Seekbar drag strip [Android] Android controls of use

Disclaimer: This article is a blogger original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.

This link: https://blog.csdn.net/qq_38950819/article/details/81938193

A, Seekbar common attributes:

android: max maximum // slider

Android: Progress // current value of the slider

Android: secondaryProgress // progress of two sliders

Android: Thumb drawable // slider

Android: progressDrawable // slider of drawable

Android: splitTrack // whether to set a gap, so that the slider and the bottom of the picture are separated

Two, Seekbar events: setOnSeekBarChangeListener

seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {

    //进度条发生改变时会触发
    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean b) {
        Toast.makeText(SeekBarActivity.this, "当前进度条是" + progress + "/100", Toast.LENGTH_SHORT).show();
    }

    //按住seekbar时会触发
    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {
        Toast.makeText(SeekBarActivity.this, "按住seekbar时会触发", Toast.LENGTH_SHORT).show();
    }

    //放开seekbar时会触发
    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
        Toast.makeText(SeekBarActivity.this, "放开seekbar时会触发", Toast.LENGTH_SHORT).show();
    }
});

Three, Seekbar small Example

( 1 ) the SeekBar default style

<SeekBar
    android:id="@+id/seekbar_nomal"
    android:layout_width="160dp"
    android:layout_height="50dp" />

( 2 ) the SeekBar default style + Delete the left and right padding distance

<SeekBar
    android:id="@+id/seekbar_nomal"
    android:layout_width="160dp"
    android:layout_height="50dp"
    android:paddingStart="0dp"
    android:paddingLeft="0dp"
    android:paddingRight="0dp"/>

( . 3 ) the SeekBar default style + set the maximum schedule 100 , the progress is 20 , the second schedule 50

<SeekBar
    android:id="@+id/seekbar_nomal"
    android:layout_width="160dp"
    android:layout_height="50dp"
    android:max="100"
    android:progress="20"
    android:secondaryProgress="50" />

( . 4 ) the SeekBar default style + setting thumb BACKGROUND

thumb background image: ic_seekbar_thumb.xml

<SeekBar
    android:id="@+id/seekbar_nomal"
    android:layout_width="160dp"
    android:layout_height="50dp"
    android:max="100"
    android:progress="20"
    android:secondaryProgress="50"
    android:thumb="@drawable/ic_seekbar_thumb"/>

（5）SeekBar自定义样式 +设置thumb滑块背景选择器 sb_thumb_selector.xml

滑块背景选择器：sb_thumb_selector.xml

<SeekBar
    android:id="@+id/seekbar_nomal"
    android:layout_width="160dp"
    android:layout_height="50dp"
    android:max="100"
    android:progress="20"
    android:secondaryProgress="50"
    android:thumb="@drawable/sb_thumb_selector"/>

（6）SeekBar自定义样式+设置progress进度背景选择器 sb_progress_bg.xml

layer-list图层：

<SeekBar
    android:id="@+id/seekbar_simple_define"
    android:layout_width="160dp"
    android:layout_height="wrap_content"
    android:max="100"
    android:progress="50"
    android:secondaryProgress="80"
    android:thumb="@drawable/sb_thumb_selector"
    android:progressDrawable="@drawable/sb_progress_bg"/>

添加android:splitTrack=”false”属性，不让滑块与底部图片分割，效果如图：

<SeekBar
    android:id="@+id/seekbar_simple_define"
    android:layout_width="160dp"
    android:layout_height="wrap_content"
    android:max="100"
    android:progress="50"
    android:secondaryProgress="80"
    android:thumb="@drawable/sb_thumb_selector"
    android:progressDrawable="@drawable/sb_progress_bg"
    android:thumbTintMode="multiply"
    android:splitTrack="false"/>

（6）SeekBar自定义样式（类似遥控）

设置thumb滑块背景 seekbar_thumb.xml

设置progress进度背景 seekbar_bg.xml

效果如图：（感觉滑块有点怪）

<SeekBar
    android:id="@+id/seekbar"
    android:layout_width="160dp"
    android:layout_height="50dp"
    android:thumb="@drawable/seekbar_thumb"
    android:progressDrawable="@drawable/seekbar_bg"
    android:thumbOffset="0dp"
    android:max="100"
    android:progress="50"
    android:paddingStart="0dp"
    android:paddingEnd="0dp"
    android:maxHeight="50dp"/>

添加android:splitTrack=”false”属性，不让滑块与底部图片分割，看上起就不怪了，效果如图：

<SeekBar
    android:id="@+id/seekbar"
    android:layout_width="160dp"
    android:layout_height="50dp"
    android:thumb="@drawable/seekbar_thumb"
    android:progressDrawable="@drawable/seekbar_bg"
    android:thumbOffset="0dp"
    android:max="100"
    android:progress="50"
    android:paddingStart="0dp"
    android:paddingEnd="0dp"
    android:maxHeight="50dp"

小案例中还用到了这个属性，这个属性是干什么用的呢？

android:thumbTintMode="multiply"

添加android:thumbTintMode="multiply"属性，混合模式，用于滑块着色。

关于这个属性的开发文档在下面连接里：

http://www.zhdoc.net/android/reference/android/widget/AbsSeekBar.html#attr_android:thumbTintMode

Seekbar drag strip [Android] Android controls of use

Guess you like