edusperoni / nativescript-ripple

NativeScript plugin to add Android Material Design Ripple effect to your layouts.
Apache License 2.0
52 stars 13 forks source link

Ripple not working with RadListView #28

Open vforv opened 5 years ago

vforv commented 5 years ago

Here is my code:

<RadListView *ngIf="!loading" [items]="menus">
        <ng-template tkListItemTemplate let-item="item">
            <GridLayout ripple (tap)="onItemTap(item)" class="listItemTemplateGrid">
                <Image [src]="item.image" stretch="aspectFill"></Image>
                <FrescoDrawee horizontalAlignment="stretch" height="250" [imageUri]="item.image"
                    verticalAlignment="top"></FrescoDrawee>
                <GridLayout verticalAlignment="bottom">
                    <StackLayout class="labelsStackLayout">
                        <Label [text]="item.name" textWrap="true"></Label>
                    </StackLayout>
                </GridLayout>
            </GridLayout>
        </ng-template>

        <!-- >> angular-listview-item-layouts-grid -->
        <ListViewGridLayout tkListViewLayout scrollDirection="Vertical" ios:itemHeight="200" spanCount="2">
        </ListViewGridLayout>
        <!-- << angular-listview-item-layouts-grid -->
    </RadListView>

It works if I don;t use List

edusperoni commented 5 years ago

Try wrapping the gridlayout in another layout just in case. RLV is annoying to work with...

vforv commented 5 years ago

Agree... Tried with Flexbox and anoter GirdLayout but same result

edusperoni commented 5 years ago

Haven't got the time to address this yet, but this may also be worth the shot: remove the *ngIf. We use RLV with ripple on one screen. We know that RLV has issues with angular components when you use *ngIf inside the template, maybe it's the same case here?

ghost commented 5 years ago

I have the same issue