Wave Scale Animation in GridViews in Android

Hello all

Previously I have shown many posts where we animate each row of the GridView randomly, linearly etc.

GridView RandomFade animation in Android

and

Cascade animation in a ListView in Android.

In today’s post I will show you how to create a wave scale animation in the ListViews.

Please refer to my old posts for the extra code. Here I am posting only the animation XML only for the wave animation.

layout_wave_scale.xml ( inside the res/anim folder)

<set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/accelerate_interpolator">
    <alpha
        android:fromAlpha="0.0"
        android:toAlpha="1.0"
        android:duration="100" />
    <scale
        android:fromXScale="0.5" android:toXScale="1.5"
        android:fromYScale="0.5" android:toYScale="1.5"
        android:pivotX="50%" android:pivotY="50%"
        android:duration="200" />
    <scale 
        android:fromXScale="1.5" android:toXScale="1.0"
        android:fromYScale="1.5" android:toYScale="1.0"
        android:pivotX="50%" android:pivotY="50%"
        android:startOffset="200"
        android:duration="100" />
</set>

Apply it to the GridView and see the result.

<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/grid"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnWidth="60dp"
    android:gravity="center"
    android:horizontalSpacing="10dp"
    android:layoutAnimation="@anim/layout_wave_scale"
    android:numColumns="auto_fit"
    android:stretchMode="columnWidth"
    android:verticalSpacing="10dp" />