WPF CheckBox zmiana stylu

Question

Właśnie rozpoczął się WPF i potrzebują specjalnej funkcji dla wyboru:

1. Chcę zmienić kształt z pudełka do elipsy.
2. Im dalej, powinna być zmiana koloru (zielona = prawda, czerwona = fałsz) zamiast krzyża.

Tło: Mam różne czujniki i chcę je włączyć/wyłączyć za pomocą tych pól wyboru. Myślałem także o użyciu przycisków zamiast pól wyboru, ale myślę, że funkcja jest bardziej podana przez pola wyboru.

Mam nadzieję, że mój opis jest zrozumiały. Czy możliwe jest zdefiniowanie takiego szablonu stylu?

poważaniem

Alex

Answer 1

Będziesz musiał dostosować wyboru i stworzyć własnego szablonu.
W tym celu należy zmienić default Checkbox Template.

To, co chcesz zrobić, to zagrać trochę z wyzwalaczami i tłem, aby nadać stylu, jak chcesz. Zwróć uwagę na właściwość CheckMark, prawdopodobnie zechcesz ją zachować: Hidden

Answer 2

OK, w końcu to zrobiłem! W załączniku możesz zobaczyć moje rozwiązanie i jestem zadowolony z wyniku. Jeśli ktoś ma jakieś uwagi, nie wahaj się napisać komentarz. Bardzo dziękuję za pomoc

<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>