How i disable button effects on android?

Ionic Framework ionic-v3
1

Hy there, i was using ionic2 app on more android devices and i notice that the click(wave) animation are “slow”.
How i can dissable that animation?

Thanks.

2

Did you find any workaround?

3

You should be able to use the Config and set activator to none:

config: { 
  platforms: { 
    android: { 
      activator: 'none' 
    } 
  } 
}
2 Likes
4

How would I do it for an specific button?

5

You want to disable the ripple for one button? There is no framework specific way to do it, but you could use CSS:

<button class="disable-ripple">My button</button>

.disable-ripple ion-button-effect {
  display: none;
}

I’m curious - what is the use case for this?

4 Likes
6

If you use an effect the user may think that an action will be done after the tap.
In my case I use it on an outline button with a price tag inside, the user can think that he/she will be purchasing something :smiley:

7

Hello @brandyshea, this solution worked on Android, but on iOS the active class keeps appearing while tapping, any work around to get this disabled for all platforms?

Thanks!

8

I wouldn’t recommend using a button for something that doesn’t require user interaction unless you disable the button. You can disable the ability to click a button like this (which also disables ripple without the extra css):

<button outline disabled>Disabled</button>

If you use outline buttons elsewhere it will be confusing to the user that the one with a price tag inside isn’t clickable.

If you really want it to look the same as any other button you can override the opacity on the disabled button to 1.

1 Like