2

我想做一些可能有点棘手的事情，因为它是 Win 10 Creators Update 中的一项新功能：我想使用新的 Acrylic Accent 功能在 UWP 应用程序中制作透明的 Windows。我看到微软已经在 Fast Insider Ring 的 Groove 和 Film & TV 中引入了它。

这是我开发的代码，使用 Win Dev Center 中的示例和 Stack Overflow 上的其他答案：

public sealed partial class MainPage : Page
{
    // Some other things

    private void initializeInterface()
    {

        /// Applying Acrylic Accent
        LayoutRoot.Background = null;

        GaussianBlurEffect blurEffect = new GaussianBlurEffect()
        {
            Name = "Blur",
            BlurAmount = 5.0f,
            BorderMode = EffectBorderMode.Hard,
            Optimization = EffectOptimization.Balanced,
            Source = new CompositionEffectSourceParameter("source"),
        };

        LayoutRoot.Background = null;

        var rootVisual = ElementCompositionPreview.GetElementVisual(LayoutRoot as UIElement);
        var compositor = rootVisual.Compositor;
        var factory = compositor.CreateEffectFactory(blurEffect);
        var effectBrush = factory.CreateBrush();

        // This is the effect I wanted to use, the "Acrylic Accent", as it is called by MS itself.
        var backdropBrush = compositor.CreateHostBackdropBrush();             
        effectBrush.SetSourceParameter("source", backdropBrush);

        var blurVisual = compositor.CreateSpriteVisual();
        blurVisual.Brush = effectBrush;
        ElementCompositionPreview.SetElementChildVisual(LayoutRoot as UIElement, blurVisual); 
    }
}

用作根面板LayoutRoot的位置在哪里。RelativePanel

但是有些东西不起作用：什么？我怎样才能将它应用于 a UIElement，比如 aPage或 a Panel？

我真的很感谢你的帮助，谢谢。

4

2 回答 2

3

自己解决：必须SpriteVisual手动指定大小（使其适合UIElement目标）和sizeChangedUIElement 本身的事件。

这是示例代码，我使用了泛型Panel类（为了轻松使用Panel.ActualWidth/ActualHeight属性...），但是UIElement对于丙烯酸效果来说，一切都可以：

    private Compositor compositor;
    private SpriteVisual hostVisual;

    private void applyAcrylicAccent(Panel e)
        {
            compositor = ElementCompositionPreview.GetElementVisual(e).Compositor;
            hostVisual = compositor.CreateSpriteVisual();
            hostVisual.Size = new System.Numerics.Vector2((float)e.ActualWidth, (float)e.ActualHeight);

        // You can choose which effect you want, it is indifferent 
        GaussianBlurEffect blurEffect = new GaussianBlurEffect()
        {
            Name = "Blur",
            BlurAmount = 0.0f,
            BorderMode = EffectBorderMode.Hard,
            Optimization = EffectOptimization.Balanced,
            Source = new CompositionEffectSourceParameter("source"),
        };

        var factory = compositor.CreateEffectFactory(blurEffect, null);
        var effectBrush = factory.CreateBrush();

        effectBrush.SetSourceParameter("source", compositor.CreateHostBackdropBrush());

        hostVisual.Brush = effectBrush;
        ElementCompositionPreview.SetElementChildVisual(e, hostVisual);
    }

以及与sizeChanged目标关联的事件UIElement（此处称为 LayoutRoot）：

private void LayoutRoot_SizeChanged(object sender, SizeChangedEventArgs e)
    {
        if (hostVisual != null)
        {
            hostVisual.Size = new System.Numerics.Vector2((float)e.NewSize.Width, (float)e.NewSize.Height);
        }
    }

享受。

;D

于 2017-04-09T16:22:47.373 回答
1

这是示例 XAML 代码，以避免在您要应用 Acrylic Accent 时其他视觉元素消失：

    <SomePanelSubclass "rootGrid">
       <SomePanelSubclassForAcrylic>
           <SomePanelSubclass "AcrylicGrid"/>
           <!-- Comment: some background is needed in order to make elements more visible -->
           <SomeElementWithBackgroundProperty Background="SomeBrush" Canvas.ZIndex="ValueAboveZero"/>
       </SomePanelSubclassForAcrylic>
       <AllOtherChildrenElements Canvas.ZIndex="ValueAboveZero"/>
    </SomePanelSubclass>

您只能将 Acrylic Accent 应用于“AcrylicGrid”。请记住：应用了 Acrylic Accents 的 UIElement 的所有子元素都将“消失”，因此目标 Acrylic UIElement 不能有子元素。

您可以将所有其他 XAML 元素放入一个单独的 IPanel 元素中，以简化 Canvas.ZIndex 事物，以便仅将其应用于面板本身。

显然这只是一个示例片段，因此您可以使用您想要的每个名称重命名这些元素。

希望能有所帮助。

;)

于 2017-06-15T20:08:20.500 回答