android自定义view(三)绘制表格和坐标系

真的很是简单css

 

运行效果截图:java

 

说说几个经常使用的方法吧android

画点 canvas

 canvas.drawPoint(200, 200, mPaint);     //在坐标(200,200)位置绘制一个点
canvas.drawPoints(new float[]{          //绘制一组点,坐标位置由float数组指定
      500,500,
      500,600,
      500,700
},mPaint);数组

画线 ide

 mPath.moveTo(100,500);起始点坐标

   mPath.lineTo(300,300); 结束点坐标,意思就是把这两个点用直线链接起来

或者oop

canvas.drawLine(300,100,600,400,paintAxes2);跟上面一张,只是写成了一个 x1y1 起始点坐标  x2y2结束点坐标

绘制曲线,方法不少种,这里列举两种code

   mPath.moveTo(100,500);

   mPath.lineTo(300,300);
  mPath.quadTo(300,100,600,500);  //原来绘制曲线是这么绘制的啊
或者
  mPath.cubicTo(100,500,300,100,600,500);  //原来  x1 y1 就是把moveto移过来啊

这些参数第一次看的同窗确定懵了,一堆是啥意思呢,原来6个参数分别是x1  y1  ,x2  y2,x3 y3blog

x1y1表示起点坐标,x2y2表示中间点的坐标,x3y3表示结束点坐标,它们之间使用曲线进行链接,最后的效果就是一个平滑的曲线ssl

剩下一堆一堆的,你们慢慢研究吧,详情请参考这位大神的博客,写的很好

http://www.gcssloop.com/customview/Canvas_BasicGraphics 

package com.example.administrator.testz;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Rect;
import android.support.v4.content.ContextCompat;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.view.View;

/**
 * Created by Administrator on 2018\9\14 0014.
 */

public class AudioView extends View {
    private Paint paintAxes;
    private Paint paintAxes2;

    private String[] xnums={"0","1","2","3","4","5","6","7","8","9","10"};
    private String[] ynums={"","100","200","300","400","500","600","700","800","900","1000"};
    private CharSequence charSequence;
    private static final int Max_Y = 580;
    private static final int Max_X = 1000;
    private static final int  startX = 40;
    private static final int  LINE_NUM = 10;


    public AudioView(Context context) {
        super(context);
    }

    public AudioView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public AudioView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }




    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        paintAxes = new Paint();
        paintAxes = new Paint();
        paintAxes.setStyle(Paint.Style.STROKE);
        paintAxes.setAntiAlias(true);
        paintAxes.setDither(true);
        paintAxes.setColor(ContextCompat.getColor(getContext(), R.color.colorAccent));
        paintAxes.setStrokeWidth(4);



        paintAxes2 = new Paint();
        paintAxes2.setStyle(Paint.Style.STROKE);
        paintAxes2.setDither(true);
        paintAxes2.setAntiAlias(true);
        paintAxes2.setColor(ContextCompat.getColor(getContext(), R.color.gray));
        paintAxes2.setTextSize(15);



        Path mPath = new Path();
        Rect textRec = new Rect(300,100,600,400);
         mPath.moveTo(100,500);

      //  mPath.lineTo(300,300);
       // mPath.quadTo(300,100,600,500);  //原来绘制曲线是这么绘制的啊
        mPath.cubicTo(100,500,300,100,600,500);  //原来  x1 y1 就是把moveto移过来啊
        canvas.drawPath(mPath,paintAxes);
        //画圆 分别是 x,y,半径,画笔
        for (int i = 1; i <= 2; i++) {
            // drawcircle这个参数是绘制圆形的
            canvas.drawCircle(500, 350, 50*i, paintAxes);
        }
        //  left  top right bottom  300  400
        //canvas.drawRect(textRec,paintAxes);
     //   canvas.drawLine(300,100,600,400,paintAxes2);
        //绘制X轴


        /*canvas.drawText(txtFirst,20,600,paintAxes2);
        canvas.drawText(txtLast,1000,600,paintAxes2);
       // canvas.drawLine(20,580,1000,580,paintAxes2);

        canvas.drawLine(20,580,20,20,paintAxes2);*/



      //画表格
        for (int i = 1; i <= LINE_NUM; i++) {
            //画横线     Max_Y = 580   Max_X = 1000  startX = 20
            canvas.drawLine(startX,Max_Y/LINE_NUM*i,Max_X,Max_Y/LINE_NUM*i,paintAxes2);
            canvas.drawLine(startX,Max_Y,startX,startX,paintAxes2);
            canvas.drawLine((Max_X-startX)/LINE_NUM*i,Max_Y,(Max_X-startX)/LINE_NUM*i,startX,paintAxes2);

        }

        //画刻度
        for (int i = 0; i <= LINE_NUM; i++) {
            //画横线     Max_Y = 580   Max_X = 1000  startX = 20
            //               四个参数   显示内容  x坐标  y坐标   画笔
            //  canvas.drawText(txtLast,1000,600,paintAxes2);
            canvas.drawText(xnums[i],(Max_X-startX)/LINE_NUM*i,600,paintAxes2);
            canvas.drawText(ynums[10-i],0,Max_Y/LINE_NUM*i,paintAxes2);


        }

//  Max_Y = 580   Max_X = 1000  startX = 20
   /*     for (int i = 1; i <= 5; i++) {
            mPath.moveTo(20, 580/5*i);
            mPath.lineTo(1000, 580/5*i);
            canvas.drawPath(mPath, paintAxes2);
        }
*/
 
    }
}