进度条横向/竖向

guishou先生

已于 2024-01-12 12:00:29 修改

阅读量406

点赞数 10

分类专栏： Android 自定义view 文章标签： android

于 2024-01-11 20:57:38 首次发布

本文链接：https://blog.csdn.net/qq_23911165/article/details/135538702

版权

Android 自定义view 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

文章详细介绍了如何在Android应用中使用`ProgressBar`实现横向、纵向和圆形的进度条样式，包括自定义背景、进度颜色以及圆角效果。

摘要由CSDN通过智能技术生成

横向进度条

<ProgressBar
    android:id="@+id/pb_memory"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="120dp"
    android:layout_height="6dp"
    android:max="100"
    android:progressDrawable="@drawable/me_bg_vip_progress"
    app:layout_constraintEnd_toEndOf="parent"
    tools:progress="80" />

me_bg_vip_progress.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>
            <corners android:radius="0dp" />
            <solid android:color="@color/color_E2E2E2" />
        </shape>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="0dp" />
                <solid android:color="@color/colorAccent" />
            </shape>
        </clip>
    </item>

</layer-list>

竖向进度条

<ProgressBar
    android:id="@+id/pb_system"
    style="@android:style/Widget.ProgressBar.Horizontal"
    android:layout_width="30dp"
    android:layout_height="120dp"
    android:max="100"
    android:progressDrawable="@drawable/progress_vertical_drawable"
    app:layout_constraintEnd_toEndOf="parent"
    tools:progress="80"
    />

progress_vertical_drawable

<?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>
            <solid android:color="#E5E5E5" />
            <!--下面是设置4个角的圆角-->
            <corners
                android:bottomLeftRadius="5dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="5dp" />
        </shape>
    </item>
    <item android:id="@android:id/progress">
<!--        scale  是竖向进度条  方向 bottom 从下向上  top 从上到下      clip 是横向进度条-->
        <scale
            android:scaleWidth="0%"
            android:scaleHeight="100%"
            android:scaleGravity="bottom">
            <shape>
                <!--这里是设置填充颜色和方向-->
                <gradient
                    android:angle="270"
                    android:endColor="#FC6589"
                    android:centerColor="#FC6589"
                    android:startColor="#B5FF9C"
                    android:type="linear" />
                <!--下面是设置4个角的圆角-->
                <corners
                    android:bottomLeftRadius="5dp"
                    android:bottomRightRadius="5dp"
                    android:topLeftRadius="5dp"
                    android:topRightRadius="5dp" />
            </shape>
        </scale>
    </item>
</layer-list>

圆形

bg_aim_circle

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" android:useLevel="true">
    <solid android:color="@color/color_ffb110"/>
    <size android:height="6dp"
          android:width="6dp"
        />
</shape>