android折线图动态,Android简易折线图的实现思路

Android简易折线图的实现方案

万事开头难，不说内容如何，关键在于我终于迈出这一步了！

对于折线图来说，github已经有太多优秀的开源框架，如MPAndroidCharts，使用起来很方便，简单的调用其API方法即可。然在懂得运用的情况下我们更要理解折线图表实现的原理。

最近写了一个简单的折线图，在此分享一下，接下来会逐渐完善与优化，主要就是模仿一些APP已经实现的简易功能。说了那么多的废话，开始行动吧！

说到折线图，我相信大家都不陌生，在很多地方都遇到过如Excel.还有股票走势等等，所以说大家也一定知道折现图长什么样子。那么接下来我们会才想，它是怎么实现的呢？？

构思:

折现图的形式：

简而言之，一条X轴，一条Y轴，X轴与Y轴组成区域内的一些点，线，以及这些点、线或坐标轴的文字描述。

猜想：应该怎么实现呢？既然知道了折线图的表现形式，由两条坐标轴，若干点与线组成，那应该就会想到，怎么画坐标轴？怎么画点？怎么画线？怎么把它们给链接起来？

-13_19h48_51.png

实现步骤

画坐标轴

画点

画线

Action:

假如现在有一个2维数组，

protected float[][] points = new float[][]{ {1,10}, {2,47}, {3,11}, {4,38}, {5,9},{6,52}, {7,14}, {8,37}, {9,29}, {10,31}};

我们将通过拆线图的形式把每个点绘制出来。

执行自定义View的3个常用方法

OnMeassure OnLayout OnDraw ，在这主要主是OnDraw.

第一步，平移坐标原点：

//平移坐标原点

canvas.translate(50,height-50);

第二步，画X轴及X轴上显示的文本描述:

注意

具体怎么画有很多种方法，这里采用的是每次画一小段，一段连接着下一段，最终形成一条完整的线段，

也可以直接先画一条直线(宽度有限，也可以叫线段，怎么叫无所谓了，实现才是最关键的)。

当然在画线的时候会画一个点，及关于这个点的描述，具体也可偏移一些以方便显示文本。

private void drawLineXAxis(Canvas canvas) {

int startX = 0;

int startY = 0;

int spaceing = (width-100)/points.length;

//每次画一小段 也可以直接画一条线，然后再线上绘制具体的各个点，其原理一样，都是等分每次变化一个spaceing

for (int i = 0;(startX+spaceing*i)

//绘制X轴上的线段了，0-1 1-2 2-3.。。这个地方应该搞个中间变量来表示 要不重复画了0-1 0-2 0-3 代码问题

canvas.drawLine(startX,startY,startX+spaceing*i ,startY,linePaint);

//绘制X轴各坐标点 小圆

canvas.drawCircle(startX+spaceing*i, startY, 5, linePaint);

//绘制X轴各坐标点的描述，在这偷懒了直接就用0 1 2 3...表示了&#x