预检清单
- 我已阅读了此项目的 Contributing Guidelines。
- 我同意遵循此项目遵循的 Code of Conduct。
- 我已在 issue tracker 中搜索了一个与我想提交的功能请求相匹配的功能请求,但没有成功。
问题描述
我尝试使用
body {
background-color: #0000002f;
-webkit-backdrop-filter: blur(8px);
}
,其中 background-color
可以工作,但 -webkit-backdrop-filter
无法工作。
建议的解决方案
能够通过 -webkit-backdrop-filter
对窗口背景进行模糊处理
考虑过的替代方案
This package 似乎很有帮助,但它已被弃用,且没有 Linux 支持 ...
其他信息
我相信随着流畅设计趋势的发展,更多的开发人员可能希望遵循这种设计模式,因此这个功能将是绝对必要的。
3条答案
按热度按时间mepcadol1#
tldr;
当微软完成Windows 11及其新的WinUI API时,Electron将能够利用这些API并自动允许您的BrowserWindow请求操作系统将其变为acrylic或mica。
我估计这还需要再过一年,无论Windows 11何时发布RTM版。我不认为这些API会在一段时间内成为非第一方和win32应用程序的稳定公共API。
更长的版本:
你提出的方案在技术上是不可能的,特别是在一个一致、可靠、可预测且跨平台的方式上。CSS "backdrop-filter"属性永远只能限制在Chromium渲染器的领域内。它只能在其自己的内容上执行图形变换。它无法、不能也不会访问Electron窗口下面的任何东西。请忘记这个作为你试图实现的目标的解决方案!
话虽如此,没有必要绝望!最终会有解决方案,你只需要耐心等待。
以下是一些有助于理解的内容:
ct3nt3jp2#
sirbozc53#
那么这个呢?看起来它可以工作,所以很明显它是可能的。然而,如果你自己尝试这个包,发现丙烯酸设置似乎有问题(至少在Windows 10上),请改用'blurbehind'。