Hello Guys, Hope you are doing well. In this tutorial we will implement an app in which views are swapping with each other with some animation . For example one view is on top and we want to swap the last view with this first view. so we will implement in this tutorial step by step.so without wasting time lets move to coding part.
Step 1:
Create an xml file with name activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <ScrollView android:layout_width="match_parent" android:layout_height="wrap_content" android:scrollbars="none"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:id="@+id/linearlayout"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:clipChildren="true" android:clipToPadding="true" android:id="@+id/viewswaptop"> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#fff" android:id="@+id/card1lin" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:orientation="horizontal" android:weightSum="1"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:textColor="#4B4B4B" android:textSize="14sp" android:layout_weight="1" android:textStyle="bold" android:text="Group 1" android:layout_gravity="center" android:layout_marginRight="10dp" android:layout_marginLeft="10dp" android:gravity="center"/> <ImageView android:layout_width="30dp" android:layout_height="30dp" android:id="@+id/pinpost1" android:background="@drawable/pinpost"></ImageView> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item1" android:gravity="center" android:layout_gravity="center" android:layout_weight=".7" android:layout_marginTop="5dp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 1" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 3" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 4" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 5" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 6" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 7" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 8" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#fff" android:id="@+id/card2lin" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:orientation="horizontal" android:weightSum="1"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:textColor="#4B4B4B" android:textSize="14sp" android:textStyle="bold" android:text="Group 2" android:layout_gravity="center" android:layout_weight="1" android:layout_marginRight="10dp" android:layout_marginLeft="10dp" android:gravity="center"/> <ImageView android:layout_width="30dp" android:layout_height="30dp" android:id="@+id/pinpost2" android:background="@drawable/pinpost"></ImageView> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item1" android:gravity="center" android:layout_gravity="center" android:layout_weight=".7" android:layout_marginTop="5dp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 1" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 3" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 4" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 5" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 6" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 7" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 8" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/card3lin" android:background="#fff" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:orientation="horizontal" android:weightSum="1"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#000" android:textStyle="normal" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:drawablePadding="7dp" android:layout_gravity="center" android:gravity="center" android:text="Group 3" android:layout_weight="1" android:paddingLeft="10dp" android:layout_marginBottom="5dp" android:textSize="15sp" ></TextView> <ImageView android:layout_width="30dp" android:layout_height="30dp" android:id="@+id/pinpost3" android:background="@drawable/pinpost"></ImageView> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 1" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 2" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 3" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 4" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/card4lin" android:background="#fff" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:orientation="horizontal" android:weightSum="1"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#000" android:textStyle="normal" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:drawablePadding="7dp" android:layout_gravity="center" android:gravity="center" android:text="Group 4" android:layout_weight="1" android:paddingLeft="10dp" android:layout_marginBottom="5dp" android:textSize="15sp" ></TextView> <ImageView android:layout_width="30dp" android:layout_height="30dp" android:id="@+id/pinpost4" android:background="@drawable/pinpost"></ImageView> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item1" android:gravity="center" android:layout_gravity="center" android:layout_weight=".7" android:layout_marginTop="5dp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 1" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 3" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 4" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> <LinearLayout android:weightSum="4" android:layout_marginTop="15dp" android:paddingBottom="10dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 5" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 6" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11sp" android:textColor="#000" android:text="Item 7" android:gravity="center" android:layout_marginTop="5dp" android:layout_gravity="center" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:layout_weight="1" android:weightSum="1" android:layout_gravity="center" android:layout_marginLeft="10dp" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content"> <FrameLayout android:layout_width="40dp" android:layout_height="30dp" android:layout_gravity="center" > <ImageView android:layout_gravity="center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <ImageView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ic_cms_svg" /> </FrameLayout> <TextView android:textSize="11dp" android:textColor="#000" android:text="Item 8" android:gravity="center" android:layout_gravity="center" android:layout_marginTop="5dp" android:layout_weight=".7" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> </LinearLayout> </LinearLayout> </ScrollView> </LinearLayout>
Step 2: Create ViewSwapAnimation.java file and paste this code
package com.example.myapplication; import androidx.appcompat.app.AppCompatActivity; import android.animation.ObjectAnimator; import android.os.Bundle; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.LinearLayout; public class ViewSwapAnimation extends AppCompatActivity { ImageView pinpost1,pinpost2,pinpost3,pinpost4; LinearLayout viewswap; LinearLayout card1lin,card2lin,card3lin,card4lin; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); pinpost1=(ImageView)findViewById(R.id.pinpost1); pinpost2=(ImageView)findViewById(R.id.pinpost2); pinpost3=(ImageView)findViewById(R.id.pinpost3); pinpost4=(ImageView)findViewById(R.id.pinpost4); card1lin=(LinearLayout)findViewById(R.id.card1lin); card2lin=(LinearLayout)findViewById(R.id.card2lin); card3lin=(LinearLayout)findViewById(R.id.card3lin); card4lin=(LinearLayout)findViewById(R.id.card4lin); viewswap=(LinearLayout)findViewById(R.id.viewswaptop); pinpost1.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { ViewGroup parent = (ViewGroup) card1lin.getParent(); parent.removeView(card1lin); parent.addView(card1lin, 0); ObjectAnimator animator = ObjectAnimator.ofFloat(card1lin, "translationY", 1000f, 0f); animator.setDuration(1000); // Set the duration of the animation in milliseconds animator.start(); // Start the animation } }); pinpost2.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { ViewGroup parent = (ViewGroup) card2lin.getParent(); parent.removeView(card2lin); parent.addView(card2lin, 0); ObjectAnimator animator = ObjectAnimator.ofFloat(card2lin, "translationY", 1000f, 0f); animator.setDuration(1000); // Set the duration of the animation in milliseconds animator.start(); // Start the animation } }); pinpost3.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { ViewGroup parent = (ViewGroup) card3lin.getParent(); parent.removeView(card3lin); parent.addView(card3lin, 0); ObjectAnimator animator = ObjectAnimator.ofFloat(card3lin, "translationY", 1000f, 0f); animator.setDuration(1000); // Set the duration of the animation in milliseconds animator.start(); // Start the animation } }); pinpost4.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { ViewGroup parent = (ViewGroup) card4lin.getParent(); parent.removeView(card4lin); parent.addView(card4lin, 0); ObjectAnimator animator = ObjectAnimator.ofFloat(card4lin, "translationY", 1000f, 0f); animator.setDuration(1000); // Set the duration of the animation in milliseconds animator.start(); // Start the animation } }); } //returns x-pos relative to root layout private float getRelativeX(View myView) { if (myView.getParent() == myView.getRootView()) return myView.getX(); else return myView.getX() + getRelativeX((View) myView.getParent()); } //returns y-pos relative to root layout private float getRelativeY(View myView) { if (myView.getParent() == myView.getRootView()) return myView.getY(); else return myView.getY() + getRelativeY((View) myView.getParent()); } }
That's it. Compile this program and you will test the app by clicking pinpost icons of each group.
Thank you for your time . Keep coding ! keep Going.
Comments
Post a Comment