Telerik UI Nativescript-RadListView涟漪效应

我在5月份的NativeScript Angular 2应用程序中为NativeScript使用RadListView telerik ui组件

当我设置EventItemTap和/或itemHold时，它们工作得很好，但列表行上没有通常的点击效果（涟漪）

有没有办法增加这种效果

---

提前感谢：）

在我看来，这与插件有关。作为一种解决方案，您可以将

点击

事件设置为

涟漪

组件并获取元素

id

，这将帮助您区分所选项目。我附上样本代码

main-page.xml

<Page xmlns:RL="nativescript-ripple" xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo">
 <GridLayout>
  <ListView items="{{ source }}"  loaded="onLoaded">
      <ListView.itemTemplate>
        <RL:Ripple rippleColor="#d50000" id="{{index}}" tap="onTap2">
            <StackLayout  >
                  <Label text="{{title}}" textWrap="true" />
            </StackLayout>
          </RL:Ripple>
      </ListView.itemTemplate>
  </ListView>

 </GridLayout>
</Page>

主页

import { EventData } from 'data/observable';
import { Page } from 'ui/page';
import { HelloWorldModel } from './main-view-model';
import {StackLayout} from "ui/layouts/stack-layout"

// Event handler for Page "navigatingTo" event attached in main-page.xml
export function navigatingTo(args: EventData) {
  // Get the event sender
  let page = <Page>args.object;
  var array=[];
  for(var i=0;i<100; i++)
  {
    array.push({index:""+i,title:"title "+i});
  }
  page.bindingContext = {"source":array};
}

export function onTap2(args){
  console.log("sample");
  var layouts = args.object;
  var id = layouts.get("id");
  console.log(id);
}

从“数据/可观察”导入{EventData}；
从'ui/Page'导入{Page}；
从“/main view model”导入{HelloWorldModel}；
从“ui/layouts/stack layout”导入{StackLayout}
//main-Page.xml中附加的页面“NavigationTo”事件的事件处理程序
导出函数导航到（参数：EventData）{
//获取事件发送器
让page=args.object；
var数组=[]；
对于（var i=0；i它与您添加到itemTemplate的类“list group item”有关。如果删除该类，您可以再次看到涟漪，但是没有样式…我执行了以下操作：

1） 添加此css样式


.list group.列表组项目{
颜色：#212121；
字号:16 ;；
保证金：0；
填充：16；
}
.列表组.列表组项目波纹标签{
垂直对齐：居中；
}
.列表组.列表组项涟漪.拇指{
拉伸：填充；
宽度：40；
身高：40；
右边距：16；
}
.list group.list-group-item-ripple.active{
背景色：#E0；
}
.列表组.列表组项目涟漪.列表组项目文本{
颜色：#7575；
字号:14 ;；
}
您可以使用提供此功能的
nativescript ripple
插件。您还可以查看插件repo中的演示，其中演示了如何在应用程序中使用它-。@NikolayTsonev我尝试了该插件，但它阻止了listview的itemTap事件触发(