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

Android简易折线图的实现方案

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

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

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

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

构思:

折现图的形式:

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

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

b61262bc06c6

-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

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值