摘要:地址中文自定义能改变尺寸颜色滑块图片刻度图片刻度文字和气泡指示器,当滑动时显示带有进度的指示器。给选择圆角方角默认两端是圆角,可以设置为方形。滑块下显示进度当的类型为时可以设置滑动后滑块下显示保留进度。
IndicatorSeekBar
README: 中文 | English
自定义SeekBar, 能改变尺寸、颜色、滑块(thumb)图片、刻度(tick)图片、刻度文字(text)和气泡指示器(indicator),当滑动时显示带有进度的指示器。
如果你喜欢IndicatorSeekBar, 去GitHub给个Star支持一下吧。
1.截图</>复制代码
dependencies {
compile "com.github.warkiz.widget:indicatorseekbar:1.1.2"
}
2. 在布局文件或java类中:
xml
</>复制代码
Java</>复制代码
</>复制代码
IndicatorSeekBar indicatorSeekBar = new IndicatorSeekBar.Builder(this)
.setMax(200)
.setMin(0)
.setProgress(35)
.setSeekBarType(IndicatorSeekBarType.DISCRETE_TICKS)
.setTickType(TickType.OVAL)
.setTickColor(Color.parseColor("#0000FF"))
.setTickSize(8)//dp size
.setTickNum(8)
.setBackgroundTrackSize(2)//dp size
.setBackgroundTrackColor(Color.parseColor("#666666"))
.setProgressTrackSize(3)//dp size
.setProgressTrackColor(Color.parseColor("#0000FF"))
.showIndicator(true)
.setIndicatorType(IndicatorType.SQUARE_CORNERS)
.setIndicatorColor(Color.parseColor("#0000FF"))
.build();
IndicatorSeekBar 提供了两种系列的类型:
连续(continuous)的滑动: CONTINUOUS/CONTINUOUS_TEXTS_ENDS.
非连续(discrete)的滑动: DISCRETE_TICKS/ DISCRETE_TICKS_TEXTS/ DISCRETE_TICKS_TEXTS_ENDS.
3.2 自定义 颜色、尺寸</>复制代码
SeekBar以下部分的颜色或尺寸可以被自定义:
背景条 track_background_bar
进度条 track_progress_bar
刻度 tick
刻度文字 text
滑块 thumb
指示器 indicator
指示器文字 indicator_text
3.3 隐藏刻度tickSeekBar的两个端点的刻度或者滑块左边的刻度可以被隐藏。
3.4 给SeekBar选择圆角/方角</>复制代码
默认两端是圆角,可以设置为方形。
3.5 滑块thumb下显示进度</>复制代码
当 seekabr 的类型为 CONTINUOUS or DISCRETE_TICKS时 , 可以设置滑动后滑块下显示保留进度。
3.6 自定义SeekBar两端的文字text</>复制代码
当 seekabr 的类型是 CONTINUOUS_TEXTS_ENDS 或 DISCRETE_TICKS_TEXTS_ENDS 时, 可以设置两端的文字.
3.7 自定义刻度下的文字text</>复制代码
当 seekabr 的类型是 DISCRETE_TICKS_TEXTS , 可以通过设置数组的方式自定义刻度下的文字, 数组的长度应当和刻度相等。
</>复制代码
</>复制代码
or
indicatorSeekBar.setTextArray(R.array.texts_below_tick_length_5);
3.8 自定义滑块thumb的图片
滑块可以使用图片去自定义:
3.9 自定义刻度tick的图片</>复制代码
刻度可以使用图片去自定义.
3.10 自定义指示器indicator</>复制代码
IndicatorSeekbar提供了3种指示器的类型: ROUNDED_CORNERS / SQUARE_CORNERS / CUSTOM,当指示器的类型为 CUSTOM 时, 可以自定义指示器的view.
</>复制代码
</>复制代码
or
indicatorSeekBar.setCustomIndicator(R.layout.indicator);
注意:如果自定义指示器需要显示进度, 那么指示器必须要有一个TextView,而且其id必须设置为isb_progress.
3.11 自定义指示器顶部的内容当 indicator 的类型为 ROUNDED_CORNERS 或者 SQUARE_CORNERS , 可以设置指示器顶部的view.
</>复制代码
</>复制代码
or
indicatorSeekBar.getIndicator().setIndicatorTopContentLayout(R.layout.top_content_view);
注意:如果自定义指示器顶部的view需要显示进度, 那么这个view必须要有一个TextView,而且其id必须设置为isb_progress.
4. 支持进度监听</>复制代码
indicatorSeekBar.setOnSeekChangeListener(new IndicatorSeekBar.OnSeekBarChangeListener() {
@Override
public void onProgressChanged(IndicatorSeekBar seekBar, int progress, float progressFloat, boolean fromUserTouch) {
}
@Override
public void onSectionChanged(IndicatorSeekBar seekBar, int thumbPosOnTick, String textBelowTick, boolean fromUserTouch) {
//only callback on discrete series SeekBar type.
}
@Override
public void onStartTrackingTouch(IndicatorSeekBar seekBar, int thumbPosOnTick) {
}
@Override
public void onStopTrackingTouch(IndicatorSeekBar seekBar) {
}
});
onSectionChanged: 当SeekBar的类型为非连续 discrete系列 时, 这个回调会获得滑块的位置和滑块下的文字. 当为连续 continuous系列则不回调。
5. 混淆配置</>复制代码
-keep class com.warkiz.widget.** { *; }
6. 属性
</>复制代码
//seekBar
//indicator
//track
//thumb
//tick
//texts
GitHub地址:https://github.com/warkiz/Ind...
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/68017.html
摘要:如果你想减少包大小,你可以这样引入事实上,每个组件都是支持单独安装的,我们也推荐你使用这种方式引入组件。以下是运行示例后各界面的截图组件图标右上角的圆形徽标数字。 1. 前言 一直以来都想做个组件库,一方面是对工作中常遇问题的总结,另一方面也确实能够提升工作效率(谁又不想造一个属于自己的轮子呢~),于是乎就有了本文的主角儿rn-components-kit。 市面上web的UI组件库如...
阅读 5255·2023-04-25 18:47
阅读 2774·2021-11-19 11:33
阅读 3519·2021-11-11 16:54
阅读 3170·2021-10-26 09:50
阅读 2656·2021-10-14 09:43
阅读 783·2021-09-03 10:47
阅读 752·2019-08-30 15:54
阅读 1582·2019-08-30 15:44