第一个自定义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天 ,虽然代码写的很渣渣,好歹效果还是大概成型了