Android组件篇--ProgressBar(二)改变滚动条样式

最新推荐文章于 2023-02-01 11:06:20 发布

qing_soft

最新推荐文章于 2023-02-01 11:06:20 发布

阅读量1.9k

点赞数

CC 4.0 BY-SA版权

分类专栏： android学习--基础篇文章标签： Android UI 图形

本文链接：https://blog.youkuaiyun.com/dcqboke/article/details/9707529

android学习--基础篇专栏收录该内容

7 篇文章

订阅专栏

本文介绍了如何在Android中改变滚动条样式，包括圆形和条形滚动条的定制。通过设置不同风格和图形资源文件，如progress_bg.xml和progress_circle_bg.xml，可以实现滚动条视觉效果的个性化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Android API提供的滚动条样式有时可能不满足我们的界面风格，这时就需要我们改变滚动条样式。

一般的滚动条分两种，圆形的和条形的。如下图

该图中绿色的样式是我自定义的样式，右边的圆形滚动条是系统默认滚动条。

圆形滚动条：

<ProgressBar
        android:id="@+id/progressBar2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/progressBar1"
        android:layout_alignLeft="@+id/textView1" 
        android:indeterminateDrawable="@drawable/progress_circle_bg"
        />

不需要设置style属性，默认为圆形，加上style属性的：

<ProgressBar
        android:id="@+id/progressBar1"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="26dp"
        android:layout_toLeftOf="@+id/button2" 
        />
<ProgressBar
        android:id="@+id/progressBar3"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="200dp"
        android:layout_height="6dp"
        android:layout_alignLeft="@+id/progressBar2"
        android:layout_below="@+id/progressBar2"
        android:layout_marginTop="18dp" 
        android:max="100"
        android:progress="30"
        android:progressDrawable="@drawable/progress_bg"
        />

上面两个是设置系统提供的样式分别为：大圆形以及水平条形滚动条。

水平条形滚动条样式的改变是通过下面定义的图形资源progress_bg.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="10dp"/>
            <gradient android:startColor="#6B747D" android:endColor="#6B747D"/>
        </shape>
    </item>
    <!-- 设置滚动条进度的颜色 -->
    <item android:id="@android:id/progress">
        <clip>
            <shape>
	            <corners android:radius="10dp"/>
	            <gradient android:startColor="#97C95E" android:endColor="#97C95E"/>
        	</shape>
        </clip>        
    </item>

</layer-list>

圆形旋转滚动条的样式改变时通过progress_circle_bg.xml：

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360" 	<!-- 定义旋转动画 -->
     >
	<!-- 定义要旋转的图形，此处为环形 -->
    <shape
        android:innerRadiusRatio="3"
        android:shape="ring"
        android:thicknessRatio="8"
        android:useLevel="false" >	
        <gradient
            android:centerColor="#FFFFFF"
            android:centerY="0.50"
            android:endColor="#97C95E"
            android:startColor="#97C95E"
            android:type="sweep"
            android:useLevel="false" />
    </shape>

</rotate>

通过以上方式改变滚动条样式，也可通过图片来替换。