拆分视图控件，当窗格打开时使内容变暗

Question

在应用程序上，我有一个带有窗格和内容的拆分视图控件。我想知道是否可以在窗格打开时使内容变暗，就像我在 splitview.Content.

上应用 75% 的不透明度蒙版一样

在此先感谢您的帮助

此致

Answer 1

有多个选项：

通过将半透明的深色控件（例如Grid）作为SplitView.Content.
的顶层来应用"fake"不透明度
在 SplitView.Content 中使用黑色 Grid 作为控制树的根对象，放置浅色 Grid（白色或您的应用程序的任何颜色)，然后构建其余内容。

内容Xaml：

<SplitView.Content>
    <Grid Background="Black">
        <Grid
            x:Name="OpacityGrid"
            Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
            Opacity="1">
        ...
        </Grid>
    </Grid>
</SplitView.Content>

将页面的根设置为黑色并使用灯光控件作为 SplitView.Content 的根。这类似于以前的方法，但需要少一层控件。

设置结构后，您可以根据 SplitView.Pane 的状态将不透明度应用于光控制（或情况 1 的深色顶层）。要么在代码后面做：

private void HamburgerButton_Click(object sender, RoutedEventArgs e)
{
    MySplitView.IsPaneOpen = !MySplitView.IsPaneOpen;
    OpacityGrid.Opacity = MySplitView.IsPaneOpen ? 0.7 : 1;
}

或使用转换器：

public class BoolToOpacityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        if (value is bool && (bool) value)
            return 0.7;
        return 1;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

XAML:

<Grid
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    Opacity="{Binding IsPaneOpen, ElementName=MySplitView, Converter={StaticResource BoolToOpacityConverter}}" />

额外注意：如果你想使用 PaneOpened 事件而不是点击你的汉堡包图标，你必须使用因为没有 PaneOpened 事件.

拆分视图控件，当窗格打开时使内容变暗

Split view control, darken content when pane is open

uwp

uwp-xaml