1

我开始使用 VS2012 提供的模板之一来设计我的应用程序，其中一些文本块旁边显示了一个图像。我希望用户能够选择一张照片或类似的照片作为图像，但如果他们没有这样做，我想提供一个默认图标。

我最初的想法是创建不同默认图标的PNG，以图像图标出现的不同大小，如果用户没有指定图像，则只从绑定中返回它们，但我想到如果我可以使用XAML 路径，默认图标将显得更清晰，因为它们将被绘制为矢量而不是位图。

我不确定这个决定是否是一个错误，但这让我有些头疼:-(。

我尝试解决的第一个挑战是如何使用绑定来显示图像或 XAML 路径。我的解决方案是使用 Button 而不是 Image，并绑定 Content。Content 绑定返回一个 Canvas 对象，该对象包含图像或定义图标的一组路径。

这一直有效，直到我更改为捕捉视图，然后它具有比未捕捉视图更小的图像/按钮元素。

所以第二个挑战，也是这个问题的主要原因，是就如何最好地处理不同尺寸的按钮寻求建议。在未捕捉的视图中，按钮为 110x110。在快照视图中，按钮为 60x60。在我所做的研究中，调整路径大小的最简单方法似乎是在 Canvas 上使用 Transform 但由于 Canvas 是从 Binding 调用返回的，因此代码隐藏不一定知道父级的大小按钮是，因此将无法包含变换。

我不能使用 DrawingBrush，因为它们在 Windows 应用商店应用程序中无效。

是否有一个干净的解决方案，或者我应该回到使用预先创建的 PNG 的更简单但质量稍低的解决方案？

谢谢。

4

1 回答 1

0

我最终采用的解决方案是使用两个项目 - 一个按钮和一个图像 - 每个都包裹在一个边框中，这使我只能使其中一个项目可见，具体取决于位图图像是否可用：

            <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="250" Height="250" Visibility="{Binding ImageIsAvailable, Converter={StaticResource HideIfTrue}}">
            <Button Content="{Binding ImageContent}" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="20,20,0,0" Style="{StaticResource UnstyledGraphicsButtonStyle}" Width="{Binding ImageWidth210}" Height="{Binding ImageHeight210}" Foreground="white" Padding="0" Background="Transparent" BorderBrush="{x:Null}" IsEnabled="False" />
        </Border>
        <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" Visibility="{Binding ImageIsAvailable, Converter={StaticResource DisplayIfTrue}}">
            <Image Source="{Binding Image250}" Stretch="{Binding Stretch250}" AutomationProperties.Name="{Binding Title}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </Border>

在此示例中，我希望项目为 250 像素 x 250 像素。Stretch 的绑定是为了让我可以处理大于和小于 250px 的图像并进行相应的拉伸。

对于按钮，内容实际上来自声明的字符串资源，例如：

<x:String x:Key="building">M13.982995,32.651007L13.982995,37.332006 18.665994,37.332006 18.665994,32.651007z M5.3319988,32.440006L5.3319988,37.332006 10.225996,37.332006 10.225996,32.440006z M34.665606,29.33198L34.665606,37.313 37.332797,37.313 37.332797,29.33198z M29.332198,29.33198L29.332198,37.340984 31.999405,37.340984 31.999405,29.33198z M13.923995,24.000005L13.923995,28.740005 18.665994,28.740005 18.665994,24.000005z M5.3319988,24.000005L5.3319988,28.839005 10.171997,28.839005 10.171997,24.000005z M34.665606,18.665992L34.665606,26.684976 37.332797,26.684976 37.332797,18.665992z M29.332198,18.665992L29.332198,26.644998 31.999405,26.644998 31.999405,18.665992z M13.331995,16.000003L13.331995,18.666003 15.998995,18.666003 15.998995,16.000003z M7.9989967,16.000003L7.9989967,18.666003 10.665997,18.666003 10.665997,16.000003z M26.665998,13.331976L39.998998,13.331976 39.998998,42.666973 26.665998,42.666973z M13.331995,10.666002L13.331995,13.332002 15.998995,13.332002 15.998995,10.666002z M7.9989967,10.666002L7.9989967,13.332002 10.665997,13.332002 10.665997,10.666002z M10.665997,0L13.331995,0 13.331995,5.3340011 15.998995,5.3340011 18.665994,10.666002 18.665994,18.666003 21.331993,18.666003 23.998992,21.332004 23.998992,42.667007 0,42.667007 0,21.332004 2.6659985,18.666003 5.3319988,18.666003 5.3319988,10.666002 7.9969978,5.3340011 10.665997,5.3340011z</x:String>

这来自地铁工作室。

高度和宽度绑定是因为我的不同 SVG 项目具有不同的宽度和高度比率，所以我绑定到代码隐藏以返回所需大小的正确数字。不幸的是，因为您不能传递参数，我最终会根据 XAML 对不同的 XXX 值进行不同的“ImageHeightXXX”调用。

关于如何定义字符串的建议可以在这里找到：http ://www.jayway.com/2012/11/27/styling-windows-8-4-the-button/

于 2013-01-12T10:18:40.503 回答