Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> Android

Cách tạo animation slide down cho TextView trong Android

Giới thiệu

Ví dụ này minh họa cách tạo hiệu ứng trượt xuống (slide down) cho TextView khi xuất hiện trên màn hình bằng XML animation.

Bước 1: Tạo dự án mới

Android Studio → File → New Project.

Bước 2: Giao diện (res/layout/activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:gravity="center"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/text"
        android:textSize="20dp"
        android:textAlignment="center"
        android:layout_width="match_parent"
        android:textColor="#FF4500"
        android:layout_height="wrap_content"
        android:singleLine="true" />

</RelativeLayout>

Bước 3: Animation XML (res/anim/slide_in_top.xml)

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true"
    android:repeatCount="100">

    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromYDelta="-100%"
        android:toYDelta="0%" />

    <alpha
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromAlpha="0.0"
        android:toAlpha="1.0" />

</set>
  • translate: Di chuyển từ Y = -100% (ngoài màn hình trên) → Y = 0% (vị trí gốc)
  • alpha: Làm mờ từ 0 (ẩn) → 1 (hiện) đồng thời
  • fillAfter="true": Giữ trạng thái cuối
  • repeatCount="100": Lặp 100 lần (vô hạn thực tế)
  • config_mediumAnimTime: Thời gian hệ thống chuẩn (~400ms)

Bước 4: Áp dụng animation (src/MainActivity.java)

package com.example.andy.myapplication;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TextView view = findViewById(R.id.text);
        view.setText("Animation trượt xuống từ trên");
        Animation anim = AnimationUtils.loadAnimation(this, R.anim.slide_in_top);
        view.startAnimation(anim);
    }
}

Chạy ứng dụng

Chạy app → TextView trượt xuống từ trên màn hình kèm fade-in, lặp lại 100 lần.

Biến thể: Slide up (trượt lên), Slide left/right

<!-- Slide up từ dưới lên -->
<translate android:fromYDelta="100%" android:toYDelta="0%" />

<!-- Slide left từ phải sang -->
<translate android:fromXDelta="100%" android:toXDelta="0%" />

<!-- Slide right từ trái sang -->
<translate android:fromXDelta="-100%" android:toXDelta="0%" />

Cách hiện đại: ViewPropertyAnimator

textView.setTranslationY(-textView.getHeight());
textView.setAlpha(0f);
textView.animate()
    .translationY(0)
    .alpha(1f)
    .setDuration(400)
    .start();