Merge pull request #602 from zh3305/update_ToggleSwitch

Update `ToggleSwitch` add `OffContent` and `OnContent`
lepoco · Oct 22, 2023 · 7229407 · 7229407
2 parents dd2ee94 + 554955e
commit 7229407
Show file tree

Hide file tree

Showing 3 changed files with 115 additions and 17 deletions.
diff --git a/src/Wpf.Ui.Gallery/Views/Pages/BasicInput/ToggleSwitchPage.xaml b/src/Wpf.Ui.Gallery/Views/Pages/BasicInput/ToggleSwitchPage.xaml
@@ -29,15 +29,31 @@
                     <ColumnDefinition Width="*" />
                     <ColumnDefinition Width="Auto" />
                 </Grid.ColumnDefinitions>
-                <ui:ToggleSwitch
-                    Grid.Column="0"
-                    Content="WPF UI toggle switch"
-                    IsEnabled="{Binding ViewModel.IsToggleSwitchEnabled, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:ToggleSwitchPage}, Mode=OneWay}" />
-                <CheckBox
-                    Grid.Column="1"
-                    Command="{Binding ViewModel.ToggleSwitchCheckboxCheckedCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:ToggleSwitchPage}, Mode=OneWay}"
-                    CommandParameter="{Binding RelativeSource={RelativeSource Self}, Mode=OneWay}"
-                    Content="Disable switch" />
+
+                <Grid Grid.Column="0" Margin="42">
+                    <controls:GalleryControlPresenter
+                        Grid.Row="0"
+                        Margin="0"
+                        CodeText="&lt;ui:ToggleSwitch OffContent=&quot;Off&quot; OnContent=&quot;On&quot;  /&gt;"
+                        HeaderText="WPF UI toggle switch.">
+                        <controls:GalleryControlPresenter.Content>
+                            <Grid>
+                                <Grid.ColumnDefinitions>
+                                    <ColumnDefinition Width="*" />
+                                    <ColumnDefinition Width="Auto" />
+                                </Grid.ColumnDefinitions>
+                                <ui:ToggleSwitch
+                                    Grid.Column="0" OffContent="Off" OnContent="On"
+                                    IsEnabled="{Binding ViewModel.IsToggleSwitchEnabled, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:ToggleSwitchPage}, Mode=OneWay}" />
+                                <CheckBox
+                                    Grid.Column="1"
+                                    Command="{Binding ViewModel.ToggleSwitchCheckboxCheckedCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:ToggleSwitchPage}, Mode=OneWay}"
+                                    CommandParameter="{Binding RelativeSource={RelativeSource Self}, Mode=OneWay}"
+                                    Content="Disable switch" />
+                            </Grid>
+                        </controls:GalleryControlPresenter.Content>
+                    </controls:GalleryControlPresenter>
+                </Grid>
             </Grid>
         </controls:ControlExample>
     </Grid>

diff --git a/src/Wpf.Ui/Controls/ToggleSwitch/ToggleSwitch.cs b/src/Wpf.Ui/Controls/ToggleSwitch/ToggleSwitch.cs
@@ -3,12 +3,50 @@
 // Copyright (C) Leszek Pomianowski and WPF UI Contributors.
 // All Rights Reserved.
 
-// ReSharper disable once CheckNamespace
+using System.ComponentModel;
+using System.Drawing;
+using System.Windows;
+
 namespace Wpf.Ui.Controls;
 
 /// <summary>
 /// Use <see cref="ToggleSwitch"/> to present users with two mutally exclusive options (like on/off).
 /// </summary>
-//[ToolboxItem(true)]
-//[ToolboxBitmap(typeof(ToggleSwitch), "ToggleSwitch.bmp")]
-public class ToggleSwitch : System.Windows.Controls.Primitives.ToggleButton { }
+// [ToolboxItem(true)]
+// [ToolboxBitmap(typeof(ToggleSwitch), "ToggleSwitch.bmp")]
+public class ToggleSwitch : System.Windows.Controls.Primitives.ToggleButton
+{
+    /// <summary>
+    /// Property for <see cref="OffContent"/>.
+    /// </summary>
+    public static readonly DependencyProperty OffContentProperty = DependencyProperty.Register(
+        "OffContent", typeof(object), typeof(ToggleSwitch), new PropertyMetadata(null));
+
+    /// <summary>
+    /// Property for <see cref="OnContent"/>.
+    /// </summary>
+    public static readonly DependencyProperty OnContentProperty = DependencyProperty.Register(
+        "OnContent", typeof(object), typeof(ToggleSwitch), new PropertyMetadata(null));
+
+    /// <summary>
+    /// Provides the object content that should be displayed when this
+    /// <see cref="ToggleSwitch" /> has state of "Off".
+    /// </summary>
+    [Bindable(true)]
+    public object OffContent
+    {
+        get => GetValue(OffContentProperty);
+        set => SetValue(OffContentProperty, value);
+    }
+
+    /// <summary>
+    /// Provides the object content that should be displayed when this
+    /// <see cref="ToggleSwitch" /> has state of "On".
+    /// </summary>
+    [Bindable(true)]
+    public object OnContent
+    {
+        get => GetValue(OnContentProperty);
+        set => SetValue(OnContentProperty, value);
+    }
+}
diff --git a/src/Wpf.Ui/Controls/ToggleSwitch/ToggleSwitch.xaml b/src/Wpf.Ui/Controls/ToggleSwitch/ToggleSwitch.xaml
@@ -127,12 +127,24 @@
                             TextElement.Foreground="{TemplateBinding Foreground}" />
                     </Grid>
                     <ControlTemplate.Triggers>
-                        <Trigger Property="Content" Value="{x:Null}">
+                        <MultiTrigger>
+                            <MultiTrigger.Conditions>
+                                 <Condition Property="Content" Value="{x:Null}" />
+                                 <Condition Property="OnContent" Value="{x:Null}" /> 
+                                 <Condition Property="OffContent" Value="{x:Null}" /> 
+                            </MultiTrigger.Conditions>
                             <Setter TargetName="ContentPresenter" Property="Margin" Value="0" />
-                        </Trigger>
-                        <Trigger Property="Content" Value="">
+                        </MultiTrigger>
+
+                        <MultiTrigger>
+                            <MultiTrigger.Conditions>
+                                 <Condition Property="Content" Value="" />
+                                 <Condition Property="OnContent" Value="" /> 
+                                 <Condition Property="OffContent" Value="" /> 
+                            </MultiTrigger.Conditions>
                             <Setter TargetName="ContentPresenter" Property="Margin" Value="0" />
-                        </Trigger>
+                        </MultiTrigger>
+
                         <Trigger Property="IsChecked" Value="True">
                             <Trigger.EnterActions>
                                 <BeginStoryboard>
@@ -219,6 +231,38 @@
                                 </BeginStoryboard>
                             </Trigger.ExitActions>
                         </Trigger>
+                        <MultiTrigger>
+                            <MultiTrigger.Conditions>
+                                <Condition Property="Content" Value="{x:Null}" />
+                                <Condition Property="IsChecked" Value="True" />
+                            </MultiTrigger.Conditions>
+                            <Setter TargetName="ContentPresenter" Property="Content" Value="{Binding OnContent, RelativeSource={RelativeSource TemplatedParent}}" />
+                        </MultiTrigger>
+
+                        <MultiTrigger>
+                            <MultiTrigger.Conditions>
+                                <Condition Property="Content" Value="{x:Null}" />
+                                <Condition Property="IsChecked" Value="False" />
+                            </MultiTrigger.Conditions>
+                            <Setter TargetName="ContentPresenter" Property="Content" Value="{Binding OffContent, RelativeSource={RelativeSource TemplatedParent}}" />
+                        </MultiTrigger>
+
+                        <MultiTrigger>
+                            <MultiTrigger.Conditions>
+                                <Condition Property="Content" Value="" />
+                                <Condition Property="IsChecked" Value="True" />
+                            </MultiTrigger.Conditions>
+                            <Setter TargetName="ContentPresenter" Property="Content" Value="{Binding OnContent, RelativeSource={RelativeSource TemplatedParent}}" />
+                        </MultiTrigger>
+
+                        <MultiTrigger>
+                            <MultiTrigger.Conditions>
+                                <Condition Property="Content" Value="" />
+                                <Condition Property="IsChecked" Value="False" />
+                            </MultiTrigger.Conditions>
+                            <Setter TargetName="ContentPresenter" Property="Content" Value="{Binding OffContent, RelativeSource={RelativeSource TemplatedParent}}" />
+                        </MultiTrigger>
+
                         <MultiTrigger>
                             <MultiTrigger.Conditions>
                                 <Condition Property="IsMouseOver" Value="True" />