当前位置:网站首页>Customize view to draw line chart (support zoom)

Customize view to draw line chart (support zoom)

2022-06-21 13:17:00 Azadoo

results : No matter how big the line chart is Where to put it The line chart can be scaled

Main idea :

  1. Data processing :
    According to the data quantity and layout width 、 coordinate Calculation point x、y Coordinate spacing distance and corresponding coordinates
  2. draw :
    stay onDraw Within the method need Path、Paint The object of path Responsible for drawing polylines ,Paint Responsible for setting the color 、 Shape and other information
    Drawing lines : The first point needs to use path.moveTo() Later use path.lineTo() To realize the broken line Finally using canvas.drawPath() Draw it out
    Drawing of points : Use it directly canvas.drawPoint() Drawing
package com.example.myapplication;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.DashPathEffect;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PointF;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;

import androidx.annotation.Nullable;

import java.util.ArrayList;

public class MyLineChartView extends View {


    private double[] dataList = {120.0, 130.0, 160.0, 115.0, 180.0};
    private ArrayList<PointF> xyList = new ArrayList<PointF>();
    private Paint mLinePaint = new Paint();
    private double minWeight = Integer.MAX_VALUE;
    private double maxWeight = 0;
    private Context mContext;
    private double spaceX;
    private int spaceY;
    public MyLineChartView(Context context) {
        this(context, null);
        this.mContext = context;
    }

    public MyLineChartView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
        this.mContext = context;
    }

    public MyLineChartView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.mContext = context;
        int a = mContext.getResources().getDisplayMetrics().widthPixels;
        //  Find the maximum and minimum 
        for (int i = 0; i< dataList.length; i++) {
            if (dataList[i] < minWeight) {
                minWeight = dataList[i];
            }
            if (dataList[i] > maxWeight) {
                maxWeight = dataList[i];
            }
        }

        // Polyline brush 
        mLinePaint.setColor(Color.RED);
        mLinePaint.setStrokeWidth(dp2px(5));
        mLinePaint.setStyle(Paint.Style.STROKE);
        mLinePaint.setAntiAlias(true);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        calculationData(getLeft(), getTop(), getRight(), getBottom());
        int a = getWidth();
        Path path = new Path();
        Paint paint= new Paint();
        paint.setAntiAlias(true);// Sawtooth removal 
        paint.setColor(Color.BLACK);// Color 
        paint.setStrokeCap(Paint.Cap.ROUND);
        paint.setStrokeWidth(40);
        for (int i = 0; i < dataList.length; i++) {
            if (i == 0) {
                path.moveTo(xyList.get(i).x, xyList.get(i).y);
            } else {
                path.lineTo(xyList.get(i).x, xyList.get(i).y);
            }
        }
        canvas.drawPath(path, mLinePaint);// Broken line 
        for (int i = 0; i < dataList.length; i++) {
            canvas.drawPoint(xyList.get(i).x, xyList.get(i).y, paint);
        }
    }

    protected float dp2px(float v) {
        return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, v, getResources().getDisplayMetrics());
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
    }

    private void calculationData(int left, int top, int right, int bottom) {
        spaceX = (right - left) / (dataList.length + 1);
        spaceY = (bottom - top) / 6;
        //  Set up xy coordinate 
        for (int i = 0; i< dataList.length; i++) {
            PointF pointF = new PointF((int) (spaceX * ( i + 1 )), (int) ((1 - ((dataList[i] - minWeight)
                    / (maxWeight - minWeight))) * (bottom - top )) );
            xyList.add(pointF);
        }
    }

}
原网站

版权声明
本文为[Azadoo]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/172/202206211204339886.html