Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Disabling Fabs android Ripple effect #2313

Closed
aravi365 opened this issue Sep 28, 2018 · 10 comments
Closed

Disabling Fabs android Ripple effect #2313

aravi365 opened this issue Sep 28, 2018 · 10 comments
Labels

Comments

@aravi365
Copy link

aravi365 commented Sep 28, 2018

Issue Description

Cannot disable the android ripple effect for FABs.

npm, react-native, react and native-base version version used

"react": "16.4.1",
"react-native": "0.56.0",
"native-base": "^2.8.0",

Expected behaviour

No ripple effect or changed color of android ripple effect.

Actual behaviour

Cannot change the FABs android ripple color.

Steps to reproduce

Tried changing the style and containerStyle of FAB to change the androidRippleEffect.
2

Only on android

@akirchmyer
Copy link

I'm also seeing this issue. Is there a way to disable this behavior? I didn't see anything in the documentation.

@riccardonuzz
Copy link

I'm also trying to remove the ripple effect on the container of the FAB with no success. It should be applied only to the circle.

@aravi365
Copy link
Author

aravi365 commented Dec 6, 2018

No update so far! Any workarounds @SupriyaKalghatgi or anyone

@YoonjaeYoo
Copy link

This is a workaround.

<Fab
    containerStyle={{ borderRadius: 28, overflow: "hidden" }}>
   // inner elements
</Fab>

@allan-simon
Copy link

@YoonjaeYoo thanks for the workaround, it does the trick for me

@SupriyaKalghatgi
Copy link
Contributor

@YoonjaeYoo That does not give the desired output
When Fab is toggled from active to inactive, the button shrink and retains back to usual size

@allan-simon
Copy link

allan-simon commented Feb 21, 2019

@SupriyaKalghatgi yes it's not perfect, but it's at least "pretty-enough" compared to a square overflowing , so it's indeed not a fix, but a "better-than-nothing workaround"

@SupriyaKalghatgi
Copy link
Contributor

Fixed with commit 56597c4

@allan-simon
Copy link

@sharathprabhal thanks a lot, can't wait for the bugfix release :)

@ZarifAhsan
Copy link

itemRippleColor="@null" doesn't seem to work but rippleColor="@null" seem to somewhat help with the issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

7 participants