Android图表控件MPAndroidChart之线形图表介绍（LineChart）

效果：

一，添加依赖：

1 . 在project的build.gradle中添加依赖：

    repositories {
        //......//
        maven { url "https://jitpack.io"}//chart需求
    }

2 . 在app的build.gradle中添加依赖：

dependencies {
    //......//
    implementation 'com.github.PhilJay:MPAndroidChart:v3.0.3'
}

二，布局文件：

三，封装类（可以直接用，也可修改成自己需求的）：

import android.graphics.Color;
import com.github.mikephil.charting.animation.Easing;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.LimitLine;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
import com.github.mikephil.charting.listener.OnChartGestureListener;
import com.github.mikephil.charting.listener.OnChartValueSelectedListener;
import com.github.mikephil.charting.utils.Utils;
import java.util.ArrayList;
import java.util.List;

/**
 * 线形图表
 */
public class MPLineChartManager {
    //线形表
    private LineChart mLineChart;
    private List setList;
    public MPLineChartManager(LineChart lineChart){
        this.mLineChart = lineChart;
        setList = new ArrayList<>();
    }
    /**
     * 设置X轴
     * @param isEnable 设置轴启用或禁用 如果禁用以下的设置全部不生效
     * @param isgdl x轴上每个点对应的线 true=显示/false=禁用
     * @param gdl 设置竖线的显示样式 若isgdl=true时显示： 0=实线/!0=虚线
     * @param xColor x轴字体颜色
     * @param xPosition x轴的显示位置
     * @param xAngle x轴标签的旋转角度
     * */
    public void setXAxis(boolean isEnable, boolean isgdl, float gdl, int xColor, XAxis.XAxisPosition xPosition, float xAngle){
        XAxis xAxis = mLineChart.getXAxis();
        xAxis.setEnabled(isEnable);//设置轴启用或禁用 如果禁用以下的设置全部不生效
        xAxis.setDrawGridLines(isgdl);//设置x轴上每个点对应的线
        //设置竖线的显示样式为虚线：lineLength控制虚线段的长度，spaceLength控制线之间的空间
        xAxis.enableGridDashedLine(gdl, gdl, 0f);
        xAxis.setDrawLabels(true);//绘制标签  指x轴上的对应数值
        xAxis.setPosition(xPosition);//设置x轴的显示位置
        xAxis.setTextColor(xColor);//设置字体颜色

        xAxis.setAvoidFirstLastClipping(true);//图表将避免第一个和最后一个标签条目被减掉在图表或屏幕的边缘
        xAxis.setLabelRotationAngle(xAngle);//设置x轴标签的旋转角度
    }
    /**
     * 设置Y轴
     * @param lineList 限制线列表
     * @param gdl 虚线设置
     * */
    public void setYLeftAndLimit(List lineList, float gdl) {
        mLineChart.getAxisRight().setEnabled(false);//禁用右边的轴线
        YAxis leftAxis = mLineChart.getAxisLeft();
        //重置所有限制线,以避免重叠线
        leftAxis.removeAllLimitLines();
        //设置限制线
        if (lineList != null){
            for (LimitLine item : lineList) {
                leftAxis.addLimitLine(item);
            }
        }
        leftAxis.enableGridDashedLine(gdl, gdl, 0f);
        leftAxis.setDrawLimitLinesBehindData(true);//是否绘制0所在的网格线
    }
    public void setYRightAndLimit(List lineList, float gdl) {
        mLineChart.getAxisLeft().setEnabled(false);
        YAxis rightAxis = mLineChart.getAxisRight();
        //重置所有限制线,以避免重叠线
        rightAxis.removeAllLimitLines();
        //设置限制线
        for (LimitLine item : lineList){
            rightAxis.addLimitLine(item);
        }
        rightAxis.enableGridDashedLine(gdl, gdl, 0f);
        rightAxis.setDrawLimitLinesBehindData(true);
    }
    /**
     * 设置与图表交互
     * @param isTE 设置是否可以触摸  为fase时后面无效
     * @param isDE 是否可以拖拽
     * @param isDX 是否可以缩放 仅x轴
     * @param isDY 是否可以缩放 仅y轴
     * @param isDXY 设置x轴和y轴能否同时缩放。默认是false
     * @param isDoubleMax 设置是否可以通过双击屏幕放大图表。默认是true
     * @param isHPDE 能否拖拽高亮线(数据点与坐标的提示线)，默认是true
     * @param isDDLE 拖拽滚动时，手放开是否会持续滚动，默认是true（false是拖到哪是哪，true拖拽之后还会有缓冲）
     * */
    public void setInteraction(boolean isTE, boolean isDE, boolean isDX, boolean isDY, boolean isDXY,
                               boolean isDoubleMax, boolean isHPDE, boolean isDDLE){
        mLineChart.setTouchEnabled(isTE); // 设置是否可以触摸
        mLineChart.setDragEnabled(isDE);// 是否可以拖拽
        mLineChart.setScaleEnabled(false);// 是否可以缩放 x和y轴, 默认是true
        mLineChart.setScaleXEnabled(isDX); //是否可以缩放 仅x轴
        mLineChart.setScaleYEnabled(isDY); //是否可以缩放 仅y轴
        mLineChart.setPinchZoom(isDXY);  //设置x轴和y轴能否同时缩放。默认是否
        mLineChart.setDoubleTapToZoomEnabled(isDoubleMax);//设置是否可以通过双击屏幕放大图表。默认是true
        mLineChart.setHighlightPerDragEnabled(isHPDE);//能否拖拽高亮线(数据点与坐标的提示线)，默认是true
        mLineChart.setDragDecelerationEnabled(isDDLE);//拖拽滚动时，手放开是否会持续滚动，默认是true（false是拖到哪是哪，true拖拽之后还会有缓冲）
        mLineChart.setDragDecelerationFrictionCoef(0.99f);//与上面那个属性配合，持续滚动时的速度快慢，[0,1) 0代表立即停止。
    }
    /**
     * 设置图例
     * @param position 设置图例的位置 Legend.LegendPosition.枚举
     * @param txtSize 设置文字大小
     * @param type 正方形，圆形或线 Legend.LegendForm.枚举
     *
     * */
    public void setLegend(Legend.LegendPosition position, float txtSize, int txtColor, Legend.LegendForm type){
        Legend legend = mLineChart.getLegend();//图例
        legend.setPosition(position);//设置图例的位置
        legend.setTextSize(txtSize);//设置文字大小
        legend.setTextColor(txtColor);
        legend.setForm(type);//正方形，圆形或线
        legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);
        legend.setFormSize(8f); // 设置Form的大小
        legend.setWordWrapEnabled(true);//是否支持自动换行 目前只支持BelowChartLeft, BelowChartRight, BelowChartCenter
        legend.setFormLineWidth(0f);//设置Form的宽度
    }
    //x轴动画
    public void animationX(int duration){
        mLineChart.animateX(duration);
    }
    public void animationX(int duration, Easing.EasingOption eo){
        mLineChart.animateX(duration, eo);
    }
    //y轴动画
    public void animationY(int duration){
        mLineChart.animateY(duration);
    }
    public void animationY(int duration, Easing.EasingOption eo){
        mLineChart.animateY(duration, eo);
    }
    //xy轴动画
    public void animationXY(int x, int y) {
        mLineChart.animateXY(x, y);
    }
    public void animationXY(int x, int y, Easing.EasingOption eox, Easing.EasingOption eoy) {
        mLineChart.animateXY(x, y, eox, eoy);
    }
    /**
     * 创建
     * @param values 数据值
     * @param title 标题
     * @param dl 线各种长度
     * @param color 颜色
     * @param txtSize 字体大小
     * @param isDHL 是否禁用点击高亮线
     * @param dHL 线
     * @param colorDHL 线颜色
     * @param isFill 是否充填
     * @param colorFill 充填颜色
     * */
    public void addData(ArrayList values, String title, float dl, int color, float txtSize,
                        boolean isDHL, float dHL, int colorDHL,
                        boolean isFill, int colorFill) {
        // 创建一个数据集,并给它一个类型
        LineDataSet set = new LineDataSet(values, title);
        // 在这里设置线
        set.enableDashedLine(dl, dl, 0f);
        set.setColor(color);
        set.setCircleColor(color);
        set.setLineWidth(1f);
        set.setCircleRadius(2f);
        set.setValueTextSize(txtSize);
        //是否禁用点击高亮线
        set.setHighlightEnabled(isDHL);
        set.enableDashedHighlightLine(dHL, dHL, 0f);//点击后的高亮线的显示样式
        set.setHighlightLineWidth(2f);//设置点击交点后显示高亮线宽
        set.setHighLightColor(colorDHL);//设置点击交点后显示交高亮线的颜色
        //填充
        set.setDrawFilled(isFill);
        if (Utils.getSDKInt() >= 18) {// 填充背景只支持18以上
            //Drawable drawable = ContextCompat.getDrawable(this, R.mipmap.ic_launcher);
            //set.setFillDrawable(drawable);
            set.setFillColor(colorFill);
        } else {
            set.setFillColor(Color.BLACK);
        }
        setList.add(set);

        //ArrayList dataSets = new ArrayList();
        ////添加数据集
        //dataSets.add(set);
        ////创建一个数据集的数据对象
        //LineData data = new LineData(dataSets);
        ////谁知数据
        //mLineChart.setData(data);
    }

    public void setData(){
        ArrayList dataSets = new ArrayList();
        //添加数据集
        for (LineDataSet item : setList){
            dataSets.add(item);
        }
        //创建一个数据集的数据对象
        LineData data = new LineData(dataSets);
        //谁知数据
        mLineChart.setData(data);
    }
    /**
     * 刷新数据
     * @param lists 数据列表
     * */
    public void refreshData(List> lists) {
        for (int i=0; i < setList.size(); i++) {
            setList.set(i, (LineDataSet) mLineChart.getData().getDataSetByIndex(i));
            setList.get(i).setValues(lists.get(i));
        }
        mLineChart.getData().notifyDataChanged();
        mLineChart.notifyDataSetChanged();
    }

    // 刷新
    public void invalidate(){
        this.mLineChart.invalidate();
    }
    
    //是否显示顶点值
    public void changeTheVerValue(boolean b){
        //获取到当前值
        List sets = mLineChart.getData().getDataSets();
        for (ILineDataSet iSet : sets) {
            LineDataSet set = (LineDataSet) iSet;
            //切换显示/隐藏
            set.setDrawValues(b);
        }
        //刷新
        invalidate();
    }
    //是否填充
    public void changeFilled(boolean b){
        List setsFilled = mLineChart.getData().getDataSets();
        for (ILineDataSet iSet : setsFilled) {
            LineDataSet set = (LineDataSet) iSet;
            set.setDrawFilled(b);
        }
        invalidate();
    }
    //是否显示圆点
    public void changeTheVerCircle(boolean b){
        List setsCircles = mLineChart.getData().getDataSets();
        for (ILineDataSet iSet : setsCircles) {
            LineDataSet set = (LineDataSet) iSet;
            set.setDrawCircles(b);
        }
        invalidate();
    }
    //切换立方
    public void changeMode(LineDataSet.Mode mode){
        List setsCubic = mLineChart.getData().getDataSets();
        for (ILineDataSet iSet : setsCubic) {
            LineDataSet set = (LineDataSet) iSet;
            set.setMode(mode);
        }
        invalidate();
    }
    //设置监听事件
    public void setListener(OnChartGestureListener onChartGestureListener, OnChartValueSelectedListener onChartValueSelectedListener){
        //设置手势滑动事件
        mLineChart.setOnChartGestureListener(onChartGestureListener);
        //设置数值选择监听
        mLineChart.setOnChartValueSelectedListener(onChartValueSelectedListener);
    }
}

四，调用（例子）：

在Activity中调用例子，可根据自己的需求修改。
1 . 定义，初始化相关组件及添加事件：

    private MPLineChartManager mpLineChartManager;
    private View chart_btn_LineChart;
    private LineChart chart_v_LineChart;
    private View chart_btn_lc_changeTheVerValue;
    private boolean is_changeTheVerValue = true;
    private View chart_btn_lc_changeFilled;
    private boolean is_changeFilled = true;
    private View chart_btn_lc_changeTheVerCircle;
    private boolean is_changeTheVerCircle = true;
    private View chart_btn_lc_changeMode;
    private int state_changeMode = 1;
    private TextView chart_btn_lc_animationX;
    private TextView chart_btn_lc_animationY;
    private int state_animationY = 1;
    private View chart_btn_lc_animationXY;
    private View chart_btn_lc_refresh;

    private void initLineChart(){
        chart_btn_LineChart = findViewById(R.id.chart_btn_LineChart);
        chart_v_LineChart = (LineChart) findViewById(R.id.chart_v_LineChart);
        chart_btn_lc_changeTheVerValue  = findViewById(R.id.chart_btn_lc_changeTheVerValue);
        chart_btn_lc_changeFilled = findViewById(R.id.chart_btn_lc_changeFilled);
        chart_btn_lc_changeTheVerCircle = findViewById(R.id.chart_btn_lc_changeTheVerCircle);
        chart_btn_lc_changeMode = findViewById(R.id.chart_btn_lc_changeMode);
        chart_btn_lc_animationX = (TextView) findViewById(R.id.chart_btn_lc_animationX);
        chart_btn_lc_animationY = (TextView) findViewById(R.id.chart_btn_lc_animationY);
        chart_btn_lc_animationXY = (TextView) findViewById(R.id.chart_btn_lc_animationXY);
        chart_btn_lc_refresh = findViewById(R.id.chart_btn_lc_refresh);

        chart_btn_lc_refresh.setOnClickListener(clickListener);
        chart_btn_lc_animationXY.setOnClickListener(clickListener);
        chart_btn_LineChart.setOnClickListener(clickListener);
        chart_btn_lc_changeTheVerValue.setOnClickListener(clickListener);
        chart_btn_lc_changeFilled.setOnClickListener(clickListener);
        chart_btn_lc_changeTheVerCircle.setOnClickListener(clickListener);
        chart_btn_lc_changeMode.setOnClickListener(clickListener);
        chart_btn_lc_animationX.setOnClickListener(clickListener);
        chart_btn_lc_animationY.setOnClickListener(clickListener);
    }
        
    private View.OnClickListener clickListener = new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            switch (view.getId()){
                //  start --------------- 线形图 ------------------
                case R.id.chart_btn_lc_refresh: // 刷新
                {
                    click_lc_Refresh();
                    break;
                }
                case R.id.chart_btn_lc_animationXY:// x，y轴动画
                {
                    mpLineChartManager.animationXY(3000, 3000);
                    break;
                }
                case R.id.chart_btn_lc_animationY:// y轴动画
                {
                    click_lc_AnimationY();
                    break;
                }
                case R.id.chart_btn_lc_animationX:// x轴动画
                {
                    Random rand = new Random();
                    int duration = (rand.nextInt(20) + 1) * 1000;
                    mpLineChartManager.animationX(duration);
                    chart_btn_lc_animationX.setText("x轴动画 " + String.valueOf(duration));
                    break;
                }
                case R.id.chart_btn_lc_changeMode://切换立方
                {
                    click_lc_changeMode()；
                    break;
                }
                case R.id.chart_btn_lc_changeTheVerCircle://是否显示顶点
                {
                    click_lc_changeTheVerCircle();
                    break;
                }
                case R.id.chart_btn_lc_changeFilled://是否填充
                {
                    click_lc_changeFilled();
                    break;
                }
                case R.id.chart_btn_lc_changeTheVerValue://是否显示顶点值
                {
                    click_lc_changeTheVerValue();
                    break;
                }
                case R.id.chart_btn_LineChart: //创建线形图表
                {
                    clickLineChart();
                    break;
                }
                //  end --------------- 线形图 ------------------
            }
        }
    };

2 . 创建图表：

    private void clickLineChart() {
        mpLineChartManager = new MPLineChartManager(chart_v_LineChart);
        mpLineChartManager.setXAxis(true, true, 10f, Color.BLUE, XAxis.XAxisPosition.BOTTOM, 10f);
        // 假数据 限制线列表（可以不添加）
        LimitLine limit1 = new LimitLine(180f, "优秀");
        limit1.setLineWidth(1f);
        limit1.enableDashedLine(10f, 10f, 0f);
        limit1.setLabelPosition(LimitLine.LimitLabelPosition.RIGHT_TOP);
        limit1.setTextSize(10f);
        LimitLine limit2 = new LimitLine(120f, "不及格");
        limit2.setLineWidth(1f);
        limit2.enableDashedLine(10f, 10f, 0f);
        limit2.setLabelPosition(LimitLine.LimitLabelPosition.RIGHT_BOTTOM);
        limit2.setTextSize(10f);
        // 添加限制线值
        List lineList = new ArrayList<>();
        lineList.add(limit1);
        lineList.add(limit2);
        mpLineChartManager.setYLeftAndLimit(lineList, 10f);

        //假数据 折线1111
        ArrayList values1 = new ArrayList();
        values1.add(new Entry(100, 120));
        values1.add(new Entry(120, 150));
        values1.add(new Entry(130, 120));
        values1.add(new Entry(140, 130));
        values1.add(new Entry(150, 110));
        mpLineChartManager.addData(values1, "小兵一号", 0f, Color.BLUE,8f,
                false, 5f, Color.GREEN,
                true, Color.YELLOW);

        //假数据 折线2222
        ArrayList values2 = new ArrayList();
        values2.add(new Entry(100, 30));
        values2.add(new Entry(120, 60));
        values2.add(new Entry(130, 100));
        values2.add(new Entry(140, 180));
        values2.add(new Entry(150, 20));
        mpLineChartManager.addData(values2, "小兵二号", 5f, Color.BLACK,8f,
                false, 5f, Color.GREEN,
                true, Color.RED);

        mpLineChartManager.setData();
        mpLineChartManager.setInteraction(true,true, true, true, false,
                false, false, false);
        mpLineChartManager.setLegend(Legend.LegendPosition.ABOVE_CHART_LEFT, 10f, Color.BLACK, Legend.LegendForm.CIRCLE);
        mpLineChartManager.invalidate();
    }

3 . 刷新数据：

    private void click_lc_Refresh(){
        //假数据  临时测试值，根据实情处理
        Random random = new Random();
        int n1 = random.nextInt(200);
        int n2 = random.nextInt(200);
        int n3 = random.nextInt(200);
        int n4 = random.nextInt(200);
        int n5 = random.nextInt(200);
        // 假数据 折线1111
        ArrayList values1 = new ArrayList();
        values1.add(new Entry(100, n1));
        values1.add(new Entry(120, n2));
        values1.add(new Entry(130, n3));
        values1.add(new Entry(140, n4));
        values1.add(new Entry(150, n5));
        // 假数据 折线2222
        ArrayList values2 = new ArrayList();
        values2.add(new Entry(100, n5));
        values2.add(new Entry(120, n4));
        values2.add(new Entry(130, n3));
        values2.add(new Entry(140, n2));
        values2.add(new Entry(150, n1));
        // 执行
        List> list = new ArrayList<>();
        list.add(values1);
        list.add(values2);
        mpLineChartManager.refreshData(list);
        mpLineChartManager.invalidate();
    }

4 . 是否显示顶点值：

    private void click_lc_changeTheVerValue(){
        if (is_changeTheVerValue){
            is_changeTheVerValue = false;
        }else {
            is_changeTheVerValue = true;
        }
        mpLineChartManager.changeTheVerValue(is_changeTheVerValue);
    }

5 . 是否填充：

    private void click_lc_changeFilled(){
        if (is_changeFilled){
            is_changeFilled = false;
        }else {
            is_changeFilled = true;
        }
        mpLineChartManager.changeFilled(is_changeFilled);
    }

6 . 是否显示顶点：

    private void click_lc_changeTheVerCircle(){
        if (is_changeTheVerCircle){
            is_changeTheVerCircle = false;
        }else {
            is_changeTheVerCircle = true;
        }
        mpLineChartManager.changeTheVerCircle(is_changeTheVerCircle);
    }

7 . 切换立方（线的形状）：

    private void click_lc_changeMode(){
        if (state_changeMode == 1) {
            state_changeMode = 2;
            mpLineChartManager.changeMode(LineDataSet.Mode.CUBIC_BEZIER);
        } else if (state_changeMode == 2) {
            state_changeMode = 3;
            mpLineChartManager.changeMode(LineDataSet.Mode.HORIZONTAL_BEZIER);
        } else if (state_changeMode == 3) {
            state_changeMode = 4;
            mpLineChartManager.changeMode(LineDataSet.Mode.STEPPED);
        } else if (state_changeMode == 4) {
            state_changeMode = 1;
            mpLineChartManager.changeMode(LineDataSet.Mode.LINEAR);
        }
    }

8 . y轴动画（有很多形式，自己找合适的吧！）：

    private void click_lc_AnimationY(){
        if (state_animationY == 1){
            state_animationY = 2;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInBack);
            chart_btn_lc_animationY.setText("y轴动画 EaseInBack");
        }else if (state_animationY == 2){
            state_animationY = 3;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInBounce);
            chart_btn_lc_animationY.setText("y轴动画 EaseInBounce");
        } else if (state_animationY == 3){
            state_animationY = 4;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInCirc);
            chart_btn_lc_animationY.setText("y轴动画 EaseInCirc");
        } else if (state_animationY == 4){
            state_animationY = 5;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInCubic);
            chart_btn_lc_animationY.setText("y轴动画 EaseInCubic");
        } else if (state_animationY == 5){
            state_animationY = 6;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInElastic);
            chart_btn_lc_animationY.setText("y轴动画 EaseInElastic");
        } else if (state_animationY == 6){
            state_animationY = 7;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInExpo);
            chart_btn_lc_animationY.setText("y轴动画 EaseInExpo");
        } else if (state_animationY == 7){
            state_animationY = 1;
            mpLineChartManager.animationY(4000, Easing.EasingOption.EaseInOutCubic);
            chart_btn_lc_animationY.setText("y轴动画 EaseInOutCubic");
        }

9 . 备注：
以上是我的简单总结！