All Projects → zhou-you → Easysegmentedbarview

zhou-you / Easysegmentedbarview

本库主要提供一个简单易用的自定义分段控件,方便快速实现分段效果,支持xml配置、代码配置、分段规则按均分/比例分、数字分段、文本分段、渐变分段、bar条样式正常/圆形/三角形,segment文字样式、进度设置、进度标记类型设置、分段描述设置、其它更多自定义设置等功能。

Programming Languages

java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to Easysegmentedbarview

Android Week View
Android Week View is an android library to display calendars (week view or day view) within the app. It supports custom styling.
Stars: ✭ 3,347 (+635.6%)
Mutual labels:  custom-view
Pudding
🌟 Pudding use WindowManager(don't need request permission) to pull down a view that are displayed on top their attached window
Stars: ✭ 371 (-18.46%)
Mutual labels:  custom-view
Wmzpagecontroller
分页控制器,替换UIPageController方案,具备完整的生命周期,多种指示器样式,多种标题样式,可悬浮,支持ios13暗黑模式(仿优酷,爱奇艺,今日头条,简书,京东等多种标题菜单) (Pagination controller with full life cycle, multiple indicator styles, multiple title styles)
Stars: ✭ 405 (-10.99%)
Mutual labels:  segment
Android Ruler Picker
Android custom view that uses ruler for picking the number from given range.
Stars: ✭ 335 (-26.37%)
Mutual labels:  custom-view
Fmap
宇行地图:高仿高德地图Android客户端(持续更新中...)
Stars: ✭ 347 (-23.74%)
Mutual labels:  custom-view
Jxpagelistview
高仿闲鱼、转转、京东、中央天气预报等主流APP列表底部分页滚动视图
Stars: ✭ 377 (-17.14%)
Mutual labels:  segment
Kafka Go
Kafka library in Go
Stars: ✭ 4,200 (+823.08%)
Mutual labels:  segment
Sliding Panel
Android sliding panel that is part of the view hierarchy, not above it.
Stars: ✭ 433 (-4.84%)
Mutual labels:  custom-view
Material Calendar View
📅 Material Design Calendar compatible with API 11+
Stars: ✭ 360 (-20.88%)
Mutual labels:  custom-view
Sppagemenu
分页菜单,功能非常齐全,满足绝大多数APP,简书地址:
Stars: ✭ 402 (-11.65%)
Mutual labels:  segment
Opengraphview
Rich url link view for Android.
Stars: ✭ 338 (-25.71%)
Mutual labels:  custom-view
Cvcalendar
A custom visual calendar for iOS 8+ written in Swift (>= 4.0).
Stars: ✭ 3,435 (+654.95%)
Mutual labels:  custom-view
Voiceripple
Voice Record Button that has ripple effect with users voice
Stars: ✭ 379 (-16.7%)
Mutual labels:  custom-view
Superlike
今日头条点赞动画 连击动画
Stars: ✭ 329 (-27.69%)
Mutual labels:  custom-view
Uicollectionview Layouts Kit
📐 A set of custom layouts for UICollectionView with examples [Swift 5.3, iOS 12].
Stars: ✭ 410 (-9.89%)
Mutual labels:  custom-view
Percentagechartview
An Android percentage chart that displays the progress of any single given task or information.
Stars: ✭ 324 (-28.79%)
Mutual labels:  custom-view
Compositionavatar
Android composition avatar. 仿QQ讨论组头像
Stars: ✭ 371 (-18.46%)
Mutual labels:  custom-view
Widgetcase
自定义控件模块库:各种风格的自定义控件,拿来就用,API文档详细,持续集成,长期维护,有问必答;
Stars: ✭ 440 (-3.3%)
Mutual labels:  custom-view
Android Otpview Pinview
A custom view to enter otp of different sizes used usually in cases of authentication.
Stars: ✭ 422 (-7.25%)
Mutual labels:  custom-view
Text Decorator
Decorate your TextView easily
Stars: ✭ 402 (-11.65%)
Mutual labels:  custom-view

EasySegmentedBarView

本库主要提供一个简单易用的自定义分段控件,方便快速实现分段效果,支持xml配置、代码配置、分段规则按均分/比例分、数字分段、文本分段、渐变分段、bar条样式正常/圆形/三角形,segment文字样式、进度设置、进度指示标记类型设置、分段描述设置、分段间距、其它更多自定义设置等功能。

功能

  • 支持xml配置;
  • 支持通过代码配置;
  • 支持bar条分段规则按均分/比例分;
  • 支持数字分段、文本分段;
  • 支持bar条渐变分段;
  • 支持设置bar条side样式正常/圆形/三角形;
  • 支持segment文字样式;
  • 支持进度设置,unit单位显示,进度为数字或指定文本;
  • 支持进度指示标记类型设置,上部显示/覆盖叠加显示;
  • 支持进度指示三角形是否显示;
  • 支持分段间距设置;
  • 支持其它更多自定义设置、包括颜色、长宽、间距等;

关于我

github csdn

联系方式

本群旨在为使用我github项目的人提供方便,如果遇到问题欢迎在群里提问。

欢迎加入QQ交流群(Q1群已满,请加入Q2群)

演示(请star支持)

版本说明

release

Demo下载

downloads

用法介绍

build.gradle设置

dependencies {
 compile 'com.zhouyou:segmentedbar:1.0.9'
}

想查看所有版本,请点击下面地址。

jcenter

在xml布局中

<com.zhouyou.view.segmentedbar.SegmentedBarView
                android:id="@+id/barView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingBottom="5dp"
                android:paddingTop="5dp"
                app:sbv_empty_segment_text="No segments"
                app:sbv_segment_gap_width="5dp"
                app:sbv_segment_rule="average"
                app:sbv_segment_text_size="15sp"
                app:sbv_show_description_text="true"
                app:sbv_side_style="rounded"
                app:sbv_side_text_style="twoSided"
                app:sbv_value_sign_height="30dp"
                app:sbv_value_sign_round="8dp"
                app:sbv_value_sign_width="100dp"
                />

具体属性设置

属性 类型 默认值 说明
sbv_side_style enum rounded 分段条样式normal/rounded/angle,normal:正常样式 rounded:圆角样式 angle:三角样式
sbv_sliderType enum 进度框 支持设置:Sign/Slider Sign:进度框指示,在分段条上部 Slider:滑块指示,覆盖在分段条上
sbv_sliderImg reference 没有默认图片 设置sbv_sliderType属性为Slider模式时,需要设置图片,例如:app:sbv_sliderImg="@mipmap/slider"
sbv_segment_gap_width dimension 2dp 每个分段之间的间隙,如果不需要可以设置0dp
sbv_side_text_style enum oneSided 分段条上文字显示样式oneSided/twoSided oneSided例如:<50 twoSided 例如:40-60
sbv_segment_text_size dimension 14sp 分段条上文字颜色
sbv_bar_height dimension 24dp 分段条高度
sbv_show_segment_text boolean true (显示) 是否显示分段条上文字
sbv_show_description_text boolean false(不显示) 是否显示分段条底部说明文字
sbv_show_description_top_text boolean false(不显示) 是否显示分段条上部说明文字
sbv_segment_bg boolean false(不显示) 是否显示分段条背景
sbv_segment_startcolor color 红色 渐变背景的起始颜色(sbv_segment_bg属性为true才起作用 )
sbv_segment_endcolor color 绿色 渐变背景的结束颜色(sbv_segment_bg属性为true才起作用 )
sbv_empty_segment_text string Empty 空分段展示的提示文字
sbv_empty_segment_background color #858585 空分段bar条的背景颜色
sbv_value_sign_background color #7492E2 进度块背景颜色
sbv_value_sign_border_color color #7492E2 进度块边框颜色
sbv_value_text_size dimension 14sp 进度文字大小
sbv_value_sign_border_size dimension 2dp 分段条上部value背景框边框粗细
sbv_value_sign_height dimension 32dp 进度块高度
sbv_value_sign_width dimension 72dp 进度块宽度
sbv_value_sign_round dimension 4dp 进度块圆角大小
sbv_arrow_height dimension 5dp 进度块上三角指示高度
sbv_arrow_width dimension 10dp 进度块上三角指示宽度
sbv_show_sign_boder boolean false(不显示) 是否显示进度块边框
sbv_description_text_color color Color.DKGRAY 描述文字字体颜色
sbv_description_text_size dimension 14sp 描述文字字体大小
sbv_description_box_height dimension 24dp 分段条上部描述文字方块高度
sbv_description_box_top_height dimension 24dp 分段条底部描述文字方块高度
sbv_descriptionAlign enum Center 分段条底部描述文字对齐方式支持Center/Both模式,Center:居中显示 ,Both:两端显示
sbv_descriptionTopAlign enum Center 分段条上部部描述文字对齐方式支持Center/Both模式,Center:居中显示 ,Both:两端显示
sbv_segment_rule enum average 设置分段规则scale/average模式,scale:按比例分段 average:平均分段

在代码中

方式一

       SegmentedBarView barView = (SegmentedBarView) findViewById(R.id.barView);
        ArrayList<Segment> segments = new ArrayList<>();
        Segment segment = new Segment(0, 4.5f, "Low", Color.parseColor("#EF3D2F"));
        segments.add(segment);
        Segment segment2 = new Segment(4.5f, 9.5f, "Optimal", Color.parseColor("#8CC63E"));
        segments.add(segment2);
        Segment segment3 = new Segment(9.5f, 20f, "High", Color.parseColor("#EF3D2F"));
        segments.add(segment3);
        barView.setValueWithUnit(13.96f, "10<sup>12</sup>/l");
        //barView.setSegmentSideRule(SegmentedBarViewSideRule.average);//通过代码设置规则
        //barView.setValue(13.96f);
        //barView.setValue(13.96f,"Optimal");
        barView.setSegments(segments);

方式二

       SegmentedBarView barView = new SegmentedBarView(this);
        ArrayList<Segment> segments = new ArrayList<>();
        Segment segment = new Segment(0, 4.5f, "Low", Color.parseColor("#EF3D2F"));
        segments.add(segment);
        Segment segment2 = new Segment(4.5f, 6.5f, "Optimal", Color.parseColor("#8CC63E"));
        segments.add(segment2);
        Segment segment3 = new Segment(6.5f, 20f, "High", Color.parseColor("#EF3D2F"));
        segments.add(segment3);
        barView.setValue(4.96f);
        barView.setUnit("m");
        barView.setSideTextStyle(SegmentedBarViewSideTextStyle.TWO_SIDED);
        barView.setSideStyle(SegmentedBarViewSideStyle.ROUNDED);
        barView.setSegments(segments);
        barView.setShowDescriptionText(false);
        barView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
        barView.setPadding(0, getResources().getDimensionPixelSize(R.dimen.vertical_padding), 0, 0);
        sideStyleLayout.addView(barView);

方式三

        ArrayList<Segment> segments = new ArrayList<>();
        Segment segment = new Segment(0, 4.5f, "Low", Color.parseColor("#EF3D2F"));
        segments.add(segment);
        Segment segment2 = new Segment(4.5f, 6.5f, "Optimal", Color.parseColor("#8CC63E"));
        segments.add(segment2);
        Segment segment3 = new Segment(6.5f, 20f, "High", Color.parseColor("#EF3D2F"));
        segments.add(segment3);
        SegmentedBarView barView = SegmentedBarView.builder(this)
                .segments(segments)
                .value(5.25f)
                .unit("ml<sup>2</sup>")
                .showDescriptionText(true)
                .sideStyle(SegmentedBarViewSideStyle.ANGLE)
                .build();
        barView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
        barView.setPadding(0, getResources().getDimensionPixelSize(R.dimen.vertical_padding), 0, 0);
        javaCodeLayout.addView(barView);

具体方法设置

方法 说明
setBarHeight(int barHeight) 设置分段条高度
setDescriptionBoxHeight(int descriptionBoxHeight) 分段条底部部描述文字方块高度
setDescriptionTextColor(int descriptionTextColor) 分段条底部描述文字颜色
setDescriptionTextSize(int descriptionTextSize) 分段条底部描述文字字体大小
setDrawSegmentBg(boolean drawSegmentBg) 设置是否显示分段条背景
setEmptySegmentColor(int emptySegmentColor) 设置没有分段时分段条颜色
setGapWidth(int gapWidth) 设置分段之间的间距
setGradientBgSegmentColor(int startColor, int endColor) 设置分段条背景的渐变色,启始颜色值和结束颜色值
setSegments(List segments) 设置分段集合
setSegmentSideRule(int sideRule) 设置分段规则scale/average模式,scale:按比例分段 average:平均分段
setSegmentTextColor(int segmentTextColor) 分段条上文字颜色
setSegmentTextSize(int segmentTextSize) 分段条上文字字体大小
setShowDescriptionText(boolean showDescriptionText) 是否显示分段条底部的描述文字
setShowSegmentText(boolean showSegmentText) 是否显示分段条上的文字
setSideStyle(int sideStyle) 分段条样式normal/rounded/angle,normal:正常样式 rounded:圆角样式 angle:三角样式 ,例如:setSideStyle(SegmentedBarViewSideStyle.NORMAL)
setSideTextStyle(int sideTextStyle) 分段条上文字显示样式SegmentedBarViewSideTextStyle.TWO_SIDEDSegmentedBarViewSideTextStyle.ONE_SIDED
setUnit(String unit) 设置单位 ,例如:"ml<sup>2</sup>"
setValue(Float value) 设置当前进度值
setValue(float value, String valueText) 设置当前进度值,例如(80,“优秀”),进度框上文字不会显示80,会显示“优秀”,主要用于转换使用
setValueSegment(Integer valueSegment) 设置文字分段时,进度位置,例如:分3段,从0开始 ValueSegment=1,表示进度块在第二个位置上展示
setValueSegmentText(String valueSegmentText) 设置分段进度块上的文字描述,配合setValueSegment使用,只针对文字分段没有数字进度,具体看Demo4,非数字分段
setValueSignColor(int valueSignColor) 进度框背景颜色
setValueSignSize(int width, int height) 进度框大小设置
setValueTextColor(int valueTextColor) 进度框上文字字体颜色
setValueTextSize(int valueTextSize) 进度框上文字字体大小
setValueWithUnit(Float value, String unitHtml) 设置有单位的进度

Other

其它更多设置和使用方法,请参考Demo

感谢

在此感谢SegmentedBarView-Android作者提供的开源库,对于本库的完成提供了很大的帮助。

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].