通过自定义.xml文件实现各种效果的SeekBar

最近项目中用到了SeekBar，大家都知道系统给的“SeekBar”只能用一个“丑”字来形容，为了达到项目经理的各种需求，实现各种颜色各种样式的SeekBar我们只能自定义。今天我就通过在Drawable文件夹下定义各种.xml文件来实现好看的SeekBar。废话少说，直接上图

目前我的API版本是24，第一个SeekBar是我自定义的（其实也很丑，为了给大家演示），第二个SeekBar使系统默认的，对比可以看出我改变了进度条的背景颜色（黑色），进度颜色（绿色），小圆球大小和颜色（粉色，这里就先叫他小圆球），围绕着这个控件衍生出很多安卓xml属性中的知识点，今天就一律做个了结。
首先先来看我的layout布局中的代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <SeekBar
        android:id="@+id/mySeekBar"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:thumb="@drawable/point"
        android:progress="30"
        android:progressDrawable="@drawable/seekbar_color"
        />
    <SeekBar
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:progress="30"
        />

</LinearLayout>

在我自定义的SeekBar中有两条语句android:thumb=”@drawable/point”和android:progressDrawable=”@drawable/seekbar_color”
这两条语句分别对应着小圆球和进度条的颜色，小圆球的很好理解，可是对于进度条的颜色有人可能会问进度条中有两种颜色：进度条背景色和进度的颜色，可是我的代码中为什么只有progressDrawable一个属性？下边我就对我的drawable文件下的seekbar_color.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 android:shape="line">
            <stroke
                android:width="3dp"
                android:color="#000000" />
        </shape>
    </item>

    <item
        android:id="@android:id/progress
        >
        <clip>
            <shape android:shape="line">
                <stroke
                    android:width="3dp"
                    android:color="#f1f1" />
            </shape>
        </clip>
    </item>
</layer-list>

上边的代码就是我所说的seekbar_color.xml文件中的所有内容了，下边我对文件中的各个标签属性进行详解：
1.首先是最外层的layer-list：layer的中文意思是“层次”，list的中文意思是集合，也就是说这个标签就的意思就是一个个效果的叠加，它的内部只有item一个子标签，每一个子标签代表一个效果。打个比方我有三张照片，每一张照片就是一个item，将三张照片叠加放在桌子上也就是我们看到的效果了。在layer-list标签下有两个item子标签，这两个item分别对应着SeekBar中的进度条背景颜色（黑色）和进度的颜色（绿色），第一个item的的id为@android:id/background，此处必须强调的是这个id必须只能是这个id，这是系统已经定义好的，他对应着SeekBar中的进度条背景颜色，第二个item的id为@android:id/progress，这个id也必须只能是这个，他也是系统定义好的，对应SeekBar的进度颜色（图中的绿色）。
2. 然后再说一下shape标签，关于安卓中shape属性的介绍网上是在太多了，在这里我只强调一下我在实际应用中遇到的问题，当我们想在xml文件中用shape属性画一条线时，也就是SeekBar中的进度条，这里有很多需要注意的细节：

网上关于画线各种各样的说法都有，在这里我用我的四级英语把他简单的总结一下：

1. 首先我们需要在属性中指定形状为line
2. 画线的时候我们只需要操作stroke属性就ok了，因为stroke属性就是描边的意思正好对应线，在stroke属性中width对应着线段的宽度，color对应线段的颜色
3. 我们所画的线段在控件中的显示效果是横向填充满整个控件，纵向的高度就是对应的stroke的高度，而且线段在控件中的布局默认是垂直居中的。

3.再说一下clip属性，clip是剪切的意思，此处需要特别注意的是，进度颜色（绿色）也就是第二个item中必须要加上clip元素，否则，在动态java代码中设置背景导致进度条不走的现象（实际上，进度在走，但进度条背景被拉到最大长度，没有逐步显示），因为进度的颜色是随着进度的大小而改变的，所以必须要加上该属性才能实现效果。

最后就是SeekBar中小圆球的实现了，这个非常简单，直接在drawable文件下创建一个point.xml文件，具体内容如下：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#e4e" />
    <size
        android:width="20dp"
        android:height="20dp" />

</shape>

非常简单 只是画了一个椭圆，然后高度和宽度固定好就变成了圆。到这一步，所有的SeekBar就完成了，我做的demo很丑，但是具体的做法就是上边这些了，大家可以根据自己的实际需要自己设计颜色和尺寸。好了今天就到这里了，算是对drawable文件下的xml文件做一个总结，其实drawable文件还有很多用法，过一段时间我会在详细总结一下，有不对的地方欢迎指正，大家共同学习！！