当前位置: 代码迷 >> 综合 >> Android 矩形/柱状进度条
  详细解决方案

Android 矩形/柱状进度条

热度:95   发布时间:2023-09-06 13:46:41.0

一般我们表示容量使用进度,或者出售量/库存,还是当期那拼团人数/剩余拼团人数这种表示时 一般可用数字来表示,或者圆形图。但是每个老板审美不一样,最近就遇到了一个要求使用柱状图来表示的需求。

类似下图表示:

 

Android 矩形/柱状进度条

或者

Android 矩形/柱状进度条

 

这种效果使用ProgressBar/Seekbar自定义也行。但是吧,感觉直接集成ProgressBar/Seekbar显得太臃肿,大多属性用不到,我也不知道有没有类似轮子,不知道如何搜索关键词。搜索一下柱状图,矩形进度条什么的,没有什么符合条件的。于是动手写一下。

 

原理不难就不赘述了,看源码应该就知道,简单说明一下目前实现功能:

1.已使用颜色/未使用颜色

2.已使用区域文字颜色/未使用区域颜色

3.是否描绘边框/边框大小/边框颜色

4.字体大小

5.文字是否分两部分显示/文字只显示一行居中

6.圆角大小/是否使用圆角

 

--目前所有属性都是通过代码设置,可以配置成xml设置方式,可自行拓展--

--区分两部分显示文字时,会根据各自区域居中,如果文字长度大于区域 则左对齐或者右对齐,并穿透到另一个区域显示,如下图:

 

 

Android 矩形/柱状进度条

 

 

预计可以应用场景(也可用作ProgressBar):

-下载进度

-库存/容量显示

-横向状增长图

-正反观点人数

-投票

- ...

 

这只是一个简单开发的初版,已经有考虑性能,代码注释明了,拓展性强。可自行拓展

 

 

使用简单示范:

     mPercentRectangleView = findViewById(R.id.percentRectangleView);//支持链式调用,更新内容记得调用 update()方法//设置已使用的百分比  设置值 0-1mPercentRectangleView.setPercent(0.3f)//设置边框,参数1是边框大小,参数2是圆角.setStroke(0,10)//圆角为10 无边框.setStroke(10,0)//无圆角 边框为10.setStroke(10,10)//圆角和边框为10//设置边框颜色.setStrokeColor(Color.GREEN)//设置字体大小,已控件高度为基准 设置值0-1 代表字体大小是高度的几分之几 .setTestSizePercent(0.5f)//设置总量的颜色.setTotalColor(Color.BLUE)//设置已使用量的颜色.setUsedColor(Color.BLUE)//设置总量里面的文字颜色,如果是单行文字则表示的是单行文字的颜色.setTotalTextColor(Color.BLUE)//设置已使用量的文字颜色, 如果是单行文字则无效果.setUsedTextColor(Color.BLUE)//设置单行文字,如果不为Null 则优先显示单行.setTips("这里是单行文字")//分别显示文字,如果要分别显示,请设置setTips(null),否则会优先显示单行.setTipArray("已用 xx%","剩余 xx%")//切记,更新属性记得调用此方法.update();

 

源码以及测试用例(TestActivity)地址:点击直达Github

  相关解决方案