Windows 10 Fluent Design / Acrylic material
marcinciarka opened this issue · 16 comments
Fall Creators update gave us the acrylic material ability, can electron-vibrancy utilize this for WIndows?
I think only UWP apps are able to use those new features. Unless I'm missing something that should be the case. I'll do some research anyway.
Any news?
Maybe with windows.ui.xaml.media from NodeRT it would be possible. That's where the Acrylic API is located.
Waiting for acrylic support too.
build.log (If you open it I suggest you use VSCode or Sublime)
I've found this quote on SO talking about AcrylicBrush;
It's effects are created using the Lower level XAML Composition APIs, which uses UWP's XAML Compositor, so I would say that I doubt you will be able to achieve this natively in Win32. If you really want it, you can either take your app across the Desktop Bridge, and convert the UI, or mimic the effects with the technology available today. (Browsers such as Chrome, manage to use bring the Window Chrome further into their app, although I'm not sure how you would achieve the acrylic effect).
Even though the API might be usable, it is possible it will have no effect. Still, we will have to try and see if it will work or not.
Any new findings about the API ?
Sadly, not really, but another way of using UWP APIs in your Node project (Electron in my case), is to have a background task that handles the UWP things, see electron-uwp-background, I am not yet sure if it is possible to have achieve Acrylic effect in your window with this solution but I am investigating, it is really late now, but I will try tomorrow, will keep you updated.
Great news everyone, lately Windows started to roll out the new build called Redstone 4 (Windows 10 version 1803), and exposed some new stuff about acrylic effects in Win32 apps. I modified electron-vibrancy a bit and I got the result I wanted but with a single problem, and it's that the background of the Electron app (with the acrylic effect) was of the size of your resolution, albeit your app which has a fixed width and height, I'll investigate this more in depth and after I figure out how to work with N-API, I'll build a module just for that effect on Windows, it'll be called electron-acrylic. I'll keep you updated.
@23phy this is is this issue closed or still work in progress ? I really like what you did so far and would love to see it continued.
The module that I am building is not related to this repo, just this specific issue (the UWP acrylic blur). If @arkenthera wants to merge the two repos, s/he is more than welcome. I tried to make a fork and adding to that one but I don't quite understand NAN. That's why I made another module for this issue with N-API. This issue can be closed indeed, but someone should leave a reference to the electron-acrylic module in case it will remain standalone.
@23phy thanks for the update .. will follow your work on acrylic over there then
Cool, then @dreszczyk can close this issue.