12

私はWPFを使い始めたばかりで、チェックボックスに特定の機能が必要です:

  1. 形を直方体から楕円形に変えたいです。
  2. さらに、クロスの代わりに色の変化 (緑 = true、赤 = false) が必要です。

背景: さまざまなセンサーがあり、これらのチェックボックスを使用してそれらを有効/無効にしたいと考えています。チェックボックスの代わりにボタンを使用することも考えましたが、機能はチェックボックスの方が優れていると思います。

私の説明が理解できることを願っています。そのようなスタイルテンプレートを定義することは可能ですか?

敬具

アレックス

4

2 に答える 2

15

よし、やっとやった！添付で私の解決策を見ることができ、私は結果に満足しています。誰かコメントがあれば、遠慮なくコメントを書いてください。ご助力ありがとうございます

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="CheckBox" x:Key="CircleCheckbox">
        <Setter Property="Cursor" Value="Hand"></Setter>   
        <Setter Property="Content" Value=""></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type CheckBox}">                   
                    <Grid>                     
                        <Ellipse x:Name="outerEllipse">
                            <Ellipse.Fill>
                                <RadialGradientBrush>
                                    <GradientStop Offset="0" Color="Red"/>
                                    <GradientStop Offset="0.88" Color="LightCoral"/>
                                    <GradientStop Offset="1" Color="DarkRed"/>
                                </RadialGradientBrush>
                            </Ellipse.Fill>
                        </Ellipse>
                        <Ellipse Margin="10" x:Name="highlightCircle" >
                            <Ellipse.Fill >
                                <LinearGradientBrush >
                                    <GradientStop Offset="0" Color="Green"/>
                                    <GradientStop Offset="0.5" Color="LightGreen"/>
                                    <GradientStop Offset="1" Color="DarkGreen"/>
                                </LinearGradientBrush>
                            </Ellipse.Fill>
                        </Ellipse>
                        <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter TargetName="highlightCircle" Property="Fill">
                                <Setter.Value>
                                    <LinearGradientBrush StartPoint="0.3,0" EndPoint="0.7,1">
                                        <GradientStop Offset="0" Color="Green"/>
                                        <GradientStop Offset="0.5" Color="LightGreen"/>
                                        <GradientStop Offset="1" Color="DarkGreen"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter TargetName="outerEllipse" Property="Fill">
                                <Setter.Value>
                                    <RadialGradientBrush>
                                        <GradientStop Offset="0" Color="Green"/>
                                        <GradientStop Offset="0.88" Color="LightGreen"/>
                                        <GradientStop Offset="1" Color="DarkGreen"/>
                                    </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                        <Trigger Property="IsChecked" Value="False">
                            <Setter TargetName="highlightCircle" Property="Fill">
                                <Setter.Value>
                                    <LinearGradientBrush StartPoint="0.3,0" EndPoint="0.7,1">
                                        <GradientStop Offset="0" Color="Red"/>
                                        <GradientStop Offset="0.5" Color="LightCoral"/>
                                        <GradientStop Offset="1" Color="DarkRed"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    
</ResourceDictionary>
于 2012-12-03T18:28:31.847 に答える
8

チェックボックスをカスタマイズしてカスタム テンプレートを作成する必要があります。
そのためには、デフォルトの Checkbox Templateを変更する必要があります。

やりたいことは、トリガーと背景を少しいじって、好きなようにスタイルを設定することです。プロパティに注意してCheckMarkください。おそらくそれを保持したいと思うでしょうHidden

于 2012-12-03T13:39:20.193 に答える