search

nativescript-community / ui-material-components

Monorepo that contains all of the NativeScript Material Design plugins.
https://nativescript-community.github.io/ui-material-components/
Apache License 2.0
218 stars 80 forks source link

[Android] Bottom Sheet causes bug in Tabs Components #135

Open flodaniel opened 4 years ago

flodaniel commented 4 years ago

Which platform(s) does your issue occur on?

-Android, all tested devices (Android 10) and simulator

Please, provide the following version numbers that your issue occurs with:

See the attached project

Please, tell us how to recreate the issue in as much detail as possible.

It took me ages to find, but the usage of the nativescript-material-bottomsheet plugin causes a strange behavior for various components within a Tabs component. I attached an example with a "Switch" Component, but the behavior also occurs for fonts, icons, ripple effects, or the CardView from nativescript-cardview.

The navigation from the route where the Tabs Component is placed to another component leads to slight visual increase in the component (watch very closely!). You can see it after you navigate back to the Tabs Component. The major issue is that the issue keeps stacking and the (e.g) the Thumb of the switch gets bigger and bigger and starts to blur, due to too many overlapping parts.

I can reproduce the issue on all available android devices and with Nativescript 6.3 and 6.5.1 Also I tested it the 3.6 and 3.17 of the nativescript-material-bottomsheet plugin.

The behavior only occurs within the Tabs component! As soon as i uninstall the plugin, the issue is gone.

Is there any code involved?

I stripped my main project of most of the code for a demonstration. Some of the structure is still the same, so be not surprised, that there is some left-over code and structure :)

I uploaded the demo project to firefox send (the link works for 7 days, i can reupload after that!): https://send.firefox.com/download/d0666a9e2f6f3199/#IXxA6wgDxr8J8BKPtzF5nQ In the screenshot the above switch is inside the Tabs. The lower one is outside. This is the status after maybe 5 navigations via "Create" button and "back" again.

Screenshot_2020-04-10-13-09-54-758_com test

Maybe it is also an issue that needs to be reported to nativescript directly :)

farfromrefug commented 4 years ago

What version of the android material lib are.you using?

flodaniel commented 4 years ago

Hey, thanks for the fast reply, but I am not sure what you mean? Do i need to set some additional dependencies via gradle?

farfromrefug commented 4 years ago

@Firetrip i have tried to run your sample but it crashes with a ton of errors. Please create a sample app NOT using angular.

flodaniel commented 4 years ago

@Firetrip i have tried to run your sample but it crashes with a ton of errors. Please create a sample app NOT using angular.

i just tried again with a simple "tns debug android" which works perfectly fine (from the downloaded zip). I never worked with plain nativescript. maybe i can manage to do it over the weekend, but please try again :) thanks!

farfromrefug commented 4 years ago

@Firetrip sorry but i don't have time to debug why it is crashing here. A lot too many projects to maintain