Skip to content

Flipped default Settings Card Action Icon in RTL contexts#855

Open
Avid29 wants to merge 1 commit into
CommunityToolkit:mainfrom
Avid29:settings_expand_flip
Open

Flipped default Settings Card Action Icon in RTL contexts#855
Avid29 wants to merge 1 commit into
CommunityToolkit:mainfrom
Avid29:settings_expand_flip

Conversation

@Avid29
Copy link
Copy Markdown
Member

@Avid29 Avid29 commented May 24, 2026

Fixes #846

PR Type

What kind of change does this PR introduce?

Bugfix

What is the current behavior?

The default ActionIcon is a chevron that points right, regardless of the FlowDirection

What is the new behavior?

The default ActionIcon is a chevron that points outwards, flipping based on the FlowDirection

PR Checklist

Please check if your PR fulfills the following requirements:

Other information

I'm not terribly happy with this solution. I think this poor solution represents an issue that the action icon maybe should be templated.

@Avid29 Avid29 added bug Something isn't working components::controls::settingscontrols Create a Windows 11 style settings experiences with these controls. labels May 24, 2026
@Avid29 Avid29 changed the title Added Changed SettingsCard.ActionIcon to utilize MirroredWhenRightToLeft by default May 24, 2026
@Avid29 Avid29 changed the title Changed SettingsCard.ActionIcon to utilize MirroredWhenRightToLeft by default Flipped default action icon in RTL contexts May 24, 2026
@Avid29 Avid29 changed the title Flipped default action icon in RTL contexts Flipped default Settings Card Action Icon in RTL contexts May 24, 2026
@niels9001
Copy link
Copy Markdown
Collaborator

@Avid29 ActionIcon can be changed by the developer to pretty much any ic9n. I eonder if in some, or most uses cases, you do not want that icon to be flipped.

Is there an event where we detect RTL and we check if the default glyph is set and if so we set the RTL version of the glyph instead? If not we leave it alone?

@Avid29
Copy link
Copy Markdown
Member Author

Avid29 commented May 25, 2026

@niels9001 This PR only flips the default icon.

It works because the ActionIcon is implemented as an IconElement, and I changed it to initialize as a FontIcon using the same chevron, but with MirroredWhenRightToLeft as true

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR fixes the default SettingsCard.ActionIcon chevron so it mirrors in RTL contexts, matching the Windows Settings behavior described in issue #846.

Changes:

  • Sets a default ActionIcon instance to a FontIcon with MirroredWhenRightToLeft=true.
  • Keeps the default glyph as \uE974 while enabling RTL-aware rendering.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines 66 to 72
public SettingsCard()
{
this.DefaultStyleKey = typeof(SettingsCard);

// This is perhaps indicative of an issue with the action icon requiring a concrete FontElement instead of a template
ActionIcon = new FontIcon { Glyph = "\ue974", MirroredWhenRightToLeft = true };
}
Comment on lines +69 to +71

// This is perhaps indicative of an issue with the action icon requiring a concrete FontElement instead of a template
ActionIcon = new FontIcon { Glyph = "\ue974", MirroredWhenRightToLeft = true };
{
this.DefaultStyleKey = typeof(SettingsCard);

// This is perhaps indicative of an issue with the action icon requiring a concrete FontElement instead of a template
this.DefaultStyleKey = typeof(SettingsCard);

// This is perhaps indicative of an issue with the action icon requiring a concrete FontElement instead of a template
ActionIcon = new FontIcon { Glyph = "\ue974", MirroredWhenRightToLeft = true };
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working components::controls::settingscontrols Create a Windows 11 style settings experiences with these controls.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[SettingsCard] Arrow icon should mirror in RTL

3 participants