Cách thêm bóng (shadow) cho văn bản trong Android

Giới thiệu

Bài viết này minh họa cách thêm hiệu ứng bóng (shadow) cho chữ trong TextView bằng phương thức setShadowLayer(). Cách này đơn giản, không cần drawable/xml phức tạp.

Các bước thực hiện

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

Mở Android Studio, chọn File → New Project và tạo dự án.

Bước 2: Thiết kế 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:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:padding="8dp"
        android:text="Hello World!"
        android:textSize="128sp"
        android:textStyle="bold|italic" />

</RelativeLayout>

Bước 3: Viết code logic (src/MainActivity.java)

import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;

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

        TextView textView = findViewById(R.id.textView);
        textView.setTextColor(Color.MAGENTA); // Màu chữ: Magenta
        // setShadowLayer(radius, dx, dy, shadowColor)
        textView.setShadowLayer(16, 8, 8, Color.BLUE); // Bóng xanh, bán kính 16, lệch 8px phải, 8px dưới
    }
}

Bước 4: Cấu hình AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="app.com.sample">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

Chạy ứng dụng

Kết nối thiết bị, nhấn Run. TextView hiển thị "Hello World!" màu Magenta, có bóng xanh Blue lệch 8px phải và 8px dưới, bán kính mờ 16px.

Giải thích setShadowLayer(float radius, float dx, float dy, int color)

• radius: Bán kính làm mờ bóng (blur radius). 0 = không mờ (bóng sắc nét). Giá trị lớn = bóng mờ mịn.
• dx: Độ lệch ngang (horizontal offset). Dương = sang phải, Âm = sang trái.
• dy: Độ lệch dọc (vertical offset). Dương = xuống dưới, Âm = lên trên.
• color: Màu bóng (ARGB). Ví dụ: Color.BLUE, 0xFF0000FF, Color.argb(128, 0, 0, 0) (đen bán trong suốt).

Cách làm trong XML (Alternative)

<TextView
    android:shadowColor="#0000FF"
    android:shadowDx="8"
    android:shadowDy="8"
    android:shadowRadius="16"
    android:text="Hello World!"
    android:textColor="#FF00FF"
    android:textSize="128sp"
    android:textStyle="bold|italic" />

Các hiệu ứng chữ nâng cao khác

Lưu ý

• Shadow không hoạt động trên một số font tùy chỉnh (custom Typeface) trong vài phiên bản Android cũ
• Radius quá lớn có thể gây lag khi render text dài
• Để shadow đẹp trên background phức tạp, dùng màu bóng bán trong suốt: Color.argb(100, 0, 0, 0)
• Kết hợp với textStyle="bold|italic" để chữ nổi bật hơn