RadListViewは、リストに追加またはリストから削除されるアイテムのアニメーションをサポートしています。 この機能を利用するには、モジュールをObservableArrayインスタンスにバインドして、コレクションの変更がRadListViewモジュールに報告されるようにする必要があります。
アイテムのアニメーションを有効にするには、まずアイテムのレイアウトを明示的に定義する必要があります。 アイテムレイアウトの詳細については、専用の記事「アイテムレイアウトアニメーション」を参照してください。 以下のコードサンプルは、"ListViewLinearLayout"の設定方法を示しています。
例1:RadListViewでアイテムアニメーションを有効にする:
<lv:RadListView items="{{ dataItems }}" row="1" id="ls">
<lv:RadListView.listViewLayout>
<lv:ListViewLinearLayout scrollDirection="Vertical" itemInsertAnimation="Default" itemDeleteAnimation="Default"/>
</lv:RadListView.listViewLayout>
<lv:RadListView.itemTemplate>
<StackLayout orientation="vertical">
<Label fontSize="20" text="{{ _itemName }}"/>
<Label fontSize="14" text="{{ _itemDescription }}"/>
</StackLayout>
</lv:RadListView.itemTemplate>
</lv:RadListView>
プロパティ "itemInsertAnimation"と "itemDeleteAnimation"プロパティを "Fade"に設定すると、 ソースコレクションから挿入または削除されるアイテムは、フェードインまたはフェードアウトアニメーションを使用してアニメーション化されます。 現在利用可能なアニメーションは以下の4つです。
現在利用可能なアイテムのアニメーションタイプは、"ListViewItemAnimation"列挙によって定義されます。
このシナリオを実際に見てみたいですか? GitHubのSDKサンプルリポジトリを確認してください。これとNativeScript UIを使用した他の多くの実用的な例があります。