WPF XAML中如何在同一按钮内同时使用Segoe MDL2 Assets与常规字体

可以实现，WPF的Button控件支持嵌套任意布局容器作为内容，你只需要用横向排列的容器把图标、文本放在一起即可，以下是可直接复用的实现代码：

基础实现方案 #

<Button Width="180" Height="40" HorizontalContentAlignment="Left">
    <StackPanel Orientation="Horizontal" Spacing="8" Margin="12,0,0,0">
        <!-- Segoe MDL2 Assets 图标 -->
        <TextBlock 
            FontFamily="Segoe MDL2 Assets" 
            FontSize="16" 
            VerticalAlignment="Center"
            Text="&#xE80F;"/> <!-- 此处Unicode对应首页图标，可替换为你需要的图标编码 -->
        <!-- 常规文本 -->
        <TextBlock 
            Text="首页" 
            FontSize="14" 
            VerticalAlignment="Center"/>
    </StackPanel>
</Button>

代码里的是Segoe MDL2 Assets图标的Unicode编码，你可以替换为你需要的其他图标编码。

侧边菜单复用优化 #

如果你要做多个同样式的侧边菜单按钮，建议封装为通用样式，避免重复代码：

• 可以给自定义按钮附加IconCode、MenuText两个依赖属性，绑定到内部的两个TextBlock
• 所有菜单按钮统一引用该样式，只需要传入图标编码和显示文本即可

注意事项 #

• Win10及以上系统默认预装Segoe MDL2 Assets字体，如果需要兼容Win7系统，需要将字体打包到应用资源内引用
• 可以调整StackPanel的Spacing属性、Margin属性修改图标和文本的间距、边距，适配你的设计规范
• 按钮的悬停、点击状态样式可以直接在Button的Style触发器中统一修改，不需要单独调整内部元素的样式

内容的提问来源于stack exchange，提问作者Gloozzy