From 19eac7224a22c14195600e9ca11da75ffa687ad1 Mon Sep 17 00:00:00 2001
From: JamRemco <58340108+JamRemco@users.noreply.github.com>
Date: Mon, 15 Jun 2020 02:39:56 +0200
Subject: [PATCH] Fix border

---
 src/Avalonia.Controls/ToggleSwitch.cs         |   2 +-
 .../Accents/FluentControlResourcesDark.xaml   |   2 +-
 .../Accents/FluentControlResourcesLight.xaml  |   2 +-
 src/Avalonia.Themes.Fluent/ToggleSwitch.xaml  | 266 +++++++++---------
 4 files changed, 139 insertions(+), 133 deletions(-)

diff --git a/src/Avalonia.Controls/ToggleSwitch.cs b/src/Avalonia.Controls/ToggleSwitch.cs
index 16caf8dbfb..9af3ded18d 100644
--- a/src/Avalonia.Controls/ToggleSwitch.cs
+++ b/src/Avalonia.Controls/ToggleSwitch.cs
@@ -106,7 +106,7 @@ namespace Avalonia.Controls
                 OnContentPresenter = presenter;
                 result = true;
             }
-            if (presenter.Name == "PART_OffContentPresenter")
+            else if (presenter.Name == "PART_OffContentPresenter")
             {
                 OffContentPresenter = presenter;
                 result = true;
diff --git a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml
index 9fa0458db3..923180f96d 100644
--- a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml
+++ b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesDark.xaml
@@ -349,7 +349,7 @@
     <!--<x:Double x:Key="ToggleSwitchOnStrokeThickness">0</x:Double>-->
     <Thickness x:Key="ToggleSwitchOnStrokeThickness">0</Thickness>
     <!--<x:Double x:Key="ToggleSwitchOuterBorderStrokeThickness">1</x:Double>-->
-    <Thickness x:Key="ToggleSwitchOuterBorderStrokeThickness">1</Thickness>
+    <Thickness x:Key="ToggleSwitchOuterBorderStrokeThickness">1.5</Thickness>
     <StaticResource x:Key="ToggleSwitchContentForeground" ResourceKey="SystemControlForegroundBaseHighBrush" />
     <StaticResource x:Key="ToggleSwitchContentForegroundDisabled" ResourceKey="SystemControlDisabledBaseMediumLowBrush" />
     <StaticResource x:Key="ToggleSwitchHeaderForeground" ResourceKey="SystemControlForegroundBaseHighBrush" />
diff --git a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml
index 5c23bc96ee..fd7a17d2e3 100644
--- a/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml
+++ b/src/Avalonia.Themes.Fluent/Accents/FluentControlResourcesLight.xaml
@@ -350,7 +350,7 @@
     
     <Thickness x:Key="ToggleSwitchOnStrokeThickness">0</Thickness>
     <!--<x:Double x:Key="ToggleSwitchOuterBorderStrokeThickness">1</x:Double>-->
-    <Thickness x:Key="ToggleSwitchOuterBorderStrokeThickness">1</Thickness>
+    <Thickness x:Key="ToggleSwitchOuterBorderStrokeThickness">1.5</Thickness>
     <StaticResource x:Key="ToggleSwitchContentForeground" ResourceKey="SystemControlForegroundBaseHighBrush" />
     <StaticResource x:Key="ToggleSwitchContentForegroundDisabled" ResourceKey="SystemControlDisabledBaseMediumLowBrush" />
     <StaticResource x:Key="ToggleSwitchHeaderForeground" ResourceKey="SystemControlForegroundBaseHighBrush" />
diff --git a/src/Avalonia.Themes.Fluent/ToggleSwitch.xaml b/src/Avalonia.Themes.Fluent/ToggleSwitch.xaml
index df9be1284a..6f74c0b715 100644
--- a/src/Avalonia.Themes.Fluent/ToggleSwitch.xaml
+++ b/src/Avalonia.Themes.Fluent/ToggleSwitch.xaml
@@ -1,12 +1,12 @@
 <!--Version wo 10-6-2020 17:30 -->
 <Styles xmlns="https://github.com/avaloniaui"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:sys="clr-namespace:System;assembly=netstandard">
-    
+        xmlns:sys="clr-namespace:System;assembly=netstandard"
+       >
   <Design.PreviewWith>
     <StackPanel Margin="20" Width="250" Spacing="24" >
 
-      <StackPanel Spacing="12">
+      <StackPanel Spacing="12" >
         <TextBlock
           Text="Automatic updates"
           Classes="h1"/>
@@ -44,148 +44,157 @@
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
         <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
-        <!--<Setter Property="ManipulationMode" Value="System,TranslateX" />
-        <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
-        <Setter Property="FocusVisualMargin" Value="-7,-3,-7,-3" />-->
         <Setter Property="Template">
-        <ControlTemplate>
-        <Grid
-            Background="{TemplateBinding Background}"
-                
-            RowDefinitions="Auto,*">
+          <ControlTemplate>
+            <Grid
+              Background="{TemplateBinding Background}"
+              RowDefinitions="Auto,*">
 
-               <ContentPresenter x:Name="PART_ContentPresenter"
-                  Grid.Row="0"
-                  Content="{TemplateBinding Content}"
-                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                 
-                  Margin="{DynamicResource ToggleSwitchTopHeaderMargin}"
-                  VerticalAlignment="Top"/>
+            <ContentPresenter x:Name="PART_ContentPresenter"
+              Grid.Row="0"
+              Content="{TemplateBinding Content}"
+              ContentTemplate="{TemplateBinding ContentTemplate}"
+              Margin="{DynamicResource ToggleSwitchTopHeaderMargin}"
+              VerticalAlignment="Top"/>
 
-                  <Grid
-                    Grid.Row="1"
-                    MinWidth="{StaticResource ToggleSwitchThemeMinWidth}"
-                    HorizontalAlignment="Left"
-                    VerticalAlignment="Top">
+              <Grid
+                Grid.Row="1"
+                MinWidth="{StaticResource ToggleSwitchThemeMinWidth}"
+                HorizontalAlignment="Left"
+                VerticalAlignment="Top">
 
-                    <Grid.RowDefinitions>
-                      <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
-                      <RowDefinition Height="Auto" />
-                      <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
-                     </Grid.RowDefinitions>
+                <Grid.RowDefinitions>
+                  <RowDefinition Height="{DynamicResource ToggleSwitchPreContentMargin}" />
+                  <RowDefinition Height="Auto" />
+                  <RowDefinition Height="{DynamicResource ToggleSwitchPostContentMargin}" />
+                </Grid.RowDefinitions>
 
-                    <Grid.ColumnDefinitions>
-                      <ColumnDefinition Width="Auto" />
-                      <ColumnDefinition Width="12" MaxWidth="12" />
-                      <ColumnDefinition Width="Auto" />
-                    </Grid.ColumnDefinitions>
+                <Grid.ColumnDefinitions>
+                  <ColumnDefinition Width="Auto" />
+                  <ColumnDefinition Width="12" MaxWidth="12" />
+                  <ColumnDefinition Width="Auto" />
+                </Grid.ColumnDefinitions>
 
-                    <Grid x:Name="SwitchAreaGrid"
+                <Grid x:Name="SwitchAreaGrid"
 
-                      Grid.RowSpan="3"
-                      Grid.ColumnSpan="3"
-                      Margin="0,5"
-                               
-                      Background="{DynamicResource ToggleSwitchContainerBackground}" />
+                  Grid.RowSpan="3"
+                  Grid.ColumnSpan="3"
+                  Margin="0,5" />
 
-                      <ContentPresenter x:Name="PART_OffContentPresenter"
-                        Grid.RowSpan="3"
-                        Grid.Column="2"
-                        
-                        
-                        Content="{TemplateBinding OffContent}"
-                        ContentTemplate="{TemplateBinding OffContentTemplate}"
-                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                />
+                <ContentPresenter x:Name="PART_OffContentPresenter"
+                  Grid.RowSpan="3"
+                  Grid.Column="2"
+                  Content="{TemplateBinding OffContent}"
+                  ContentTemplate="{TemplateBinding OffContentTemplate}"
+                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
 
-                        <ContentPresenter x:Name="PART_OnContentPresenter"
-                          Grid.RowSpan="3"
-                          Grid.Column="2"
-                        
-                          Content="{TemplateBinding OnContent}"
-                          ContentTemplate="{TemplateBinding OnContentTemplate}"
-                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                 />
+                  <ContentPresenter x:Name="PART_OnContentPresenter"
+                    Grid.RowSpan="3"
+                    Grid.Column="2"
+                    Content="{TemplateBinding OnContent}"
+                    ContentTemplate="{TemplateBinding OnContentTemplate}"
+                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                           
-                         <Border x:Name="OuterBorder"
-                            Grid.Row="1"
-                            Height="20"
-                            Width="40" 
-                            CornerRadius="50"
-                            Background="{DynamicResource ToggleSwitchFilloff}"
-                            BorderBrush="{DynamicResource ToggleSwitchStrokeOn}"
-                            BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}" />
+                 <Border x:Name="OuterBorder"
+                   Grid.Row="1"
+                   Height="20"
+                   Width="40" 
+                   CornerRadius="10"
+                   BorderThickness="{DynamicResource ToggleSwitchOuterBorderStrokeThickness}" />
                           
-                         <Border x:Name="SwitchKnobBounds"
-                            Grid.Row="1"
-                            Height="20"
-                            Width="40"
-                            CornerRadius="50"
-                            Background="{DynamicResource ToggleSwitchFillOn}"
-                            BorderBrush="{DynamicResource ToggleSwitchStrokeOn}"
-                            BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"
-                            />
+                 <Border x:Name="SwitchKnobBounds"
+                   Grid.Row="1"
+                   Height="20"
+                   Width="40"
+                   CornerRadius="10"
+                   BorderThickness="{DynamicResource ToggleSwitchOnStrokeThickness}"/>
                           
-                         <Grid x:Name="SwitchKnob"
-                            Grid.Row="1"
-                            HorizontalAlignment="Left"
-                            Width="20"
-                            Height="20">
-                            <Ellipse x:Name="SwitchKnobOn"
-                              Fill="{DynamicResource ToggleSwitchKnobFillOn}"
-                              Width="10"
-                              Height="10"
-                               />
-                            <Ellipse x:Name="SwitchKnobOff"
-                              Fill="{DynamicResource ToggleSwitchKnobFillOff}"
-                              Width="10"
-                              Height="10" />
-                              <Grid.RenderTransform>
-                                    <!--<TranslateTransform x:Name="KnobTranslateTransform" />-->
-                              </Grid.RenderTransform>
-                         </Grid>
-                    
-                            <Thumb x:Name="SwitchThumb"
-                              Grid.RowSpan="3"
-                                Grid.ColumnSpan="3">
-                                <Thumb.Template>
-                                  <ControlTemplate>
-                                    <Rectangle Fill="Transparent" />
-                                  </ControlTemplate>
-                                </Thumb.Template>
-                              </Thumb>
-                  
-                        </Grid>
-                    </Grid>
+                 <Grid x:Name="SwitchKnob"
+                    Grid.Row="1"
+                    HorizontalAlignment="Left"
+                    Width="20"
+                    Height="20">
+                           
+                   <Ellipse x:Name="SwitchKnobOn"
+                     Width="10"
+                     Height="10"/>
+                           
+                   <Ellipse x:Name="SwitchKnobOff"
+                     Width="10"
+                     Height="10" />
+                       <Grid.RenderTransform>
+                          <!--<TranslateTransform x:Name="KnobTranslateTransform" />-->
+                       </Grid.RenderTransform>
+                 </Grid>
+                
+                 <!--<Thumb x:Name="SwitchThumb"
+                   Grid.RowSpan="3"
+                   Grid.ColumnSpan="3">
+                   <Thumb.Template>
+                     <ControlTemplate>
+                       <Rectangle Fill="Transparent" />
+                     </ControlTemplate>
+                   </Thumb.Template>
+                 </Thumb>-->
+              </Grid>
+            </Grid>
         </ControlTemplate>
       </Setter>
-
     </Style>
   
-  <!--******** POINTEROVER *******-->
+  <!--*********** Normal ********-->
+  <!--  Initial values If hardcode values in template they'll become Imutable -->
   
-      <Style Selector="ToggleSwitch:PointerOver /template/ Border#OuterBorder"> 
+   <Style Selector="ToggleSwitch /template/ Grid#SwitchAreaGrid">
+       <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackground}"/>
+  </Style>
+  
+  <Style Selector="ToggleSwitch /template/ Border#OuterBorder">
+     <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOff}"/>
+     <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOff}"/>
+  </Style>
+  
+  <Style Selector="ToggleSwitch /template/ Border#SwitchKnobBounds">
+     <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}"/>
+     <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}"/>
+  </Style>
+  
+  <Style Selector="ToggleSwitch /template/ Ellipse#SwitchKnobOn">
+    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOn}"/>
+    <Setter Property="Stroke" Value="{DynamicResource ToggleSwitchKnobStrokeOn}"/>
+  </Style>
+  
+  <Style Selector="ToggleSwitch /template/ Ellipse#SwitchKnobOff">
+    <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOff}"/>
+    <Setter Property="Stroke" Value="{DynamicResource ToggleSwitchKnobStrokeOff}"/>
+  </Style>
+ 
+  <!--******** POINTEROVER *******-->
+              
+      <Style Selector="ToggleSwitch:pointerover /template/ Border#OuterBorder"> 
+       
         <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOffPointerOver}"/>
         <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOffPointerOver}"/>
       </Style>
       
-      <Style Selector="ToggleSwitch:PointerOver /template/ Ellipse#SwitchKnobOff"> 
+      <Style Selector="ToggleSwitch:pointerover /template/ Ellipse#SwitchKnobOff"> 
         <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOffPointerOver}"/>
       </Style>
   
-      <Style Selector="ToggleSwitch:PointerOver /template/ Ellipse#SwitchKnobOn"> 
+      <Style Selector="ToggleSwitch:pointerover /template/ Ellipse#SwitchKnobOn"> 
         <Setter Property="Fill" Value="{DynamicResource ToggleSwitchKnobFillOnPointerOver}"/>
       </Style>
     
-       <Style Selector="ToggleSwitch:PointerOver /template/ Border#SwitchKnobBounds"> 
+       <Style Selector="ToggleSwitch:pointerover /template/ Border#SwitchKnobBounds"> 
+      
         <Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOnPointerOver}"/>
         <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOnPointerOver}"/>
       </Style>
          
-      <Style Selector="ToggleSwitch:PointerOver /template/ Grid#SwitchAreaGrid"> 
-        <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}"/>
+      <Style Selector="ToggleSwitch:pointerover /template/ Grid#SwitchAreaGrid"> 
+         <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPointerOver}"/>
       </Style>
   
   <!--******** PRESSED *******-->
@@ -211,7 +220,7 @@
       <Style Selector="ToggleSwitch:pressed /template/ Grid#SwitchAreaGrid"> 
         <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerBackgroundPressed}"/>
       </Style>
-  
+    
    <!--******** DISABLED *******-->
 
       <Style Selector="ToggleSwitch:disabled">
@@ -242,7 +251,7 @@
   
    <!--******** CHECKED *******-->
       <Style Selector="ToggleSwitch:checked /template/ Border#OuterBorder"> 
-        <Setter Property="Opacity" Value="1"/>
+        <Setter Property="Opacity" Value="0"/>
       </Style>
       
       <Style Selector="ToggleSwitch:checked  /template/ Ellipse#SwitchKnobOff"> 
@@ -251,7 +260,7 @@
       </Style>
         
       <Style Selector="ToggleSwitch:checked  /template/ Border#SwitchKnobBounds"> 
-        <Setter Property="Opacity" Value="0"/>
+        <Setter Property="Opacity" Value="1"/>
         <!--<Setter Property="IsHitTestVisible" Value="false"/>-->
       </Style>
   
@@ -274,31 +283,29 @@
   
   <!--******** UNCHECKED *******-->
   
-    <Style Selector="ToggleSwitch:checked /template/ Border#OuterBorder">
+    <Style Selector="ToggleSwitch:unchecked /template/ Border#OuterBorder">
      <Setter Property="Opacity" Value="1"/>
+    
    </Style>
 
-   <Style Selector="ToggleSwitch:checked /template/ Ellipse#SwitchKnobOff">
+   <Style Selector="ToggleSwitch:unchecked /template/ Ellipse#SwitchKnobOff">
      <Setter Property="Opacity" Value="1"/>
    </Style>
 
-   <Style Selector="ToggleSwitch:checked /template/ Ellipse#SwitchKnobOn">
+   <Style Selector="ToggleSwitch:unchecked /template/ Ellipse#SwitchKnobOn">
      <Setter Property="Opacity" Value="0"/>
    </Style>
   
-   <Style Selector="ToggleSwitch:checked  /template/ Ellipse#SwitchKnobBounds"> 
-        <Setter Property="Opacity" Value="1"/>
-        <!--<Setter Property="IsHitTestVisible" Value="false"/>-->
-      </Style>
-
-   <Style Selector="ToggleSwitch:checked /template/ ContentPresenter#PART_OffContentPresenter">
+   <Style Selector="ToggleSwitch:unchecked  /template/ Border#SwitchKnobBounds"> 
+     <Setter Property="Opacity" Value="0"/>
+   </Style>
+  
+   <Style Selector="ToggleSwitch:unchecked /template/ ContentPresenter#PART_OffContentPresenter">
      <Setter Property="Opacity" Value="1"/>
    </Style>
 
-  <Style Selector="ToggleSwitch:checked /template/ ContentPresenter#PART_OnContentPresenter">
+  <Style Selector="ToggleSwitch:unchecked /template/ ContentPresenter#PART_OnContentPresenter">
     <Setter Property="Opacity" Value="0"/>
-   
-  
   </Style>
     
     
@@ -309,7 +316,6 @@
     <x:Double x:Key="ToggleSwitchThemeMinWidth">154</x:Double>
     <x:Double x:Key="KnobOnPosition">5</x:Double>
     <x:Double x:Key="KnobOffPosition">28</x:Double>
-   
  
  </Styles.Resources>