第一个自定义view,折线图

死活找不到想要的折线图的开源库,

无奈,只好研究了几天自定义view后自己开始写。

package com.example.pc.test.Activity;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.LinearGradient;import android.graphics.Paint;import android.graphics.Path;import android.graphics.RectF;import android.graphics.Shader;import android.graphics.drawable.ShapeDrawable;import android.graphics.drawable.shapes.PathShape;import android.util.AttributeSet;import android.util.Log;import android.view.MotionEvent;import android.view.View;import com.example.pc.test.R;import java.util.ArrayList;import java.util.List;/** * Created by pc on 2016/3/8. */public class MyView extends View {    public int paddingLeft;    public int paddingRight;    public int paddingBottom;    public int paddintTop;    int width;  //控件宽度    int height; //控件高度    List<Double> listDate;    double maxDate;  //集合最大值,占满整个高度    int jgwidth; //2点间隔宽度    int[] x=new int[7];    int[] y=new int[7];    /**     * 初始化数据     */    public void initDatas(){        listDate=new ArrayList<>();        listDate.add(0.7);        listDate.add(0.6);        listDate.add(0.7);        listDate.add(0.5);        listDate.add(1.0);        listDate.add(0.1);        listDate.add(0.8);        maxDate=getMaxint();  //算出最大的数        jgwidth=(getWidth()-60)/(listDate.size()-1);        paddingLeft=30;        paddingRight=30;        paddingBottom=30;        paddintTop=100;        width=getWidth()-paddingLeft;        height=getHeight()-paddingBottom;    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        initDatas();        //算出来7个坐标点        for(int i=0;i<listDate.size();i++){            double kuan=getMyWeight(i);            double gao=getMyHeight(listDate.get(i));            x[i]=(int)kuan;            y[i]=(int)gao;        }        //绘制任意多边形        Paint paint = new Paint();        //设置画笔颜色        paint.setColor(getResources().getColor(R.color.arc_blue));        //设置圆弧的宽度        paint.setStrokeWidth(10);        //设置圆弧为空心        paint.setStyle(Paint.Style.STROKE);        //消除锯齿        paint.setAntiAlias(true);        Path path = new Path();        path.moveTo(((int)x[0]), (int)y[0]);        path.lineTo(x[1], y[1]);        path.lineTo(x[2], y[2]);        path.lineTo(x[3], y[3]);        path.lineTo(x[4], y[4]);        path.lineTo(x[5], y[5]);        path.lineTo(x[6], y[6]);        path.lineTo(getWidth()-paddingLeft,getHeight());        path.lineTo(paddingLeft,getHeight());        path.lineTo(((int)x[0]), (int)y[0]);        paint.setStyle(Paint.Style.FILL);        ;        Shader mShader=new LinearGradient(0,0,0,getHeight(),                new int[]{0x00BFFF,Color.WHITE},                null,Shader.TileMode.REPEAT);        paint.setShader(mShader);        canvas.drawPath(path, paint);        //绘制蓝色连线        paint = new Paint();        //设置画笔颜色        paint.setColor(Color.parseColor("#49acd5"));        //设置圆弧的宽度        paint.setStrokeWidth(3);        //设置圆弧为空心        paint.setStyle(Paint.Style.FILL);        //消除锯齿        paint.setAntiAlias(true);        for(int i=0;i<listDate.size();i++){            double kuan=getMyWeight(i);            double gao=getMyHeight(listDate.get(i));            if(i!=0){                double kuan1=getMyWeight(i-1);                double gao1=getMyHeight(listDate.get(i-1));                canvas.drawLine((float) kuan1,(float) gao1,(float) kuan,(float) gao,paint);            }        }        /**         * 画圆外部蓝色         */        paint = new Paint();        //设置画笔颜色        paint.setColor(Color.parseColor("#49acd5"));        //设置圆弧的宽度        paint.setStrokeWidth(3);        //设置圆弧为空心        paint.setStyle(Paint.Style.FILL);        //消除锯齿        paint.setAntiAlias(true);       for(int item=0;item<7;item++){           //定义一个矩形           RectF rf2 = new RectF(x[item]-15, y[item]-15, x[item]+15, y[item]+15);           //画圆           canvas.drawOval(rf2, paint);       }        /**         * 画圆内部白色         */        paint = new Paint();        //设置画笔颜色        paint.setColor(Color.WHITE);        //设置圆弧的宽度        paint.setStrokeWidth(3);        //设置圆弧为空心        paint.setStyle(Paint.Style.FILL);        //消除锯齿        paint.setAntiAlias(true);        for(int item=0;item<7;item++){            //定义一个矩形            RectF rf2 = new RectF(x[item]-11, y[item]-11, x[item]+11, y[item]+11);            //画圆            canvas.drawOval(rf2, paint);        }        Log.e("-->1x:",x[0]+""+"   "+y[0]);        Log.e("-->1x:",x[1]+""+"   "+y[1]);        Log.e("-->1x:",x[2]+""+"   "+y[2]);        Log.e("-->1x:",x[3]+""+"   "+y[3]);        Log.e("-->1x:",x[4]+""+"   "+y[4]);    }    public double getMaxint(){        double max=0;        for (int i=0;i<listDate.size();i++){            if(listDate.get(i)>max){                max=listDate.get(i);            }        }        return max;    }    //穿入数据源返回数据源应有的高度    public double getMyHeight(double d){      int height=getHeight()-paddintTop;////        Log.e("-->xx:height:",height+"");//        Log.e("-->xx:maxDate:",maxDate+"");//        Log.e("-->xx:d:",d+"");//        Log.e("-->xx:zhi:",height*(d/maxDate)+paddingBottom+"");        return (height-(height*(d/maxDate)))+paddintTop;    }    public double getMyWeight(int posotion){//        jgwidth=getWidth()-60;//        jgwidth=width/(listDate.size()-1);//        int width=getWidth()-paddingLeft-paddingRight;//        jgwidth=width/(listDate.size()-1);        return posotion*jgwidth+paddingLeft;    }    public MyView(Context context) {        super(context);    }    public MyView(Context context, AttributeSet attrs) {        super(context, attrs);    }    public MyView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        return super.onTouchEvent(event);    }}

效果图：

思路：
首先绘制不规则多边形,蓝色的一大块区域图及时,

根据点绘制6条线,蓝色的连着圆形的

圆形因为不知道怎么设置空心的颜色,

所以绘制了2次,

第一次绘制的蓝色大圆,

第二次绘制白色小圆,

一层层覆盖上去,即达到这个效果图,搞了2天 ,虽然代码写的很渣渣,好歹效果还是大概成型了