0

In my uwp app I am trying to use the Acrylic Brush, I made a custom one because the default ones are not working for me. But if you notice here I have attached image from Microsoft docs and on right side is window of my app showing acrylic completely different on same background.

comparing

Code

 <AcrylicBrush
                            x:Key="AppBackgroundAcrylicBrush"
                            BackgroundSource="HostBackdrop"
                            FallbackColor="Black"
                            TintColor="Black"
                            TintLuminosityOpacity="0.1"
                            TintOpacity="1" />

After that I tried luminosity to be 0.9 and now it looks dark grayish. But I want it to look jet black color Acrylic with small transparency. Basically I want it to look like as the image shows on left side as in Microsoft docs with 10% luminosity and 100% tint opacity.

enter image description here

Code

   <AcrylicBrush
                            x:Key="AppBackgroundAcrylicBrush"
                            BackgroundSource="HostBackdrop"
                            FallbackColor="Black"
                            TintColor="Black"
                            TintLuminosityOpacity="0.9"
                            TintOpacity="1" />

Docs: https://learn.microsoft.com/en-us/windows/uwp/design/style/acrylic

halfer
  • 19,824
  • 17
  • 99
  • 186
Muhammad Touseef
  • 4,357
  • 4
  • 31
  • 75

1 Answers1

1

Basically I want it to look like as the image showson left side as in microsoft docs with 10% luminosity and 100 % tint opacity.

Update

Base on the testing, TintLuminosityOpacity 0.9 and TintOpacity 1.0 could render you mentioned jet black color AcrylicBrush. But that is not conformity with document. And the AcrylicBrush looks dark gray. It is strange, I will report to related team. Currently, please try use the following to replace.

<AcrylicBrush
    x:Key="CustomAcrylicBrush"
    BackgroundSource="Backdrop"
    FallbackColor="Black"
    TintColor="Black"
    TintLuminosityOpacity="1.0"
    TintOpacity="1"
    />
Nico Zhu
  • 32,367
  • 2
  • 15
  • 36
  • not sure which reference u used for testing but as u can see in 2nd screenshot I posted above that has 0.9 Luminosity and opacity=1 but it is still grayish, and when I make luminosity 1.0 it just stops being transparent and becomes opaque dark gray color. same with white color, I am nt able to achieve pure white in light theme using same values. with color as white. – Muhammad Touseef Apr 28 '20 at 10:06
  • when u said the document screenshot has little chromatism , does that mean I cannot achieve those colors in reality ? – Muhammad Touseef Apr 28 '20 at 10:09
  • 1
    This behavior is every strange, I will report it, thanks for your feed back. – Nico Zhu Apr 29 '20 at 03:01
  • thankyou for reporting it to the right team, where can I follow progress on this ? – Muhammad Touseef Apr 30 '20 at 17:08