【问题标题】:Custom Checkbox style for WPFWPF 的自定义复选框样式
【发布时间】:2011-02-07 20:42:18
【问题描述】:

我想将 wpf 默认复选框设置为自定义的皮肤。由于启动一个全新的控件并没有什么意义,我想覆盖复选框的 Bulletchrome 子组件的 Windows Chrome 模板绑定。但是,我不能像使用复选框那样做到这一点。

尝试使用类似这样的东西来覆盖默认样式,但它似乎无法像这样编译

   <Style x:Key="cb_BULLETSTYLE" TargetType="{x:Type BulletDecorator}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
<Setter.Value>
 <ControlTemplate TargetType="{x:Type BulletDecorator}">
  <Border x:Name="Chrome" SnapsToDevicePixels="true" BorderBrush="{x:Null}" BorderThickness="0">
  </Border>
   <ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
     <Setter Property="Background" TargetName="Chrome" Value="#FF4C4C4C"/>
    </Trigger>
   </ControlTemplate.Triggers>
 </ControlTemplate>
</Setter.Value>
</Setter>

【问题讨论】:

    标签: wpf silverlight .net-3.5 checkbox custom-controls


    【解决方案1】:

    看看这个

    <Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="WpfApplication3.MainWindow"
    x:Name="Window"
    Title="MainWindow"
    Width="640" Height="480" Background="white">
    

    <LinearGradientBrush x:Key="LinearGradient_Orange_H" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FFF9FF09" Offset="0"/>
        <GradientStop Color="#FFF7DE25" Offset="0.959"/>
        <GradientStop Color="#FFFF7000" Offset="0.033"/>
        <GradientStop Color="#FFFF7200" Offset="1"/>
    </LinearGradientBrush>
    
    <LinearGradientBrush x:Key="Horizontal_Gradient" EndPoint="1,0" StartPoint="0,0">
        <GradientStop Color="#CCC" Offset="0.0"/>
        <GradientStop Color="#444" Offset="1.0"/>
    </LinearGradientBrush>
        <LinearGradientBrush x:Key="Vertical_Gradient" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#CCC" Offset="0.0"/>
        <GradientStop Color="#444" Offset="1.0"/>
    </LinearGradientBrush>
    
    <!-- MouseOverBrush is used for MouseOver in Button, Radio Button, CheckBox -->
    <LinearGradientBrush x:Key="MouseOverBrush" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FFF" Offset="0.0"/>
        <GradientStop Color="#AAA" Offset="1.0"/>
    </LinearGradientBrush>
    <!-- LightBrush is used for content areas such as Menu, Tab Control background -->
    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0" x:Key="LightBrush">
        <GradientStop Color="#FFF" Offset="0.0"/>
        <GradientStop Color="#EEE" Offset="1.0"/>
    </LinearGradientBrush>
    
    <Style x:Key="{x:Type CheckBox}" TargetType="{x:Type CheckBox}">
        <Setter Property="SnapsToDevicePixels" Value="true"/>
        <Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
        <Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type CheckBox}">
    
                    <!-- BulletDecorator is used to provide baseline alignment between the checkmark and the Content -->
                    <BulletDecorator Background="Transparent">
                        <BulletDecorator.Bullet>
                            <Grid Width="13" Height="13">
                                <Border x:Name="Border" Background="{DynamicResource LightBrush}" BorderBrush="{DynamicResource Stroke_Gradient}" BorderThickness="1,1,1,1" CornerRadius="1,1,1,1"/>
                                <Path x:Name="CheckMark" Stroke="{DynamicResource Normal_Background}" StrokeThickness="3" SnapsToDevicePixels="False" Data="M1.5000001,1.5833334 L9.7920001,9.6666667 M1.5420001,9.6666667 L9.7083333,1.5000001" Margin="0.875,0.895,0.833,0.938" ClipToBounds="False" StrokeEndLineCap="Round" StrokeStartLineCap="Round"/>
                            </Grid>
                        </BulletDecorator.Bullet>
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/>
                    </BulletDecorator>
    
                    <!-- This uses Visibility to hide and show the CheckMark on IsChecked -->
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="false">
                            <Setter Property="Visibility" Value="Collapsed" TargetName="CheckMark"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter Property="Background" Value="{DynamicResource Normal_Background}" TargetName="Border"/>
                            <Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Background" Value="{DynamicResource Vertical_Gradient}" TargetName="Border"/>
                            <Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
    
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    

    【讨论】:

    • 谢谢。我已经设法修复它。我删除了 Aero 样式和所有混合相关的兼容性代码和架构 + 微软主题部分,现在它可以工作了。基本上我已经从头开始重新完成了复选框,我只保留了模板中的一些基础知识,其余的都是从头开始重新创建的。 :)
    猜你喜欢
    • 2021-05-20
    • 1970-01-01
    • 2015-10-16
    • 2010-09-26
    • 2017-10-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-04-18
    相关资源
    最近更新 更多