Define style for ToggleSwitch control

Oct 21, 2014 at 3:45 AM
Hy,

i found this amazing library and try to use the ToggleSwitch. Im curious if i can define a style for the ToggleSwitch control.

What i have so far is:
<Style x:Key="myToggleSw1Style" TargetType="{x:Type wpfspark:ToggleSwitch }" >
        <Setter Property="Width" Value="60"/>
        <Setter Property="ThumbWidth" Value="25"/>
        <Setter Property="BorderThickness" Value="2"/>
        <Setter Property="CheckedForeground" Value="White"/>
        <Setter Property="CornerRadius" Value="10"/>
        <Setter Property="FontFamily" Value="Tahoma"/>
        <Setter Property="FontSize" Value="18"/>
        <Setter Property="FontWeight" Value="Normal"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="Background" Value="Black"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="ThumbBorderThickness" Value="2"/>
        <Setter Property="ThumbCornerRadius" Value="7"/>
        <Setter Property="ThumbGlowColor" Value="Gray"/>
        <Setter Property="ThumbShineCornerRadius" Value="6,6,3,3"/>
        <Setter Property="UncheckedForeground" Value="Black"/>
        <Setter Property="UncheckedText" Value="OFF"/>
        <Setter Property="CheckedText" Value="ON"/>
        <Setter Property="CheckedToolTip" Value="ON"/>
        <Setter Property="UncheckedToolTip" Value="OFF"/>
    </Style>
But my problem is that i dont know how to define the UncheckedBackground, BorderBrush, CheckedBackground, ThumbBackground and ThumbBorderBrush properties in a style.
Is there a way to add the following to my style:
<wpfspark:ToggleSwitch.UncheckedBackground>
                            <LinearGradientBrush EndPoint="0,1"
                                     StartPoint="0,0">
                                <GradientStop Color="#626262"
                                  Offset="0.1" />
                                <GradientStop Color="#A5A5A5"
                                  Offset="0.5" />
                                <GradientStop Color="#F1F1F1"
                                  Offset="1" />
                            </LinearGradientBrush>
                        </wpfspark:ToggleSwitch.UncheckedBackground>
                        <wpfspark:ToggleSwitch.BorderBrush>
                            <LinearGradientBrush EndPoint="0,0"
                                     StartPoint="0,1">
                                <GradientStop Color="#959595"
                                  Offset="0" />
                                <GradientStop Color="#A1A1A1"
                                  Offset="0.5" />
                                <GradientStop Color="#555555"
                                  Offset="1" />
                            </LinearGradientBrush>
                        </wpfspark:ToggleSwitch.BorderBrush>
                        <wpfspark:ToggleSwitch.CheckedBackground>
                            <LinearGradientBrush EndPoint="0,1"
                                     StartPoint="0,0">
                                <GradientStop Color="Green"
                                  Offset="0" />
                                <GradientStop Color="Green"
                                  Offset="0.5" />
                                <GradientStop Color="Green"
                                  Offset="1" />
                            </LinearGradientBrush>
                        </wpfspark:ToggleSwitch.CheckedBackground>
                        <wpfspark:ToggleSwitch.ThumbBackground>
                            <LinearGradientBrush EndPoint="0,1"
                                     StartPoint="0,0">
                                <GradientStop Color="#C1C1C1"
                                  Offset="0" />
                                <GradientStop Color="#A5A5A5"
                                  Offset="0.5" />
                                <GradientStop Color="#FCFCF6"
                                  Offset="1" />
                            </LinearGradientBrush>
                        </wpfspark:ToggleSwitch.ThumbBackground>
                        <wpfspark:ToggleSwitch.ThumbBorderBrush>
                            <LinearGradientBrush EndPoint="0,1"
                                     StartPoint="0,0">
                                <GradientStop Color="#F6F6F6"
                                  Offset="0" />
                                <GradientStop Color="#959595"
                                  Offset="0.5" />
                                <GradientStop Color="#565656"
                                  Offset="1" />
                            </LinearGradientBrush>
                        </wpfspark:ToggleSwitch.ThumbBorderBrush>                        
                    </wpfspark:ToggleSwitch>
Thank you very much in advance!