Android开发丶基于MPChart的饼状图统计实现

经过没日没夜的加班加点，项目终于如期上线了，在下个迭代即将来临蹂躏之余，将本次迭代遇到的一些问题进行汇总以便学习。

遇到一个需求，将统计数据以饼状图进行统计，这块我们引用了一个第三方类库，官方地址如下：

https://github.com/PhilJay/MPAndroidChart

该类库可以提供丰富的各类图表实现，如折线，饼状，柱状等，这里我们看下饼状图的效果：

效果还行吧，左边是饼状图，右边则是颜色文字等描述。
下面具体说下实现方法。

首先打开app的build.gradle，添加上如下一行：

implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'

打开project的build.gradle，在allprojects的repositories节点里添加

maven { url "https://jitpack.io" }

点击sync now，等待加载即可集成。

接下来打开视图界面或者XML文件，添加控件。

<com.github.mikephil.charting.charts.PieChart
    android:id="@+id/main_piechart"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

在视图文件中引用完控件后，进行控件配置，主要方法如下

chart.setUsePercentValues(true); //是否显示百分比（经测试没什么用）
Description description = chart.getDescription();
description.setText(""); //设置描述的文字,默认在右下角
chart.setHighlightPerTapEnabled(true); //设置piecahrt图表点击Item高亮是否可用
chart.animateX(0); 
chart.setDrawEntryLabels(false); // 设置entry中的描述label是否画进饼状图中
chart.setEntryLabelColor(Color.WHITE);//设置该文字是的颜色
chart.setEntryLabelTextSize(10f);//设置该文字的字体大小
chart.setDrawHoleEnabled(true);//设置圆孔的显隐，也就是内圆
chart.setHoleRadius(42f);//设置内圆的半径。外圆的半径好像是不能设置的，改变控件的宽度和高度，半径会自适应。
chart.setHoleColor(Color.WHITE);//设置内圆的颜色
chart.setDrawCenterText(false);//设置是否显示文字
chart.setCenterText("");//设置饼状图中心的文字
chart.setCenterTextSize(10f);//设置文字的消息
chart.setCenterTextColor(Color.RED);//设置文字的颜色
chart.setTransparentCircleRadius(31f);//设置内圆和外圆的一个交叉园的半径，这样会凸显内外部的空间
chart.setTransparentCircleColor(Color.BLACK);//设置透明圆的颜色
chart.setTransparentCircleAlpha(50);//设置透明圆你的透明度
chart.setRotationAngle(20); //设置初始旋转角度
chart.setRotationEnabled(false); //设置是否可以拖动旋转
chart.setExtraOffsets(10, 10, 10, 15); //设置饼状图的初始位置偏移
Legend legend = chart.getLegend();//图例
legend.setEnabled(false);//是否显示（不显示的话，图例可以自己自定义控件）

以上都是官方提供的方法，值得一提的是最后的图例，默认显示，设置false的话不显示，图例则可以根据我们需求进行自定义。

1.先提一下默认显示的配置

Legend legend = pieChart.getLegend();//获取图例
legend.setEnabled(true);//是否显示图例，false则以下配置不生效
legend.setVerticalAlignment(Legend.LegendVerticalAlignment.CENTER);//设置图例和饼状图竖向对齐
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.RIGHT);//设置图例和饼状图横线对齐
//以下偏移量设置可以多设几次不同值，慢慢调试最终效果
legend.setYOffset(-30f); //图例的Y轴偏移量
legend.setXOffset(15f); //图例的X轴偏移量
pieChart.setExtraOffsets(10, 10, 20, 10); //饼状图的偏移量
legend.setYEntrySpace(10);//不同图例的Y轴间距
legend.setOrientation(Legend.LegendOrientation.VERTICAL);//设置图例的排列走向:vertacal相当于分行
legend.setForm(Legend.LegendForm.SQUARE);//设置图例的图形样式,默认为圆形
legend.setFormSize(15f);//设置图例的大小
legend.setTextSize(15f);//设置图注的字体大小
legend.setTextColor(getResources().getColor(R.color.black)); //图例的文字颜色
legend.setFormToTextSpace(5f);//设置图例到饼状图的距离
legend.setDrawInside(false); //设置图例是否绘制在内部
legend.setWordWrapEnabled(false);//设置图列换行(注意使用影响性能,仅适用legend位于图表下面)，我也不知道怎么用的

2.如果设置false的话,我们只需要在视图的xml文件中,给对应的位置画上图例即可,不过这种情况一般适用固定条目数量的情况,上者则可以根据返回的条目数量动态生成图例。当然自定义时画上一个列表控件也可动态生成，就是比较麻烦而已。

3.配置完成后，我们生成数据。

/**
 * 配置数据
 */
private void initData() {
    ArrayList<PieEntry> pieEntries = new ArrayList<>();
    String a = null;
    String b = null;
    String c = null;
    String d = null;
    a = "40%";
    b = "30%";
    c = "20%";
    d = "10%";
    //去除最后一位百分号
    a = a.substring(0, a.length() - 1);
    b = b.substring(0, b.length() - 1);
    c = c.substring(0, c.length() - 1);
    d = d.substring(0, d.length() - 1);
    pieEntries.add(new PieEntry(Float.parseFloat(a), "暗夜猎手"+ a));
    pieEntries.add(new PieEntry(Float.parseFloat(b), "暴走萝莉"+ b));
    pieEntries.add(new PieEntry(Float.parseFloat(c), "寒冰射手"+ c));
    pieEntries.add(new PieEntry(Float.parseFloat(d), "诺克萨斯之手"+ d));
    PieDataSet pieDataSet = new PieDataSet(pieEntries, null);
    pieDataSet.setSliceSpace(0f);//设置每块饼之间的空隙
    pieDataSet.setSelectionShift(0f);//点击某个饼时拉长的宽度
    pieDataSet.setColors(getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.color_348f79),
            getResources().getColor(R.color.color_4e738d), getResources().getColor(R.color.color_fd794b)); //设置饼状图不同数据的颜色
    PieData pieData = new PieData(pieDataSet);
    pieData.setDrawValues(true);            //设置是否显示数据实体(百分比，true:以下属性才有意义)
    pieData.setValueTextColor(Color.WHITE);  //设置所有DataSet内数据实体（百分比）的文本颜色
    pieData.setValueTextSize(12f);          //设置所有DataSet内数据实体（百分比）的文本字体大小
    pieData.setValueFormatter(new ValueFormatter() { //格式化数据，并加上百分号
        @Override
        public String getFormattedValue(float value) {
            Log.d("fantasychong_value", value + "");
            if (value == 0) {
                return "";
            } else {
                BigDecimal b = new BigDecimal(String.valueOf(value));
                float num = b.setScale(2, BigDecimal.ROUND_HALF_UP).floatValue();
                return num + "%";
            }
        }
    });
    piechart.setData(pieData);
    piechart.highlightValues(null); //设置高亮
    piechart.invalidate(); //将图表重绘以显示设置的属性和数据
}

4.配置完数据后，我们来启动app

 

至此全部完成，demo附上！

下载地址