UWP xaml:如何显示带有图标和文字的按钮？

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>

我可以在stackpanel中添加一个taplistener,但这不会使stackpanel像真正的按钮一样具有视觉效果.

我也尝试过:

<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是一个可以容纳孩子的CLR对象,那么你很高兴.希望这会有所帮助,欢呼!