ToggleSwitch Left or Right Nob #22

Valkirie · 2023-03-29T14:58:37Z

Valkirie
Mar 29, 2023

Windows 11 has Nob either on the left or the right.

I tried FlowDirection but that's also affecting the nob position within the toggle.

wherewhere · 2023-03-29T16:53:25Z

wherewhere
Mar 29, 2023
Maintainer

But it is not by change FlowDirection. It's a new style...

0 replies

Valkirie · 2023-03-29T17:09:37Z

Valkirie
Mar 29, 2023
Author

Here it is.

0,0,0,4 10 10 154 0:0:0.033 0:0:0.367 0.1,0.9 0.2,1.0

        <Style x:Key="InvertedToggleSwitchStyle" TargetType="ui:ToggleSwitch">
            <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
            <Setter Property="HorizontalAlignment" Value="Left" />
            <Setter Property="VerticalAlignment" Value="Center" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
            <Setter Property="UseSystemFocusVisuals" Value="{DynamicResource UseSystemFocusVisuals}" />
            <Setter Property="MinWidth" Value="{DynamicResource ToggleSwitchThemeMinWidth}" />
            <Setter Property="FocusVisualStyle" Value="{DynamicResource {x:Static SystemParameters.FocusVisualStyleKey}}" />
            <Setter Property="ui:FocusVisualHelper.FocusVisualMargin" Value="-7,-3,-7,-3" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ui:ToggleSwitch">
                        <Border
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="{TemplateBinding CornerRadius}"
                            SnapsToDevicePixels="True">
                            <Border.Resources>
                                <Storyboard x:Key="DraggingToOnTransition">
                                    <DoubleAnimationUsingKeyFrames
                                        BeginTime="{StaticResource RepositionDelay}"
                                        Storyboard.TargetName="KnobTranslateTransform"
                                        Storyboard.TargetProperty="X">
                                        <SplineDoubleKeyFrame
                                            KeySpline="{StaticResource RepositionKeySpline}"
                                            KeyTime="{StaticResource RepositionDuration}"
                                            Value="20" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="OuterBorder" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>

                                <Storyboard x:Key="OnToDraggingTransition">
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="0" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="0" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="0" Value="0" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>

                                <Storyboard x:Key="DraggingToOffTransition">
                                    <DoubleAnimationUsingKeyFrames
                                        BeginTime="{StaticResource RepositionDelay}"
                                        Storyboard.TargetName="KnobTranslateTransform"
                                        Storyboard.TargetProperty="X">
                                        <SplineDoubleKeyFrame
                                            KeySpline="{StaticResource RepositionKeySpline}"
                                            KeyTime="{StaticResource RepositionDuration}"
                                            Value="0" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Opacity">
                                        <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </Border.Resources>
                            <VisualStateManager.CustomVisualStateManager>
                                <ui:SimpleVisualStateManager />
                            </VisualStateManager.CustomVisualStateManager>

                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>

                                <ui:ContentPresenterEx
                                    x:Name="HeaderContentPresenter"
                                    Grid.Row="0"
                                    Margin="{StaticResource ToggleSwitchTopHeaderMargin}"
                                    VerticalAlignment="Top"
                                    Content="{TemplateBinding Header}"
                                    ContentTemplate="{TemplateBinding HeaderTemplate}"
                                    Foreground="{DynamicResource ToggleSwitchHeaderForeground}"
                                    IsHitTestVisible="False"
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                    TextWrapping="Wrap"
                                    Visibility="Collapsed" />
                                <Grid
                                    Grid.Row="1"
                                    HorizontalAlignment="Right"
                                    VerticalAlignment="Top">

                                    <Grid.RowDefinitions>
                                        <RowDefinition ui:RowDefinitionHelper.PixelHeight="{DynamicResource ToggleSwitchPreContentMargin}" />
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition ui:RowDefinitionHelper.PixelHeight="{DynamicResource ToggleSwitchPostContentMargin}" />
                                    </Grid.RowDefinitions>

                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="12" MaxWidth="12" />
                                        <ColumnDefinition Width="Auto" />
                                    </Grid.ColumnDefinitions>
                                    <Border
                                        x:Name="SwitchAreaGrid"
                                        Grid.RowSpan="3"
                                        Grid.ColumnSpan="3"
                                        Margin="0,5"
                                        ui:FocusVisualHelper.IsTemplateFocusTarget="True"
                                        Background="{DynamicResource ToggleSwitchContainerBackground}"
                                        CornerRadius="{TemplateBinding CornerRadius}" />
                                    <ui:ContentPresenterEx
                                        x:Name="OffContentPresenter"
                                        Grid.RowSpan="3"
                                        Grid.Column="0"
                                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                        Content="{TemplateBinding OffContent}"
                                        ContentTemplate="{TemplateBinding OffContentTemplate}"
                                        Foreground="{TemplateBinding Foreground}"
                                        IsHitTestVisible="False"
                                        Opacity="0"
                                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                    <ui:ContentPresenterEx
                                        x:Name="OnContentPresenter"
                                        Grid.RowSpan="3"
                                        Grid.Column="0"
                                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                        Content="{TemplateBinding OnContent}"
                                        ContentTemplate="{TemplateBinding OnContentTemplate}"
                                        Foreground="{TemplateBinding Foreground}"
                                        IsHitTestVisible="False"
                                        Opacity="0"
                                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                    <Rectangle
                                        x:Name="OuterBorder"
                                        Grid.Row="1"
                                        Grid.Column="2"
                                        Width="40"
                                        Height="20"
                                        Fill="{DynamicResource ToggleSwitchFillOff}"
                                        RadiusX="10"
                                        RadiusY="10"
                                        Stroke="{DynamicResource ToggleSwitchStrokeOff}"
                                        StrokeThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}" />
                                    <Rectangle
                                        x:Name="SwitchKnobBounds"
                                        Grid.Row="1"
                                        Grid.Column="2"
                                        Width="40"
                                        Height="20"
                                        Fill="{DynamicResource ToggleSwitchFillOn}"
                                        Opacity="0"
                                        RadiusX="10"
                                        RadiusY="10"
                                        Stroke="{DynamicResource ToggleSwitchStrokeOn}"
                                        StrokeThickness="{DynamicResource ToggleSwitchOnStrokeThickness}" />
                                    <Grid
                                        x:Name="SwitchKnob"
                                        Grid.Row="1"
                                        Grid.Column="2"
                                        Width="20"
                                        Height="20"
                                        HorizontalAlignment="Left">
                                        <Border
                                            x:Name="SwitchKnobOn"
                                            Width="12"
                                            Height="12"
                                            Margin="0,0,1,0"
                                            HorizontalAlignment="Center"
                                            Background="{DynamicResource ToggleSwitchKnobFillOn}"
                                            CornerRadius="7"
                                            Opacity="0"
                                            RenderTransformOrigin="0.5, 0.5">
                                            <Border
                                                x:Name="SwitchKnobOnBorder"
                                                BorderBrush="{DynamicResource ToggleSwitchKnobStrokeOn}"
                                                CornerRadius="7" />
                                        </Border>
                                        <Rectangle
                                            x:Name="SwitchKnobOff"
                                            Width="12"
                                            Height="12"
                                            Margin="-1,0,0,0"
                                            HorizontalAlignment="Center"
                                            Fill="{DynamicResource ToggleSwitchKnobFillOff}"
                                            RadiusX="7"
                                            RadiusY="7"
                                            RenderTransformOrigin="0.5, 0.5" />
                                        <Grid.RenderTransform>
                                            <TranslateTransform x:Name="KnobTranslateTransform" />
                                        </Grid.RenderTransform>
                                    </Grid>
                                    <Thumb
                                        x:Name="SwitchThumb"
                                        Grid.RowSpan="3"
                                        Grid.ColumnSpan="3">
                                        <Thumb.Template>
                                            <ControlTemplate TargetType="Thumb">
                                                <Rectangle Fill="Transparent" />
                                            </ControlTemplate>
                                        </Thumb.Template>
                                    </Thumb>
                                </Grid>
                            </Grid>

                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="14" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="14" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="14" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="14" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="17" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="14" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="17" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlFasterAnimationDuration}"
                                                    Value="14" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlNormalAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlNormalAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Width">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlNormalAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Height">
                                                <SplineDoubleKeyFrame
                                                    KeySpline="{DynamicResource ControlFastOutSlowInKeySpline}"
                                                    KeyTime="{DynamicResource ControlNormalAnimationDuration}"
                                                    Value="12" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="ToggleStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition
                                            x:Name="DraggingOffToOnTransition"
                                            GeneratedDuration="0"
                                            Storyboard="{StaticResource DraggingToOnTransition}"
                                            From="DraggingOff"
                                            To="On" />
                                        <VisualTransition
                                            x:Name="DraggingOnToOnTransition"
                                            GeneratedDuration="0"
                                            Storyboard="{StaticResource DraggingToOnTransition}"
                                            From="DraggingOn"
                                            To="On" />
                                        <VisualTransition
                                            x:Name="OnToDraggingOnTransition"
                                            GeneratedDuration="0"
                                            Storyboard="{StaticResource OnToDraggingTransition}"
                                            From="On"
                                            To="DraggingOn" />
                                        <VisualTransition
                                            x:Name="OnToDraggingOffTransition"
                                            GeneratedDuration="0"
                                            Storyboard="{StaticResource OnToDraggingTransition}"
                                            From="On"
                                            To="DraggingOff" />
                                        <VisualTransition
                                            x:Name="DraggingOffToOffTransition"
                                            GeneratedDuration="0"
                                            Storyboard="{StaticResource DraggingToOffTransition}"
                                            From="DraggingOff"
                                            To="Off" />
                                        <VisualTransition
                                            x:Name="DraggingOnToOffTransition"
                                            GeneratedDuration="0"
                                            Storyboard="{StaticResource DraggingToOffTransition}"
                                            From="DraggingOn"
                                            To="Off" />
                                        <VisualTransition
                                            x:Name="OnToOffTransition"
                                            GeneratedDuration="0"
                                            From="On"
                                            To="Off">
                                            <Storyboard>
                                                <DoubleAnimationUsingKeyFrames
                                                    BeginTime="{StaticResource RepositionDelay}"
                                                    Storyboard.TargetName="KnobTranslateTransform"
                                                    Storyboard.TargetProperty="X">
                                                    <SplineDoubleKeyFrame
                                                        KeySpline="{StaticResource RepositionKeySpline}"
                                                        KeyTime="{StaticResource RepositionDuration}"
                                                        Value="0" />
                                                </DoubleAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualTransition>
                                        <VisualTransition
                                            x:Name="OffToOnTransition"
                                            GeneratedDuration="0"
                                            From="Off"
                                            To="On">
                                            <Storyboard>
                                                <DoubleAnimationUsingKeyFrames
                                                    BeginTime="{StaticResource RepositionDelay}"
                                                    Storyboard.TargetName="KnobTranslateTransform"
                                                    Storyboard.TargetProperty="X">
                                                    <SplineDoubleKeyFrame
                                                        KeySpline="{StaticResource RepositionKeySpline}"
                                                        KeyTime="{StaticResource RepositionDuration}"
                                                        Value="20" />
                                                </DoubleAnimationUsingKeyFrames>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                    <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                                </DoubleAnimationUsingKeyFrames>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="OuterBorder" Storyboard.TargetProperty="Opacity">
                                                    <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                                </DoubleAnimationUsingKeyFrames>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Opacity">
                                                    <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                                </DoubleAnimationUsingKeyFrames>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Opacity">
                                                    <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                                </DoubleAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualTransition>
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="DraggingOff" />
                                    <VisualState x:Name="DraggingOn">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="OuterBorder" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Off">
                                        <Storyboard>
                                            <DoubleAnimation
                                                Storyboard.TargetName="KnobTranslateTransform"
                                                Storyboard.TargetProperty="X"
                                                To="0"
                                                Duration="0" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="On">
                                        <Storyboard>
                                            <DoubleAnimation
                                                Storyboard.TargetName="KnobTranslateTransform"
                                                Storyboard.TargetProperty="X"
                                                To="20"
                                                Duration="0" />
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobBounds" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="OuterBorder" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOn" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="1" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="SwitchKnobOff" Storyboard.TargetProperty="Opacity">
                                                <DiscreteDoubleKeyFrame KeyTime="{DynamicResource ControlFasterAnimationDuration}" Value="0" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="ContentStates">
                                    <VisualState x:Name="OffContent">
                                        <Storyboard>
                                            <DoubleAnimation
                                                Storyboard.TargetName="OffContentPresenter"
                                                Storyboard.TargetProperty="Opacity"
                                                To="1"
                                                Duration="0" />
                                            <BooleanAnimationUsingKeyFrames Storyboard.TargetName="OffContentPresenter" Storyboard.TargetProperty="IsHitTestVisible">
                                                <DiscreteBooleanKeyFrame KeyTime="0" Value="True" />
                                            </BooleanAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="OnContent">
                                        <Storyboard>
                                            <DoubleAnimation
                                                Storyboard.TargetName="OnContentPresenter"
                                                Storyboard.TargetProperty="Opacity"
                                                To="1"
                                                Duration="0" />
                                            <BooleanAnimationUsingKeyFrames Storyboard.TargetName="OnContentPresenter" Storyboard.TargetProperty="IsHitTestVisible">
                                                <DiscreteBooleanKeyFrame KeyTime="0" Value="True" />
                                            </BooleanAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        </Border>
                        <ControlTemplate.Triggers>
                            <!--  PointerOver  -->
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="OuterBorder" Property="Stroke" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}" />
                                <Setter TargetName="OuterBorder" Property="Fill" Value="{DynamicResource ToggleSwitchFillOffPointerOver}" />
                                <Setter TargetName="SwitchKnobOff" Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}" />
                                <Setter TargetName="SwitchKnobOn" Property="Background" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}" />
                                <Setter TargetName="SwitchKnobBounds" Property="Fill" Value="{DynamicResource ToggleSwitchFillOnPointerOver}" />
                                <Setter TargetName="SwitchKnobBounds" Property="Stroke" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}" />
                                <Setter TargetName="SwitchAreaGrid" Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}" />
                            </Trigger>
                            <!--  Pressed  -->
                            <Trigger SourceName="SwitchThumb" Property="IsDragging" Value="true">
                                <Setter TargetName="SwitchKnobOn" Property="HorizontalAlignment" Value="Right" />
                                <Setter TargetName="SwitchKnobOn" Property="Margin" Value="0,0,3,0" />
                                <Setter TargetName="SwitchKnobOff" Property="HorizontalAlignment" Value="Left" />
                                <Setter TargetName="SwitchKnobOff" Property="Margin" Value="3,0,0,0" />
                                <Setter TargetName="OuterBorder" Property="Stroke" Value="{DynamicResource ToggleSwitchStrokeOffPressed}" />
                                <Setter TargetName="OuterBorder" Property="Fill" Value="{DynamicResource ToggleSwitchFillOffPressed}" />
                                <Setter TargetName="SwitchKnobOff" Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPressed}" />
                                <Setter TargetName="SwitchKnobOn" Property="Background" Value="{DynamicResource ToggleSwitchKnobFillOnPressed}" />
                                <Setter TargetName="SwitchKnobBounds" Property="Fill" Value="{DynamicResource ToggleSwitchFillOnPressed}" />
                                <Setter TargetName="SwitchKnobBounds" Property="Stroke" Value="{DynamicResource ToggleSwitchStrokeOnPressed}" />
                                <Setter TargetName="SwitchAreaGrid" Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}" />
                            </Trigger>
                            <!--  Disabled  -->
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter TargetName="HeaderContentPresenter" Property="Foreground" Value="{DynamicResource ToggleSwitchHeaderForegroundDisabled}" />
                                <Setter TargetName="OffContentPresenter" Property="TextElement.Foreground" Value="{DynamicResource ToggleSwitchContentForegroundDisabled}" />
                                <Setter TargetName="OnContentPresenter" Property="TextElement.Foreground" Value="{DynamicResource ToggleSwitchContentForegroundDisabled}" />
                                <Setter TargetName="OuterBorder" Property="Stroke" Value="{DynamicResource ToggleSwitchStrokeOffDisabled}" />
                                <Setter TargetName="OuterBorder" Property="Fill" Value="{DynamicResource ToggleSwitchFillOffDisabled}" />
                                <Setter TargetName="SwitchKnobOff" Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffDisabled}" />
                                <Setter TargetName="SwitchKnobOn" Property="Background" Value="{DynamicResource ToggleSwitchKnobFillOnDisabled}" />
                                <Setter TargetName="SwitchKnobBounds" Property="Fill" Value="{DynamicResource ToggleSwitchFillOnDisabled}" />
                                <Setter TargetName="SwitchKnobBounds" Property="Stroke" Value="{DynamicResource ToggleSwitchStrokeOnDisabled}" />
                                <Setter TargetName="SwitchAreaGrid" Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundDisabled}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

2 replies

wherewhere Mar 29, 2023
Maintainer

https://github.com/Paving-Base/APK-Installer-Classic/blob/main/APKInstaller/APKInstaller/Styles/Button.xaml#L93-L633
？？？
(Please just reply me. Not create a new feed...

Valkirie Mar 30, 2023
Author

Oh yeah my bad. Thanks for sharing. Was able to came to the same approach on my end.
Not sure if you want to close this discussion or keep it open for other users.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

ToggleSwitch Left or Right Nob #22

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Replies: 2 comments 2 replies

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

ToggleSwitch Left or Right Nob #22

Uh oh!

Uh oh!

Valkirie Mar 29, 2023

Replies: 2 comments · 2 replies

Uh oh!

wherewhere Mar 29, 2023 Maintainer

Uh oh!

Uh oh!

Valkirie Mar 29, 2023 Author

Uh oh!

wherewhere Mar 29, 2023 Maintainer

Uh oh!

Valkirie Mar 30, 2023 Author

Valkirie
Mar 29, 2023

Replies: 2 comments 2 replies

wherewhere
Mar 29, 2023
Maintainer

Valkirie
Mar 29, 2023
Author

wherewhere Mar 29, 2023
Maintainer

Valkirie Mar 30, 2023
Author