【View】Android ProgressBar 進度條

指示操作進度的用戶界面元素。進度條支持兩種方式來表示進度：確定的和不確定的。以不中斷的方式向用戶顯示進度條。在應用程序的用戶界面或通知中而不是在對話框中顯示進度條。

ProgressBar 在 Android 中有多種形式，包括水平 ProgressBar 和圓形 ProgressBar。它們都可以通過設置不同的屬性來改變外觀和行為。

---

文章目錄

1. ProgressBar
2. ProgressBar 內建樣式
3. ProgressBar 自定義樣式 長條形
4. ProgressBar 自定義樣式 環形
5. ProgressBar 用法
6. Developer Documents ProgressBar

---

1.ProgressBar

不確定的進度條

<ProgressBar
      android:id="@+id/indeterminateBar"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" />

確定的進度條

<ProgressBar
      android:id="@+id/determinateBar"
      style="@android:style/Widget.ProgressBar.Horizontal"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:progress="25" />

2.ProgressBar 內建樣式

長條形

<ProgressBar
        style="@android:style/Widget.ProgressBar.Horizontal"
        android:id="@+id/indeterminateBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:max="4"
        android:progress="2"/>

<ProgressBar
        android:id="@+id/indeterminateBar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:max="4"
        android:progress="2" />

環形

<ProgressBar
        style="@android:style/Widget.ProgressBar.Large"
        android:id="@+id/indeterminateBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

<ProgressBar
        android:id="@+id/indeterminateBar"
        style="?android:attr/progressBarStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

3.ProgressBar 自定義樣式 長條形

<ProgressBar
        android:id="@+id/indeterminateBar"
        style="@android:style/Widget.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="8dp"
        android:max="4"
        android:progress="2"
        android:progressDrawable="@drawable/progressbar" />

一般

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <solid android:color="#D4D4D4"/>
        </shape>
    </item>

    <item android:id="@android:id/progress" >
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#0900FF"/>
            </shape>
        </clip>
    </item>
</layer-list>

漸變 + 圓角

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <corners android:radius="10dp" />
            <solid android:color="#D4D4D4"/>
        </shape>
    </item>

    <item android:id="@android:id/progress" >
        <clip>
            <shape android:shape="rectangle">
                <corners android:radius="10dp" />
                <gradient
                    android:startColor="#B0A0FC"
                    android:centerColor="#8D77FE"
                    android:endColor="#0900FF" />
            </shape>
        </clip>
    </item>
</layer-list>

4.ProgressBar 自定義樣式 環形

<ProgressBar
        android:id="@+id/indeterminateBar"
        style="?android:attr/progressBarStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:indeterminateDuration="1000"
        android:indeterminateDrawable="@drawable/progressbar" />

一般

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android">
    <shape
        android:shape="ring"
        android:useLevel="false" >

        <gradient
            android:startColor="#FFFFFF"
            android:centerColor="#F4A11D"
            android:endColor="#10772C"
            android:type="sweep" />
    </shape>
</rotate>

雷達

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android">
    <shape
        android:shape="oval"
        android:useLevel="false" >

        <gradient
            android:startColor="#FFFFFF"
            android:centerColor="#F4A11D"
            android:endColor="#10772C"
            android:type="sweep"
            />
    </shape>
</rotate>

5.ProgressBar 用法

class MainActivity : AppCompatActivity() {

    var lock = false

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.progressBar.apply {
            max = 100
            progress = 5
        }

        thread {
            while (!lock) {
                Thread.sleep(1000)
                binding.progressBar.progress = binding.progressBar.progress + 5
                if (binding.progressBar.progress == 80) {
                    lock = true
                }
            }
        }
    }
}

6.Developer Documents ProgressBar

Open in Documents ProgressBar