Question

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

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

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

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

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

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

我无法使用DrawingBrush，因为这些在Windows应用商店应用中无效。

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

感谢。

Answer 1

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

            <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>

在这个例子中，我想要的项目是250px到250px。 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>

这来自Metro Studio。

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

有关如何获取字符串的建议，请访问：http://www.jayway.com/2012/11/27/styling-windows-8-4-the-button/

Windows应用商店应用：在网格布局中使用XAML路径（C＃/ XAML）

1 个答案: