如何仅在 UWP 中将 AcrylicBrush 添加到工具栏

Question

如何仅在 UWP 中将丙烯酸 material 应用于 TitleBar（就像 Microsoft Edge）。在像 Pivots 这样的场景中。您使用将视图扩展到标题栏。但是如果它只是一个普通的单页应用程序并且你想将标题栏设为亚克力怎么办

Answer 1

You use extend the view to the title bar. But what If it's just an ordinary Single page app and you want to make the title bar acrylic

您的理解是正确的。标题栏亚克力，只适用于单页。对于边缘设计，它设置 TitleBar ButtonBackgroundColor,ButtonInactiveBackgroundColor 为透明。并设置 ExtendViewIntoTitleBar 属性 true 以将您的内容扩展到 TitleBar。然后在底部区域制作一个相同高度的亚克力元素。

private void ExtendAcrylicIntoTitleBar()
{
    CoreApplication.GetCurrentView().TitleBar.ExtendViewIntoTitleBar = true;
    CoreApplication.GetCurrentView().TitleBar.LayoutMetricsChanged += (s,e) => {
       Header.Height = s.Height;
   };

    ApplicationViewTitleBar titleBar = ApplicationView.GetForCurrentView().TitleBar;
    titleBar.ButtonBackgroundColor = Colors.Transparent;
    titleBar.ButtonInactiveBackgroundColor = Colors.Transparent;
}

<Rectangle Name="Header"
Stretch="UniformToFill" 
Fill="{ThemeResource SystemControlChromeHighAcrylicWindowMediumBrush}" 
VerticalAlignment="Top"/>

如何仅在 UWP 中将 AcrylicBrush 添加到工具栏

How to add an AcrylicBrush to the toolbar only in UWP

xaml

uwp

titlebar

fluent-design

acrylic-material