Skip to content

feat(controls): Add LabelPosition property to ToggleSwitch control #1600

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pomianowski merged 1 commit into from
Jan 10, 2026
Merged

feat(controls): Add LabelPosition property to ToggleSwitch control #1600

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 14 additions & 2 deletions src/Wpf.Ui.Gallery/Views/Pages/BasicInput/ToggleSwitchPage.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
mc:Ignorable="d">

<Grid Margin="0,0,0,24">
<StackPanel Margin="0,0,0,24">
<controls:ControlExample
Margin="0"
HeaderText="WPF UI toggle switch."
Expand All @@ -42,5 +42,17 @@
</Grid>
</controls:ControlExample>

</Grid>
<controls:ControlExample
Margin="0,32,0,0"
HeaderText="ToggleSwitch with LabelPosition property."
XamlCode="&lt;ui:ToggleSwitch Content=&quot;Label on Right&quot; LabelPosition=&quot;Right&quot; /&gt;&#10; &lt;ui:ToggleSwitch Content=&quot;Label on Left&quot; LabelPosition=&quot;Left&quot; /&gt;">
<StackPanel>
<ui:ToggleSwitch
Margin="0,0,0,8"
Content="Label on Right"
LabelPosition="Right" />
<ui:ToggleSwitch Content="Label on Left" LabelPosition="Left" />
</StackPanel>
</controls:ControlExample>
</StackPanel>
</Page>
24 changes: 24 additions & 0 deletions src/Wpf.Ui/Controls/ToggleSwitch/ToggleSwitch.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@
// Copyright (C) Leszek Pomianowski and WPF UI Contributors.
// All Rights Reserved.

using System.Windows;

namespace Wpf.Ui.Controls;

/// <summary>
Expand All @@ -26,6 +28,17 @@ public class ToggleSwitch : System.Windows.Controls.Primitives.ToggleButton
new PropertyMetadata(null)
);

/// <summary>Identifies the <see cref="LabelPosition"/> dependency property.</summary>
public static readonly DependencyProperty LabelPositionProperty = DependencyProperty.Register(
nameof(LabelPosition),
typeof(ElementPlacement),
typeof(ToggleSwitch),
new FrameworkPropertyMetadata(
ElementPlacement.Right,
FrameworkPropertyMetadataOptions.AffectsArrange | FrameworkPropertyMetadataOptions.AffectsMeasure
)
);

/// <summary>
/// Gets or sets the content that should be displayed when the <see cref="ToggleSwitch"/> is in the "Off" state.
/// </summary>
Expand All @@ -45,4 +58,15 @@ public object? OnContent
get => GetValue(OnContentProperty);
set => SetValue(OnContentProperty, value);
}

/// <summary>
/// Gets or sets the position of the label content relative to the toggle switch.
/// </summary>
[System.ComponentModel.Bindable(true)]
[System.ComponentModel.Category("Layout")]
public ElementPlacement LabelPosition
{
get => (ElementPlacement)GetValue(LabelPositionProperty);
set => SetValue(LabelPositionProperty, value);
}
}
16 changes: 14 additions & 2 deletions src/Wpf.Ui/Controls/ToggleSwitch/ToggleSwitch.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@
<Setter Property="Padding" Value="{StaticResource ToggleSwitchPadding}" />
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="LabelPosition" Value="Right" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
Expand All @@ -43,10 +44,11 @@
<ControlTemplate TargetType="{x:Type controls:ToggleSwitch}">
<Grid Margin="{TemplateBinding Padding}" Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition x:Name="ToggleColumn" Width="Auto" />
<ColumnDefinition x:Name="ContentColumn" Width="*" />
Comment on lines +47 to +48
Copy link
Collaborator

@Nuklon Nuklon Dec 9, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Undo, not needed.

Copy link
Contributor Author

@Koichi-Kobayashi Koichi-Kobayashi Dec 9, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I guess so...
Since there was #1536 ...

</Grid.ColumnDefinitions>
<Grid
x:Name="ToggleGrid"
Grid.Column="0"
Width="{StaticResource ToggleButtonWidth}"
Height="{StaticResource ToggleButtonHeight}">
Expand Down Expand Up @@ -113,6 +115,16 @@
TextElement.Foreground="{TemplateBinding Foreground}" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="LabelPosition" Value="Left">
<Setter TargetName="ToggleGrid" Property="Grid.Column" Value="1" />
<Setter TargetName="ContentPresenter" Property="Grid.Column" Value="0" />
<Setter TargetName="ContentPresenter" Property="Margin" Value="0,0,8,0" />
</Trigger>
<Trigger Property="LabelPosition" Value="Right">
<Setter TargetName="ToggleGrid" Property="Grid.Column" Value="0" />
<Setter TargetName="ContentPresenter" Property="Grid.Column" Value="1" />
<Setter TargetName="ContentPresenter" Property="Margin" Value="8,0,0,0" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Content" Value="{x:Null}" />
Expand Down