ProgressBar大家可能项目中都会用到,但是大部分都是根据UI给的符合项目主题的自定义形式的;
下面就是我们项目中一个显示学习进度的横向ProgressBar;
可以看到四个角都是圆角的,本人首先想到的是自定义,但是会发现四个角总是不能够实现,要不左侧会被切成直角,要不进度内侧会被切成直角,也是从网上查找分析,最终实现如下:
结合网上大神的示意,在此作个笔记,方便之后遇到直接拿来用,节省时间.
借鉴ProgressBar 进度条的进度两端是圆角的方法
但是根据自定义的shape 或者是 layer-list却总是很难做到，几乎都是被clip成了直角的样子如上；
为什么是直角的？原因就是被clip给切了，所以我们不能够用clip，而要使用scale这个标签。而上面链接给出的解答是定义一个.9的图片就能满足要求，由于我们这里是纯色的一个进度，所以没有必要通过再制作一个.9的图片，而只需要通过同样的方法引用我们定义的一个shape就可以了；
好了,先上图(自动忽略边框,实际是没有)
xml
<ProgressBarandroid:id="@+id/pb_lesson_progress"style="?android:attr/progressBarStyleHorizontal"android:layout_width="200dp"android:layout_height="20dp"android:max="100"android:progress="40"android:progressDrawable="@drawable/layer_list_lesson_progress_bar" />
/drawable/layer_list_lesson_progress_bar.xml
<?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="/apk/res/android"><item android:id="@android:id/background"><shape><corners android:radius="20dp"/><solid android:color="#FF45baef"/></shape></item><item android:id="@android:id/secondaryProgress"><scale android:scaleWidth="100%"><shape><corners android:radius="20dp"/><solid android:color="#FF11ce33"/></shape></scale></item><item android:id="@android:id/progress"><!--<clip><shape><corners android:topRightRadius="20dp"android:bottomRightRadius="20dp"/><solid android:color="#FF009898"/></shape></clip>--><scale android:scaleWidth="100%"android:drawable="@drawable/shape_lesson_progress_bar" /></item></layer-list>
drawable/shape_lesson_progress_bar
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="/apk/res/android"android:shape="rectangle"><!-- solid指定形状的填充色，只有android:color一个属性 --><solid android:color="#ffb644" /><!-- padding设置内容区域离边界的间距 --><!-- corners设置圆角，只适用于rectangle --><corners android:radius="20dp"/></shape>
