Cách dùng Fade In và Fade Out Animation trong Android Java

Giới thiệu về Animation Alpha

Fade In/Out dựa trên AlphaAnimation (thay đổi độ trong suốt 0.0 - 1.0) hoặc ObjectAnimator (property animation hiện đại).

• Fade In: Alpha 0.0 → 1.0 (mờ → rõ)
• Fade Out: Alpha 1.0 → 0.0 (rõ → mờ)

Ví dụ minh họa

Bước 1: Tạo project

Android Studio → File → New Project.

Bước 2: Layout (res/layout/login.xml hoặc activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:id="@+id/parent"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:gravity="center"
    android:orientation="vertical">
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher" />
    <Button
        android:id="@+id/fadeIn"
        android:text="Fade In"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <Button
        android:id="@+id/fadeOut"
        android:text="Fade Out"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

Bước 3: Code (src/MainActivity.java)

package com.example.andy.myapplication;

import android.animation.ObjectAnimator;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.RequiresApi;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

    @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final ImageView imageView = findViewById(R.id.imageView);
        Button fadeIn = findViewById(R.id.fadeIn);
        Button fadeOut = findViewById(R.id.fadeOut);

        // Fade In - View Animation (Legacy)
        fadeIn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                AlphaAnimation alphaAnimation = new AlphaAnimation(0.0f, 1.0f);
                alphaAnimation.setDuration(1000); // 1 giây
                alphaAnimation.setRepeatCount(1); // Lặp 1 lần
                alphaAnimation.setRepeatMode(Animation.REVERSE); // Ngược lại
                imageView.startAnimation(alphaAnimation);
            }
        });

        // Fade Out - Property Animation (Modern)
        fadeOut.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ObjectAnimator fadeOut = ObjectAnimator.ofFloat(imageView, "alpha", 1f, 0f);
                fadeOut.setDuration(2000); // 2 giây
                fadeOut.start();
            }
        });
    }
}

Hai hệ thống Animation trong Android

Fade In/Out với Property Animation (Khuyến nghị)

Fade In

ObjectAnimator fadeIn = ObjectAnimator.ofFloat(view, "alpha", 0f, 1f);
fadeIn.setDuration(500);
fadeIn.setInterpolator(new AccelerateDecelerateInterpolator());
fadeIn.start();

Fade Out

ObjectAnimator fadeOut = ObjectAnimator.ofFloat(view, "alpha", 1f, 0f);
fadeOut.setDuration(500);
fadeOut.addListener(new AnimatorListenerAdapter() {
    @Override
    public void onAnimationEnd(Animator animation) {
        view.setVisibility(View.GONE); // Ẩn hẳn sau khi fade out
    }
});
fadeOut.start();

XML Animation (Reusable)

res/anim/fade_in.xml

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="https://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromAlpha="0.0"
    android:toAlpha="1.0"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator" />

res/anim/fade_out.xml

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="https://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator" />

Sử dụng XML Animation

Animation fadeIn = AnimationUtils.loadAnimation(this, R.anim.fade_in);
Animation fadeOut = AnimationUtils.loadAnimation(this, R.anim.fade_out);

view.startAnimation(fadeIn);
view.startAnimation(fadeOut);

AnimationListener - Xử lý sự kiện

animation.setAnimationListener(new Animation.AnimationListener() {
    @Override
    public void onAnimationStart(Animation animation) { }

    @Override
    public void onAnimationEnd(Animation animation) {
        // Xử lý sau khi kết thúc
        view.setVisibility(View.GONE);
    }

    @Override
    public void onAnimationRepeat(Animation animation) { }
});

Lưu ý quan trọng

• Property Animation (ObjectAnimator) là chuẩn hiện đại
• View Animation chỉ thay đổi matrix vẽ, không thay đổi layout bounds
• Fade Out nên setVisibility(GONE/INVISIBLE) trong onAnimationEnd
• Hardware acceleration có thể gây lỗi - thử view.setLayerType(View.LAYER_TYPE_HARDWARE, null)
• Memory leak: cancel animation trong onDestroy()