1

NativeScriptのAngular 2アプリケーションで、NativeScriptのRadListView telerik UIコンポーネントを使用しています。Telerik UI Nativescript - RadListView波紋効果

私はイベントを設定itemTapおよび/または、彼らは非常によくしかし、リストの行の通常のタップ効果(リップル)なしで動作をitemHold。

この効果を追加する方法はありますか?すべて事前に

感謝:)

+0

あなたはこの機能を提供し 'nativescript-ripple'プラグインを、使用することができます。また、プラグインのレポのデモを見直すこともできます。ここでは、アプリでの使用方法(https://github.com/bradmartin/nativescript-ripple/tree/master/demo)が示されています。 –

+0

@NikolayTsonev私はプラグインを試しましたが、リストビューのitemTapイベントが発生するのをブロックします。 :( – Androidian

答えて

0

私の意見では、このプラグインに関連するものです。解決策として、tapイベントをRippleコンポーネントに設定し、要素idを取得すると、選択したアイテムを区別するのに役立ちます。私はサンプルコードを添付しています。

メイン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> 

メインpage.ts

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); 
} 
関連する問題