自定义折线、柱状图控件（kotlin）
2019-03-05 本文已影响0人
简单点儿吧
实习一了段时间了，终于有活干了……
然鹅……
我需要做一个折线图控件，我tm之前从来没做任何过复杂程度超过矩形的控件，你现在让我做一个折线图！！！（手动狗头）
最后只能先去网上看看大神怎么写的，模仿着花了一天多终于把控件写出来了。
先上图：
效果图.jpg
其实完成之后想想也挺简单，以下是思路：
首先设定初始化变量：
- 首先重写onMeasure（）获取控件大小width和height，并且给出默认大小；
- 确定绘制起点，也就相当于原点（startpointX,startpointY），图中的所有线段、刻度包括文字的位置都是基于这个原点的；
- 通过控件width和height以及XY轴的刻度数量来设置X轴和Y轴的刻度单位长度Xscale和Yscale，进而获得XY轴的总长度xLength和yLength；
- 初始化各种画笔，建议将画坐标轴的笔、画数据线的笔、画坐标刻度的笔分开
开始绘制：
- 初始化这些变量后就可以开始绘制：
1.绘制XY轴
2.绘制XY轴刻度
3.根据转折点坐标一段一段画出折线
需要注意的点：
- 可以用二维数组来存储转折点坐标（当然也可以用一维数组）
- 用rect和paint的getTextBounds（）获取字符串的宽高，便于定位刻度位置；
- 对于阴影可以用path来画,要用画笔的FILL模式
- 对于点击事件可重写onTouchEvent（）来获取触摸位置touchX和touchY，然后遍历坐标数组中的坐标确定属于哪个转折点的点击范围，触发事件；
- 若想要绘制虚线，可以用paint的pathEffect属性需要线关闭配置文件中当前activity的hardwareAccelerated属性
总结：再复杂的控件也都是一点一点画出来的，有了思路之后，一点一点做就一定能做出来，刚开始的时候肯定错误会比较多，但是你把错误都试完了自然就只剩下成功的办法了！
以下是这个项目地址，如果能帮到你，一定赏我一个star啊23333333……
