Skip to content
This repository has been archived by the owner on May 1, 2024. It is now read-only.

[Bug] Transparent Modal doesn't work on iOS #11877

Closed
dansiegel opened this issue Aug 21, 2020 · 2 comments · Fixed by #11915
Closed

[Bug] Transparent Modal doesn't work on iOS #11877

dansiegel opened this issue Aug 21, 2020 · 2 comments · Fixed by #11915
Labels
a/modal a/navigation e/3 🕒 3 i/regression in-progress This issue has an associated pull request that may resolve it! p/iOS 🍎 t/bug 🐛
Milestone

Comments

@dansiegel
Copy link
Contributor

dansiegel commented Aug 21, 2020

Description

When modally pushing a page with a transparent background over an existing page the background is transparent while the Navigation the page is animating, and then the background loses transparency.

Note this impacts the Prism 8 update to the DialogService as we are updating to use a Modal Page with a transparent background. See PR PrismLibrary/Prism#2169

Also while this may be related to #10861, I've opened this as a separate issue as I have tested with and without a NavigationPage in the mix and get the same results.

Steps to Reproduce

  1. Set App.MainPage = SomeRootPage
  2. Create new ContentPage
  • Set the Page Background to Color.Transparent
  • Give the content a mask layer with an opaque color
  1. Push the new page modally on the currently visible page

Expected Behavior

The Page background should be transparent with the opaque mask visible and showing the content of the underlying page

Actual Behavior

The Page background is transparent while the Navigation Animation is running and then loses transparency. If using PushModallyAsync(page, false) the new page simply is presented modally without a transparent background.

Basic Information

  • Version with issue: 4.8.0.1269
  • Last known good version: n/a
  • IDE: Visual Studio 2019 16.7.1
  • Platform Target Frameworks:
    • iOS: 13.20.2.2 (817b6f72a)
    • Android:
    • UWP:
  • Android Support Library Version:
  • Nuget Packages:
  • Affected Devices:

Screenshots

Android iOS
transparent-modal-android transparent-modal-ios

Reproduction Link

https://github.com/PrismLibrary/Prism/tree/transparent-modals/e2e/Forms

Workaround

n/a

@jsuarezruiz
Copy link
Contributor

@dansiegel Using the PlatformSpecific that allows setting the ModalPresentationStyle:

On<iOS>().SetModalPresentationStyle(UIModalPresentationStyle.OverFullScreen);

Should allow you to use a transparent background.

@samhouts samhouts added the in-progress This issue has an associated pull request that may resolve it! label Aug 25, 2020
@dansiegel
Copy link
Contributor Author

thanks for the work around and fix in progress.

@samhouts samhouts added this to the 5.0.0 milestone Aug 25, 2020
rmarinho pushed a commit that referenced this issue Oct 30, 2020
* Changed default UIModalPresentationStyle value to OverFullScreen

* If the ModalPresentationStyle is the default value and the color have alpha, use OverFullScreen
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
a/modal a/navigation e/3 🕒 3 i/regression in-progress This issue has an associated pull request that may resolve it! p/iOS 🍎 t/bug 🐛
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants