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

最新推荐文章于 2024-05-22 07:45:00 发布

lxq_xsyu

最新推荐文章于 2024-05-22 07:45:00 发布

阅读量1.3w

点赞数 16

分类专栏： Android开发 Android界面图像 Android自定义组件 Android进阶之自定义组件文章标签： Android Canvas 折线图自定义View

本文链接：https://blog.csdn.net/dawanganban/article/details/31445249

版权

本文介绍如何在Android中利用Canvas自定义绘制折线图，通过示例代码展示绘制过程，并分享改进后的效果。文章提供了一个简单的实现原理和代码片段，帮助开发者理解如何根据项目需求定制图形。

摘要由CSDN通过智能技术生成

有时候我们在项目中会遇到使用折线图等图形，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 = new ArrayList<Integer>();
	

	
	private String[] YLabel = new String[YLength / YScale];
	
	private Handler handler = new Handler(){
		public void handleMessage(Message msg) {
			if(msg.what == 0x1234){
				MyView.this.invalidate();
			}
		};
	};
	public MyView(Context context, AttributeSet attrs) {
		super(context, attrs);
		for(int i=0; i<YLabel.length; i++){
			YLabel[i] = (i + 1) + "M/s";
		}
		
		new Thread(new Runnable() {
			
			@Override
			public void run() {
				while(true){
					try {
						Thread.sleep(1000);
					} catch (InterruptedException e) {
						e.printStackTrace();
					}
					if(data.size() >= MaxDataSize){
						data.remove(0);
					}
					data.add(new Random().nextInt(4) + 1);
					handler.sendEmptyMessage(0x1234);
				}
			}
		}).start();
	}
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		Paint paint = new Paint();
		paint.setStyle(Paint.Style.STROKE);
		paint.setAntiAlias(true); //去锯齿
		paint.setColor(Color.BLUE);
		
		//画Y轴
		canvas.drawLine(XPoint, YPoint - YLength, XPoint, YPoint, paint);
		
		//Y