用layer-list实现弧形进度条
本文转载自:http://www.linuxidc.com/Linux/2013-04/82743.htm
之前我有写过如何用style或者是layer-list实现自定义的横向进度条(http://www.cnblogs.com/tianzhijiexian/p/3854105.html),最近看到网上有人写了个垂直的弧形进度条的实现方式,觉得思路很巧妙,值得学习和体会,便转载一下。
之前文章的主要代码如下:
方法一:
<?xml version="1.0" encoding="UTF-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 设置背景色图像资源 --> <item android:id="@android:id/background" android:drawable="@drawable/bar_bg" /> <!-- 设置进度条颜色图像资源 --> <item android:id="@android:id/progress" android:drawable="@drawable/bar_progress" /> </layer-list>
方法二:
<?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="6dp" /> <gradient android:startColor="#0000ff" android:endColor="#0000ff" /> </shape> </item> <!-- 设置进度条颜色(红色) --> <item android:id="@android:id/progress" > <clip> <shape> <corners android:radius="6dp" /> <gradient android:startColor="#ff0000" android:endColor="#ff0000" /> </shape> </clip> </item> </layer-list>
文章讲的是如何用一个图片来定义弧形进度条,其实就是把图片做个弧度,然后设置背景透明,最后修改进度条的方向为垂直的。下面是文章内容:
Android自带的progressbar组件基本可以满足常用的一些需求,最近一套新UI用到了弧形的进度条,如图
最初看到,自己是想自己实现,涉及到的问题就比较多,需要一些精确的计算画上去,整个屏幕的背景图是这样的:
不过在动手前,自己又百度了一些自定义进度条的文章看了一下。看了一篇受了很大的启发,这个弧形的效果完全可以用一个垂直的进度条来实现。使用这样一张图:
弧形与背景图的轨迹一样,然后整张图是长方形,不过背景是透明的,这样以后这样将android的progressbar竖直显示即可。
<ProgressBar android:id="@+id/disc_audio_progressbar" style="?android:attr/progressBarStyleHorizontal" android:progressDrawable="@drawable/audioseekbar_style" android:layout_width="49dip"
android:layout_height="281dip" android:max="100"
android:layout_x="486dp"
android:layout_y="142dp" android:progress="1"> </ProgressBar>
竖直显示了,下一步就是如何进度条沿竖直方向走呢?那就在audioseekbar_style中进行设置
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <!-- <item android:id="@android:id/secondaryProgress" android:drawable="@drawable/imgslider_second"> </item> --> <item android:id="@android:id/progress"> <clip android:clipOrientation="vertical" android:drawable="@drawable/imgslider" android:gravity="top"> </clip> </item> </layer-list>
代码中的clip节点一共有四个属性,其中clipOrientation就是用来设置progress走向的,这里设置成vertical,图片就是刚才那张彩色弧形的图即可。
分类:
ProgressBar
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试?测试工程师会被淘汰吗?