Question

弹出按钮不会将其主题从亮变为暗。我不知道为什么。请参阅下面的示例代码。您可以在此处更改主题，然后弹出按钮保持浅色主题。

MainPage.xaml中

<Page>
    <Page.BottomAppBar>
        <CommandBar>
            <AppBarButton Icon="Emoji">
                <AppBarButton.Flyout>
                    <Flyout/>
                </AppBarButton.Flyout>
            </AppBarButton>
            <AppBarToggleButton Checked="Checked" Unchecked="Unchecked">
            <AppBarToggleButton.Icon>
                <FontIcon Glyph="&#xE771;" />
            </AppBarToggleButton.Icon>
        </AppBarToggleButton>
    </CommandBar>
    </Page.BottomAppBar>
</Page>

MainPage.cs

public sealed partial class MainPage : Page
{
    private void Checked(object sender, RoutedEventArgs e)
    {
        this.RequestedTheme = ElementTheme.Dark;
    }

    private void Unchecked(object sender, RoutedEventArgs e)
    {
        this.RequestedTheme = ElementTheme.Light;
    }
}

Answer 1

如果您将内容放置在弹出窗口内，您会发现它们适应新的ElementTheme，但是弹出式演示者本身不会改变它的背景。

弹出式演示者遵循ApplicationTheme，在应用程序运行时您无法更改代码，但我有两个解决此问题的方法：

特定的弹出方法，定义

在App.Xaml资源中定义<SolidColorBrush x:Key="FlyoutBackBrush" Color="#FF2B2B2B"/>

定义FlyoutPresenterStyle并让后台使用我们在App.Xaml中定义的画笔

        <Flyout x:Name="MyFlyout">
            <Flyout.FlyoutPresenterStyle>
                <Style TargetType="FlyoutPresenter">
                    <Setter Property="Background" Value="{StaticResource FlyoutBackBrush}"/>
                </Style>
            </Flyout.FlyoutPresenterStyle>
            <StackPanel>
                <Button Content="Button"/>
                <TextBlock Text="Test"/>
            </StackPanel>
        </Flyout>

更改资源FlyoutBackBrush的颜色属性，它将反映在Flyout的背景中。

 private readonly Color _darkColor = Color.FromArgb(255, 43, 43, 43);//themeresources.xaml - Default
 private readonly Color _lightColor = Color.FromArgb(255, 242, 242, 242);//themeresources.xaml - Light

 private void SetFlyoutBackBrush(Color color)
 {
     var brushKey = "FlyoutBackBrush";
     if (Resources.ContainsKey(brushKey))
     {
        var flyoutbackBrush = Resources[brushKey] as SolidColorBrush;
        if (flyoutbackBrush != null) flyoutbackBrush.Color = color;
     }
 }

 private void Checked(object sender, RoutedEventArgs e)
 {
      this.RequestedTheme = ElementTheme.Dark;
      SetFlyoutBackBrush(_darkColor);
 }

 private void Unchecked(object sender, RoutedEventArgs e)
 {
     this.RequestedTheme = ElementTheme.Light;
     SetFlyoutBackBrush(_lightColor);
 }

[不推荐]广泛效果方法，从应用程序资源中检索SystemControlBackgroundChromeMediumLowBrush并更改其颜色值 [工作但读取注意]

 private readonly Color _darkColor = Color.FromArgb(255, 43, 43, 43);//themeresources.xaml - Default

 private readonly Color _lightColor = Color.FromArgb(255, 242, 242, 242);//themeresources.xaml - Light

private void SetFlyoutBackBrush(Color color)
{
    var brushKey = "SystemControlBackgroundChromeMediumLowBrush";
    if (Application.Current.Resources.ContainsKey(brushKey))
    {
        var flyoutbackBrush = Application.Current.Resources[brushKey] as SolidColorBrush;
        if (flyoutbackBrush != null) flyoutbackBrush.Color = color;
    }
}

private void Checked(object sender, RoutedEventArgs e)
{
    this.RequestedTheme = ElementTheme.Dark;
    SetFlyoutBackBrush(_darkColor);
}

private void Unchecked(object sender, RoutedEventArgs e)
{
    this.RequestedTheme = ElementTheme.Light;
    SetFlyoutBackBrush(_lightColor);
}

注意这将影响应用程序中的所有Flyout和Pickers，因为它们都使用SystemControlBackgroundChromeMediumLowBrush。

Answer 2

我发现这个问题没有那么好的解决方案，但它很容易且有效：）

http://blog.kurpio.com/2016/04/19/perelki-uwp-2-flyout-w-commandbar-obejscie-buga/

您可以在Flyout内容中将SystemControlBackgroundChromeMediumBrush设置为网格画笔。

<AppBarButton Label="Szukaj"
                          Icon="Find">
                <AppBarButton.Flyout>
                    <Flyout Placement="Bottom">
                        <Flyout.Content>
                            <Grid Background="{ThemeResource SystemControlBackgroundChromeMediumBrush}"
                                  Margin="-15"
                                  Padding="15"
                                  Width="285">
                                <TextBox Header="Szukaj:"
                                         Width="175"
                                         HorizontalAlignment="Left" />
                                <AppBarButton Label="Szukaj"
                                              Icon="Find"
                                              HorizontalAlignment="Right" />
                            </Grid>
                        </Flyout.Content>
                    </Flyout>
                </AppBarButton.Flyout>
            </AppBarButton>

...注意设置网格的边距和填充以填充弹出窗口。

弹出窗口不会改为黑暗主题？

2 个答案: