首页 > 解决方案 > 如何创建带圆角的圆形进度条

问题描述

我试图弄清楚如何使我的圆形进度条的角落变圆。创建进度条相当容易,但是,我找不到一种方法来修整进度条每一侧的角。

这是我的可绘制circle_progress_bar.xml:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate android:fromDegrees="270" android:toDegrees="270">
            <shape
                android:innerRadiusRatio="2.55"
                android:shape="ring"
                android:thickness="5dp"
                android:useLevel="true">
                <gradient
                    android:type="sweep"
                    android:startColor="#ff963c"
                    android:endColor="#ff4641"/>
            </shape>
        </rotate>
    </item>
    <item android:bottom="211dp">
        <shape
            android:innerRadiusRatio="1000"
            android:shape="ring"
            android:thickness="7dp"
            android:useLevel="false">
            <solid android:color="#ff963c" />
        </shape>
    </item>
    <item>
        <rotate>
            <inset android:insetBottom="211dp">
                <shape
                    android:innerRadiusRatio="1000"
                    android:shape="ring"
                    android:thickness="5dp"
                    android:useLevel="false">
                    <solid android:color="#ff4641" />
                </shape>
            </inset>
        </rotate>
    </item>
</layer-list>

这是我的 activity_main.xml 的片段:

<ProgressBar
    android:id="@+id/progressBar"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:max="100"
    android:progress="86"
    android:progressDrawable="@drawable/circular_progress_bar"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    tools:layout_editor_absoluteY="114dp" />

这就是我得到的:

在此处输入图像描述

标签: androidxmlandroid-layout

解决方案


推荐阅读