How to FadeOut Textview on Button Click

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:

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.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:background="#81a3d0">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world"
android:textSize="40dp"
android:id="@+id/textView1"
android:layout_centerHorizontal="true"
/>
<Button
android:id="@+id/button1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="FadeOut"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
>
</Button>
</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:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<alpha
android:duration="1000"
android:fromAlpha="1.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="0.0" />
</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.

package com.fadeoutapplication;
import android.app.Activity;
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 Activity implements Animation.AnimationListener {
Animation fadeout;
Button button;
TextView textview;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
textview=(TextView)findViewById(R.id.textView1);
button=(Button)findViewById(R.id.button1);
fadeout= AnimationUtils.loadAnimation(getApplicationContext(),R.anim.fade_out);
fadeout.setAnimationListener(this);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
textview.setAnimation(fadeout);
}
});
}
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
}
@Override
public void onAnimationRepeat(Animation animation) {
}
}

Step 5

output

Step 6

When you click on the fadeout button: