ToggleSwitchpage for Control gallery (#4137)

Co-authored-by: danwalmsley <dan@walms.co.uk>

samples/ControlCatalog/MainView.xaml

@@ -57,6 +57,7 @@
       <TabItem Header="TabStrip"><pages:TabStripPage/></TabItem>
       <TabItem Header="TextBox"><pages:TextBoxPage/></TabItem>
       <TabItem Header="TextBlock"><pages:TextBlockPage/></TabItem>
+      <TabItem Header="ToggleSwitch"><pages:ToggleSwitchPage/></TabItem>
       <TabItem Header="ToolTip"><pages:ToolTipPage/></TabItem>
       <TabItem Header="TreeView"><pages:TreeViewPage/></TabItem>
       <TabItem Header="Viewbox"><pages:ViewboxPage/></TabItem>

samples/ControlCatalog/Pages/ToggleSwitchPage.xaml

@@ -0,0 +1,79 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             x:Class="ControlCatalog.Pages.ToggleSwitchPage" Margin="5">
+  <StackPanel Width="500" HorizontalAlignment="Center">
+    <TextBlock Text="Simple ToggleSwitch" Classes="header"/>
+    <Border Classes="Thin">
+      <StackPanel>
+        <ToggleSwitch Margin="10"/>
+        <TextBox Text="&lt;ToggleSwitch/&gt;" Classes="CodeBox"/>
+      </StackPanel>
+    </Border>
+
+    <TextBlock Text="headered ToggleSwitch" Classes="header"/>
+
+    <Border Classes="Thin">
+      <StackPanel>
+        <ToggleSwitch Content="headered" IsChecked="true" Margin="10"/>
+        <TextBox Classes="CodeBox"
+          Text="&lt;ToggleSwitch&gt;headered&lt;/ToggleSwitch&gt;"/>
+      </StackPanel>
+    </Border>
+
+    <TextBlock Text="Custom content ToggleSwitch" Classes="header"/>
+
+    <Border Classes="Thin">
+      <StackPanel>
+        <ToggleSwitch Content="Custom"
+          OnContent="On"
+          OffContent="Off"
+          Margin="10"/>
+
+        <TextBox Text="&lt;ToggleSwitch Content=&quot;Custom&quot; 
+ContentOn=&quot;On&quot; 
+ContentOff=&quot;Off&quot; /&gt;"
+          Classes="CodeBox"/>
+      </StackPanel>
+    </Border>
+
+    <TextBlock Text="Image content ToggleSwitch" Classes="header"/>
+
+    <Border Classes="Thin">
+      <StackPanel>
+        <ToggleSwitch Content="Just Click!" Margin="10">
+          <ToggleSwitch.OnContent>
+            <Image Source="/Assets/hirsch-899118_640.jpg" Height="32"/>
+          </ToggleSwitch.OnContent>
+
+          <ToggleSwitch.OffContent>
+            <Image Source="/Assets/delicate-arch-896885_640.jpg" Height="32"/>
+          </ToggleSwitch.OffContent>
+
+        </ToggleSwitch>
+      </StackPanel>
+    </Border>
+  </StackPanel>
+
+  <UserControl.Styles >
+    <Style Selector="TextBox.CodeBox" >
+      <Setter Property="Padding" Value="10"/>
+      <Setter Property="IsReadOnly" Value="True"/>
+      <Setter Property="BorderBrush" Value="Transparent"/>
+      <Setter Property="FontSize" Value="14"/>
+      <Setter Property="IsEnabled" Value="true"/>
+    </Style>
+
+    <Style Selector="TextBlock.header">
+      <Setter Property="FontSize" Value="18"/>
+      <Setter Property="Margin" Value="0 20 0 20"/>
+    </Style>
+
+    <Style Selector="Border.Thin">
+      <Setter Property="BorderBrush" Value="Gray"/>
+      <Setter Property="BorderThickness" Value="0.5"/>
+      <Setter Property="CornerRadius" Value="2"/>
+    </Style>
+
+  </UserControl.Styles>
+</UserControl>
+

samples/ControlCatalog/Pages/ToggleSwitchPage.xaml.cs

@@ -0,0 +1,19 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Markup.Xaml;
+
+namespace ControlCatalog.Pages
+{
+    public class ToggleSwitchPage : UserControl
+    {
+        public ToggleSwitchPage()
+        {
+            this.InitializeComponent();
+        }
+
+        private void InitializeComponent()
+        {
+            AvaloniaXamlLoader.Load(this);
+        }
+    }
+}

src/Avalonia.Controls/ToggleSwitch.cs

@@ -1,4 +1,5 @@
-using Avalonia.Controls.Primitives;
+using Avalonia.Controls.Presenters;
+using Avalonia.Controls.Primitives;
 using Avalonia.Controls.Templates;
 using Avalonia.LogicalTree;
 
@@ -57,6 +58,18 @@ namespace Avalonia.Controls
             set { SetValue(OffContentProperty, value); }
         }
 
+        public IContentPresenter OffContentPresenter
+        {
+            get;
+            private set;
+        }
+
+        public IContentPresenter OnContentPresenter
+        {
+            get;
+            private set;
+        }
+
         /// <summary>
         /// Gets or Sets the <see cref="IDataTemplate"/> used to display the <see cref="OffContent"/>.
         /// </summary>
@@ -100,6 +113,24 @@ namespace Avalonia.Controls
                 LogicalChildren.Add(newChild);
             }
         }
+
+        protected override bool RegisterContentPresenter(IContentPresenter presenter)
+        {
+            var result = base.RegisterContentPresenter(presenter);
+
+            if (presenter.Name == "Part_OnContentPresenter")
+            {
+                OnContentPresenter = presenter;
+                result = true;
+            }
+            else if (presenter.Name == "PART_OffContentPresenter")
+            {
+                OffContentPresenter = presenter;
+                result = true;
+            }
+
+            return result;
+        }
     }
 }
 

src/Avalonia.Themes.Fluent/Avalonia.Themes.Fluent.csproj

@@ -19,4 +19,4 @@
   </ItemGroup>
   <Import Project="..\..\build\BuildTargets.targets" />
   <Import Project="..\..\build\Rx.props" />
-</Project>
+</Project>