Introduction

In this article, you will learn how to fade_out text on button click using animation in Android.
In this first article, you will create the project. In the XML file, you will use a TextView and Button. So what you will do is to hide the textview on button click. In a Java class file, you will create an animation object. And then you call the loadAnimation() method to load the animation in the object. Now set the animation on its animation clicklistener(). At last on button click event this object to the setAnimation method as an argument to set the animation.
Step 1
Create a project like this:
1.jpg
Step 2
Create an XML file and write this.
In the XML file you will use a TextView and Button. In this application you need to hide the TextView on button click.
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:paddingLeft="@dimen/activity_horizontal_margin"
  6. android:paddingRight="@dimen/activity_horizontal_margin"
  7. android:paddingTop="@dimen/activity_vertical_margin"
  8. android:paddingBottom="@dimen/activity_vertical_margin"
  9. tools:context=".MainActivity"
  11. android:background="#81a3d0">
  13. <TextView
  14. android:layout_width="wrap_content"
  15. android:layout_height="wrap_content"
  16. android:text="@string/hello_world"
  17. android:textSize="40dp"
  18. android:id="@+id/textView1"
  19. android:layout_centerHorizontal="true"
  20. />
  22. <Button
  23. android:id="@+id/button1"
  24. android:layout_height="wrap_content"
  25. android:layout_width="wrap_content"
  26. android:text="FadeOut"
  27. android:layout_alignParentBottom="true"
  28. android:layout_centerHorizontal="true"
  29. >
  31. </Button>
  33. </RelativeLayout>
Step 3
Create an anim resource file inside the res folder. Inside the anim folder you will create an XML file named fade_out and write this:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <set xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fillAfter="true" >
  5. <alpha
  6. android:duration="1000"
  7. android:fromAlpha="1.0"
  8. android:interpolator="@android:anim/accelerate_interpolator"
  9. android:toAlpha="0.0" />
  11. </set>
Step 4
Create a Java file and write this.
In this class file, you will create an animation object. And then you call the loadAnimation() method to load the animation into the object. Now set the animation on its animation clicklistener(). At last on button click event this object to the setAnimation method as an argument to set the animation.
  1. package com.fadeoutapplication;
  3. import android.app.Activity;
  4. import android.os.Bundle;
  5. import android.view.View;
  6. import android.view.animation.Animation;
  7. import android.view.animation.AnimationUtils;
  8. import android.widget.Button;
  9. import android.widget.TextView;
  11. public class MainActivity extends Activity implements Animation.AnimationListener {
  13. Animation fadeout;
  14. Button button;
  15. TextView textview;
  16. @Override
  17. protected void onCreate(Bundle savedInstanceState) {
  18. super.onCreate(savedInstanceState);
  19. setContentView(R.layout.activity_main);
  20. textview=(TextView)findViewById(R.id.textView1);
  21. button=(Button)findViewById(R.id.button1);
  23. fadeout= AnimationUtils.loadAnimation(getApplicationContext(),R.anim.fade_out);
  24. fadeout.setAnimationListener(this);
  26. button.setOnClickListener(new View.OnClickListener() {
  27. @Override
  28. public void onClick(View view) {
  30. textview.setAnimation(fadeout);
  31. }
  32. });
  33. }
  35. @Override
  36. public void onAnimationStart(Animation animation) {
  38. }
  40. @Override
  41. public void onAnimationEnd(Animation animation) {
  43. }
  45. @Override
  46. public void onAnimationRepeat(Animation animation) {
  48. }
  49. }
Step 5
output
2.jpg
Step 6
When you click on the fadeout button:
3.jpg