android-风力风向图

最近在做气象方面的项目，其中会用到折线图的效果，但是风力风向的就没有现成的控件，代码也很简单，所以就自己写了一下

代码如下：

import android.app.AlertDialog;import android.content.Context;import android.content.DialogInterface;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.RectF;import android.util.Log;import android.view.MotionEvent;import android.view.View;import android.widget.Toast;/*** * 风力风向图**/public class LineCharView extends View {private Context mContext;public int xOrigin;// x原点public int yOrigin;// y原地public int xLenght;// x轴长public int yLenght;// y轴长public int xScale;// x刻度public int yScale;// y刻度public String[] xData;// x轴值public String[] yData;// y轴值public String[] Data;// 数据public String Title;// 标题private int[] Xbitmaps;// 风向xprivate int[] Ybitmaps;// 风向Yprivate int bitmapsLenght;private Paint paint;private Bitmap bitmap;// 风向图标private int[] FX;//风向private int[] FL;//风力private int xS;//x刻度数private int yS;//y刻度数//private int xDialog = -1;//private int yDialog = -1;public LineCharView(Context context) {super(context);this.mContext = context;}public void setLineCharViewInfo(int xOrigin, int yOrigin, int xLenght, int yLenght, int xScale, int yScale,String[] xData, String[] yData, String[] Data, String Title, int bitmapsLenght,int[] FX,int[] FL) {this.xOrigin = xOrigin;this.yOrigin = yOrigin;this.xLenght = xLenght;this.yLenght = yLenght;this.xScale = (int)xLenght/xScale;this.yScale = (int)yLenght/yScale;this.xData = xData;this.yData = yData;this.Title = Title;this.bitmapsLenght = bitmapsLenght;this.FX = FX;this.FL = FL;this.xS = xScale;this.yS = yScale;}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);paint = new Paint();paint.setStyle(Paint.Style.STROKE);paint.setColor(Color.BLUE);paint.setAntiAlias(true);paint.setTextSize(20);canvas.drawLine(xOrigin, yOrigin - yLenght, xOrigin, yOrigin, paint);//x轴canvas.drawLine(xOrigin, yOrigin, xOrigin + xLenght, yOrigin, paint);//y轴for (int i = 0; i * yScale < yLenght; i++) {//if (i > 0) {//PathEffect effects = new DashPathEffect(new float[] { 5, 5, 5, 5 }, 1);// 画虚线//paint.setPathEffect(effects);if (i < yS) {paint.setColor(Color.GRAY);canvas.drawLine(xOrigin, yOrigin - i * yScale, xOrigin + xLenght, yOrigin - i * yScale, paint);}paint.setColor(Color.BLUE);canvas.drawText(yData[i], xOrigin - 40, yOrigin - i * yScale + 5, paint);//}}canvas.drawLine(xOrigin, yOrigin - yLenght, xOrigin - 5, yOrigin - yLenght + 10, paint);//箭头canvas.drawLine(xOrigin, yOrigin - yLenght, xOrigin + 5, yOrigin - yLenght + 10, paint);Xbitmaps = new int[bitmapsLenght];Ybitmaps = new int[bitmapsLenght];for (int i = 0; i * xScale < xLenght; i++) {if (i < xS) {paint.setColor(Color.GRAY);canvas.drawLine(xOrigin + i * xScale, yOrigin, xOrigin + i * xScale, yOrigin - yLenght, paint);}paint.setColor(Color.BLUE);canvas.drawText(xData[i], xOrigin + i * xScale - 5, yOrigin + 30, paint);if (i < xS) {int bit = FX[i];int y = FL[i];//根据风向的值设置不同的图片显示,风向有8个方向if (bit == 1) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a1);} else if (bit == 2) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a2);} else if (bit == 3) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a3);} else if (bit == 4) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a4);}else if (bit == 5) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a2);} else if (bit == 6) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a3);} else if (bit == 7) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a4);} else if (bit == 8) {bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.a4);}canvas.drawBitmap(bitmap, xOrigin + i * xScale - 10, yOrigin - y, paint);Xbitmaps[i] = xOrigin + i * xScale - 8;Ybitmaps[i] = yOrigin - y;}}/*if (xDialog != -1) {RectF rectF = new RectF(xDialog-10, yDialog-100, xDialog+120, yDialog-50);canvas.drawRect(rectF, paint);canvas.drawLine(xDialog-10, yDialog-50, xDialog-15, yDialog+10, paint);canvas.drawText("X:"+xDialog+"\nY:"+yDialog, xDialog, yDialog-70, paint);}*/canvas.drawLine(xOrigin + xLenght, yOrigin, xOrigin + xLenght - 10, yOrigin - 5, paint);canvas.drawLine(xOrigin + xLenght, yOrigin, xOrigin + xLenght - 10, yOrigin + 5, paint);paint.setColor(Color.BLUE);paint.setTextSize(26);canvas.drawText(Title, xOrigin + xLenght / 3, yOrigin + 60, paint);}@Overridepublic boolean onTouchEvent(final MotionEvent event) {if (event.getAction() == MotionEvent.ACTION_DOWN) {Log.d("TAG", "ACTION_DOWN" + event.getX() + "--" + event.getY());int checkBitmapClick = CheckBitmapClick(event.getX(), event.getY());//xDialog = (int)event.getX();//yDialog = (int)event.getY();if (checkBitmapClick > -1) {//Toast.makeText(mContext, checkBitmapClick + ":checkBitmapClick", Toast.LENGTH_LONG).show();new AlertDialog.Builder(mContext).setTitle(Title).setMessage("x:" + event.getX() + "\ny:" + event.getY()+"\n风向:"+FX[checkBitmapClick]+"\n风力:"+FL[checkBitmapClick]).setNegativeButton("no", null).setPositiveButton("ok", new DialogInterface.OnClickListener() {@Overridepublic void onClick(DialogInterface dialog, int which) {//invalidate();}}).show();}}return true;}private int CheckBitmapClick(float DownX, float DownY) {for (int j = 0; j < Ybitmaps.length; j++) {for (int i = 0; i < Xbitmaps.length; i++) {//判断点击的范围是否是风向图片的范围内if ((Xbitmaps[i] <= (int) DownX && (int) DownX <= Xbitmaps[i] + 32)&& (Ybitmaps[j] <= (int) DownY && (int) DownY <= Ybitmaps[j] + 32)) {Log.d("TAG", "CheckBitmapClick" + DownX + "--" + DownY+"--"+Xbitmaps[i]+"---"+Ybitmaps[j]);return i;}}}return -1;}}

调用：

import android.os.Bundle;import android.app.Activity;public class MainActivity extends Activity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);LineCharView lineCharView = new LineCharView(this);lineCharView.setLineCharViewInfo(60, 400, 580, 380, 7, 6,new String[] { "1", "2", "3", "4", "5", "6", "7", "day"},new String[] { "","50", "100", "150", "200", "250","km/h"},new String[] { "1", "2", "3", "4", "5", "6", "7", ""}, "LineCharView",12,new int[]{1,2,3,1,3,4,6},new int[]{50,200,50,30,60,140,150});setContentView(lineCharView);}}

效果图：

也可以加点动画效果，这里就不写了