【Android开发笔记】光速码出一条万能虚线

进入正题

虚线，想必在不少APP中都有用到。最近项目中正好也有这样的设计，所以就诞生了今天我要分享给大家的这个自定义View，我将它命名为ColorfulLine（多彩线条），之所以多彩，是因为它不仅仅能实现常规印象中的灰色虚线，也可以实现更多彩的其他效果，具体见效果图。

效果图

ColorfulLine

使用方法

从效果图中的xml代码片段可以看出，使用起来也是很简单的，只需要设置colors,colorSizes,colorSizeUnit,direction这几个属性就可以了，下面对这些属性做一说明:

属性	含义	值
colors	颜色数组，用逗号分隔的16进制RGB颜色值	"#ffffff,#00ff00"
colorSizes	colors对应的颜色绘制长度，数组大小应和colors相同	"16,16"
colorSizeUnit	colorSizes的单位	dp/px
direction	方向	vertical纵向/horizontal横向

源码解析（使用kotlin）

Github（觉得对你有用就★一下吧）

• xml属性值获取

这里将colos中的数组字符串拆分，再解析为Int的颜色值，colorSizes的获取于此类似

      var colors: List = listOf()
      val typedArray: TypedArray = resources.obtainAttributes(attrs, R.styleable.ColorfulLine)
      val colorsString = typedArray.getString(R.styleable.ColorfulLine_colors)
      colors = colorsString.split(",").map { Color.parseColor(it) }

• 绘制

drawnSize为已经绘制的长度，根据绘制的方向，判断该值是否大于View的长或宽，然后循环进行绘制

        var drawnSize = 0
        when (direction) {
            1 -> {
                while (drawnSize < width) {
                    for ((index, color) in colors.withIndex()) {
                        paint.color = color
                        canvas?.drawRect(drawnSize.toFloat(), 0F, (drawnSize + colorSizes[index]).toFloat(), height.toFloat(), paint)
                        drawnSize += colorSizes[index]
                    }
                }
            }
            2 -> {
                while (drawnSize < height) {
                    for ((index, color) in colors.withIndex()) {
                        paint.color = color
                        canvas?.drawRect(0F, drawnSize.toFloat(), width.toFloat(), (drawnSize + colorSizes[index]).toFloat(), paint)
                        drawnSize += colorSizes[index]
                    }
                }
            }
        }

• 实现起来还是很简单的，希望对你有用