feat(edge-to-edge): support different colors for the navigation bar and status bar

[rixhkai]

• support different colors for the navigation bar and status bar

Pull request checklist

Please check if your PR fulfills the following requirements:

• The changes have been tested successfully.
• A changeset has been created (npm run changeset).
• I have read and followed the pull request guidelines.

Related to #460

[abhinavs97]

Some one please merge this PR @robingenz
.
@rixhkai is the fix is working fine?

[rixhkai]

@abhinavs97 yes, I tested it's working fine. Maybe you could test to make sure there's nothing I missed.

[abhinavs97]

@rixhkai After changing the Status Bar color, can’t we change it back to transparent? For example, we could make it red on some pages and transparent on others.

[rixhkai]

@abhinavs97 if transparent you mean is reflecting background color of WebView that's not gonna work, because even without this merge if you set transparent background it will show black.

it need different approach, currently this plugin is adding margin inset to WebView. which the purpose is to disable edge to edge and make it behave like before android 35.

otherwise the approach is getting system inset and send the safe area inset to WebView, then handle it in WebView with css.

I can make PR for safe area approach

[abhinavs97]

@robingenz Any update on this PR? When we are gonna merge it? Or this change will come come in next capacitor release?

[robingenz]

@abhinavs97 I haven't had time to review this PR yet. It would be good if the community can already test the PR using the dev build and provide feedback.

[robingenz]

I guess it would make sense to deprecate the setBackgroundColor method and add another setNavigationBarBackgroundColor method.

[howlettga]

Hey I tested out the pull request and it is working in all my scenarios. I can confirm that the original setBackgroundColor does not support 'transparent' either. I also agree that the naming of function are no longer intuitive. setBackgroundColor seems to only set the navigation bar color. Either it should be deprecated and replaced with setNavigationBarBackgroundColor, or it should still set both and an additional function should be added for each individual bar where necessary. This would keep the existing functionality backwards compatible.

Super thanks for this feature! I think there are plenty of use-cases for a full screen image that needs separate top and bottom bar overlays. Let me know if I can help in other ways to push this through

[mariomurrent-softwaresolutions]

Is there an update on this one?

[mariomurrent-softwaresolutions]

May this methods needs to be renamed as well to setNavigationBarBackgroundColor. And accordingly to all the other methods and properties as well.

As also stated in one comment

[mariomurrent-softwaresolutions]

Changeset is missing

[faizrahmadani]

is there any problem where this pull request can't be accepted?

[mariomurrent-softwaresolutions]

is there any problem where this pull request can't be accepted?

Yes there are two errors in the checks. That's why it can't be accepted.
And there is one comment, also from the original maintainer that should be considered

[faizrahmadani]

Is there any possibility to make the background transparent?

[mariomurrent-softwaresolutions]

Is there any possibility to make the background transparent?

For the status bar? Or the navigation bar?
On which OS?