Question

我为我的应用制作了动画甜甜圈进度条。在此之前，我使用班级进行绘画，但是用户告诉我，自Android 8起，此刻应用程序崩溃。

我说“确定”，让我更改ProgressBar的类型。我发现了这样的解决方案（其他元素，看起来像以前的一样）。并设置半透明颜色以查看每层的碰撞。如您所见，“新建”中没有空闲像素（介于橙色和绿色之间）。橙色部分就像绿色（进度）部分的背景一样：

我在活动上的ProgressBar：

        <ProgressBar
        android:id="@+id/pb"
        android:layout_width="150dp"
        android:layout_height="150dp"
        style="?android:progressBarStyleHorizontal"
        android:progressDrawable="@drawable/circle"/>

此PB的形状：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:shape="ring"
            android:thicknessRatio="10"
            android:useLevel="false">
            <solid android:color="#55ffa500" />
        </shape>
    </item>
    <item>
        <rotate
            android:fromDegrees="270"
            android:toDegrees="270"
            android:pivotX="50%"
            android:pivotY="50%">
            <shape
                android:shape="ring"
                android:thicknessRatio="10"
                android:useLevel="true">
                <solid android:color="#5589c154" />
            </shape>
        </rotate>
    </item>
</layer-list>

简单动画：

ProgressBar progressBar = findViewById(R.id.pb);
        ObjectAnimator progressAnimator = ObjectAnimator.ofInt(progressBar, "Progress", 0,80);
        progressAnimator.setStartDelay(500);
        progressAnimator.setDuration(1000);
        progressAnimator.start();

似乎我应该为带有空格（100％-progress-spaces）的橙色部分设置进度。

Answer 1

可以用两条“时钟”线作为分隔线来解决问题：

可以定义为背景颜色：

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:shape="ring"
            android:thicknessRatio="10"
            android:useLevel="false">
            <solid android:color="@color/orange" />
        </shape>
    </item>
    <item>
        <rotate
            android:fromDegrees="270"
            android:toDegrees="270"
            android:pivotX="50%"
            android:pivotY="50%">
            <shape
                android:shape="ring"
                android:thicknessRatio="10"
                android:useLevel="true">
                <solid android:color="@color/green" />
            </shape>
        </rotate>
    </item>
    <item android:left="75dp" android:gravity="center">
        <rotate android:pivotX="0%" android:fromDegrees="270" android:toDegrees="270">
            <shape
                android:shape="line"
                android:useLevel="false">

                <size android:width="75dp" android:height="75dp"/>
                <stroke android:width="3dp" android:color="@color/material"/>
            </shape>
        </rotate>
    </item>
    <item android:left="75dp" android:gravity="center">
        <rotate android:pivotX="0%" android:fromDegrees="270" android:toDegrees="630">
            <shape
                android:shape="line"
                android:useLevel="false">

                <size android:width="75dp" android:height="75dp"/>
                <stroke android:width="3dp" android:color="@color/material"/>
            </shape>
        </rotate>
    </item>
</layer-list>

使背景部分的形状变化与进度部分相反

1 个答案: