Android:自定义折线图

最新推荐文章于 2022-06-04 13:05:48 发布

原创最新推荐文章于 2022-06-04 13:05:48 发布 · 505 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍如何在Android应用中创建自定义的折线图。通过加载自定义布局LineView，实现绘制并展示折线图的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

创建Activity去加载自定义布局
LineView

public class LineView extends View {
    private String[] timeArr={
            "00:00","06:00","12:00","18:00","24:00"
    };
    //温度值
    private String[] arr={
            "-20°","-10°","0°","10°","20°","30°","40°"
    };
    private Paint mPaint;
    private float margin=60;
    private Path mPath;

    public LineView(Context context) {
        super(context);
        init(context);
    }

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

    public LineView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }
   // 初始化
    private void init(Context context) {
        mPath=new Path();
        setBackgroundColor(Color.parseColor("#222222"));
        mPaint=new Paint();
        mPaint.setColor(Color.WHITE);
        mPaint.setStrokeWidth(6);
        mPaint.setTextSize(26);
        mPaint.setTextAlign(Paint.Align.CENTER);
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //绘制标题
        canvasTitle(canvas);
        //绘制XY
        canvasXY(canvas);
        //绘制时间轴刻度
        canvasTime(canvas);
        //绘制折线
        canvasLine(canvas);
    }

    //绘制折线
    private void canvasLine(Canvas canvas) {
        mPaint.setColor(Color.WHITE);
        //获取X轴的长度
        float xWidth=getRight()-margin*2;
        //每一份的长度
        float vWidth=xWidth/timeArr.length;
        //获取Y轴的长度
        float yHeight=getBottom()-margin*2;
        //均等y轴刻度
        float vHeight=yHeight/arr.length;
        canvas.drawLine(margin,getBottom()-margin,margin+vWidth,yHeight-vHeight,mPaint);
        canvas.drawLine(margin+vWidth,yHeight-vHeight,margin+vWidth*2,yHeight-vHeight*4,mPaint);
        //绘制圆
        // mPaint.setStyle(Paint.Style.STROKE);
        canvas.drawCircle(margin+vWidth,yHeight-vHeight,10,mPaint);
    }

    //绘制时间
    private void canvasTime(Canvas canvas) {
        //获取X轴的长度
        float xWidth=getRight()-margin*2;
        //每一份的长度
        float vWidth=xWidth/timeArr.length;
        float deWidth=margin;
        for (int a=0;a<timeArr.length;a++){
            if(a==0){
                canvas.drawText(timeArr[a],margin+margin/2,getBottom()-margin+30,mPaint);
            }else{
                deWidth+=vWidth;//deWidth=deWidth+vWidth
                canvas.drawText(timeArr[a],deWidth+margin/2,getBottom()-margin+30,mPaint);
            }
        }
        //获取Y轴的长度
        float yHeight=getBottom()-margin*2;
        //均等y轴刻度
        float vHeight=yHeight/arr.length;
        float defHeight=getBottom()-margin;//默认的坐标
        float defLineHeight=getBottom()-margin;//默认的坐标
        int color=Color.WHITE;
        for (int b=0;b<arr.length;b++){
            switch (b){
                case 0:
                    color=Color.GRAY;
                    break;
                case 1:
                    color=Color.YELLOW;
                    break;
                case 2:
                    color=Color.GRAY;
                    break;
                case 3:
                    color=Color.GREEN;
                    break;
                case 4:
                    color=Color.RED;
                    break;
            }
            mPaint.setColor(Color.WHITE);
            if(b==0){
                canvas.drawText(arr[b],margin-20,defHeight,mPaint);
            }else{
                defHeight-=vHeight;
                canvas.drawText(arr[b],margin-20,defHeight,mPaint);
            }
            mPaint.setColor(color);
            if(b==0){
                canvas.drawLine(margin,defLineHeight-vHeight,margin,defLineHeight,mPaint);
            }else{
                canvas.drawLine(margin,defLineHeight-vHeight*(b+1),margin,defLineHeight-vHeight*b,mPaint);
            }
        }
    }
    //绘制xy
    private void canvasXY(Canvas canvas) {
        mPaint.setColor(Color.WHITE);
        canvas.drawLine(margin,getBottom()-margin,getRight()-margin,getBottom()-margin,mPaint);
        canvas.drawLine(margin,margin,margin,getBottom()-margin,mPaint);
    }
    private void canvasTitle(Canvas canvas) {
        mPaint.setColor(Color.WHITE);
        canvas.drawText("帝都气温折现图",getRight()/2,50,mPaint);
    }