其實折線圖很簡單，並沒有想象的那麼複雜，首先來看看效果圖。

因為折線圖是填充的,且花的順序也有講究，後面的畫的東西可能會吧前面額遮擋掉哦！

下面看程式碼：

public class LineGraphView extends View {

    private int XPoint = 30;//X座標點
    private int YPoint = 520;//Y座標點
    private int XScale = 100;//X軸間距
    private int YScale = 90;//Y軸間距
    private int XLength = 660;
    private int YLength = 370;

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

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

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

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setAntiAlias(true); //去鋸齒
        paint.setColor(Color.parseColor("#38b2ff"));

        //畫Y軸
        canvas.drawLine(XPoint, YPoint - YLength, XPoint, YPoint, paint);

        //畫X軸
        canvas.drawLine(XPoint, YPoint, XPoint + XLength, YPoint, paint);

        String[] days = new String[6];
        for (int i = 0; i < days.length; i++) {
            days[i] = String.valueOf(25 + i);
        }
        //畫折線的筆
        Paint paint2 = new Paint();
        paint2.setStyle(Paint.Style.FILL);
        paint2.setAntiAlias(true); //去鋸齒
        paint2.setColor(Color.parseColor("#38b2ff"));
        paint2.setAlpha(160);
        //描邊的筆
        Paint paint3 = new Paint();
        paint3.setStyle(Paint.Style.STROKE);
        paint3.setAntiAlias(true); //去鋸齒
        paint3.setColor(Color.parseColor("#38b2ff"));
        paint3.setStrokeWidth(4);
        //畫遠點的筆
        Paint paint4 = new Paint();
        paint4.setStrokeWidth(15);
        paint4.setStrokeCap(Paint.Cap.ROUND);
        paint4.setColor(Color.parseColor("#38b2ff"));

        //畫折線圖
        Path path = new Path();
        path.moveTo(XPoint, YPoint);

        for (int i = 0; i < days.length; i++) {
            float pointy = (float) (YPoint - Math.random() * 400);
            path.lineTo(XPoint + (i + 1) * YScale, pointy);
            canvas.drawPoint(XPoint + (i + 1) * YScale, pointy, paint4);
        }
        path.lineTo(XPoint + XLength, YPoint);
        canvas.drawPath(path, paint2);
        canvas.drawPath(path, paint3);

        //畫文字
        Paint paint1 = new Paint();
        paint1.setStyle(Paint.Style.STROKE);
        paint1.setAntiAlias(true); //去鋸齒
        paint1.setColor(Color.parseColor("#ffffff"));
        paint1.setTextSize(30);
        for (int i = 0; i < days.length; i++) {
            canvas.drawText(days[i], XPoint + (i + 1) * YScale - 15, YPoint, paint1);//文字
        }
    }
}
 

程式碼差不多就這樣，需要注意的是，座標點的確定，文字需要在中間，所有一個文字大小的偏移。有不懂的問題歡迎提問。

github程式碼：https://github.com/MasterSumCloud/lineGraphView