From 4f335b94710252147646ca74d02842ea93ea030f Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Tue, 19 Oct 2021 13:44:13 +0200
Subject: [PATCH] [Settings][Chore] Add CheckBoxWithDescriptionControl (#13866)

* Added new control

* Update Microsoft.PowerToys.Settings.UI.csproj

* Added styling

* Add enableableTextBlock

* Update EnableableTextBlock.xaml

* Updated styles

* Updates styles

* Updated margins

* Name change and typo fix

* Update App.xaml

* Control name change

* Update expect.txt

* More name changes

* Even more name changes

Co-authored-by: Laute <Niels.Laute@philips.com>
---
 .../Microsoft.PowerToys.Settings.UI/App.xaml  |  5 ++
 .../CheckBoxWithDescriptionControl.cs         | 72 ++++++++++++++++++
 .../IsEnabledTextBlock/IsEnabledTextBlock.cs  | 51 +++++++++++++
 .../IsEnabledTextBlock.xaml                   | 34 +++++++++
 .../Controls/TextBlockControl.xaml            | 15 ----
 .../Controls/TextBlockControl.xaml.cs         | 76 -------------------
 .../Microsoft.PowerToys.Settings.UI.csproj    | 15 ++--
 .../Strings/en-us/Resources.resw              | 11 ++-
 .../Themes/Generic.xaml                       |  1 +
 .../Themes/SettingsExpanderStyles.xaml        |  1 -
 .../Views/FancyZonesPage.xaml                 | 26 ++-----
 .../Views/PowerLauncherPage.xaml              | 15 ++--
 12 files changed, 194 insertions(+), 128 deletions(-)
 create mode 100644 src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/CheckBoxWithDescriptionControl.cs
 create mode 100644 src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.cs
 create mode 100644 src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml
 delete mode 100644 src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml
 delete mode 100644 src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml.cs

diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml
index 6900c4b1e9..d2283fa45c 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/App.xaml
@@ -2,12 +2,14 @@
     x:Class="Microsoft.PowerToys.Settings.UI.App"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:controls="using:Microsoft.PowerToys.Settings.UI.Controls"
     xmlns:xaml="using:Microsoft.Toolkit.Win32.UI.XamlHost">
     <Application.Resources>
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>
                 <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" ControlsResourcesVersion="Version2" />
                 <ResourceDictionary Source="/Controls/KeyVisual/KeyVisual.xaml" />
+                <ResourceDictionary Source="/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml" />
                 <ResourceDictionary Source="/Styles/TextBlock.xaml" />
                 <ResourceDictionary Source="/Styles/Button.xaml"/>
                 <ResourceDictionary Source="/Themes/Colors.xaml"/>
@@ -23,6 +25,9 @@
                 <Setter Property="Padding" Value="0,0,0,0" />
                 <Setter Property="HorizontalContentAlignment" Value="Stretch" />
             </Style>
+
+            <Style TargetType="controls:CheckBoxWithDescriptionControl" BasedOn="{StaticResource DefaultCheckBoxStyle}" />
+
         </ResourceDictionary>
     </Application.Resources>
 </xaml:XamlApplication>
\ No newline at end of file
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/CheckBoxWithDescriptionControl.cs b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/CheckBoxWithDescriptionControl.cs
new file mode 100644
index 0000000000..8c728b9150
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/CheckBoxWithDescriptionControl.cs
@@ -0,0 +1,72 @@
+// Copyright (c) Microsoft Corporation
+// The Microsoft Corporation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using System.ComponentModel;
+using Windows.UI.Accessibility;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Automation;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Media;
+
+namespace Microsoft.PowerToys.Settings.UI.Controls
+{
+    public class CheckBoxWithDescriptionControl : CheckBox
+    {
+        private CheckBoxWithDescriptionControl _checkBoxSubTextControl;
+
+        public CheckBoxWithDescriptionControl()
+        {
+            _checkBoxSubTextControl = (CheckBoxWithDescriptionControl)this;
+            this.Loaded += CheckBoxSubTextControl_Loaded;
+        }
+
+        protected override void OnApplyTemplate()
+        {
+            Update();
+            base.OnApplyTemplate();
+        }
+
+        private void Update()
+        {
+            if (!string.IsNullOrEmpty(Header))
+            {
+                AutomationProperties.SetName(this, Header);
+            }
+        }
+
+        private void CheckBoxSubTextControl_Loaded(object sender, RoutedEventArgs e)
+        {
+            StackPanel panel = new StackPanel() { Orientation = Orientation.Vertical };
+            panel.Children.Add(new TextBlock() { Margin = new Thickness(0, 10, 0, 0), Text = Header });
+            panel.Children.Add(new IsEnabledTextBlock() { FontSize = (double)App.Current.Resources["SecondaryTextFontSize"], Foreground = (SolidColorBrush)App.Current.Resources["TextFillColorSecondaryBrush"], Text = Description });
+            _checkBoxSubTextControl.Content = panel;
+        }
+
+        public static readonly DependencyProperty HeaderProperty = DependencyProperty.Register(
+            "Header",
+            typeof(string),
+            typeof(CheckBoxWithDescriptionControl),
+            new PropertyMetadata(default(string)));
+
+        public static readonly DependencyProperty DescriptionProperty = DependencyProperty.Register(
+            "Description",
+            typeof(object),
+            typeof(CheckBoxWithDescriptionControl),
+            new PropertyMetadata(default(string)));
+
+        [Localizable(true)]
+        public string Header
+        {
+            get => (string)GetValue(HeaderProperty);
+            set => SetValue(HeaderProperty, value);
+        }
+
+        [Localizable(true)]
+        public string Description
+        {
+            get => (string)GetValue(DescriptionProperty);
+            set => SetValue(DescriptionProperty, value);
+        }
+    }
+}
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.cs b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.cs
new file mode 100644
index 0000000000..ff090777c8
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.cs
@@ -0,0 +1,51 @@
+// Copyright (c) Microsoft Corporation
+// The Microsoft Corporation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using System.ComponentModel;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+
+namespace Microsoft.PowerToys.Settings.UI.Controls
+{
+    [TemplateVisualState(Name = "Normal", GroupName = "CommonStates")]
+    [TemplateVisualState(Name = "Disabled", GroupName = "CommonStates")]
+    public class IsEnabledTextBlock : Control
+    {
+        public IsEnabledTextBlock()
+        {
+            this.DefaultStyleKey = typeof(IsEnabledTextBlock);
+        }
+
+        protected override void OnApplyTemplate()
+        {
+            IsEnabledChanged -= IsEnabledTextBlock_IsEnabledChanged;
+            SetEnabledState();
+            IsEnabledChanged += IsEnabledTextBlock_IsEnabledChanged;
+            base.OnApplyTemplate();
+        }
+
+        public static readonly DependencyProperty TextProperty = DependencyProperty.Register(
+           "Text",
+           typeof(string),
+           typeof(IsEnabledTextBlock),
+           null);
+
+        [Localizable(true)]
+        public string Text
+        {
+            get => (string)GetValue(TextProperty);
+            set => SetValue(TextProperty, value);
+        }
+
+        private void IsEnabledTextBlock_IsEnabledChanged(object sender, DependencyPropertyChangedEventArgs e)
+        {
+            SetEnabledState();
+        }
+
+        private void SetEnabledState()
+        {
+            VisualStateManager.GoToState(this, IsEnabled ? "Normal" : "Disabled", true);
+        }
+    }
+}
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml
new file mode 100644
index 0000000000..080637d6da
--- /dev/null
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml
@@ -0,0 +1,34 @@
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:Microsoft.PowerToys.Settings.UI.Controls">
+
+    <Style TargetType="local:IsEnabledTextBlock">
+        <Setter Property="Foreground" Value="{ThemeResource DefaultTextForegroundThemeBrush}" />
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="local:IsEnabledTextBlock">
+                    <Grid>
+                        <VisualStateManager.VisualStateGroups>
+                            <VisualStateGroup x:Name="CommonStates">
+                                <VisualState x:Name="Normal"/>
+                                <VisualState x:Name="Disabled">
+                                    <VisualState.Setters>
+                                        <Setter Target="Label.Foreground" Value="{ThemeResource TextFillColorDisabledBrush}" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+                        </VisualStateManager.VisualStateGroups>
+                        <TextBlock x:Name="Label"
+                                   FontSize="{TemplateBinding FontSize}"
+                                   FontWeight="{TemplateBinding FontWeight}"
+                                   FontFamily="{TemplateBinding FontFamily}"
+                                   Foreground="{TemplateBinding Foreground}"
+                                   TextWrapping="WrapWholeWords"
+                                   Text="{TemplateBinding Text}" />
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+</ResourceDictionary>
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml
deleted file mode 100644
index 7733a34b35..0000000000
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml
+++ /dev/null
@@ -1,15 +0,0 @@
-<UserControl
-    x:Class="Microsoft.PowerToys.Settings.UI.Controls.TextBlockControl"
-    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
-    mc:Ignorable="d"
-    d:DesignHeight="300"
-    d:DesignWidth="400">
-
-    <TextBlock x:Name="textBlock"
-               Text="{Binding Text}"
-               TextWrapping="WrapWholeWords" 
-               Loaded="TextBlock_Loaded"/>
-</UserControl>
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml.cs b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml.cs
deleted file mode 100644
index 66f89bbde2..0000000000
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Controls/TextBlockControl.xaml.cs
+++ /dev/null
@@ -1,76 +0,0 @@
-// Copyright (c) Microsoft Corporation
-// The Microsoft Corporation licenses this file to you under the MIT license.
-// See the LICENSE file in the project root for more information.
-
-using System.ComponentModel;
-using Windows.UI.Xaml;
-using Windows.UI.Xaml.Controls;
-using Windows.UI.Xaml.Media;
-
-namespace Microsoft.PowerToys.Settings.UI.Controls
-{
-    public sealed partial class TextBlockControl : UserControl
-    {
-        public static readonly DependencyProperty TextProperty = DependencyProperty.Register(
-           "Text",
-           typeof(string),
-           typeof(TextBlockControl),
-           null);
-
-        [Localizable(true)]
-        public string Text
-        {
-            get => (string)GetValue(TextProperty);
-            set => SetValue(TextProperty, value);
-        }
-
-        public static readonly DependencyProperty EnabledForegroundProperty = DependencyProperty.Register(
-           "EnabledForeground",
-           typeof(Brush),
-           typeof(TextBlockControl),
-           null);
-
-        public Brush EnabledForeground
-        {
-            get => (Brush)GetValue(EnabledForegroundProperty);
-            set => SetValue(EnabledForegroundProperty, value);
-        }
-
-        public static readonly DependencyProperty DisabledForegroundProperty = DependencyProperty.Register(
-           "DisabledForeground",
-           typeof(Brush),
-           typeof(TextBlockControl),
-           null);
-
-        public Brush DisabledForeground
-        {
-            get => (Brush)GetValue(DisabledForegroundProperty);
-            set => SetValue(DisabledForegroundProperty, value);
-        }
-
-        public TextBlockControl()
-        {
-            this.InitializeComponent();
-            DataContext = this;
-
-            IsEnabledChanged += TextBlockControl_IsEnabledChanged;
-        }
-
-        private void TextBlockControl_IsEnabledChanged(object sender, DependencyPropertyChangedEventArgs e)
-        {
-            if ((bool)e.NewValue)
-            {
-                textBlock.Foreground = EnabledForeground;
-            }
-            else
-            {
-                textBlock.Foreground = DisabledForeground;
-            }
-        }
-
-        private void TextBlock_Loaded(object sender, RoutedEventArgs e)
-        {
-            textBlock.Foreground = IsEnabled ? EnabledForeground : DisabledForeground;
-        }
-    }
-}
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj
index b798b3f676..32924752b5 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Microsoft.PowerToys.Settings.UI.csproj
@@ -95,6 +95,8 @@
     </Compile>
     <Compile Include="Behaviors\NavigationViewHeaderBehavior.cs" />
     <Compile Include="Behaviors\NavigationViewHeaderMode.cs" />
+    <Compile Include="Controls\CheckBoxWithDescriptionControl.cs" />
+    <Compile Include="Controls\IsEnabledTextBlock\IsEnabledTextBlock.cs" />
     <Compile Include="Controls\SettingsGroup\SettingsGroupAutomationPeer.cs" />
     <Compile Include="Controls\ShortcutControl\ShortcutControl.xaml.cs">
       <DependentUpon>ShortcutControl.xaml</DependentUpon>
@@ -116,9 +118,6 @@
       <DependentUpon>OOBEPageControl.xaml</DependentUpon>
     </Compile>
     <Compile Include="Controls\SettingsPageControl\PageLink.cs" />
-    <Compile Include="Controls\TextBlockControl.xaml.cs">
-      <DependentUpon>TextBlockControl.xaml</DependentUpon>
-    </Compile>
     <Compile Include="Converters\AwakeModeToIntConverter.cs" />
     <Compile Include="Converters\ImageResizerFitToStringConverter.cs" />
     <Compile Include="Converters\ImageResizerUnitToStringConverter.cs" />
@@ -303,9 +302,13 @@
     </PackageReference>
   </ItemGroup>
   <ItemGroup>
-    <PRIResource Include="Strings\*\Resources.resw" />
+    <PRIResource Include="Strings\en-us\Resources.resw" />
   </ItemGroup>
   <ItemGroup>
+    <Page Include="Controls\IsEnabledTextBlock\IsEnabledTextBlock.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="Controls\ShortcutControl\ShortcutControl.xaml">
       <Generator>MSBuild:Compile</Generator>
       <SubType>Designer</SubType>
@@ -338,10 +341,6 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Controls\TextBlockControl.xaml">
-      <SubType>Designer</SubType>
-      <Generator>MSBuild:Compile</Generator>
-    </Page>
     <Page Include="OOBE\Views\OobeAwake.xaml">
       <Generator>MSBuild:Compile</Generator>
       <SubType>Designer</SubType>
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Strings/en-us/Resources.resw b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Strings/en-us/Resources.resw
index 05481e4593..6a22e1ab88 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Strings/en-us/Resources.resw
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Strings/en-us/Resources.resw
@@ -401,8 +401,11 @@
   <data name="PowerLauncher_IgnoreHotkeysInFullScreen.Content" xml:space="preserve">
     <value>Ignore shortcuts in fullscreen mode</value>
   </data>
-  <data name="PowerLauncher_UseCentralizedKeyboardHook.Content" xml:space="preserve">
-    <value>Use centralized keyboard hook (try it if there are issues with the shortcut)</value>
+  <data name="PowerLauncher_UseCentralizedKeyboardHook.Header" xml:space="preserve">
+    <value>Use centralized keyboard hook</value>
+  </data>
+	<data name="PowerLauncher_UseCentralizedKeyboardHook.Description" xml:space="preserve">
+    <value>Try this if there are issues with the shortcut</value>
   </data>
   <data name="PowerLauncher_ClearInputOnLaunch.Content" xml:space="preserve">
     <value>Clear the previous query on launch</value>
@@ -913,7 +916,7 @@
 Made with 💗 by Microsoft and the PowerToys community.</value>
     <comment>Windows refers to the OS</comment>
   </data>
-  <data name="FancyZones_SpanZonesAcrossMonitorsCheckBoxControl.Text" xml:space="preserve">
+  <data name="FancyZones_SpanZonesAcrossMonitors.Header" xml:space="preserve">
     <value>Allow zones to span across monitors</value>
   </data>
   <data name="ImageResizer_Formatting_ActualHeight.Text" xml:space="preserve">
@@ -1627,7 +1630,7 @@ From there, simply click on a Markdown file, PDF file or SVG icon in the File Ex
   <data name="InvalidShortcutWarningLabel.Text" xml:space="preserve">
     <value>Only shortcuts that start with **Windows key**, **Ctrl**, **Alt** or **Shift** are valid.</value>
   </data>
-  <data name="FancyZones_SpanZonesAcrossMonitorsPrerequisites.Text" xml:space="preserve">
+  <data name="FancyZones_SpanZonesAcrossMonitors.Description" xml:space="preserve">
     <value>All monitors must have the same DPI scaling and will be treated as one large combined rectangle which contains all monitors</value>
   </data>
   <data name="ImageResizer_DefaultSize_NewSizePrefix" xml:space="preserve">
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml
index c1f16179e8..8629816d97 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/Generic.xaml
@@ -5,5 +5,6 @@
     <ResourceDictionary.MergedDictionaries>
         <ResourceDictionary Source="ms-appx:///Controls/Setting/Setting.xaml" />
         <ResourceDictionary Source="ms-appx:///Controls/SettingsGroup/SettingsGroup.xaml" />
+        <ResourceDictionary Source="ms-appx:///Controls/IsEnabledTextBlock/IsEnabledTextBlock.xaml" />
     </ResourceDictionary.MergedDictionaries>
 </ResourceDictionary>
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml
index 9c6b088c91..f56e2adfa9 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Themes/SettingsExpanderStyles.xaml
@@ -34,7 +34,6 @@
     </Style>
 
     <!-- Setting expander style -->
-
     <Style x:Key="SettingExpanderStyle" TargetType="muxc:Expander">
         <Setter Property="Background" Value="{ThemeResource CardBackgroundBrush}" />
         <Setter Property="BorderThickness" Value="{ThemeResource CardBorderThickness}" />
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/FancyZonesPage.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/FancyZonesPage.xaml
index 0f46c4d8a0..8bf566a24b 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/FancyZonesPage.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/FancyZonesPage.xaml
@@ -49,7 +49,7 @@
                             <controls:Setting x:Uid="Activation_Shortcut" Icon="&#xEDA7;" Style="{StaticResource ExpanderHeaderSettingStyle}">
                                 <controls:Setting.ActionContent>
                                     <controls:ShortcutControl MinWidth="{StaticResource SettingActionControlMinWidth}"
-                                                                    HotkeySettings="{x:Bind Path=ViewModel.EditorHotkey, Mode=TwoWay}"/>
+                                                              HotkeySettings="{x:Bind Path=ViewModel.EditorHotkey, Mode=TwoWay}"/>
                                 </controls:Setting.ActionContent>
                             </controls:Setting>
                         </controls:SettingExpander.Header>
@@ -81,20 +81,10 @@
                                 <Rectangle Style="{StaticResource ExpanderSeparatorStyle}" />
                                 <CheckBox x:Uid="FancyZones_ShowZonesOnAllMonitorsCheckBoxControl" IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.ShowOnAllMonitors}" Margin="{StaticResource ExpanderSettingMargin}"  />
                                 <Rectangle Style="{StaticResource ExpanderSeparatorStyle}" />
-                                <CheckBox IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.SpanZonesAcrossMonitors}" 
-                                          Margin="56, 0, 40, 16"
-                                          AutomationProperties.Name="{Binding ElementName=SpanZonesAcrossMonitorsPrerequisitesTitle, Path=Text}">
-                                    <StackPanel Orientation="Vertical">
-                                        <TextBlock x:Name="SpanZonesAcrossMonitorsPrerequisitesTitle"
-                                                   Margin="0,10,0,0"
-                                                   x:Uid="FancyZones_SpanZonesAcrossMonitorsCheckBoxControl" />
-                                        <controls:TextBlockControl x:Uid="FancyZones_SpanZonesAcrossMonitorsPrerequisites"
-                                            FontSize="{StaticResource SecondaryTextFontSize}"
-                                            EnabledForeground="{ThemeResource TextFillColorSecondaryBrush}"
-                                            DisabledForeground="{ThemeResource TextFillColorDisabledBrush}"/>
-                                    </StackPanel>
-                                </CheckBox>
-                            
+                                <controls:CheckBoxWithDescriptionControl IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.SpanZonesAcrossMonitors}"
+                                                                 Margin="56, -2, 40, 14"
+                                                                 x:Uid="FancyZones_SpanZonesAcrossMonitors"/>
+
                                 <controls:Setting x:Uid="FancyZones_OverlappingZones" Style="{StaticResource ExpanderContentSettingStyle}">
                                     <controls:Setting.ActionContent>
                                         <ComboBox SelectedIndex="{x:Bind Path=ViewModel.OverlappingZonesAlgorithmIndex, Mode=TwoWay}" MinWidth="{StaticResource SettingActionControlMinWidth}">
@@ -232,7 +222,7 @@
                                         <ComboBox SelectedIndex="{x:Bind Mode=TwoWay, Path=ViewModel.MoveWindowsBasedOnPosition, Converter={StaticResource BoolToComboBoxIndexConverter}}" MinHeight="56" MinWidth="{StaticResource SettingActionControlMinWidth}">
                                             <ComboBoxItem x:Uid="FancyZones_MoveWindowLeftRightBasedOnZoneIndex_Accessible">
                                                 <StackPanel Orientation="Vertical" Spacing="4">
-                                                    <TextBlock x:Uid="FancyZones_MoveWindowLeftRightBasedOnZoneIndex"/>
+                                                    <controls:IsEnabledTextBlock x:Uid="FancyZones_MoveWindowLeftRightBasedOnZoneIndex"/>
                                                     <TextBlock FontFamily="{ThemeResource SymbolThemeFontFamily}" Style="{StaticResource SecondaryTextStyle}">
                                                         <Run x:Uid="FancyZones_MoveWindowLeftRightBasedOnZoneIndex_Description" />
                                                     </TextBlock>
@@ -240,8 +230,8 @@
                                             </ComboBoxItem>
                                             <ComboBoxItem x:Uid="FancyZones_MoveWindowBasedOnRelativePosition_Accessible">
                                                 <StackPanel Orientation="Vertical" Spacing="4">
-                                                    <TextBlock x:Uid="FancyZones_MoveWindowBasedOnRelativePosition"/>
-                                                    <TextBlock FontFamily="{ThemeResource SymbolThemeFontFamily}"  Style="{StaticResource SecondaryTextStyle}">
+                                                    <controls:IsEnabledTextBlock x:Uid="FancyZones_MoveWindowBasedOnRelativePosition"/>
+                                                    <TextBlock FontFamily="{ThemeResource SymbolThemeFontFamily}" Style="{StaticResource SecondaryTextStyle}">
                                                         <Run x:Uid="FancyZones_MoveWindowBasedOnRelativePosition_Description" />
                                                     </TextBlock>
                                                 </StackPanel>
diff --git a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/PowerLauncherPage.xaml b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/PowerLauncherPage.xaml
index 32256fdacf..75ce5d6569 100644
--- a/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/PowerLauncherPage.xaml
+++ b/src/settings-ui/Microsoft.PowerToys.Settings.UI/Views/PowerLauncherPage.xaml
@@ -45,9 +45,13 @@
                         </controls:SettingExpander.Header>
                         <controls:SettingExpander.Content>
                             <StackPanel>
-                                <CheckBox x:Uid="PowerLauncher_UseCentralizedKeyboardHook" IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.UseCentralizedKeyboardHook}" Margin="{StaticResource ExpanderSettingMargin}" />
+                                <controls:CheckBoxWithDescriptionControl x:Uid="PowerLauncher_UseCentralizedKeyboardHook"
+                                                                 IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.UseCentralizedKeyboardHook}"
+                                                                 Margin="56, 0, 40, 16"/>
                                 <Rectangle Style="{StaticResource ExpanderSeparatorStyle}" />
-                                <CheckBox x:Uid="PowerLauncher_IgnoreHotkeysInFullScreen" IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.IgnoreHotkeysInFullScreen}" Margin="{StaticResource ExpanderSettingMargin}" />
+                                <CheckBox x:Uid="PowerLauncher_IgnoreHotkeysInFullScreen"
+                                          IsChecked="{x:Bind Mode=TwoWay, Path=ViewModel.IgnoreHotkeysInFullScreen}"
+                                          Margin="{StaticResource ExpanderSettingMargin}" />
                             </StackPanel>
                         </controls:SettingExpander.Content>
                     </controls:SettingExpander>
@@ -236,10 +240,9 @@
                                                         <TextBlock x:Name="IncludeInGlobalResultTitle"
                                                                    Margin="0,10,0,0"
                                                                    x:Uid="PowerLauncher_IncludeInGlobalResultTitle" />
-                                                        <controls:TextBlockControl x:Uid="PowerLauncher_IncludeInGlobalResultDescription" 
-                                                                                   FontSize="{StaticResource SecondaryTextFontSize}" 
-                                                                                   EnabledForeground="{ThemeResource TextFillColorSecondaryBrush}" 
-                                                                                   DisabledForeground="{ThemeResource TextFillColorDisabledBrush}" />
+                                                        <controls:IsEnabledTextBlock x:Uid="PowerLauncher_IncludeInGlobalResultDescription" 
+                                                                                   FontSize="{StaticResource SecondaryTextFontSize}"
+                                                                                   Foreground="{ThemeResource TextFillColorSecondaryBrush}"/>
                                                     </StackPanel>
                                                 </CheckBox>