Tutorial Cara Membuat Progress Button Tanpa Library Di Android Studio

Halo semuanya, bagaimana kabar kalian hari ini? Saya harap kalian semua dalam keadaan yang baik-baik saja. Pada kesempatan kali ini, saya akan membagikan Tutorial Cara Membuat Progress Button Tanpa Library di Android Studio.

Progress Button adalah salah satu opsi untuk menunjukan non-blocking progress dalam aplikasi yang diperkenalkan Google dalam Material Guidelines. Sayangnya, google tidak menyediakan implementasi ini padahal dalam aplikasi mereka Playstore menerapkan sistem ini.

Dan disini, saya dapat melihat bagaimana cara menerapkannya menggunakan komponen yang ada dan terlebih algi bagaimana menambahkannya ke aplikasi yang telah Anda yang sudah ada tanpa perubahan layout. Ikuti tutorialnya dibawah.

Tutorial Cara Membuat Progress Button Tanpa Library Di Android Studio

Buatlah project Android Studio baru dengan informasi seperti pada tabel dibawah ini:

Daftar file xml layout yang digunakan dalam project ini:

1. activity_main.xml

Daftar file java activity yang digunakan dalam project ini:

1. MainActivity.java

Dibawah ini adalah langkah-langkah dalam pembuatan aplikasi Progress Button App

XML Layout File (activity_main.xml)

Buka file activity_main.xml dalam folder layout lalu tambahkan komponen Button di dalam FrameLayout. Lalu tambahkan juga komponen ProgressIndicator di dalam RelativeLayout. Berikut ini adalah kode lengkap untuk file activity_main.xml

app/res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true">

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <Button
                android:id="@+id/btn_download"
                android:layout_width="150dp"
                android:layout_height="60dp"
                android:gravity="center"
                android:text="Download" />

        </FrameLayout>

        <ProgressBar
            android:id="@+id/progress_download"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:max="100"
            android:progress="35"
            app:indicatorColor="@android:color/white" />

    </RelativeLayout>
</RelativeLayout>

Java Activity File (MainActivity.java)

Buka file MainActivity dalam folder java. Deklarasikan kedua komponen yang telah kita tambahkan dalam folder layout, lalu untuk membuat ProgressBar muncul ketika Button di klik, kita memerlukan Handler dan Runnable. Berikut ini adalah kode lengkap untuk file MainActivity.java

app/java/com.androidrion.progressbuttonapp/MainActivity.java

package com.androidrion.progressbuttonapp;

import android.os.Bundle;
import android.os.Handler;
import android.widget.Button;
import android.widget.ProgressBar;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    private ProgressBar progressDownload;
    private Handler mHandler;
    private Button btnDownload;
    private Runnable runnable;
    boolean running = true;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mHandler = new Handler(this.getMainLooper());
        progressDownload = findViewById(R.id.progress_download);
        btnDownload = findViewById(R.id.btn_download);

        btnDownload.setOnClickListener(v -> runProgressDeterminateCircular());
        runProgressDeterminateCircular();
    }

    private void runProgressDeterminateCircular() {
        runnable = new Runnable() {
            public void run() {
                running = true;
                btnDownload.setText("");
                btnDownload.setClickable(false);
                int progress = progressDownload.getProgress() + 1;
                progressDownload.setProgress(progress);
                if (progress > 100) {
                    progressDownload.setProgress(0);
                    running = false;
                    btnDownload.setText("DOWNLOAD");
                    btnDownload.setClickable(true);
                } else {
                    mHandler.postDelayed(this, 5);
                }
            }
        };
        mHandler.post(runnable);
    }

    @Override
    protected void onStop() {
        super.onStop();
        if (mHandler == null || runnable == null) return;
        mHandler.removeCallbacks(runnable);
    }

}

Run ‘app’

Sekarang jalankan project Android Studio kalian, kalian bisa melihat bahwa di Aplikasi terdapat satu buah tombol yang tertulis Download. Jika kalian mengklik tombol tersebut, maka tombol akan menampilkan progress bar lingkaran. Jika kode diatas tidak terjadi error, maka aplikasi akan terlihat seperti pada video di bawah ini.

AKHIR KATA

Itulah tadi tutorial singkat dan mudah Cara Membuat Progress Button Tanpa Library Tambahan di Android. Tutorial diatas sangatlah mudah untuk dikerjakan karen tidak begitu banyak menggunakan file layout dan java untuk membuatnya.

Jika kalian mengalami kendala saat melakukan tutorial di atas, Silahkan beri komentar pada artikel ini dibawah. Jangan lupa untuk Subscribe Channel YouTube Android Rion. Semoga artikel ini membantu kalian semua. Terima kasih.

Download Project

Untuk download project pada tutorial ini, silahkan klik tombol dibawah ini.