Android一种View动态折线绘制的实现实战

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

最主要的实现类:

[java]  view plain copy
  1. package com.jesse.paintline1;  
  2.   
  3. import java.util.ArrayList;  
  4. import java.util.HashMap;  
  5. import java.util.List;  
  6. import java.util.Map;  
  7. import android.content.Context;  
  8. import android.graphics.Canvas;  
  9. import android.graphics.Color;  
  10. import android.graphics.Paint;  
  11. import android.graphics.PaintFlagsDrawFilter;  
  12. import android.util.AttributeSet;  
  13. import android.view.View;  
  14. /** 
  15.  * @author Jesse 
  16.  * write this view for draw line,use it easy. 
  17.  */  
  18. public class LineView extends View {  
  19.     private final static String X_KEY = "Xpos";  
  20.     private final static String Y_KEY = "Ypos";  
  21.       
  22.     private List<Map<String, Integer>> mListPoint = new ArrayList<Map<String,Integer>>();  
  23.       
  24.     Paint mPaint = new Paint();  
  25.       
  26.     public LineView(Context context, AttributeSet attrs, int defStyle) {  
  27.         super(context, attrs, defStyle);  
  28.         // TODO Auto-generated constructor stub  
  29.     }  
  30.   
  31.     public LineView(Context context, AttributeSet attrs) {  
  32.         super(context, attrs);  
  33.         // TODO Auto-generated constructor stub  
  34.     }  
  35.       
  36.     public LineView(Context context) {  
  37.         super(context);  
  38.         // TODO Auto-generated constructor stub  
  39.     }  
  40.       
  41.     @Override  
  42.     protected void onDraw(Canvas canvas) {  
  43.         // TODO Auto-generated method stub  
  44.         super.onDraw(canvas);  
  45.           
  46.         mPaint.setColor(Color.RED);  
  47.         mPaint.setAntiAlias(true);  
  48.           
  49.         for (int index=0; index<mListPoint.size(); index++)  
  50.         {  
  51.             if (index > 0)  
  52.             {  
  53.                 canvas.drawLine(mListPoint.get(index-1).get(X_KEY), mListPoint.get(index-1).get(Y_KEY),  
  54.                         mListPoint.get(index).get(X_KEY), mListPoint.get(index).get(Y_KEY), mPaint);  
  55.                 canvas.setDrawFilter(new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint.FILTER_BITMAP_FLAG));   
  56.             }  
  57.         }  
  58.     }  
  59.     /** 
  60.      * @param curX  which x position you want to draw. 
  61.      * @param curY  which y position you want to draw. 
  62.      * @see all you put x-y position will connect to a line. 
  63.      */  
  64.     public void setLinePoint(int curX, int curY)  
  65.     {  
  66.         Map<String, Integer> temp = new HashMap<String, Integer>();  
  67.         temp.put(X_KEY, curX);  
  68.         temp.put(Y_KEY, curY);  
  69.         mListPoint.add(temp);  
  70.         invalidate();  
  71.     }  
  72. }  

UI类:

[java]  view plain copy
  1. package com.jesse.paintline1;  
  2.   
  3. import android.os.Bundle;  
  4. import android.os.Handler;  
  5. import android.os.Message;  
  6. import android.app.Activity;  
  7.   
  8. public class MainActivity extends Activity {  
  9.     private static final int MSG_DATA_CHANGE = 0x11;  
  10.     private LineView mLineView;  
  11.     private Handler mHandler;  
  12.     private int mX = 0;  
  13.   
  14.     @Override  
  15.     protected void onCreate(Bundle savedInstanceState) {  
  16.         super.onCreate(savedInstanceState);  
  17.         setContentView(R.layout.activity_main);  
  18.           
  19.         mLineView = (LineView) this.findViewById(R.id.line);  
  20.           
  21.         mHandler = new Handler(){  
  22.             @Override  
  23.             public void handleMessage(Message msg) {  
  24.                 // TODO Auto-generated method stub  
  25.                 switch (msg.what) {  
  26.                 case MSG_DATA_CHANGE:  
  27.                     mLineView.setLinePoint(msg.arg1, msg.arg2);  
  28.                     break;  
  29.   
  30.                 default:  
  31.                     break;  
  32.                 }  
  33.                 super.handleMessage(msg);  
  34.             }  
  35.         };  
  36.           
  37.         new Thread(){  
  38.             public void run() {  
  39.                 for (int index=0; index<20; index++)  
  40.                 {  
  41.                     Message message = new Message();  
  42.                     message.what = MSG_DATA_CHANGE;  
  43.                     message.arg1 = mX;  
  44.                     message.arg2 = (int)(Math.random()*200);;  
  45.                     mHandler.sendMessage(message);  
  46.                     try {  
  47.                         sleep(1000);  
  48.                     } catch (InterruptedException e) {  
  49.                         // TODO Auto-generated catch block  
  50.                         e.printStackTrace();  
  51.                     }  
  52.                       
  53.                     mX += 30;  
  54.                 }  
  55.             };  
  56.         }.start();  
  57.     }  
  58. }  

UI布局文件:

[html]  view plain copy
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     tools:context=".MainActivity" >  
  6.   
  7.     <com.jesse.paintline1.LineView   
  8.         android:id="@+id/line"  
  9.         android:layout_centerInParent="true"  
  10.         android:layout_width="1024dp"  
  11.         android:layout_height="576dp"  
  12.         android:background="@drawable/line_bg"  
  13.         />  
  14.   
  15. </RelativeLayout>  

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

原文转自:http://blog.csdn.net/yanbober/article/details/21000579

你可能感兴趣的:(android,view,动态,简单,折线图)