基本的WPF切换按钮模板

本文关键字：按钮 WPF | 更新日期: 2023-09-27 18:18:46

我需要一个切换按钮，当IsChecked = False时没有边框，当IsChecked = True时有一个简单的1pt特定颜色的边框。我有下面的样式，但我的边界，当按钮IsChecked = True被设置为Transparent(使用Snoop检查)

<Style x:Key="InfoToggleButton"
         TargetType="{x:Type ToggleButton}">
    <Setter Property="Background" Value="#EEEEF2"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Border CornerRadius="0" 
                          BorderBrush="{TemplateBinding BorderBrush}"
                          BorderThickness="{TemplateBinding BorderThickness}">
                    <ContentPresenter x:Name="contentPresenter" 
                                            ContentTemplate="{TemplateBinding ContentTemplate}" 
                                            Content="{TemplateBinding Content}"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="BorderBrush" Value="#007ACC"/>
                        <Setter Property="BorderThickness" Value="1"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="False">
                        <Setter Property="BorderBrush" Value="Transparent"/>
                        <Setter Property="BorderThickness" Value="0"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

按钮工作和显示正确，但当我检查/单击它，边界不显示。

我像

那样实现这个样式
<ToggleButton Grid.Column="0"
    Style="{StaticResource InfoToggleButton}" 
    IsChecked="{Binding IsDisplayingBetInfo, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
    Content="{Binding BetInfoIconSource}"/>

我怎样才能得到一个简单的带有边框的切换按钮?

感谢您的宝贵时间。

基本的WPF切换按钮模板

我已经找到了问题和解决方案，但不知道为什么会发生。
问题:必须将{x:Null}以外的值设置为切换按钮的内容。解决方案:但是可以设置一个空字符串作为内容。
我的推理:当没有设置内容时，ContentPresenter 为null，因此不能点击

这个问题可以通过将默认内容设置为""来解决，如下所示: 
<Style x:Key="InfoToggleButton"
     TargetType="{x:Type ToggleButton}">
        <Setter Property="Background" Value="#EEEEF2"/>
        <Setter Property="Content" Value=""/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    <Border CornerRadius="0" 
                      BorderBrush="{TemplateBinding BorderBrush}"
                      BorderThickness="{TemplateBinding BorderThickness}">
                        <ContentPresenter x:Name="contentPresenter" 
                                        ContentTemplate="{TemplateBinding ContentTemplate}" 
                                        Content="{TemplateBinding Content}"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter Property="BorderBrush" Value="#007ACC"/>
                            <Setter Property="BorderThickness" Value="1"/>
                        </Trigger>
                        <Trigger Property="IsChecked" Value="False">
                            <Setter Property="BorderBrush" Value="Transparent"/>
                            <Setter Property="BorderThickness" Value="0"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

你必须像这样在Border标签上指定一个名称

<Border x:Name="MyBorderName"...

那么你必须在属性上分配TargetName。示例

<Setter TargetName="MyBorderName" Property="BorderBrush" Value="#007ACC"/>
<Setter TargetName="MyBorderName" Property="BorderThickness" Value="1"/>

否则WPF不知道该给谁分配属性BorderBrush和BorderThickness

相关文章：