Hello Guys ,
In this tutorial , we are going to create move animation on android app. In this animation are object moving on left side , right side , up and down. In this app we create four buttons and textview. four buttons are used to perform move animation.
and
Feel free to visit my previous Animation tutorial.
Rotate Animation
Move Animation App MainScreen looking like below picture :
Step 1 : Create a new Project
Step 2 : Create the animation file.
- Go to res folder and create a new Android Resource Directory named "anim". And in the anim resource directory create new animation files. Here We create four animation files. Animation files name are move_left.xml , move_right.xml , move_up.xml and move_down.xml.
- move_left.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fillAfter="true" >
<translate
android:fromXDelta="100%p"
android:toXDelta="0%p"
android:duration="3000" />
</set>
- move_right.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fillAfter="true" >
<translate
android:fromXDelta="0%p"
android:toXDelta="100%p"
android:duration="3000" />
</set>
- move_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fillAfter="true" >
<translate
android:fromYDelta="100%p"
android:toYDelta="0%p"
android:duration="3000" />
</set>
- move_down.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fillAfter="true" >
<translate
android:fromYDelta="0%p"
android:toYDelta="100%p"
android:duration="3000" />
</set>
- android:duration : It is used to specify duration for animation.
- android:fromYDelta : It is Starting Y offset. It Expressed in pixels relative to the normal position.
- android:toYDelta : It is Ending Y offset. It Expressed in pixels relative to the normal position.
- android:fromXDelta : It is Starting X offset. It Expressed in pixels relative to the normal position.
- android:toXDelta : It is Ending X offset. It Expressed in pixels relative to the normal position.
Step 3 : Edit activity_main.xml file
- Here we added four button and textview for perform move animation.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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"
tools:context=".MainActivity">
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ps_Inf0"
android:textAllCaps="false"
android:textSize="40sp"
android:textColor="@color/teal_200"
android:layout_centerInParent="true"/>
<Button
android:id="@+id/btn_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left"
android:textAllCaps="false"
android:layout_alignParentBottom="true"
android:layout_marginBottom="45dp"
android:layout_marginStart="20dp"/>
<Button
android:id="@+id/btn_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right"
android:textAllCaps="false"
android:layout_alignParentBottom="true"
android:layout_marginBottom="45dp"
android:layout_marginStart="115dp"/>
<Button
android:id="@+id/btn_down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Down"
android:textAllCaps="false"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="20dp"
android:layout_marginBottom="45dp" />
<Button
android:id="@+id/btn_up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Up"
android:textAllCaps="false"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="115dp"
android:layout_marginBottom="45dp" />
</RelativeLayout>
Step 4 : Implement MainActivity.java class file.
- In this class we can load animation class using Animation class.
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
Button left , right , up , down;
TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
left = findViewById(R.id.btn_left);
right = findViewById(R.id.btn_right);
up = findViewById(R.id.btn_up);
down = findViewById(R.id.btn_down);
textView = findViewById(R.id.text);
left.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation = AnimationUtils.loadAnimation(
getApplicationContext() , R.anim.move_left);
textView.startAnimation(animation);
}
});
right.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation = AnimationUtils.loadAnimation(
getApplicationContext() , R.anim.move_right);
textView.startAnimation(animation);
}
});
up.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation = AnimationUtils.loadAnimation(
getApplicationContext() , R.anim.move_up);
textView.startAnimation(animation);
}
});
down.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation = AnimationUtils.loadAnimation(
getApplicationContext() , R.anim.move_down);
textView.startAnimation(animation);
}
});
}
}
Output :
If you liked this post do comment ,share and promote the post 🙏 . Please stay with us and support. 🙏
0 Comments