复选框样式虽然样式定义,但前景色不会改变

时间:2017-07-07 18:13:47

标签: wpf checkbox styles

请参阅此Checkbox样式:

<Style TargetType="{x:Type CheckBox}">
    <Setter Property="SnapsToDevicePixels" Value="true" />
    <Setter Property="OverridesDefaultStyle" Value="true" />
    <Setter Property="Height" Value="20" />
    <Setter Property="FocusVisualStyle" Value="{DynamicResource MyFocusVisualStyte}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type CheckBox}">
                <BulletDecorator>
                    <BulletDecorator.Bullet>
                        <Grid Height="{TemplateBinding Height}"
                                  Width="{Binding RelativeSource={RelativeSource Self}, Path=Height, UpdateSourceTrigger=PropertyChanged}"
                                  MinHeight="20"
                                  MinWidth="20"
                                  ShowGridLines="False">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="4*" />
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="4*" />
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="2*" />
                                <ColumnDefinition Width="2*" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="3*" />
                                <RowDefinition Height="1*" />
                                <RowDefinition Height="1*" />
                                <RowDefinition Height="1*" />
                                <RowDefinition Height="4*" />
                                <RowDefinition Height="1*" />
                                <RowDefinition Height="1*" />
                                <RowDefinition Height="4*" />
                            </Grid.RowDefinitions>
                            <Border
                                Name="MainBorder"
                                Grid.ColumnSpan="9"
                                Grid.RowSpan="9"
                                CornerRadius="4"
                                BorderThickness="1"
                                Background="Transparent" />
                            <Border
                                Name="InnerBorder"
                                Grid.Column="1"
                                Grid.ColumnSpan="5"
                                Grid.Row="2"
                                Grid.RowSpan="5"
                                BorderThickness="1"
                                BorderBrush="Gray" />
                            <Path
                                Name="InnerPath"
                                Grid.Column="1"
                                Grid.ColumnSpan="5"
                                Grid.Row="2"
                                Grid.RowSpan="5"
                                Data="M31,5 L19.5,5 19.5,19.5 34.5,19.5 34.5,11.75"
                                Stretch="Fill"
                                Stroke="Gray"/>
                            <Path
                                Name="CheckMark"
                                Grid.Column="2"
                                Grid.ColumnSpan="5"
                                Grid.Row="1"
                                Grid.RowSpan="5"
                                Opacity="0"
                                Data="M9.07743946676476E-09,4.31805768640244L4.68740335877841,8.86361158398516C4.68740335877841,8.86361158398516,16.3281249985376,-2.42451336648723,16.3281249985376,-2.42451336648723L14.0622100581796,-4.77304938341948 4.68740335877846,4.31805791992662 2.22656251699567,1.93164208562579z"
                                Fill="Orange"
                                Stretch="Fill"
                                Stroke="Orange" />
                            <Path
                                Name="InderminateMark"
                                Grid.Column="3"
                                Grid.Row="4"
                                Data="M0,4 L1,5 5,1 4,0"
                                Opacity="0"
                                Stretch="Fill"
                                StrokeThickness="0"
                                Fill="#808080" />
                        </Grid>
                    </BulletDecorator.Bullet>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Storyboard.TargetName="CheckMark" Duration="0:0:0.2" To="1" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unchecked" >
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Storyboard.TargetName="CheckMark" Duration="0:0:0.2" To="0" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Indeterminate">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Storyboard.TargetName="InderminateMark" Duration="0:0:0.2" To="1" />
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentPresenter 
                            Margin="4,0,4,0"
                            VerticalAlignment="Center"
                            HorizontalAlignment="Left"
                            RecognizesAccessKey="True" />
                </BulletDecorator>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="InnerBorder" Property="BorderBrush" Value="#FF7AA0CD" />
                        <Setter TargetName="InnerPath" Property="Stroke" Value="#FF7AA0CD" />
                        <Setter TargetName="CheckMark" Property="Fill" Value="Gainsboro"/>
                        <Setter TargetName="CheckMark" Property="Stroke" Value="Gainsboro"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
                        <Setter Property="Foreground" Value="#303030"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="False">
                        <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />                            
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="MainBorder" Property="Background" Value="#81d2eb" />
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="True">
                        <Setter Property="Foreground" Value="Gainsboro"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Foreground" Value="#55B3B3B6"/>
                        <Setter TargetName="CheckMark" Property="Fill" Value="Orange" />
                        <Setter TargetName="CheckMark" Property="Stroke" Value="Orange" />
                        <Setter TargetName="InnerPath" Property="Stroke" Value="#55649EB4" />
                        <Setter TargetName="InderminateMark" Property="Fill" Value="#cccccc" />
                        <Setter TargetName="InnerBorder" Property="BorderBrush" Value="#55649EB4" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

因此,当我的style被选中时,我尝试为Foreground Color添加非常简单的Checkbox

<Trigger Property="IsChecked" Value="True">
    <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
    <Setter Property="Foreground" Value="#303030"/>
</Trigger>

由于某些原因,这不起作用且Foreground颜色没有变化。 有什么建议吗?

更新

这是我的Checkbox

<CheckBox
    FontSize="14"
    Height="25"
    FontFamily="Ariel"/>

正如您所见,我未设置Foreground属性。

1 个答案:

答案 0 :(得分:1)

以下是您的部分触发器的顺序:

<Trigger Property="IsChecked" Value="True">
    <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
    <Setter Property="Foreground" Value="Red"/>
</Trigger>
<Trigger Property="IsChecked" Value="False">
    <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
    <Setter TargetName="MainBorder" Property="Background" Value="#81d2eb" />
</Trigger>
<Trigger Property="IsEnabled" Value="True">
    <Setter Property="Foreground" Value="Gainsboro"/>
</Trigger>

(为了显而易见,我将“如果选中”前景改为红色。)

  1. 如果已选中,请将前景设为红色(或在您的情况下为#303030)。

  2. 然后,如果未选中,则折叠InnerBorder。

  3. 然后,如果按下它,设置MainBorder的背景。

  4. 最后,如果已启用,请将Foreground设置为Gainsboro。

  5. 所以每当启用它时,它会将Foreground设置为Gainsboro。

    你正在覆盖IsChecked前景。简单的修复,你已经弄明白了:

    <Trigger Property="IsChecked" Value="False">
        <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
    </Trigger>
    <Trigger Property="IsPressed" Value="True">
        <Setter TargetName="MainBorder" Property="Background" Value="#81d2eb" />
    </Trigger>
    <Trigger Property="IsEnabled" Value="True">
        <Setter Property="Foreground" Value="Gainsboro"/>
    </Trigger>
    <!-- 
    Move this one so it comes after IsEnabled="True", but before IsEnabled="False"
    -->
    <Trigger Property="IsChecked" Value="True">
        <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
        <Setter Property="Foreground" Value="Red"/>
    </Trigger>
    

    您无需明确将Foreground应用于ContentPresenter,这就是适应能力。