modal_bottom_sheet

modal_bottom_sheet copied to clipboard

We are using #000000 background in our dark mode theme. This leads to the following result

However, I was expecting something like this (the background color in iOS without bottom sheet open is black too, not gray):

I tried controlling the background with backgroundColor and barrierColor but this did not lead to the result expected.

Working on it. Right now the only solution would be to change the background color of the previous route before the one is being pushed

I was playing around a bit with this issue and I found a solution that works for me. So if you want you can try it with my fork: https://github.com/bierbaumtim/modal_bottom_sheet

But as I said it works for me but there could be some issues and customizations aren't possible.

Yes indeed @bierbaumtim has been doing amazing research on the topic. I am not completely familiar with BlendMode but I think using lighten and darken would be a better choice.

As I can see in the native modal, it lightens up all the previous route while scrolling. You can see that with a backround completely dark.

Also for saturation, not all the page becomes grey, only primaryColor buttons, probably because they are disabled during an animation. We could implement something for this, but I don't think it would be useful if it is not integrated into the cupertino library itseld

@bierbaumtim are you still interested in working on this? Your repository is a little bit behind. Would be great to see a PR from you to fix this issue.

I think that this is the main commit: https://github.com/bierbaumtim/modal_bottom_sheet/commit/c00e038150f7faae026772ea5bf990d6335afd1d

But you had also a few other changes and I am not sure if they are all required.

@SimonHausdorf I created a new PR #231 which only contains the nessecary changes to create the discussed result.

I tried the demo with your changes, settings the CupertinoNavigationBar to black. Theoretically it should turn into a dark gray correct? Similar to mail app in dark mode when composing a new email?

https://user-images.githubusercontent.com/1446685/160324925-00682160-c2c3-4b80-8ab4-ad33c98e8ece.mov

It only works if use CupertinoDynamicColor because it contains colors when CupertinoUserInterfaceLevel is elevated. With normal colors it would result in an undefined behaviour. Also the example does not support darkmode very well. I opened a second PR #232 which add darkmode support for the example.

Ok, the magic was making use of CupertinoTheme.of(context).scaffoldBackgroundColor. One thing, it seems like the color animation isn't working?

https://user-images.githubusercontent.com/1446685/161416816-52b50ed2-d445-4c8b-83ca-4f77e6afd986.mov

can confirm, this is still a problem