Windows 8.1 应用程序中的自定义按钮答案

【问题标题】：Custom button in Windows 8.1 appWindows 8.1 应用程序中的自定义按钮
【发布时间】：2013-11-18 22:08:09
【问题描述】：

我需要在具有图标和文本标签的 Windows 8.1 应用程序中创建一个按钮。该图标将是 Segoe UI Symbols 中的一个符号，文本标签将是 Segoe UI Semibold，文本大小较小。

我希望能够在应用内的不同位置重复使用按钮，使用不同的图标和文本标签。

我该怎么做？我可以创建一个按钮，然后编辑 ContentPresenter 以拥有一个带有两个 TextBlock 的水平方向的堆栈面板，但是我该如何重用它呢？以及如何更改两个不同文本块中的文本？

我应该为每个文本块字符串创建一个具有单独依赖属性的单独自定义控件吗？我很想听听你会怎么做。

谢谢

【问题讨论】：

标签： xaml windows-8 winrt-xaml windows-8.1

【解决方案1】：

创建一个简单的Style。为了简单起见，我将它基于标准化的AppBarButton 样式。您可以将其格式化为您想要的任何大小（我做了类似的事情来制作一个更大的按钮或一个侧面带有文本的按钮）。

让主图标只是一个ContentPresenter，它使用TemplateBinding 绑定到Content。确保将FontFamily 设置为Segoe UI Symbol。从AutomationProperties.Name 中提取文本标签，类似于AppBarButton 样式的做法。

然后，只要您想使用它，就这样做：

<Button Style="{StaticResource MyCustomButtonStyle}"
        Content="&#xe000;" // Where "000" is replaced by the number of the icon you wish to use.
        AutomationProperties.Name="Text Label"/>

这应该是可扩展的，并且可以轻松地复制到您需要的任何位置。在复制AppBarButton 样式时，我建议删除人为的大小限制（特别是主要内容Grid 的宽度）。我确实建议给文本标签一个固定的大小，或者让它从指定的父级Width 拉出它的大小，这样它就可以正确地Wrap。

希望这对编码有所帮助！

【讨论】：

您好，AppBarButtonStyle 在 8.1 中已弃用。 msdn.microsoft.com/en-us/library/windows/apps/jj662743.aspx 但是感谢您的提示，我将研究如何从 AutomationProperties.Name 中提取文本标签文本。
样式确实被弃用了，但是你仍然可以把8中使用的那个拉出来直接复制进去。没人说你不能！

【解决方案2】：

您是否想要为 AppBar 创建类似的东西？看看 AppBarButton 和它支持的样式/类型。在 Windows 8.1 中，我们专门在 SymbolIcon 周围添加了一些东西。由于您基本上需要两块“内容”作为您的样式，因此您必须重新调整一个属性的用途（除非您创建了一个在这种情况下听起来不需要的自定义控件）。对可见标签使用 AutimationProperties.Name 是一个好主意，因为默认情况下它还有助于这些用户的可访问性。

研究 AppBarButton 的样式以帮助您入门。

【讨论】：

我已经尝试创建一个新的 Style BasedOn="AppBarButtonStyle"，但这种风格在 8.1 中已被弃用。另外，我不再需要检查 StandardStyles.xaml 了。我基本上是在尝试在左窗格导航栏中创建一个按钮，该按钮看起来有点像 Twitter 应用程序的导航按钮。感谢您的帮助，我会进一步探索。很高兴知道这不是自定义控制方案，因为它看起来有点矫枉过正。
我找到了我的解决方案：使用单选按钮，然后使用控件模板为其创建自定义样式。完美的。我在标准页面上的“导航”用户控件中有这些按钮，所以现在我需要做的就是弄清楚如何将选中的单选按钮绑定到页面的视图模型。我认为解决方案将是导航控件上的依赖属性，该属性绑定到主页的 VM 上的 INotifyPropertyChange 属性。嗯……到了！ :-)