Kotlin ব্যবহার করে Android-এ কাস্টম প্রগ্রেসবার তৈরি করা

ওভারভিউ

এই টিউটোরিয়ালে দেখানো হয়েছে কিভাবে কাস্টম ড্রয়েবল ব্যবহার করে সার্কুলার প্রগ্রেসবারের রঙ এবং স্টাইল কাস্টোমাইজ করা যায়।

প্রয়োজনীয় ধাপসমূহ

ধাপ ১: নতুন প্রজেক্ট তৈরি

ধাপ ২: 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:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="70dp"
        android:background="#008080"
        android:padding="5dp"
        android:text="Custom ProgressBar Demo"
        android:textColor="#fff"
        android:textSize="24sp"
        android:textStyle="bold" />
    
    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_centerInParent="true"
        android:indeterminate="false"
        android:max="100"
        android:progress="20"
        style="?android:attr/progressBarStyleHorizontal"
        android:progressDrawable="@drawable/circle_progress" />
</RelativeLayout>

ধাপ ৩: res/drawable/circle_progress.xml (কাস্টম ড্রয়েবল)

<?xml version="1.0" encoding="utf-8"?>
<ring xmlns:android="https://schemas.android.com/apk/res/android"
    android:innerRadiusRatio="3"
    android:thicknessRatio="8"
    android:useLevel="true">
    
    <!-- ব্যাকগ্রাউন্ড ট্র্যাক -->
    <item android:id="@android:id/background">
        <shape android:shape="ring">
            <solid android:color="#E0E0E0" />
        </shape>
    </item>
    
    <!-- প্রগ্রেস রঙ -->
    <item android:id="@android:id/progress">
        <rotate
            android:fromDegrees="270"
            android:toDegrees="270">
            <shape android:shape="ring">
                <gradient
                    android:startColor="#4CAF50"
                    android:endColor="#8BC34A"
                    android:type="sweep" />
            </shape>
        </rotate>
    </item>
</ring>

ধাপ ৪: MainActivity.kt

import android.os.Bundle
import android.os.Handler
import android.os.Looper
import android.widget.ProgressBar
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {
    private lateinit var progressBar: ProgressBar
    private val handler = Handler(Looper.getMainLooper())
    private var progress = 0
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "Custom ProgressBar"
        
        progressBar = findViewById(R.id.progressBar)
        progressBar.max = 100
        progressBar.progress = 0
        
        // ডেমো: অটো প্রগ্রেস অ্যানিমেশন
        startProgressAnimation()
    }
    
    private fun startProgressAnimation() {
        val runnable = object : Runnable {
            override fun run() {
                if (progress < 100) {
                    progress += 5
                    progressBar.progress = progress
                    handler.postDelayed(this, 200)
                } else {
                    progress = 0
                    progressBar.progress = 0
                    handler.postDelayed(this, 1000)
                }
            }
        }
        handler.post(runnable)
    }
    
    override fun onDestroy() {
        super.onDestroy()
        handler.removeCallbacksAndMessages(null)
    }
}

ধাপ ৫: AndroidManifest.xml

স্ট্যান্ডার্ড কনফিগারেশন।

আধুনিক বিকল্প: Material Progress Indicators

Dependency:

implementation "com.google.android.material:material:1.11.0"

Circular Progress Indicator (Material Design 3):

<com.google.android.material.progressindicator.CircularProgressIndicator
    android:id="@+id/circularProgress"
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:indeterminate="false"
    app:indicatorColor="@color/primary"
    app:trackColor="@color/primary_container"
    app:trackThickness="4dp"
    app:indicatorSize="80dp" />

Linear Progress Indicator:

<com.google.android.material.progressindicator.LinearProgressIndicator
    android:id="@+id/linearProgress"
    android:layout_width="match_parent"
    android:layout_height="8dp"
    android:indeterminate="false"
    app:indicatorColor="@color/primary"
    app:trackColor="@color/primary_container"
    app:trackThickness="4dp"
    app:indicatorDirection="start_to_end" />

কোডে কন্ট্রোল:

val circularProgress = findViewById(R.id.circularProgress)
circularProgress.progress = 75

// ইন্ডিটারমিনেট (লোডিং স্পিনার)
circularProgress.isIndeterminate = true

স্পিনিং (Indeterminate) প্রগ্রেসবার কাস্টোমাইজেশন

<!-- res/drawable/custom_spinner.xml -->
<rotate xmlns:android="https://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:pivotX="50%"
    android:pivotY="50%">
    <shape android:shape="ring"
        android:innerRadiusRatio="3"
        android:thicknessRatio="8">
        <gradient
            android:type="sweep"
            android:startColor="#FF0000"
            android:centerColor="#00FF00"
            android:endColor="#0000FF" />
    </shape>
</rotate>

<ProgressBar
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:indeterminate="true"
    android:indeterminateDrawable="@drawable/custom_spinner" />

সেরা অনুশীলন

• Material Components ব্যবহার করুন (Material 3) - একসাথে ডার্ক থিম, অ্যানিমেশন, এক্সেসিবিলিটি হ্যান্ডেল করে
• Indeterminate লোডিং-এর জন্য, Determinate প্রোগ্রেস বারের জন্য
• UI থ্রেড ব্লক করবেন না - কোরউটিন/ফ্লো ব্যবহার করে প্রগ্রেস আপডেট করুন
• অ্যাক্সেসিবিলিটি: contentDescription যোগ করুন