[MDRipple] does not work on Android

[Bezlepkin]

• @nativescript/angular: 13.0.2
• @nativescript-community/ui-material-ripple: 6.2.14

import { NativeScriptMaterialRippleModule } from '@nativescript-community/ui-material-ripple/angular';

@NgModule({
  bootstrap: [AppComponent],
  imports: [
    NativeScriptModule,
    HttpClientModule,
    AppRoutingModule,
    NativeScriptMaterialBottomNavigationModule,
    NativeScriptMaterialRippleModule,
    NativeScriptMaterialTabsModule,
    MediaModule
  ],

<StackLayout padding="20" backgroundColor="yellow">
  <MDRipple backgroundColor="lightgray" rippleColor="red" width="100%" height="40"></MDRipple>
  <GridLayout width="100%" height="40" backgroundColor="brown" padding="3">
    <MDRipple height="50" rippleColor="blue">
      <Label text="test"></Label>
    </MDRipple>
  </GridLayout>
</StackLayout>

Works on iOS but doesn't work on Android...

[farfromrefug]

@Bezlepkin what does not work? please a lit bit more explanation

[Bezlepkin]

@Bezlepkin what does not work? please a lit bit more explanation

if i set the dimensions of the MDRipple tag, they change. There is no ripple effect and background color.

[farfromrefug]

@Bezlepkin sorry but i really dont undestand. You say they change, what changes?.

[Bezlepkin]

@Bezlepkin sorry but i really dont undestand. You say they change, what changes?.

https://user-images.githubusercontent.com/10475699/154703944-5da9859f-0e54-4f1e-96df-9e1e0a5f261d.mp4

This is the code from the example. Works on iOS but not on Android.

[farfromrefug]

@Bezlepkin what s your android version?

[Bezlepkin]

@Bezlepkin what s your android version?

9 (ZTE Blade A5)

[Bezlepkin]

@Bezlepkin what s your android version?

Hi! I saw you released an update. Have you fixed the ripple effect?

[tartinesKiller]

I had this issue with my recent migration of my app from NS6 to NS8: I'm now using the latest version of @nativescript-community/ui-material-ripple. In my case, the ripple is not showing if there's not a rippleColor specified, it wasn't mandatory, but seems to be accidentally needed now. So, instead of

<MDRipple @tap="dosomething">
...

you should now do

<MDRipple rippleColor="red" @tap="dosomething">
...

[farfromrefug]

@Bezlepkin @tartinesKiller it seems ripple is completely broken on android :s i have no idea how to fix it :( I would suggest to use https://github.com/nativescript-community/ui-material-components#mixins= to have rippleColor work on any view! This is what i do.

[tartinesKiller]

@Bezlepkin @tartinesKiller it seems ripple is completely broken on android :s i have no idea how to fix it :( I would suggest to use https://github.com/nativescript-community/ui-material-components#mixins= to have rippleColor work on any view! This is what i do.

No, it does work for me, but I had to specify a rippleColor, through component property, or with CSS with

mdripple {
    ripple-color: red;
}

After that, it works as intended. Didn't had time to try to investigate for now however

[farfromrefug]

@tartinesKiller here locally with the dev version it does not work at all anymore