xaml - UWP xaml : How to display a button with icon and text in it?

Question

如何在按钮中显示图像/图标和文本？

<StackPanel Name="stackPanel" Orientation="Horizontal" Tapped="stackPanel_Tapped">
    <Button x:Name="button" FontFamily="Segoe MDL2 Assets" Content="&#xE779;" Width="50" Height="50" Background="Transparent" />
    <TextBlock Text="Grades" FontSize="18" VerticalAlignment="Center" />
</StackPanel>

我可以向堆栈面板添加一个 Taplistener，但这不会使堆栈面板具有像真正按钮一样的视觉效果。

我也试过:

<Button FontFamily="Segoe MDL2 Assets" Width="50" Height="50" x:Name="button" Content="test">
   <Image x:Name="button" Source="Assets/test.png" />
</Button>

但是我不能设置两次内容。我想要一个按钮中的文本和一个图标，这样当用户点击它时，它就会有一个像按钮一样的视觉效果。这可能吗？或者有没有其他人有另一种方法来实现这一目标？

谢谢阅读。

Answer 1

因此，由于我找不到直接重复的内容(我可以发誓这是之前问过的问题类型)，我想我会提供一个合理的答案。

按钮模板的核心是 ContentPresenter它允许您传入任何 CLR 对象。但需要注意的是，只有一个可以通过。但是，如果该对象是一个能够包含子项的面板，那么它将作为内容传递所有内容。

所以在这种情况下，如果我们这样做:

<Button>
    <Image/>
    <TextBlock/>
</Button>

然后它会失败并提示一次只允许一个对象。

除非您提供一个父面板来保存这些子项，否则它会将其全部视为内容并将提供所需的结果作为示例:

<Button>
    <StackPanel>
        <Image/>
        <TextBlock/>
    </StackPanel>
</Button>

所以自从 StackPanel是一个可以承载 child 的 CLR 对象，你很高兴。希望这有帮助，干杯!