android 控件教程之SeekBar进度条

怼烎@ 2023-10-16 20:43 36阅读 0赞

SeekBar 简介：

**[SeekBar][]**是进度条。我们使用进度条时，可以使用系统默认的进度条；也可以自定义进度条的图片和滑块图片等。

SeekBar 示列

创建一个activity，包含1个SeekBar。

SeekBar是自定义SeekBar，使用自定义的背景图和滑块图片。

界面代码：

package com.dsn.activity;
    
    import com.application.dnsclient.R;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.widget.SeekBar;
    import android.widget.SeekBar.OnSeekBarChangeListener;
    import android.widget.Toast;
    
    public class MainActivity extends Activity implements OnSeekBarChangeListener {
    	// 自定义SeekBar
        private SeekBar SeekBarSelf;
    	@Override
    	public void onCreate(Bundle savedInstanceState) {
    		// TODO Auto-generated method stub
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.mainactivity);
    		
    		SeekBarSelf=(SeekBar) findViewById(R.id.seekbar);
    		SeekBarSelf.setOnSeekBarChangeListener(this);
    	}
    
    	@Override
    	public void onProgressChanged(SeekBar seekBar, int progress,
    			boolean fromUser) {
    		// TODO Auto-generated method stub
    		switch (SeekBarSelf.getId()) {
    		case R.id.seekbar:
    			//提示进度条的值
    			Toast.makeText(MainActivity.this, "SeekBar 值为："+SeekBarSelf.getProgress(), Toast.LENGTH_LONG).show();
    			break;
    
    		default:
    			break;
    		}
    		
    	}
    
    	@Override
    	public void onStartTrackingTouch(SeekBar seekBar) {
    		// TODO Auto-generated method stub
    		
    	}
    
    	@Override
    	public void onStopTrackingTouch(SeekBar seekBar) {
    		// TODO Auto-generated method stub
    		
    	}
    	
    	
    
    }

代码说明：  
要监听SeekBar的滑动消息，通过实现“SeekBar.OnSeekBarChangeListener”接口。这个接口中包含3个方法onStartTrackingTouch()、onStopTrackingTouch()和onProgressChanged()。

布局文件说明：

自定义SeekBar的背景定义为：android:progressDrawable="@drawable/bg\_bar"。  
它调用的bg\_bar.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="@drawable/bar_dn" />
        
        <item android:id="@+android:id/SecondaryProgress" android:drawable="@drawable/bar_dn" />
        
        <item android:id="@+android:id/progress" android:drawable="@drawable/bar_up" />
    </layer-list>

bar\_dn.png如下图：

![Center][]

bar\_up.png如下图：

![Center 1][]

自定义SeekBar的滑块定义为：android:thumb="@drawable/thumb\_bar"。  
它调用的thumb\_bar.xml的内容如下：

<?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/thumb_dn" />
    
        
        <item android:state_focused="true"
            android:drawable="@drawable/thumb_up" />
        
        
        <item android:drawable="@drawable/thumb_up" />  
        
    </selector>

thumb\_up.png如下图:

![Center 2][]

thumb\_dn.png如下图：  
![Center 3][]

页面效果截图：

![Center 4][]

[SeekBar]: http://developer.android.com/reference/android/widget/SeekBar.html
[Center]: https://img-blog.csdn.net/20141203170644803?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvemhvdXpoaXdlbmdhbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: https://img-blog.csdn.net/20141203170651792?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvemhvdXpoaXdlbmdhbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 2]: https://img-blog.csdn.net/20141203170835125?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvemhvdXpoaXdlbmdhbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 3]: https://img-blog.csdn.net/20141203170841500?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvemhvdXpoaXdlbmdhbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 4]: https://img-blog.csdn.net/20141203170958774?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvemhvdXpoaXdlbmdhbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center