MPchart的使用和SDK的封装

换了家公司，目前在长沙工作，拿着在北上广漂流过的经验来说，工作十分轻松。

废话不多说，业务需要，做了一个MPchart的图表封装，改了一部分东西，了解了部分属性，博客写的少，所以还有些东西不太会用，望指教。

先上效果图

这里看图表就行了，设计要求是折线图，填充效果渐变，可滑动，x轴虚线，点中的时候变粗，点为空心圆圈，一屏大概显示7个数据左右，无leftY和rightY，仅有X轴显示，点中每个点的时候显示一个tip为这个点的Y的值。

个人不喜欢写注释，所以直接上代码，再把我修改过的地方一一贴出来。

   public View initLineChart(int layoutId, int viewId, Context context, ArrayList
    
    
     
      dataList, LayoutInflater inflater, ViewGroup container,
                              LineChart LineChart, int zoom) {
        this.context = context;
        this.mLineChart = LineChart;
        //这里是设置字体的，例如楷体啥的，自己看着改就行
        mTfLight = Typeface.createFromAsset(context.getAssets(), "OpenSans-Light.ttf");
        ArrayList
     
     
      
      
       
       > Linelist = new ArrayList<>();
        for (int j = 0; j < dataList.size(); j++) {
            ArrayList
       
       
        
         listEntry1 = new ArrayList<>();
            int[] numList = dataList.get(j);
            for (int i = 0; i < numList.length; i++) {
                listEntry1.add(new Entry(i, numList[i]));
            }
            Linelist.add(listEntry1);
        }
        //这里是设置图表背景颜色的
        mLineChart.setBackgroundColor(Color.rgb(255, 255, 255));
        mLineChart.setDescription("");
        mLineChart.setNoDataTextDescription("You need to provide data for the chart.");
        mLineChart.setOnChartValueSelectedListener(this);
        //设置点击某个点之后弹出的tip，tip背景就是layout文件，至于怎么把图片设置进layout文件这种就别问我了，搞个背景就ok
        MyMarkerView mv = new MyMarkerView(context, R.layout.custom_marker_view);
        mLineChart.setMarkerView(mv);
        //是否可触摸
        mLineChart.setTouchEnabled(true);
        //滑动速度
        mLineChart.setDragDecelerationFrictionCoef(0.9f);
        mLineChart.setDragEnabled(true);
        mLineChart.setScaleEnabled(true);
        mLineChart.setDrawGridBackground(false);
        //是否高亮
        mLineChart.setHighlightPerDragEnabled(true);
        //是否允许放大缩小
        mLineChart.setScaleYEnabled(false);
        //下面两句代码我搞了半天反正没搞懂，第一句差不多是进去加载的时候就放大7倍的意思，参考了一些别人的意见
        mLineChart.setPinchZoom(true);
        //这里是通过zoom的值来控制加载的时候页面的大小，因为业务需要调整为一屏显示7个左右的数据，所以先这样做着
        mLineChart.zoom(zoom, 0, 0, 0);

        // 这写getMax getMin 都自己写的，获取数据里面最大最小值，我不贴了，大家应该也都会
        lineNum = dataList.size();
        count = getCount(Linelist);
        max = getMax(Linelist);
        min = getMin(Linelist);
        range = max - min;
        //设置数据进去
        setLineChartData(count, range, lineNum, Linelist);
        //进去会有一个加载动画效果，这里是动画的事件
        mLineChart.animateX(2500);
        //这里是表下面的文字，我的给挤掉了
        Legend l = mLineChart.getLegend();

        l.setForm(Legend.LegendForm.LINE);
        l.setTypeface(mTfLight);
        l.setTextSize(11f);
        l.setTextColor(Color.WHITE);
        l.setPosition(Legend.LegendPosition.BELOW_CHART_LEFT);

        //这里是设置X轴的东西
        XAxis xAxis = mLineChart.getXAxis();
        //X轴显示在底部
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setTypeface(mTfLight);
        //设置X轴的线为虚线，间隔10
        xAxis.enableGridDashedLine(10f, 10f, 0);
        //这句好像没用，下一句才有用
        xAxis.setAxisLineColor(Color.parseColor("#5B86A8"));
        xAxis.setGridColor(Color.parseColor("#5B86A8"));
        xAxis.setTextSize(11f);
        //是否画出X轴的线
        xAxis.setDrawAxisLine(true);
        xAxis.setTextColor(ColorTemplate.getHoloBlue());
        xAxis.setAxisMaxValue(max * 1.5f);
        xAxis.setAxisMinValue(min * 0.5f);
        xAxis.setDrawGridLines(true);
        xAxis.setGranularityEnabled(true);
        xAxis.setLabelCount(200);

        mLineChart.getAxisRight().setEnabled(false);
        mLineChart.getAxisLeft().setEnabled(false);

        mLineChart.invalidate();

        return mLineChart;
    }
       
       
      
      
     
     
    
    

这些是加载的方法，想了一下，还是写注释比较好

这里是设置数据的方法

  private void setLineChartData(int count, float range, float lineNum, ArrayList
    
    
     
     
      
      > list) {
        ArrayList
      
      
       
        dataSets = new ArrayList
       
       
        
        ();

        for (int linei = 0; linei < lineNum; linei++) {

            ArrayList
        
        
          yVals1 = list.get(linei); LineDataSet set1; if (mLineChart.getData() != null && mLineChart.getData().getDataSetCount() > 0) { Log.e("if", "" + mLineChart.getData().getDataSetCount()); if (lineNum > mLineChart.getData().getDataSetCount()) { lineNum = mLineChart.getData().getDataSetCount(); } set1 = (LineDataSet) mLineChart.getData().getDataSetByIndex(linei); //这里是设置点的Y的值 set1.setValues(yVals1); mLineChart.getData().notifyDataChanged(); mLineChart.notifyDataSetChanged(); } else { set1 = new LineDataSet(yVals1, "DataSet " + (linei + 1)); set1.setAxisDependency(YAxis.AxisDependency.LEFT); switch (linei) { case 0: set1.setColor(Color.GREEN); break; case 1: set1.setColor(Color.RED); break; case 2: set1.setColor(Color.YELLOW); break; case 3: set1.setColor(Color.CYAN); break; default: break; } //主要的设置方法在这里，是否填充图形 set1.setDrawFilled(true); //填充颜色 set1.setFillColor(Color.YELLOW); //填充背景 set1.setFillDrawable(ActivityCompat.getDrawable(context, R.drawable.background)); //数据曲线的宽度 set1.setLineWidth(1.5f); //数据曲线的点的圆圈的大小 set1.setCircleRadius(4f); //高亮的线的颜色 set1.setHighLightColor(Color.parseColor("#1688F5")); //高亮的线的格式（虚线，10f的间隔） set1.enableDashedHighlightLine(10f, 10f, 0f); //高亮的线的线宽 set1.setHighlightLineWidth(2.5f); dataSets.add(set1); // add the datasets } } // create a data object with the datasets LineData data = new LineData(dataSets); data.setValueTextColor(Color.WHITE); data.setValueTextSize(0f); // set data mLineChart.setData(data); List 
         
           sets = mLineChart.getData() .getDataSets(); for (ILineDataSet iSet : sets) { LineDataSet set = (LineDataSet) iSet; set.setMode(set.getMode() == LineDataSet.Mode.HORIZONTAL_BEZIER ? LineDataSet.Mode.LINEAR : LineDataSet.Mode.HORIZONTAL_BEZIER); } for (ILineDataSet iSet : sets) { LineDataSet set = (LineDataSet) iSet; set.setDrawFilled(true); } //刷新数据 mLineChart.invalidate(); } 
          
        
       
       
      
      
     
     
    
    

嗯~好像差不多了，有改进的会再加，请各位指教