Cách tạo ProgressBar tròn tùy chỉnh trong Android?

Giới thiệu

Hướng dẫn tạo ProgressBar hình tròn (circular) với màu sắc và độ dày tùy chỉnh bằng drawable XML, không cần thư viện bên thứ ba.

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

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

Khởi tạo project Android Studio.

Bước 2: Tạo drawable progress tròn (res/drawable/circular_progress_bar.xml)

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="https://schemas.android.com/apk/res/android"
    android:fromDegrees="270"
    android:toDegrees="270">
    <shape
        android:innerRadiusRatio="2.5"
        android:shape="ring"
        android:thickness="1dp"
        android:useLevel="true">
        <!-- Fix cho API 21 (Lollipop) -->
        <gradient
            android:angle="0"
            android:endColor="#007DD6"
            android:startColor="#007DD6"
            android:type="sweep"
            android:useLevel="false" />
    </shape>
</rotate>

Bước 3: Tạo drawable nền vòng tròn (res/drawable/circular_shape.xml)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="https://schemas.android.com/apk/res/android"
    android:innerRadiusRatio="2.5"
    android:shape="ring"
    android:thickness="1dp"
    android:useLevel="false">
    <solid android:color="#CCCCCC" />
</shape>

Bước 4: Giao diện sử dụng ProgressBar (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"
    android:layout_margin="16dp"
    tools:context=".MainActivity">
    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_centerInParent="true"
        android:background="@drawable/circular_shape"
        android:indeterminate="false"
        android:max="100"
        android:progress="65"
        android:progressDrawable="@drawable/circular_progress_bar" />
</RelativeLayout>

Bước 5: MainActivity đơn giản (src/MainActivity.java)

package app.tutorialspoint.com.sample;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

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

Bước 6: AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="app.tutorialspoint.com.sample">
    <uses-permission android:name="android.permission.CALL_PHONE" />
    <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. ProgressBar tròn sẽ hiển thị với tiến độ 65%, màu xanh dương trên nền xám.

Tùy chỉnh thêm

• Thay đổi android:thickness để điều chỉnh độ dày vòng tròn
• Sửa android:endColor/startColor để đổi màu tiến độ
• Cập nhật progress động: progressBar.setProgress(80)
• Dùng ObjectAnimator để animate tiến độ mượt mà