问题标签 [acrylic-material]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
uwp - win32 app中的亚克力材质
微软最近公布了他们新的“流利”设计语言,其中一部分是“亚克力”材料。此效果使元素透明并模糊背景。它既可以应用于窗口,使底层窗口的一部分发光(背景丙烯酸),也可以应用于窗口中的单个元素,以便其他控件发光(应用内丙烯酸)。它在概念上和视觉上与 macOS 上的活力非常相似。
它在 XAML 中作为特殊的 Brush 实现,但我想知道有没有办法在常规 Win32 应用程序中使用它(背景丙烯酸)?该效果看起来与应用于开始菜单和任务栏(由SetWindowCompositionAttribute处理)的模糊非常相似,这让我相信它可能可以通过类似的标志激活。
一个子问题:我想知道它是如何实现的?它只是您可以在窗口上设置的标志,然后在 DWM 中应用(如 SetWindowCompositionAttribute,或如 Vista 和 7 中的 Aero Glass)?还是 UWP 对 DWM 有某种控制,并且可以设置着色器来控制它的渲染方式?在 Vista 下,当 DWM 第一次被引入时,它与 WPF 有共同的代码,并且它实际上共享(类似 DirectX 的)缓冲区和场景图,所以这样的技巧是可能的。magifier 实用程序可以像矢量图像一样清晰地放大 WPF 应用程序,但该功能后来丢失了。MS 在该页面上呈现“丙烯酸”的方式(作为不同的图层,并作为 XAML 画笔实现)让我认为您必须以某种方式将图层注入 DWM 场景图中,这将使其更难或无法使用来自 Win32。
css - 来自 Fluent Design System 的纯 CSS 丙烯酸材料
随着 Microsoft Fluent Design System的出现以及新的 Acrylic Material 在 Windows 生态系统中的传播,我认为在某些 Web 布局中使用它会很棒。
根据规范,亚克力层的组成为:
所以我尝试了一种受该图片中图层启发的纯 CSS 方法,这样:
结果非常接近规范并且响应也很灵敏,但有一个大问题:只需堆叠另一个.acrylic
div 并且后台技巧不再起作用。
问题是: 有没有更聪明的方法来高斯模糊而不为每个孩子复制身体背景?或者也许是一些更聪明的方法来动态计算它的位置?
更新
由于backdrop-filter
CSS 功能终于在 7 月 29 日在 Chrome 76中发布,我们有一个非常简化的方法来解决它,使原来的问题比以前容易得多。
xaml - 如何定制亚克力画笔
我想使用丙烯酸刷子绘制堆栈面板表面。
它对我有用,但是当我想更改色调颜色和不透明度时会出现问题。有以下代码可以更改它:
我不知道我应该把它放在哪里并为此重命名画笔?
感谢帮助。PS 你需要 Windows Insider SDK 和系统版本 16190 或更高版本
c# - UWP 在后面的代码中设置主题资源亚克力
我有一个 UWP 应用程序,我想将它升级到流利的设计系统。我使用 Windows Template Studio 创建了一个新项目,我的导航是使用 Pivot 进行的。
现在我想把亚克力背景放在pivot 的标题上。正如 uwp 的设计指南中所述,建议在这种情况下使用 70% 的丙烯酸。
所以我尝试使用 70% 的丙烯酸和以下代码。
其中 MainPivot 是我正在使用的枢轴,这个加载的方法是该枢轴的加载事件。
问题是它仅适用于浅色或深色主题(取决于在应用程序的上次运行期间设置的主题),但是当应用程序运行并且我更改主题并在浅色或深色主题之间切换时,它无法正常工作对于这两个主题,例如,如果我使主题变暗,丙烯酸颜色仍然是白色,并且枢轴标题文本也是白色,因此会产生混乱的 UI。
此外,FallBack Color也没有任何意义,因为浅色主题的后备颜色是黑色(与黑色文本混合),并且在深色主题中也会出现同样的问题。
我之所以从后面的代码中执行此操作,是因为我的应用程序的最小项目目标是没有丙烯酸刷的创作者更新。
xaml - 如何仅在 UWP 中将 AcrylicBrush 添加到工具栏
如何将丙烯酸材料应用于TitleBar
UWP 中的唯一(就像 Microsoft Edge)。在像枢轴这样的场景中。您使用将视图扩展到标题栏。但是如果它只是一个普通的单页应用程序,你想把标题栏做成亚克力怎么办?
xaml - XamarinForms 中的 UWP 流畅设计
我正在创建一个 XamarinFroms 解决方案,并且我想在我的 UWP 应用程序中实现 Fluent Design 或部分它。您可能知道,大多数 Fluent Design 构建块都是 ThemeResources。所以我试着做:
但我得到了一个意外
如果我无法在我的 UWP 项目的代码中检索这些主题资源,我将无法访问任何预定义的画笔,或者我永远无法实现显示样式
xamarin.forms - 在 XamarinForms 的效果中为控件应用背景
我正在尝试为效果所附加的控件应用背景。
首先,我制作了为 UWP 中具有填充或背景属性的控件应用背景的效果。但问题是很多控件在 UWP 中呈现给 FrameworkElement。并且 FrameworkElement 没有 Background 属性。在 VisualElementRenderer Xamarin 表单中,解决了在内容后面应用背景层的问题,但这是一种效果。有什么方法可以为附加的效果应用背景吗?我正在应用 AcrylicBrush 所以它必须直接分配给控件。
我之前写的代码: