New to Telerik UI for Xamarin? Download free 30-day trial

ListView for Xamarin.iOS: Animations

TKListView supports the following predefined animations:

Animation Type Figures
Fade-in
Scale-in
Slide-in

The animated images above are just for illustration purposes. They are missing some fps quality because of the image processing software used to create these images. In order to get a real understanding of how the animations look and feel, check the Demo application that ships with the UI for Xamarin suite.

These animations can be applied when items enter different states. The following list contains all states where animations can be applied:

  • when an item appears when scrolling
  • when adding/inserting an item
  • when removing an item

Accessing the Animations API

The animations can be controlled from the animations-related properties of the Telerik ListView layouts. These properties are exposed at the TKListViewLinearLayout which is the base layout for the TKListViewGridLayout and TKListViewStaggeredLayout. So, in order to apply some animation settings to that layout, you can take it like this:

TKListViewLinearLayout layout = (TKListViewLinearLayout)listView.Layout;

Appear Animations

Those animations are applied when scrolling the list view. You can add a scroll animation by setting the ItemAppearAnimation property of TKListViewLinearLayout:

layout.ItemAppearAnimation = TKListViewItemAnimation.Scale;

Add/Remove animations

To animate an item on insert set the ItemInsertAnimation property:

layout.ItemInsertAnimation = TKListViewItemAnimation.Scale;

To animate an item on delete set the ItemDeleteAnimation property:

layout.ItemDeleteAnimation = TKListViewItemAnimation.Slide;

Be sure to update your data source before triggering item insert/delete methods in TKListView.

Animations Duration

Animations are controlled by setting properties of TKListViewLinearLayout class. The animation duration is controlled by setting the AnimationDuration property:

layout.AnimationDuration = 0.4f;

A sample ListView Animations example can be found in our Native Xamarin.iOS examples.

In this article