Android进阶之路

来源:互联网 发布:php条件判断语句 编辑:程序博客网 时间:2024/06/15 13:02

Just a little more patience, please!

因项目需要,所以参照网上的mpandroidchart三方依赖实现了一个饼图数据分布效果,当然使用mpandroidchart同时可以实现折线图,柱形图之类的效果。

本文会有俩个饼图的效果和讲解,第一个是参照网上的Demo自己写了的一个,方法并不是很全,第二个的话,相比而言更加系统化一些,在第一个中遇到的问题,或许看完第二个写法之后你会很快解决,下面请直接观赏吧。

**mpandroidchart:
- 优点
使用成熟,方法较全,自带动画,自带百分比计算,自带各种API,非常快捷**

Effect :

这里写图片描述

build 导入:

compile 'org.quanqi:mpandroidchart:1.7.5'

注意:
- 在需要使用饼状图显示的区域,在xml中引com.github.mikephil.charting.charts.PieChart控件
- 一般我们会涉及到最少三个集合,一个放color,一个放x轴数据值,一个放y轴数据值
- 在第一个Demo中遇到的问题,尝试在第二个Demo中找答案

MainActivity :

package com.example.dow.chartround;import android.graphics.Color;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.util.DisplayMetrics;import android.view.View;import android.widget.TextView;import com.github.mikephil.charting.charts.PieChart;import com.github.mikephil.charting.data.Entry;import com.github.mikephil.charting.data.PieData;import com.github.mikephil.charting.data.PieDataSet;import com.github.mikephil.charting.utils.Legend;import java.util.ArrayList;public class MainActivity extends AppCompatActivity {    private PieChart mPiechart;    private TextView mT1;    private TextView mT2;    private TextView mT3;    private TextView mT4;    private TextView mT5;    private TextView mT6;    private ArrayList<String> xContents;    private ArrayList arrayList;    private ArrayList<Entry> yContent;    private ArrayList<Integer> colors;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();        mPiechart = (PieChart) findViewById(R.id.mPieChart);        PieData mPieData = getPieData(4, 100);        showChart(mPiechart, mPieData);    }    //这个可以不要,不要看自己需求    private void initView() {        mT1 = (TextView) findViewById(R.id.text1);        mT2 = (TextView) findViewById(R.id.text2);        mT3 = (TextView) findViewById(R.id.text3);        mT4 = (TextView) findViewById(R.id.text4);        mT5 = (TextView) findViewById(R.id.text5);        mT6 = (TextView) findViewById(R.id.text6);    }    //关键方法在这里-主要用于饼图的画图    private void showChart(PieChart pieChart, PieData pieData) {//            pieChart.setHoleColorTransparent(true);            pieChart.setHoleRadius(60f);//半径              pieChart.setTransparentCircleRadius(64f); // 半透明圈//            pieChart.setHoleRadius(0);  //实心圆            pieChart.setDescription(""); //添加右下角备注            pieChart.setDrawCenterText(true);  //饼状图中间可以添加文字            pieChart.setDrawHoleEnabled(true);              pieChart.setRotationAngle(90); // 初始旋转角度              pieChart.setRotationEnabled(true); // 可以手动旋转            pieChart.setUsePercentValues(true);  //显示成百分比            pieChart.setCenterText("Dow Store");  //饼状图中间的文字            //设置数据             pieChart.setData(pieData);               Legend mLegend = pieChart.getLegend();  //设置比例图  //          mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART);  //最右边显示//          mLegend.setForm(Legend.LegendForm.LINE);  //设置比例图的形状,默认是方形            mLegend.setXEntrySpace(7f);              mLegend.setYEntrySpace(5f);            pieChart.animateXY(1000, 1000);  //设置动画//        pieChart.spin(2000, 0, 360);          }     private PieData getPieData(int count,float range){        initData();        PieDataSet  pieDataSet= new PieDataSet(yContent,null);        //设置饼状图之间的距离        pieDataSet.setSliceSpace(0f);        //设置饼状图之间的颜色         pieDataSet.setColors(colors);         DisplayMetrics metrics = getResources().getDisplayMetrics();         float px = 5 * (metrics.densityDpi / 160f);         pieDataSet.setSelectionShift(px); // 选中态多出的长度           PieData pieData = new PieData(xContents, pieDataSet);        return pieData;    }    //数据源咯,这里我们看预定义饼图区域的颜色、大小、介绍,其中框架会自动计算百分比    private void initData() {        // 饼图颜色        colors = new ArrayList<Integer>();        colors.add(Color.rgb(205,205,205));        colors.add(Color.rgb(114,188,223));        colors.add(Color.rgb(255,123,124));        colors.add(Color.rgb(57, 135, 200));        colors.add(Color.rgb(57, 135, 20));        colors.add(Color.rgb(77, 105, 20));        //展示内容        xContents = new ArrayList<String>();        xContents.add("汽车");        xContents.add("美容");        xContents.add("小保养");        xContents.add("大保养");        xContents.add("喷漆");        xContents.add("机修");        float m1=121;        float m2=41;        float m3=421;        float m4=491;        float m5=123;        float m6=46;        arrayList = new ArrayList();        arrayList.add(m1);        arrayList.add(m2);        arrayList.add(m1);        //将数据展示        runOnUiThread(new Runnable() {            @Override            public void run() {                mT1.setText(xContents.get(0)+":"+ arrayList.get(0)+"元");                mT2.setText(xContents.get(1)+":"+ arrayList.get(1)+"元");                mT3.setText(xContents.get(2)+":"+ arrayList.get(2)+"元");                mT4.setText(xContents.get(2)+":"+ arrayList.get(2)+"元");                mT5.setText(xContents.get(2)+":"+ arrayList.get(2)+"元");                mT6.setText(xContents.get(2)+":"+ arrayList.get(2)+"元");            }        });        //展示比例        yContent = new ArrayList<Entry>();        yContent.add(new Entry(m1,0));        yContent.add(new Entry(m2,1));       `yContent.add(new Entry(m3,2));        yContent.add(new Entry(m4,3));        yContent.add(new Entry(m5,4));        yContent.add(new Entry(m6,5));    }}

MainActivity Xml :

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.example.dow.chartround.MainActivity">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"        android:background="#fff"        android:orientation="horizontal"        >       <com.github.mikephil.charting.charts.PieChart        android:paddingTop="30dp"        android:id="@+id/mPieChart"        android:layout_width="250dp"        android:layout_height="250dp"       />        <LinearLayout            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:orientation="vertical"            >        <TextView            android:layout_marginTop="30dp"            android:padding="5dp"            android:id="@+id/text1"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="111"            />            <TextView                android:padding="5dp"                android:id="@+id/text2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="111"                />            <TextView                android:padding="5dp"                android:id="@+id/text3"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="111"                />            <TextView                android:padding="5dp"                android:id="@+id/text4"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="111"                />            <TextView                android:padding="5dp"                android:id="@+id/text5"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="111"                />            <TextView                android:padding="5dp"                android:id="@+id/text6"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="111"                />        </LinearLayout>    </LinearLayout>    <RelativeLayout        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"       >        <LinearLayout            android:layout_width="0dp"            android:layout_height="match_parent"            android:weightSum="2"            android:orientation="vertical"            >        <TextView            android:layout_width="wrap_content"            android:text="112312312321321"            android:layout_height="wrap_content" />        </LinearLayout>    </RelativeLayout></LinearLayout>
原创粉丝点击