Skip to content
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.

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

MenuFlyoutItem text doesn't sync with system theme. #8678

Open
Pdawg-bytes opened this issue Jul 24, 2023 · 3 comments
Open

MenuFlyoutItem text doesn't sync with system theme. #8678

Pdawg-bytes opened this issue Jul 24, 2023 · 3 comments
Labels
bug Something isn't working team-Controls Issue for the Controls team

Comments

@Pdawg-bytes
Copy link

Describe the bug

In the latest WinUI 3 1.4 preview 1 build, MenuFlyoutItems Text theme doesn't update when the system theme is changed. I have a MenuFlyout in my Grid.Resources which I open using the RightTapped event of a button. If this menu isn't opened when I change the system theme, the background of the flyout is set properly, but the text color is not. If I switch from light mode to dark mode while this menu is closed, the text stays black. It only updates properly if the flyout is actually open when I change the system theme.

Steps to reproduce the bug

  1. Create a MenuFlyout in your Grid.Resources
  2. Open this menu, then close it.
  3. While the menu is closed, change your system theme in Settings.
  4. Notice how the text color is not changed to the correct color.

Expected behavior

I expected the text color to update whenever I change my system theme, regardless of its visibility.

Screenshots

(Yes, there is text here!)
image

Here's the bug in dark mode:
image

NuGet package version

WinUI 3 - Windows App SDK 1.4 Preview 1: 1.4.230628000-preview1

Windows version

Windows Insider Build (xxxxx)

Additional context

Windows 11 canary, 25905.1000.

@Pdawg-bytes Pdawg-bytes added the bug Something isn't working label Jul 24, 2023
@ynborokh
Copy link

I also observe similar issues with theme switching for flyouts. I use the following workaround to make it work (I switch the theme manually):

public YourControlWithFlyoutMenu()
{
    ...
    ActualThemeChanged += (_, _) => ActualizeRootTheme();
    ActualizeRootTheme();
}

private void ActualizeRootTheme()
{
    root.RequestedTheme = Application.Current.RequestedTheme == ApplicationTheme.Light
        ? ElementTheme.Light
        : ElementTheme.Dark;
}

Here, YourControlWithFlyoutMenu is the control where you call your flyout menu. root is the root element of the control's visual tree:

<UserControl x:Class="YourNamespace.YourControlWithFlyoutMenu" ...>
    <Grid x:Name="root ...>
        ...
    </Grid>
</UserControl>

Setting RequestedTheme directly on the control, instead of its root element, may also work (I don't remember details of why I'm stuck to root).

@Pdawg-bytes
Copy link
Author

Thank you for the workaround! Hopefully it's fixed soon in the next few versions.

@bpulliam bpulliam added the team-Controls Issue for the Controls team label Aug 22, 2023
@AdriaanLarcai
Copy link

I posted an alternative workaround for this in #8756

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working team-Controls Issue for the Controls team
Projects
None yet
Development

No branches or pull requests

4 participants