Skip to content

Conversation

llongley
Copy link
Member

We need to make two updates to get acrylic to work properly in XAML islands:

  1. Flyouts should use in-app acrylic rather than HostBackdrop, since they're being drawn on top of other content in the app.
  2. We should use the system XAML version of AcrylicBrush - that properly accounts for XAML islands, whereas the WinUI 2 version does not.

With these two changes, acrylic works properly in both a UWP app and a XAML islands app. I modified WpfApp to add some flyouts and a rainbow background to showcase this scenario and get a XAML islands app on which this can be tested, and also modified some pages in MUXControlsTestApp to add a rainbow background there as well to make it easier to tell if acrylic is working properly.

@ghost ghost added the needs-triage Issue needs to be triaged by the area owners label Jun 12, 2021
@llongley
Copy link
Member Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@llongley
Copy link
Member Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@llongley llongley changed the title Updating acrylic usage for flyouts Updating acrylic usage for XAML islands Jun 12, 2021
@llongley
Copy link
Member Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@mdtauk
Copy link
Contributor

mdtauk commented Jun 12, 2021

I'm assuming these changes are only related to WinUI 2.X versions, and WinUI 3.X doesn't use any System Acrylic? (Which for 3.0 means in app acrylic only until HostBackdrop is working)

@sylveon
Copy link
Contributor

sylveon commented Jun 12, 2021

Flyouts should use in-app acrylic rather than HostBackdrop, since they're being drawn on top of other content in the app.

This is not correct. Flyouts in system XAML islands can show up on top of non-app content. This change would make so that it wouldn't be transparent to non-app content.

@mdtauk
Copy link
Contributor

mdtauk commented Jun 12, 2021

Flyouts should use in-app acrylic rather than HostBackdrop, since they're being drawn on top of other content in the app.

This is not correct. Flyouts in system XAML islands can show up on top of non-app content. This change would make so that it wouldn't be transparent to non-app content.

I thought WinUI 2.0 XAML Islands were bound to the app window?

@sylveon
Copy link
Contributor

sylveon commented Jun 12, 2021

No, flyouts and MenuFlyouts will correctly show up outside the app window

@llongley
Copy link
Member Author

I'm assuming these changes are only related to WinUI 2.X versions, and WinUI 3.X doesn't use any System Acrylic? (Which for 3.0 means in app acrylic only until HostBackdrop is working)

Yes, that's correct, this is only for WinUI 2.

This is not correct. Flyouts in system XAML islands can show up on top of non-app content. This change would make so that it wouldn't be transparent to non-app content.

From my testing, BackgroundSource="Backdrop" still works as expected when the flyout is over non-app content.

@sylveon
Copy link
Contributor

sylveon commented Jun 14, 2021

Ah, if it still works then that's fine

@llongley
Copy link
Member Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@StephenLPeters StephenLPeters added area-Materials Reveal, Acrylic, lighting, etc. team-Controls Issue for the Controls team and removed needs-triage Issue needs to be triaged by the area owners labels Jun 15, 2021
@llongley
Copy link
Member Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@llongley llongley merged commit fc4900a into main Jun 17, 2021
@llongley llongley deleted the user/llongley/FixAcrylicInIslands branch June 17, 2021 01:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-Materials Reveal, Acrylic, lighting, etc. team-Controls Issue for the Controls team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants