Android画图-动态折线图(一秒一画)

第一次接触的可以看一下这个,最基础的画图https://blog.csdn.net/hanmoliuxuan/article/details/82490762


图片
这里写图片描述

代码
准备工作

public static int j[]={0,2,2,2,4,2,2,6,2,9,2};
    Draw1 draw1;
    int i=0;
    public Draw1(Context context, AttributeSet attrs) {
        super(context, attrs);
        draw1=(Draw1) findViewById(R.id.draw1);
        handler.postDelayed(runnable, 100);
    }
    Handler handler=new Handler();
    Runnable runnable=new Runnable() {

        @Override
        public void run() {
            handler.postDelayed(this, 1000);
            i++;
            if (i>10) 
            {
                i=0;
                Newpoints();
                //10秒走完归零,刷新点
            }
            draw1.invalidate();
        }
    };
    Paint FillPaint=new Paint();
    Paint textPaint=new Paint();
    Paint pointPaint=new Paint();
    int x,y,px,py;

画图

    @SuppressLint("DrawAllocation")
    @Override
    protected void onDraw(final Canvas canvas) {
        // TODO Auto-generated method stub
        super.onDraw(canvas);

        FillPaint.setAntiAlias(true);
        FillPaint.setStrokeWidth(3);
        FillPaint.setStyle(Style.FILL);
        FillPaint.setColor(Color.GREEN);

        textPaint.setTextSize(20);

        pointPaint.setStrokeWidth(3);
        pointPaint.setColor(Color.BLACK);
        pointPaint.setStyle(Style.STROKE);
        pointPaint.setAntiAlias(false);
        //画笔设置

        canvas.drawLine(20, 20, 20, getHeight()-20, FillPaint);//y轴,20是离屏幕边距可以自己改
        canvas.drawLine(20, getHeight()-20, getWidth(), getHeight()-20, FillPaint);//x轴
        //x轴刻度

        x=getWidth()-20;//x轴长度
        px=x/10;//分成10份,一份长度
        for (int i = 1; i <=10; i++) 
        {
            canvas.drawLine(px*i+20, getHeight()-20, px*i+20 ,getHeight()-30, FillPaint);   
        }
        //刻度线要高一点点,看得出是一条线
        //y轴刻度
        y=getHeight()-20;
        py=y/10;
        for (int i = 1; i <=10; i++) 
        {
            canvas.drawLine(20, getHeight()-py*i-20,30,getHeight()-py*i-20, FillPaint); 
        }

        //数字
        for (int i = 0; i <=10; i++) 
        {
            canvas.drawText(""+i,5,getHeight()-py*i, textPaint);            
        }

        for (int i = 1; i <=10; i++) 
        {       
            canvas.drawText(""+i,px*i+20,y+20, textPaint);
        }

重点

        //画点连线
        int lastx=20,lasty=20,nowx=20,nowy=20;
        for (int k = 0; k <=i; k++) {//i是0-10进行增加,则每次多画一个点,实现了一秒一画的动画效果
            canvas.drawCircle(px*k+20, j[k]*py,4, pointPaint);
            //x轴从0坐标开始,px*0+20=20就是第一个点
            //y轴j的第k个*每一份的长度
            //4是圆的半径
             nowx=px*k+20;
             nowy=j[k]*py;
             //保存当前点
             canvas.drawLine(lastx, lasty, nowx, nowy, FillPaint);
             lastx=nowx;
             lasty=nowy;
              //画线要两个点,所以要保存上一次的点
             if (k==10) 
             {
                j[0]=j[10];
             }
             //当到第10个y点时,保存第10个点,用来与下一组点衔接
        }
    }
    public static void Newpoints() 
    {
        Random random=new Random();
        for (int i = 1; i <=10; i++) 
        {
            Draw1.j[i]=random.nextInt(10);
        }
    }

猜你喜欢

转载自blog.csdn.net/hanmoliuxuan/article/details/82584778
今日推荐