Android SeekBar控件

1. SeekBar类

SeekBar类是滑动条，用于进度控制。主要属性

• max，指定滑动条的最大值
• progress，指定滑动条的当前值

通过setOnSeekBarChangeListener(OnSeekBarChangeListener)的回调方法实现SeekBar的拖动事件

• onProgressChanged，进度发生改变时会触发
• onStartTrackingTouch，按住SeekBar时会触发
• onStopTrackingTouch，放开SeekBar时触发

效果如下

2. 定制滑片

android:thumb用来指定滑片。

• 滑片使用shape来定义。

  <SeekBar
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:maxHeight="2dp"
      android:max="100"
      android:progress="30"
      android:thumb="@drawable/seek_bar_thumb"/>
  

  seek_bar_thumb.xml文件

  <selector xmlns:android="http://schemas.android.com/apk/res/android">
      <item android:state_selected="true">
          <shape android:shape="oval">
              <size android:height="10dp" android:width="10dp" />
              <solid android:color="#fff54b19" />
          </shape>
      </item>
      <item android:state_pressed="true">
          <shape android:shape="oval">
              <size android:height="10dp" android:width="10dp" />
              <solid android:color="#fff54b19" />
          </shape>
      </item>
      <item>
          <shape android:shape="oval">
              <size android:height="10dp" android:width="10dp" />
              <solid android:color="#fff1922d" />
          </shape>
      </item>
  </selector>
  

  效果如下
  
• 滑片使用图片来定义

  <SeekBar
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:maxHeight="2dp"
      android:max="100"
      android:progress="30"
      android:thumb="@drawable/star"/>
  

  效果如下
  

3. 定制背景

progressDrawable引用背景，maxHeight限制进度条高度。

<SeekBar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:maxHeight="2dp"
    android:max="100"
    android:progress="30"
    android:thumb="@drawable/seek_bar_thumb"
    android:progressDrawable="@drawable/seek_bar_bg"/>

seek_bar_bg.xml文件

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background" >
        <shape>
            <solid android:color="#ffffffff" />
        </shape>
    </item>
    <item android:id="@android:id/progress" >
        <clip>
            <shape>
                <solid android:color="#ffff8c00" />
            </shape>
        </clip>
    </item>
</layer-list>

效果如下

相关文章
Android ProgressBar控件
Android SeekBar控件
Android RatingBar控件