Android元件(ProgressBar) — ProgressBar進度條

前言：

製作ProgressBar

其實之前在

Android元件(DownloadManager) ─ downloadManager下載元件

就有使用過，這次把他拉出來另外做一篇。

---

重點程式碼：

先來看一下官方文檔ProgressBar

你要使用進度條，一定要知道三件事情。

一、你最大100%的比例為何（setMax）

二、現在跑到的比例在哪了(setProgress)

三、進度條的長相是水平的，還是圓形的.... 等等 (Style)
這邊是所有的Style，參考文檔可以去看看

Other progress bar styles provided by the system include:

• Widget.ProgressBar.Horizontal
• Widget.ProgressBar.Small
• Widget.ProgressBar.Large
• Widget.ProgressBar.Inverse
• Widget.ProgressBar.Small.Inverse
• Widget.ProgressBar.Large.Inverse

---

實作：

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="com.hello.kaiser.progressbardemo.MainActivity">

    <LinearLayout
        android:id="@+id/bar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ProgressBar
            android:id="@+id/progress_bar"
            style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="9" />

        <TextView
            android:id="@+id/progress_tv"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:text="0%" />

    </LinearLayout>

    <Button
        android:onClick="increasing"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/bar_layout"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="40dp"
        android:text="增加10" />


</RelativeLayout>

 

我在activity_main.xml內多設置了一個按鈕來模擬增加的比率和多增一個TextView來觀測%數。

MainActivity.java

 
public class MainActivity extends AppCompatActivity {


    private ProgressBar mProgressBar;
    private TextView mPercentage;

    private int progress = 0;//變化參數

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

        initView();
        initSet();

    }

    private void initView() {
        mProgressBar = (ProgressBar) findViewById(R.id.progress_bar);
        mPercentage = (TextView) findViewById(R.id.progress_tv);
    }

    private void initSet() {
        mProgressBar.setMax(100);
    }


    public void increasing(View view) {
        progress += 10;
        if (progress <= 100)
            mPercentage.setText(progress + "%");
        else
            Toast.makeText(this, "已經跑完囉", Toast.LENGTH_SHORT).show();

        mProgressBar.setProgress(progress);
    }
}

---

DEMO:

https://github.com/nikeru8/ProgressBarDemo

久違的github
為什麼之前不用呢？  這不好說XD