From d27594c4f71668ab7512e11f29a707a7873bcefa Mon Sep 17 00:00:00 2001
From: Kai Tao <69313318+vanzue@users.noreply.github.com>
Date: Wed, 1 Apr 2026 16:29:53 +0800
Subject: [PATCH] Settings: Fix settings arrow render (#46454)

<!-- Enter a brief description/summary of your PR here. What does it
fix/what does it change/how was it tested (even manually, if necessary)?
-->
## Summary of the Pull Request
Existing:
<img width="1201" height="150" alt="image"
src="https://github.com/user-attachments/assets/5e764875-bed8-45b5-97a8-60e5f475c296"
/>

A box icon for whatever up, down, left, right, they are not treated as
Glyph icon rendered, instead as normal text

<!-- Please review the items on the PR checklist before submitting-->
## PR Checklist

- [ ] Closes: #xxx
<!-- - [ ] Closes: #yyy (add separate lines for additional resolved
issues) -->
- [ ] **Communication:** I've discussed this with core contributors
already. If the work hasn't been agreed, this work might be rejected
- [ ] **Tests:** Added/updated and all pass
- [ ] **Localization:** All end-user-facing strings can be localized
- [ ] **Dev docs:** Added/updated
- [ ] **New binaries:** Added on the required places
- [ ] [JSON for
signing](https://github.com/microsoft/PowerToys/blob/main/.pipelines/ESRPSigning_core.json)
for new binaries
- [ ] [WXS for
installer](https://github.com/microsoft/PowerToys/blob/main/installer/PowerToysSetup/Product.wxs)
for new binaries and localization folder
- [ ] [YML for CI
pipeline](https://github.com/microsoft/PowerToys/blob/main/.pipelines/ci/templates/build-powertoys-steps.yml)
for new test projects
- [ ] [YML for signed
pipeline](https://github.com/microsoft/PowerToys/blob/main/.pipelines/release.yml)
- [ ] **Documentation updated:** If checked, please file a pull request
on [our docs
repo](https://github.com/MicrosoftDocs/windows-uwp/tree/docs/hub/powertoys)
and link it here: #xxx

<!-- Provide a more detailed description of the PR, other things fixed,
or any additional comments/features here -->
## Detailed Description of the Pull Request / Additional comments

<!-- Describe how you validated the behavior. Add automated tests
wherever possible, but list manual validation steps taken as well -->
## Validation Steps Performed

<img width="1273" height="714" alt="image"
src="https://github.com/user-attachments/assets/4d2ffa92-e0ca-44f4-8eda-9c4a7e05bbde"
/>
---
 .../Controls/KeyVisual/KeyVisual.xaml.cs      | 24 +++++++++++++++----
 .../ShortcutControl/ShortcutControl.xaml      |  3 ++-
 .../ShortcutDialogContentControl.xaml         |  3 ++-
 3 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/src/common/Common.UI.Controls/Controls/KeyVisual/KeyVisual.xaml.cs b/src/common/Common.UI.Controls/Controls/KeyVisual/KeyVisual.xaml.cs
index 1439a6e1d9..eebf7a6565 100644
--- a/src/common/Common.UI.Controls/Controls/KeyVisual/KeyVisual.xaml.cs
+++ b/src/common/Common.UI.Controls/Controls/KeyVisual/KeyVisual.xaml.cs
@@ -105,6 +105,22 @@ namespace Microsoft.PowerToys.Common.UI.Controls
             {
                 switch (key)
                 {
+                    case nameof(VirtualKey.Up):
+                        SetGlyphOrText("\uE0E4", VirtualKey.Up);
+                        break;
+
+                    case nameof(VirtualKey.Down):
+                        SetGlyphOrText("\uE0E5", VirtualKey.Down);
+                        break;
+
+                    case nameof(VirtualKey.Left):
+                        SetGlyphOrText("\uE0E2", VirtualKey.Left);
+                        break;
+
+                    case nameof(VirtualKey.Right):
+                        SetGlyphOrText("\uE0E3", VirtualKey.Right);
+                        break;
+
                     case "Copilot":
                         _keyPresenter.Style = (Style)Application.Current.Resources["CopilotKeyCharPresenterStyle"];
                         break;
@@ -141,19 +157,19 @@ namespace Microsoft.PowerToys.Common.UI.Controls
                         break;
 
                     case VirtualKey.Up:
-                        _keyPresenter.Content = "\uE0E4";
+                        SetGlyphOrText("\uE0E4", virtualKey);
                         break;
 
                     case VirtualKey.Down:
-                        _keyPresenter.Content = "\uE0E5";
+                        SetGlyphOrText("\uE0E5", virtualKey);
                         break;
 
                     case VirtualKey.Left:
-                        _keyPresenter.Content = "\uE0E2";
+                        SetGlyphOrText("\uE0E2", virtualKey);
                         break;
 
                     case VirtualKey.Right:
-                        _keyPresenter.Content = "\uE0E3";
+                        SetGlyphOrText("\uE0E3", virtualKey);
                         break;
 
                     case VirtualKey.LeftWindows:
diff --git a/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutControl.xaml b/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutControl.xaml
index 585af5c38b..5900e0615b 100644
--- a/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutControl.xaml
+++ b/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutControl.xaml
@@ -46,6 +46,7 @@
                                 Content="{Binding}"
                                 CornerRadius="{StaticResource ControlCornerRadius}"
                                 IsTabStop="False"
+                                RenderKeyAsGlyph="True"
                                 State="{Binding ElementName=LayoutRoot, Path=KeyVisualShouldShowConflict, Mode=OneWay, Converter={StaticResource BoolToKeyVisualStateConverter}, ConverterParameter=Warning}"
                                 Style="{StaticResource AccentKeyVisualStyle}" />
                         </DataTemplate>
@@ -96,4 +97,4 @@
             </VisualStateGroup>
         </VisualStateManager.VisualStateGroups>
     </Grid>
-</UserControl>
\ No newline at end of file
+</UserControl>
diff --git a/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutDialogContentControl.xaml b/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutDialogContentControl.xaml
index ce4274ac1d..384b4b63f4 100644
--- a/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutDialogContentControl.xaml
+++ b/src/settings-ui/Settings.UI/SettingsXAML/Controls/ShortcutControl/ShortcutDialogContentControl.xaml
@@ -236,6 +236,7 @@
                             FontSize="16"
                             FontWeight="SemiBold"
                             IsTabStop="False"
+                            RenderKeyAsGlyph="True"
                             State="{Binding ElementName=ShortcutContentControl, Path=IsError, Mode=OneWay, Converter={StaticResource BoolToKeyVisualStateConverter}, ConverterParameter=Error}"
                             Style="{StaticResource AccentKeyVisualStyle}" />
                     </DataTemplate>
@@ -332,4 +333,4 @@
             </InfoBar>
         </Grid>
     </Grid>
-</UserControl>
\ No newline at end of file
+</UserControl>