Android之SeekBar

一、简介

SeekBar意思为拖动条,是ProgressBar的一个子类。

在咱们安卓的开发中也是利用十分的宽泛。如音乐播放、音量条、播放进度条,等等。Android零碎只提供了程度的,默认的款式,咱们也能够依据本人需要自定义款式。

二、罕用属性和办法

seekBar继承了ProgressBar,ProgressBar所反对的xml属性和办法都实用于seekBar,ProgressBar的应用能够看这篇博客Android之 ProgressBar的简略应用

这里介绍下最罕用属性和办法:

属性名含意
max设置该进度条的最大值
progress设置该进度条的已实现进度值
progressDrawable自定义drawable显示
secondaryProgress定义二级进度值,值介于0到max。该进度在主进度和背景之间。比方用于网络播放视频时,二级进度用于示意缓冲进度,主进度用于示意播放进度。
thumb设置进度条的滑块图片
splitTrack滑块底部 背景款式 (false为通明 )
getMax() //返回这个进度条的范畴的下限getProgress():返回进度getsecondaryProgress() //返回二级进度incrementProgressBy(int diff) //指定减少的进度isIndeterminate() //批示进度条是否在不确定模式下setIndeterminate(boolean indeterminate) //设置不确定模式下

三、简略应用

实现一个简略seekbar监听事件,扭转图片的透明度

  1. 编写布局代码

因为图片的透明度分为256阶(0-255),所以咱们的max属性要设置为255,初始值progress属性也设置为255,使照片不通明可见。

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".MainActivity"    android:orientation="vertical">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="拖动条"        android:layout_gravity="center"        android:layout_marginTop="50dp"/>    <ImageView        android:id="@+id/iv_zhuyin"        android:layout_width="match_parent"        android:layout_height="250dp"        android:src="@drawable/zhuyin"/>        <SeekBar            android:id="@+id/seek_bar"            android:layout_marginLeft="15dp"            android:layout_marginRight="15dp"            android:splitTrack="false"            android:max="255"            android:progress="255"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:thumb="@drawable/seekbar01"/>        <TextView            android:id="@+id/tv_progress"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginTop="10dp"            android:layout_gravity="center"            android:text="以后透明度:255/255"/></LinearLayout>
  1. 编写MainActivity里的java代码

次要是实现一个seek的监听事件,OnSeekBarChangeListener() 能够为拖动条增加监听事件,该监听事件重写三个办法。

办法作用
onStartTrackingTouch当开始滑动滑块时,会执行该办法下的代码
onStopTrackingTouch当完结滑动滑块时,会执行该办法下的代码
onProgressChanged当滑块进度扭转时,会执行该办法下的代码
public class MainActivity extends AppCompatActivity {    private SeekBar mSeekBar;    private TextView mTextView;    private ImageView mImageView;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mSeekBar=findViewById(R.id.seek_bar);        mTextView=findViewById(R.id.tv_progress);        mImageView=findViewById(R.id.iv_zhuyin);        mSeekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {            @Override  //当滑块进度扭转时,会执行该办法下的代码            public void onProgressChanged(SeekBar seekBar, int i, boolean b) {                mImageView.setAlpha(i);//设置以后的透明度                mTextView.setText("以后透明度: " +i+"/255");            }            @Override  //当开始滑动滑块时,会执行该办法下的代码            public void onStartTrackingTouch(SeekBar seekBar) {                Toast.makeText(MainActivity.this,"我seekbar开始滑动了",Toast.LENGTH_SHORT).show();            }            @Override   //当完结滑动滑块时,会执行该办法下的代码            public void onStopTrackingTouch(SeekBar seekBar) {                Toast.makeText(MainActivity.this,"我seekbar完结滑动了",Toast.LENGTH_SHORT).show();            }        });    }}

最初实现成果:

四、自定义SeekBar

有时候零碎的款式不难看,不足以满足开发好看需要,这个时候就须要自定义款式,应用xml资源文件进行款式的编辑。最初在布局文件中通过属性progressDrawable援用。
如果要实现非常复杂的款式就须要应用到View的自定义了,能够本人去理解学习下,自定义View能够实现简直所有你想的到的款式。

上面放几个我感觉还挺难看的。

上图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>            <corners android:radius="60dp" />            <gradient                android:angle="0"                android:centerColor="#F39801"                android:centerY="0.20"                android:endColor="#F39801"                android:startColor="#F39801" />        </shape>    </item></layer-list>

上图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>            <solid android:color="#22DDDD" />        </shape>    </item>    <item android:id="@android:id/secondaryProgress">        <clip>            <shape>                <solid android:color="#3CC4C4" />            </shape>        </clip>    </item>    <item android:id="@android:id/progress">        <clip>            <shape>                <solid android:color="#70CC33" />            </shape>        </clip>    </item></layer-list>

上图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>            <corners android:radius="5dp"/>        </shape>        <!--    背景色彩-->        <color android:color="#CCCCCC"/>    </item>    <item android:id="@android:id/progress">        <clip            android:clipOrientation="horizontal"            android:gravity="left">            <shape>                <corners android:radius="5dp"/>                <!--  开始色彩,中途色彩,最初色彩-->                <gradient                    android:startColor="#00FF00"                    android:centerColor="#FFFF00"                    android:endColor="#FF0000"/>            </shape>        </clip>    </item></layer-list>


通过thumb援用图片就能够自定义本人喜爱的图标了。

这里举荐一个很好用的矢量图标网站。iconfont-阿里巴巴矢量图标


明天的分享就到此为止了吧,加油。海绵宝宝!