由于工作需要,模拟一个signal变化量走势,所以需要绘制折线动态图,话说使用achartengine这个jar包就能实现各种图形绘制,but工程导入一个包在大小上毕竟是要付出代价的嘛,况且只是为了实现画一条动态曲线嘛,故就用重写View实现了下,还是惯例,直接上代码。

最主要的实现类:

package com.jesse.paintline1;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PaintFlagsDrawFilter;
import android.util.AttributeSet;
import android.view.View;
/**
 * @author Jesse
 * write this view for draw line,use it easy.
 */
public class LineView extends View {
	private final static String X_KEY = "Xpos";
	private final static String Y_KEY = "Ypos";
	
	private List<Map<String, Integer>> mListPoint = new ArrayList<Map<String,Integer>>();
	
	Paint mPaint = new Paint();
	
	public LineView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		// TODO Auto-generated constructor stub
	}

	public LineView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
	}
	
	public LineView(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}
	
	@Override
	protected void onDraw(Canvas canvas) {
		// TODO Auto-generated method stub
		super.onDraw(canvas);
		
		mPaint.setColor(Color.RED);
		mPaint.setAntiAlias(true);
		
		for (int index=0; index<mListPoint.size(); index++)
		{
			if (index > 0)
			{
				canvas.drawLine(mListPoint.get(index-1).get(X_KEY), mListPoint.get(index-1).get(Y_KEY),
						mListPoint.get(index).get(X_KEY), mListPoint.get(index).get(Y_KEY), mPaint);
				canvas.setDrawFilter(new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint.FILTER_BITMAP_FLAG)); 
			}
		}
	}
	/**
	 * @param curX  which x position you want to draw.
	 * @param curY	which y position you want to draw.
	 * @see	all you put x-y position will connect to a line.
	 */
	public void setLinePoint(int curX, int curY)
	{
		Map<String, Integer> temp = new HashMap<String, Integer>();
		temp.put(X_KEY, curX);
		temp.put(Y_KEY, curY);
		mListPoint.add(temp);
		invalidate();
	}
}

UI类:

package com.jesse.paintline1;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.app.Activity;

public class MainActivity extends Activity {
	private static final int MSG_DATA_CHANGE = 0x11;
	private LineView mLineView;
	private Handler mHandler;
	private int mX = 0;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		mLineView = (LineView) this.findViewById(R.id.line);
		
		mHandler = new Handler(){
			@Override
			public void handleMessage(Message msg) {
				// TODO Auto-generated method stub
				switch (msg.what) {
				case MSG_DATA_CHANGE:
					mLineView.setLinePoint(msg.arg1, msg.arg2);
					break;

				default:
					break;
				}
				super.handleMessage(msg);
			}
		};
		
		new Thread(){
			public void run() {
				for (int index=0; index<20; index++)
				{
					Message message = new Message();
					message.what = MSG_DATA_CHANGE;
					message.arg1 = mX;
					message.arg2 = (int)(Math.random()*200);;
					mHandler.sendMessage(message);
					try {
						sleep(1000);
					} catch (InterruptedException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					}
					
					mX += 30;
				}
			};
		}.start();
	}
}

UI布局文件:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <com.jesse.paintline1.LineView 
        android:id="@+id/line"
        android:layout_centerInParent="true"
        android:layout_width="1024dp"
        android:layout_height="576dp"
        android:background="@drawable/line_bg"
        />

</RelativeLayout>

效果不解释,就是动态曲线图,哈哈!


Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐