预览
1.在项目根目录下的build.gradle文件中,
allprojects {
repositories {
maven {
url 'https://s01.oss.sonatype.org/content/repositories/release/'
}
}
}
2.在entry模块的build.gradle文件中,
dependencies {
implementation 'com.gitee.chinasoft_ohos:IndicatorSeekbar:1.0.0'
}
在sdk6,DevEco Studio2.2 beta1下项目可直接运行 如无法运行,删除项目.gradle,.idea,build,gradle,build.gradle文件, 并依据自己的版本创建新项目,将新项目的对应文件复制到根目录下
xml
<com.warkiz.widget.IndicatorSeekBar
ohos:height="match_content"
ohos:width="match_parent"
app:isb_max="100"
app:isb_min="-1.0"
app:isb_progress="25"
app:isb_seek_smoothly="true"
app:isb_ticks_count="5"
app:isb_show_tick_marks_type="1"
app:isb_tick_marks_size="13vp"
app:isb_tick_marks_drawable="$media:ic_launcher"
app:isb_show_tick_texts="true"
app:isb_tick_texts_size="15fp"
app:isb_tick_texts_color="$color:color_blue"
app:isb_thumb_color="$color:color_green"
app:isb_thumb_size="20vp"
app:isb_show_indicator="2"
app:isb_indicator_color="$color:color_gray"
app:isb_indicator_text_color="$color:colorAccent"
app:isb_indicator_text_size="18fp"
app:isb_track_background_color="$color:color_gray"
app:isb_track_background_size="2vp"
app:isb_track_progress_color="$color:color_blue"
app:isb_track_progress_size="4vp" />
Java
IndicatorSeekBar seekbar = IndicatorSeekBar
.with(getContext())
.max(110)
.min(10)
.progress(53)
.tickCount(7)
.showTickMarksType(TickMarkType.OVAL)
.tickMarksColor(getColor(ResourceTable.Color_color_blue))
.tickMarksSize(13)//vp
.showTickTexts(true)
.tickTextsColor(getColor(ResourceTable.Color_color_pink))
.tickTextsSize(13)//fp
.tickTextsTypeFace(Font.MONOSPACE)
.showIndicatorType(IndicatorType.ROUNDED_RECTANGLE)
.indicatorColor(getColor(ResourceTable.Color_color_blue))
.indicatorTextColor(new Color(Color.getIntColor("#ffffff")))
.indicatorTextSize(13)//fp
.thumbColor(getColor(ResourceTable.Color_colorAccent))
.thumbSize(14)
.trackProgressColor(new Color(mContext.getColor(ResourceTable.Color_colorAccent)))
.trackProgressSize(4)
.trackBackgroundColor(new Color(mContext.getColor(ResourceTable.Color_color_gray)))
.trackBackgroundSize(2)
.build();
指示器总是停留 将IndicatorSeekBar放进IndicatorStayLayout后可以使Indicator总是停留,在此之前,请确保你使用属性去显示indicator.
Xml
<com.warkiz.widget.IndicatorStayLayout
ohos:height="match_content"
ohos:width="match_parent">
<!--your layout-->
<com.warkiz.widget.IndicatorSeekBar
ohos:height="match_content"
ohos:width="match_parent"
app:isb_show_indicator="rectangle" <!--显示指示器属性不能为none-->
....../>
<!--your layout-->
</com.warkiz.widget.IndicatorStayLayout>
Java
IndicatorSeekBar seekbar = IndicatorSeekBar
.with(getContext())
.max(50)
.min(10)
.showIndicatorType(IndicatorType.RECTANGLE) //显示指示器属性不能为none
...
.build();
new IndicatorStayLayout(getContext()).attachTo(seekbar);
自定义指示器文字
向IndicatorSeekBar设置一个带有占位符的格式字符串,${PROGRESS}
或者 ${TICK_TEXT}
,指示器的文字就会改变.
例如:
如果你想显示带百分号后缀的指示器进度文字: %
,代码如下:
seekbar.setIndicatorTextFormat("${PROGRESS} %")
如果你想显示带前缀 I am
的指示器tick text文字 ,代码如下:
seekbar.setIndicatorTextFormat("I am ${TICK_TEXT}")
自定义每一节的track块颜色 seekbar上每一块track的颜色都能被设置:
seekBar.customSectionTrackColor(new ColorCollector() {
@Override
public boolean collectSectionTrackColor(int[] colorIntArr) {
//the length of colorIntArray equals section count
colorIntArr[0] = getColor(ResourceTable.Color_color_blue);
colorIntArr[1] = getColor(ResourceTable.Color_color_gray);
colorIntArr[2] = Color.getIntColor("#FF4081");
...
return true; //True if apply color , otherwise no change
}
});
支持Selector类型的图片或颜色
你可以为滑块和tick标记设置StateElement, 而且,tick下面的文字也支持StateElement,使用的格式如下:
滑块图片 state-container:
<?xml version="1.0" encoding="utf-8"?>
<state-container xmlns:ohos="http://schemas.huawei.com/res/ohos">
<!--this drawable is for thumb when pressing-->
<item ohos:element="$media:ic_launcher_round" ohos:state="component_state_pressed" />
<!--for thumb in normal-->
<item ohos:element="$media:ic_launcher" ohos:state="component_state_empty"/>
</state-container>
滑块颜色 state-container:
<?xml version="1.0" encoding="utf-8"?>
<state-container xmlns:ohos="http://schemas.huawei.com/res/ohos">
<!--this color is for thumb which is at pressing status-->
<item ohos:element="$color:colorAccent" ohos:state="component_state_pressed" />
<!--for thumb which is at normal status-->
<item ohos:element="$color:color_blue" ohos:state="component_state_empty"/>
</state-container>
tick标记图片 state-container:
<?xml version="1.0" encoding="utf-8"?>
<state-container xmlns:ohos="http://schemas.huawei.com/res/ohos">
<!--this drawable is for tickMarks those are at left side of thumb-->
<item ohos:element="$media:ic_launcher_round" ohos:state="component_state_selected" />
<!--for tickMarks in normal-->
<item ohos:element="$media:ic_launcher" ohos:state="component_state_empty"/>
</state-container>
tick标记颜色 state-container:
<?xml version="1.0" encoding="utf-8"?>
<state-container xmlns:ohos="http://schemas.huawei.com/res/ohos">
<!--this color is for marks those are at left side of thumb-->
<item ohos:element="$color:colorAccent" ohos:state="component_state_selected" />
<!--for marks those are at right side of thumb-->
<item ohos:element="$color:color_gray" ohos:state="component_state_empty"/>
</state-container>
tick文字颜色 state-container:
<?xml version="1.0" encoding="utf-8"?>
<state-container xmlns:ohos="http://schemas.huawei.com/res/ohos">
<!--this color is for texts those are at left side of thumb-->
<item ohos:element="$color:colorAccent" ohos:state="component_state_selected" />
<!--for tick text which is stopped under thumb -->
<item ohos:element="$color:color_blue" ohos:state="component_state_hovered" />
<!--for texts those are at right side of thumb-->
<item ohos:element="$color:color_gray" ohos:state="component_state_empty"/>
</state-container>
监听器
seekBar.setOnSeekChangeListener(new OnSeekChangeListener() {
@Override
public void onSeeking(SeekParams p) {
Log.i(TAG, seekParams.seekBar);
Log.i(TAG, seekParams.progress);
Log.i(TAG, seekParams.progressFloat);
Log.i(TAG, seekParams.fromUser);
//when tick count > 0
Log.i(TAG, seekParams.thumbPosition);
Log.i(TAG, seekParams.tickText);
}
@Override
public void onStartTrackingTouch(IndicatorSeekBar seekBar) {
}
@Override
public void onStopTrackingTouch(IndicatorSeekBar seekBar) {
}
});
CodeCheck代码测试无异常
CloudTest代码测试无异常
病毒安全检测通过
当前版本demo功能与原组件基本无差异
Copyright (C) 2017 zhuangguangquan
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
1. 开源生态
2. 协作、人、软件
3. 评估模型