Tkko / Flutter_dismissible_page

Flutter page widget that is dismissed by swipe gestures, with Hero style animations, Inspired by Facebook and Instagram stories.
https://pub.dev/packages/dismissible_page
MIT License
151 stars 39 forks source link

When `backgroundColor` is set as `Colors.transparent`, transition has grey/black color #12

Closed aytunch closed 2 years ago

aytunch commented 2 years ago

I think this happens from the fact that Colors.transparent.withOpacity(value) creates a grey shade even if the base color is transparent.

Both in Single and Multi axis transitions we need to add a condition for backgroundColor being Colors.transparent and do not add withOpacity in those cases

https://github.com/Tkko/Flutter_dismissible_page/blob/c8ddb543e3c3280641b045e5fea08c8848f210a0/lib/src/multi_axis_dismissible_page.dart#L171 https://github.com/Tkko/Flutter_dismissible_page/blob/c8ddb543e3c3280641b045e5fea08c8848f210a0/lib/src/single_axis_dismissible_page.dart#L269

aytunch commented 2 years ago

You can see the grey overlay in the video. This might not be about this package but if the keyboard is open, the hero animation has a weird effect (it starts stretched in width. Do you have any idea on this?) https://user-images.githubusercontent.com/6442915/160652666-e5650610-24bb-463d-9be1-82ac8d034cf2.mov

aytunch commented 2 years ago

When I looked at the video frame by frame I realized that; When DismissablePage is entering the screen, the background is pure solid black (Page A is not seen at all) When it is popped, it shows the gradient overlay (Page A can be seen) Do you think there is a bug for the entering animation?

Tkko commented 2 years ago

@aytunch Can you check if Image has the same problem as Video?

Tkko commented 2 years ago

Added background color check in version 0.7.1

        final backgroundColor = widget.backgroundColor == Colors.transparent
            ? Colors.transparent
            : widget.backgroundColor.withOpacity(details.opacity);
aytunch commented 2 years ago

@Tkko the new version works perfect with the transparent background. Much smoother. Thank you very much.

https://user-images.githubusercontent.com/6442915/161397748-ac97127d-851c-4d09-907d-3077ea64b691.mov