SeekBar ( 拖动条 ) 控件一般用于音乐播放器或者视频播放器的音量控制或者播放进度控制

SeekBar 是 ProgressBar 的子类，所以 ProgressBar的属性都可以用

SeekBar 属性

SeekBar 有以下几个简单的属性

SeekBar 事件

SeekBar 内置了 SeekBar.OnSeekBarChangeListener 事件

该事件会触发三个方法

范例：基本的 SeekBar

1. 创建一个 空的 Android 项目 cn.twle.android.SeekBar

2. 修改 activity_main.xml 文件添加一个 SeekBar

   <?xml version="1.0" encoding="utf-8" ?>
   <LinearLayout 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"
       android:padding="8dp" 
       android:orientation="horizontal" >
   
       <SeekBar
           android:layout_width="wrap_content"
           android:layout_height="wrap_content" 
           android:max="100" 
           android:progress="60" />
   </LinearLayout>
   

运行结果如下

范例：获取 SeekBar 当前值

要获取 SeekBar 的当前值需要给它添加一个 SeekBar.OnSeekBarChangeListener 事件，然后重写 onProgressChanged() 方法

1. 复用上面的 demo

2. 修改 activity_main.xml 文件添加一个 ProgressBar

   <?xml version="1.0" encoding="utf-8" ?>
   <LinearLayout 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"
       android:padding="8dp" 
       android:orientation="vertical" >
   
       <SeekBar
           android:id="@+id/volume"
           android:layout_width="match_parent"
           android:layout_height="wrap_content" 
           android:max="100" 
           android:progress="60" />
   
       <TextView 
           android:id="@+id/volume_hint" 
           android:layout_width="match_parent" 
           android:layout_height="wrap_content" 
           android:text="当前音量: 60/100" />
   </LinearLayout>
   

3. 修改 MainActivity.java 给 SeekBar 添加一个 SeekBar.OnSeekBarChangeListener

   package cn.twle.android.seekbar;
   
   import android.content.Context;
   import android.support.v7.app.AppCompatActivity;
   import android.os.Bundle;
   
   import android.widget.SeekBar;
   import android.widget.TextView;
   import android.widget.Toast;
   
   public class MainActivity extends AppCompatActivity {
   
       private SeekBar  volume;
       private TextView volume_hint;
       private Context mContext;
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_main);
           mContext = MainActivity.this;
           bindViews();
       }
   
       private void bindViews() {
           volume = (SeekBar) findViewById(R.id.volume);
           volume_hint = (TextView) findViewById(R.id.volume_hint);
           volume.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
               @Override
               public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                   volume_hint.setText("当前音量:" + progress + "  / 100 ");
               }
   
               @Override
               public void onStartTrackingTouch(SeekBar seekBar) {
                   Toast.makeText(mContext, "触碰 SeekBar", Toast.LENGTH_SHORT).show();
               }
   
               @Override
               public void onStopTrackingTouch(SeekBar seekBar) {
                   Toast.makeText(mContext, "放开 SeekBar", Toast.LENGTH_SHORT).show();
               }
           });
       }
   }
   

定制 SeekBar

SeekBar 很简单，就一个轨道和一个拖动条，SeekBar 提供了两个属性让我们可以定制它

1. 复用上面的 demo

2. 下载 /static/i/android/seekbar_thumb.zip 并解压到 res/drawable 目录

3. 在 res/drawable 目录下新建一个文件 sb_thumb.xml 创建滑块状态的 Drawable

   <?xml version="1.0" encoding="utf-8"?>
   <selector xmlns:android="http://schemas.android.com/apk/res/android">
       <item android:state_pressed="true" android:drawable="@drawable/seekbar_thumb_pressed"/>
       <item android:state_pressed="false" android:drawable="@drawable/seekbar_thumb_normal"/>
   </selector>
   

4. 创建一个 layer-list 的 drawable 资源 sb_bar.xml 用于 SeekBar 的轨道

   <?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>
               <solid android:color="#FFFFD042" />
           </shape>
       </item>
       <item android:id="@android:id/secondaryProgress">
           <clip>
               <shape>
                   <solid android:color="#FFFFFFFF" />
               </shape>
           </clip>
       </item>
       <item android:id="@android:id/progress">
           <clip>
               <shape>
                   <solid android:color="#FF96E85D" />
               </shape>
           </clip>
       </item>
   </layer-list>
   

5. 修改 activity_main.xml 引入 SeekBar ，设置 progressDrawable 与 thumb

   <?xml version="1.0" encoding="utf-8" ?>
   <LinearLayout 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"
       android:padding="8dp" 
       android:orientation="vertical" >
   
       <SeekBar
               android:id="@+id/volume"
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:maxHeight="5.0dp"
               android:minHeight="5.0dp"
               android:progress="60"
               android:max="100" 
               android:progressDrawable="@drawable/sb_bar"
               android:thumb="@drawable/sb_thumb"/>
   
       <TextView 
           android:id="@+id/volume_hint" 
           android:layout_width="match_parent" 
           android:layout_height="wrap_content" 
           android:text="当前音量: 60/100" />
   
   </LinearLayout>
   

参考文档

官方文档： SeekBar