如何减少XAML样式重复：带触发器的ControlTemplate优化

当然可以！你遇到的这种XAML样式代码臃肿问题太常见了——重复写几乎一样的ControlTemplate，只是内部内容不同，完全可以通过抽离公共模板逻辑+复用可变内容来解决，最终实现你想要的极简子样式结构。

核心思路 #

把所有按钮的公共部分（包括ElementBorder的基础属性、所有触发器逻辑）放到基础样式AllButtons的ControlTemplate里，然后用ContentPresenter来承载每个按钮独有的内容。这样子样式只需要定义自己的内容，不需要重复整个模板。

步骤1：重构基础样式AllButtons #

修改你的基础样式，将可变内容替换为ContentPresenter，保留所有公共的Border配置和触发器：

<Style x:Key="AllButtons" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <!-- 公共的Border，触发器依然绑定它 -->
                <Border x:Name="ElementBorder" CornerRadius="5" BorderThickness="1" Padding="0" 
                        BorderBrush="{StaticResource border1}" Background="{StaticResource MenuButtonGradient}">
                    <!-- 用ContentPresenter承载可变内容，绑定到Button的Content/ContentTemplate属性 -->
                    <ContentPresenter Margin="10" VerticalAlignment="Center" HorizontalAlignment="Center"
                                      Content="{TemplateBinding Content}"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"/>
                </Border>
                <!-- 所有公共触发器保留在这里 -->
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Opacity" Value="0.2" />
                        <Setter Property="Foreground" Value="LightGray" />
                    </Trigger>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="ElementBorder" Property="Background" Value="{StaticResource DefaultButtonOverBackground}" />
                        <Setter Property="Cursor" Value="Hand" />
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="ElementBorder" Property="Background" Value="{StaticResource DefaultButtonPressedBackground}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

步骤2：简化子样式ButtonScaleMinus #

现在你的子样式只需要定义独有的内容即可，完全不需要重复ControlTemplate：

<Style x:Key="ButtonScaleMinus" TargetType="Button" BasedOn="{StaticResource AllButtons}">
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <!-- 这里只放原来Border内部的独有内容 -->
                <Viewbox>
                    <Path Data="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z" 
                          Fill="White" Stroke="White" x:Name="faImage"/>
                </Viewbox>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

可选：直接设置Content（如果内容固定） #

如果你的按钮内容不需要动态绑定，也可以直接设置Content属性，写法更简洁：

<Style x:Key="ButtonScaleMinus" TargetType="Button" BasedOn="{StaticResource AllButtons}">
    <Setter Property="Content">
        <Setter.Value>
            <Viewbox>
                <Path Data="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z" 
                      Fill="White" Stroke="White" x:Name="faImage"/>
            </Viewbox>
        </Setter.Value>
    </Setter>
</Style>

为什么这样可行？ #

• 所有公共的触发器依然能正常作用到ElementBorder，因为它属于基础模板的一部分，子样式只是替换了内容部分，不会影响模板的其他逻辑。
• 这种方式能极大减少代码重复，你的样式文件会从1万行快速瘦身，而且后续新增按钮样式只需要写几行内容代码即可。

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