Android 圆角矩形ProgressBar

首先定义一个ProgressBar:

    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:indeterminate="false"
        android:progress="30"
        android:progressDrawable="@drawable/round_progress"
        app:layout_constraintBottom_toBottomOf="@+id/name"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_marginRight="110dp"
        app:layout_constraintTop_toTopOf="@+id/name" />

设置style 是横向的,然后设置progressDrawable 为 round_progress.

round_progress.xml 里面如下


情况一:

如果进度左边是圆形,中间是矩形,如下图:

在这里插入图片描述

使用下面的xml

<?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" android:padding = "5dp">
            <solid android:color="#FFE8E8E8"/>
            <stroke android:color="#FFE8E8E8" android:width="1dp" />
            <corners
                android:radius="10dp" />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">

        <clip>

            <shape
                android:shape="rectangle" android:padding = "5dp">
                <solid android:color="#FFFF0000"/>
                <corners
                    android:radius="10dp"
/>
            </shape>
        </clip>
    </item>

    <item android:id="@android:id/progress">

        <clip>

            <shape
                android:shape="rectangle" android:padding = "5dp">
                <solid android:color="#FFFF0000"/>
                <corners
                    android:radius="10dp"
/>
            </shape>
        </clip>
    </item>

</layer-list>

情况二:

如果进度两端都是圆形,如下图

在这里插入图片描述
使用下面的xml

<?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" android:padding = "5dp">
            <solid android:color="#FFE8E8E8"/>
            <stroke android:color="#FFE8E8E8" android:width="1dp" />
            <corners
                android:radius="10dp" />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">

        <scale android:scaleWidth="100%">

            <shape
                android:shape="rectangle" android:padding = "5dp">
                <solid android:color="#FFFF0000"/>
                <corners
                    android:radius="10dp"
/>
            </shape>
        </scale>
    </item>

    <item android:id="@android:id/progress">

        <scale android:scaleWidth="100%">

            <shape
                android:shape="rectangle" android:padding = "5dp">
                <solid android:color="#FFFF0000"/>
                <corners
                    android:radius="10dp"
                    />
            </shape>
        </scale>
    </item>

</layer-list>

TODO

layer-list、shape、scale、clip 的使用,真的不太熟悉。

你可能感兴趣的:(Android)