首页 > 代码库 > Android自定义组件系列【9】——Canvas绘制折线图

Android自定义组件系列【9】——Canvas绘制折线图

有时候我们在项目中会遇到使用折线图等图形,Android的开源项目中为我们提供了很多插件,但是很多时候我们需要根据具体项目自定义这些图表,这一篇文章我们一起来看看如何在Android中使用Canvas绘制折线图。先看看绘制的效果:

实现原理很简单,我就直接给出代码:

package com.example.testcanvasdraw;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.View;

public class MyView extends View{
	private int XPoint = 60;
	private int YPoint = 260;
	private int XScale = 8;  //刻度长度
	private int YScale = 40;
	private int XLength = 380;
	private int YLength = 240;
	
	private int MaxDataSize = XLength / XScale;
	
	private List<Integer> data = http://www.mamicode.com/new ArrayList();>上面绘制折线部分我们还有一种方式同样可以实现:

		if(data.size() > 1){
			Path path = new Path();
			path.moveTo(XPoint, YPoint - data.get(0) * YScale);
			for(int i=1; i<data.size(); i++){
				path.lineTo(XPoint + i * XScale, YPoint - data.get(i) * YScale);
			}
			canvas.drawPath(path, paint);
		}
下面我们将上面代码修改,让折线下面的区域颜色填充

package com.example.testcanvasdraw;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.View;
/**
 * 
 * @author 阳光小强
 * http://blog.csdn.net/dawanganban
 *
 */
public class MyView extends View {
	private int XPoint = 60;
	private int YPoint = 260;
	private int XScale = 8; // 刻度长度
	private int YScale = 40;
	private int XLength = 380;
	private int YLength = 240;

	private int MaxDataSize = XLength / XScale;

	private List<Integer> data = http://www.mamicode.com/new ArrayList();>

上面的效果有时候还是达不到我们的要求,我们将代码修改后效果如下:

package com.example.testcanvasdraw;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.View;

/**
 * 
 * @author 阳光小强 http://blog.csdn.net/dawanganban
 * 
 */
public class MyView extends View {
	private int XPoint = 60;
	private int YPoint = 260;
	private int XScale = 8; // 刻度长度
	private int YScale = 40;
	private int XLength = 380;
	private int YLength = 240;

	private int MaxDataSize = XLength / XScale;

	private List<Integer> data = http://www.mamicode.com/new ArrayList();>

感谢你对“阳光小强"的关注,我的另一篇博文很荣幸参加了CSDN举办的博文大赛,如果你觉的小强的博文对你有帮助,请为小强投上你宝贵的一票,投票地址:http://vote.blog.csdn.net/Article/Details?articleid=30101091