Android自定义SeekBar的样式

原创 2016年08月28日 16:26:21

SeekBar就是拖动条,是继承自ProgressBar的。SeekBar与ProgressBar一样都是用来显示进度的,不同的SeekBar有一个可拖动的滑块,可以用来改变进度。所以SeekBar主要使用来实现对数值进行调节,如调节音量,亮度等。
但是Android系统的SeekBar的样式基本上是不能满足我们的需求,所以自定义SeekBar的样式就是必然的了。
SeekBar自定义样式与ProgressBar自定义样式一样,都是通过自定义一个drawable资源文件作为progressDrawable属性值来实现。
自定义SeekBard的样式:

1.在res/drawable中定义一个资源文件 seekbar.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"
        android:drawable="@color/progress_bg"></item>
    <item android:id="@android:id/secondaryProgress">
        <scale
            android:drawable="@color/second_progress"
            android:scaleWidth="100%">
        </scale>
    </item>
    <item android:id="@android:id/progress">
        <scale
            android:drawable="@color/progress"
            android:scaleWidth="100%"></scale>
    </item>
</layer-list>

第一个item定义的是进度条的背景,第二个item定义的是secondaryProgress的颜色,第三个item定义的是进度progress的颜色
定义progressDrawable的时候,必须要按照这个顺序(如果没有secondaryProgress可以去掉)来定义,并且secondaryProgress
和progress定义drawable时都必须用< scale/>子项,否则进度条会一直显示满的状态。

2.这里滑块我们也是用自定义的,在res/drawable中定义一个资源文件
mythumb.xml

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

定义了一个圆点作为thumb

3.在布局文件中使用SeekBar,并使用自定义的样式

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="maqing.seekbardemo.MainActivity">
    <SeekBar
        android:id="@+id/seekBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:maxHeight="5dp"
        android:minHeight="5dp"
        android:progressDrawable="@drawable/seekbar"
        android:thumb="@drawable/mythumb" />
</RelativeLayout>

使用SeekBar的时候要注意,这里设置了android:minHeight和android:maxHeight属性,用这两个属性来设置进度条的高度,
而android:layout_height设为wrap_content,不要把android:layout_height设置为具体的值,否则thumb会不在SeekBar的中间。

这样就完成了一个自定义样式的SeekBar,效果如下:

点击下载源码

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

Android通知栏版本兼容解决方案

原文:http://blog.csdn.net/u012124438/article/details/53054994 Android通知栏是我们在APP中几乎必须使用到的,自定义通知栏给我...
  • hudashi
  • hudashi
  • 2017年03月09日 19:58
  • 1564

【SeekBar】Android 自定义漂亮的SeekBar样式

Android 自定义样式的SeekBar控件(水平样式和垂直样式) 第一个Seekbar 背景是颜色,thumb是图片,上代码: [html] view plaincopy...

[Android初级]自定义SeekBar样式(简单说明)

关于Android的组件SeekBar的使用,其实各个网上的用法也都一样,这里也是差不多的用法,但你看到我的博文,自然也要说清楚怎么个用法啦,接下来,看代码。 一 . 如上图。我们先创建布局,添加...

android SeekBar的自定义样式设置

android自带的seekbar样式不是很好看,我们在项目开发中,经常需要对其进行美化或者重写。 我在项目需要改成如下这个样式: 其实这个改动还是比较简单的 xml文件如下: ...

Android:自定义SeekBar样式

转自:http://mawenhao19930620.blog.163.com/blog/static/1285753612011112131423826/  感谢原作者的分享 先上效果图 ...

Android 自定义SeekBar样式

Android系统自带的SeekBar的样式比较单一,而且不同品牌手机被定制了之后样式也不一样,为了SeekBar的样式和应用的风格统一,就需要自定义SeekBar的样式,先看效果图: ...
  • jdsjlzx
  • jdsjlzx
  • 2014年05月19日 10:11
  • 14990

自定义漂亮的Android SeekBar样式

系统自带的SeekBar真是太难看了,项目需要,只能自定义了,先来张效果图 第一个Seekbar 背景是颜色,thumb是图片,上代码: [html...
  • vrix
  • vrix
  • 2015年04月25日 09:20
  • 1156

android 进度条seekbar样式自定义

SeekBar是ProgressBar的扩展,在其基础上增加了一个可拖动的thumb(注:就是那个可拖动的图标)。用户可以触摸thumb并向左或向右拖动,再或者可以使用方向键都可以设置当前的进度等级。...
  • Jimmy5z
  • Jimmy5z
  • 2012年07月16日 01:11
  • 2900

自定义漂亮的Android SeekBar(拖动条)样式

系统自带的SeekBar真是太难看了,项目需要,只能自定义了,先来张效果图 第一个Seekbar 背景是颜色,thumb是图片,上代码: [html...

Android笔记之SeekBar自定义样式与监听

android中,在播放音乐或视频时,有一条进度条在显示,使用的就是SeekBar控件,我们先来看看效果: 第一个是原生的,第2,3个是自定义样式,很显然,原生的并不能实现很好看的效果,那么下面...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android自定义SeekBar的样式
举报原因:
原因补充:

(最多只允许输入30个字)