Checkbox Control Template - changing check color and size RRS feed

  • Question

  • Hi,

    By editing the template, I have enlarged the rectangle where the check mark resides.

    However, I want to have the check mark be larger, it is still showing the default size.  I also want the check to be green.

    Can somebody point me to the correct properties?


    Friday, March 6, 2009 3:14 AM


  • The check mark is a Path in the ControlTemplate of CheckBox. So if you want to change the size of check mark and modify it color, you could edit the template of CheckBox.
    For example:
    <Window x:Class="_temple.Window1" 
        Title="Window1" Height="300" Width="300"
            <CheckBox Width="100" Height="50"
                     TargetType="{x:Type CheckBox}"
                        <Border BorderBrush="{TemplateBinding BorderBrush}" 
                BorderThickness="{TemplateBinding BorderThickness}" 
                Background="{TemplateBinding Background}"
                                <!-- ContentPresenter displays content of CheckBox --> 
                    Content="{TemplateBinding Content}" 
                    ContentTemplate="{TemplateBinding ContentTemplate}" 
                    Margin="{TemplateBinding Padding}" 
                                            VerticalContentAlignment}" /> 
                                <!-- This Border displays a semi-transparent red X --> 
                                        <VisualBrush Opacity="0.5"
                                                <Path Name="path" 
                                      Data="M 0 0 L 10 10 M 10 0 L 0 10" 
                                      StrokeLineJoin="Round" /> 
                            <Trigger Property="IsChecked" Value="True"
                                <Setter TargetName="path" 
                    Value="M 0 5 L 3 10 10 0" /> 
                                <Setter TargetName="path" 
                    Value="Green" /> 
                            <Trigger Property="IsChecked" Value="{x:Null}"
                                <Setter TargetName="path" 
                    Value="M 0 2.5 A 5 2.5 0 1 1 5 5  
                           L 5 8 M 5 10 L 5 10" /> 
                                <Setter TargetName="path" 
                    Value="Blue" /> 
                            <Trigger Property="IsEnabled" Value="False"
                                <Setter Property="Foreground"  
                       {x:Static SystemColors.GrayTextBrushKey}}" /> 

    For more information about using tmplates to customize WPF controls, you can refer to this article:
    Using Templates to Customize WPF Controls
    • Proposed as answer by Tao Liang Monday, March 9, 2009 6:22 AM
    • Marked as answer by Tao Liang Tuesday, March 10, 2009 5:56 AM
    Monday, March 9, 2009 6:22 AM