Android图表超简单实现柱状图、折线图、饼状图(基于MpAndroidChart)_android mpandroidchart实现折线图和柱状图-程序员宅基地

技术标签: 图表  android  视图  柱状图  

本文基于MpAndroidChart实现各种图标,目的是让同学们快速实现图标效果
实现效果:
柱状图
这里写图片描述
折线图
这里写图片描述
饼状图
这里写图片描述

实现步骤:
1.导入
先从git上克隆下来,下载之后将jar包考到自己的工程
git地址
我用的是mpandroidchartlibrary-2-2-2.jar
2.柱状图实现
柱状图实现核心类:BarChart(用于显示柱状图)、BarData (用于设置数据和样式)

xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

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

</LinearLayout>

Activity文件


import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.Toast;

import com.github.mikephil.charting.charts.BarChart;
import com.github.mikephil.charting.data.BarData;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.highlight.Highlight;
import com.github.mikephil.charting.interfaces.datasets.IBarDataSet;
import com.github.mikephil.charting.listener.OnChartValueSelectedListener;
import com.github.mikephil.charting.utils.ColorTemplate;

import java.util.ArrayList;

public class ZhuzhuangtuActivity extends AppCompatActivity {
    //显示的图表
    public BarChart barChart;
    //保存数据的实体(下面定义了两组数据集合)
    public ArrayList<BarEntry> entries = new ArrayList<BarEntry>();
    public ArrayList<BarEntry> entries1 = new ArrayList<>();
    //数据的集合(每组数据都需要一个数据集合存放数据实体和该组的样式)
    public BarDataSet dataset;
    public BarDataSet dataset1;
    //表格下方的文字
    public ArrayList<String> labels = new ArrayList<String>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_zhuzhuangtu);
        barChart = (BarChart) findViewById(R.id.bar_chart);
        entries.add(new BarEntry(4f, 0));
        entries.add(new BarEntry(8f, 1));
        entries.add(new BarEntry(6f, 2));
        entries.add(new BarEntry(12f, 3));
        entries.add(new BarEntry(18f, 4));
        entries.add(new BarEntry(9f, 5));


        entries1.add(new BarEntry(4f, 0));
        entries1.add(new BarEntry(8f, 1));
        entries1.add(new BarEntry(6f, 2));
        //设置数据组的数据
        dataSet1 = new BarDataSet(entries1, "第二组数据");
        //设置数据组的样式(参数是显示颜色的数组)
        dataSet1.setColors(ColorTemplate.PASTEL_COLORS);
        //设置柱状图上方显示数据字体大小
        dataSet1.setValueTextSize(14);

        labels.add("一月");
        labels.add("二月");
        labels.add("三月");
        labels.add("四月");
        labels.add("五月");
        labels.add("六月");
        dataset = new BarDataSet(entries, "第一组数据");
        dataset.setColors(ColorTemplate.COLORFUL_COLORS);
        ArrayList<IBarDataSet> dataSets = new ArrayList<>();
        dataSets.add(dataset);
        dataSets.add(dataSet1);
        BarData data = new BarData(labels, dataSets);
        barChart.setData(data);



        //设置单个点击事件
        barChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
            @Override
            public void onValueSelected(Entry entry, int i, Highlight highlight) {
                Toast.makeText(getApplicationContext(),entry.getVal()+"",Toast.LENGTH_LONG).show();
            }

            @Override
            public void onNothingSelected() {

            }
        });
        //设置显示动画效果
        barChart.animateY(2000);
        //设置图标右下放显示文字
        barChart.setDescription("MPandroidChart Test");

    }
}

3.折线图实现
xml文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity"
    >
    <com.github.mikephil.charting.charts.LineChart
        android:id="@+id/spread_line_chart"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="center_horizontal"
        />
</RelativeLayout>

Activity文件

import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;

import java.util.ArrayList;

public class ZhexiantuActivity extends AppCompatActivity {
    

    public LineChart lineChart;
    public ArrayList<String> x = new ArrayList<String>();
    public ArrayList<Entry> y = new ArrayList<Entry>();
    public ArrayList<LineDataSet> lineDataSets = new ArrayList<LineDataSet>();
    public LineData lineData = null;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_zhexiantu);
        lineChart = (LineChart)findViewById(R.id.spread_line_chart);
        getLineData(100, 100);
        showChart();
    }
    /**
     * 初始化数据
     * count 表示坐标点个数,range表示等下y值生成的范围
     */
    public LineData getLineData(int count, float range) {
        for (int i = 0; i < count; i++) {  //X轴显示的数据
            x.add(i + "");
        }
        for (int i = 0; i < count; i++) {
   //y轴的数据
            float result = (float) (Math.random() * range) + 3;
            y.add(new Entry(result, i));
        }
        LineDataSet lineDataSet = new LineDataSet(y, "随机产生的折线图");//y轴数据集合
        lineDataSet.setLineWidth(1f);//线宽
        lineDataSet.setCircleSize(Color.BLUE);//圆形颜色
        lineDataSet.setCircleSize(2f);//现实圆形大小
        lineDataSet.setColor(Color.RED);//现实颜色
        lineDataSet.setHighLightColor(Color.BLACK);//高度线的颜色
        lineDataSets.add(lineDataSet);
        lineData = new LineData(x,lineDataSet);
        return lineData;
    }
    /**
     * 设置样式
     */
    public void showChart() {
        lineChart.setDrawBorders(false);//是否添加边框
        lineChart.setDescription("随机生成的数据");//数据描述
        lineChart.setNoDataTextDescription("我需要数据");//没数据显示
        lineChart.setDrawGridBackground(true);//是否显示表格颜色
        lineChart.setBackgroundColor(Color.GRAY);//背景颜色
        lineChart.setData(lineData);//设置数据
        Legend legend = lineChart.getLegend();//设置比例图片标示,就是那一组Y的value
        legend.setForm(Legend.LegendForm.SQUARE);//样式
        legend.setFormSize(10f);//字体
        legend.setTextColor(Color.BLUE);//设置颜色
        lineChart.animateX(2000);//X轴的动画
    }
}

4.饼状图实现
xml文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity"
    >
    <com.github.mikephil.charting.charts.PieChart
        android:id="@+id/pie_chart"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="center_horizontal"
        />
</RelativeLayout>

Activity文件

import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.DisplayMetrics;

import com.github.mikephil.charting.charts.PieChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.PieData;
import com.github.mikephil.charting.data.PieDataSet;

import java.util.ArrayList;

public class BingzhuangtuActivity extends AppCompatActivity {
    
    public PieChart mChart;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_bingzhuangtu);
        mChart = (PieChart) findViewById(R.id.pie_chart);

        PieData mPieData = getPieData(4, 100);
        showChart(mChart, mPieData);
    }


    private void showChart(PieChart pieChart, PieData pieData) {
        pieChart.setHoleColor(Color.TRANSPARENT);
        pieChart.setHoleRadius(60f);  //半径
        pieChart.setTransparentCircleRadius(64f); // 半透明圈
        //pieChart.setHoleRadius(0)  //实心圆
        pieChart.setDescription("测试饼状图");
        // mChart.setDrawYValues(true);
        pieChart.setDrawCenterText(true);  //饼状图中间可以添加文字
        pieChart.setDrawHoleEnabled(true);
        pieChart.setRotationAngle(90); // 初始旋转角度
        pieChart.setCenterTextSize(20);
        pieChart.setDescriptionTextSize(20);
        // draws the corresponding description value into the slice
        // mChart.setDrawXValues(true);
        // enable rotation of the chart by touch
        pieChart.setRotationEnabled(true); // 可以手动旋转
        // display percentage values
        pieChart.setUsePercentValues(true);  //显示成百分比
        // mChart.setUnit(" €");
        // mChart.setDrawUnitsInChart(true);
        // add a selection listener
//      mChart.setOnChartValueSelectedListener(this);
        // mChart.setTouchEnabled(false);
//      mChart.setOnAnimationListener(this);
        pieChart.setCenterText("Quarterly Revenue");  //饼状图中间的文字
//        pieChart.animateY(3000);
        //设置数据
        pieChart.setData(pieData);
        // undo all highlights
//      pieChart.highlightValues(null);
//      pieChart.invalidate();
        Legend mLegend = pieChart.getLegend();  //设置比例图

        mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART);  //最右边显示
//      mLegend.setForm(LegendForm.LINE);  //设置比例图的形状,默认是方形
        mLegend.setXEntrySpace(7f);//设置距离饼图的距离,防止与饼图重合
        mLegend.setYEntrySpace(5f);


        pieChart.animateXY(1000, 1000);  //设置动画
        // mChart.spin(2000, 0, 360);
    }

    /**
     * @param count 分成几部分
     * @param range
     */
    private PieData getPieData(int count, float range) {
        ArrayList<String> xValues = new ArrayList<String>();  //xVals用来表示每个饼块上的内容
        for (int i = 0; i < count; i++) {
            xValues.add("Quarterly" + (i + 1));  //饼块上显示成Quarterly1, Quarterly2, Quarterly3, Quarterly4
        }
        ArrayList<Entry> yValues = new ArrayList<Entry>();  //yVals用来表示封装每个饼块的实际数据
        // 饼图数据
        /**
         * 将一个饼形图分成四部分, 四部分的数值比例为14:14:34:38
         * 所以 14代表的百分比就是14%
         */
        float quarterly1 = 14;
        float quarterly2 = 14;
        float quarterly3 = 34;
        float quarterly4 = 38;

        yValues.add(new Entry(quarterly1, 0));
        yValues.add(new Entry(quarterly2, 1));
        yValues.add(new Entry(quarterly3, 2));
        yValues.add(new Entry(quarterly4, 3));

        //y轴的集合
        PieDataSet pieDataSet = new PieDataSet(yValues, "Quarterly Revenue 2014"/*显示在比例图上*/);
        pieDataSet.setSliceSpace(0f); //设置个饼状图之间的距离
        ArrayList<Integer> 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));
        pieDataSet.setColors(colors);
        DisplayMetrics metrics = getResources().getDisplayMetrics();
        float px = 5 * (metrics.densityDpi / 160f);
        pieDataSet.setSelectionShift(px); // 选中态多出的长度
        PieData pieData = new PieData(xValues, pieDataSet);
        return pieData;
    }
}
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/XieChaoAndroid/article/details/53423341

智能推荐

百度c语言贴吧 经典C源程序100例-2_c语言贴吧顶贴机源码-程序员宅基地

文章浏览阅读1k次。【程序2】 题目:企业发放的奖金根据利润提成。利润(I)低于或等于10万元时,奖金可提10%;利润高    于10万元,低于20万元时,低于10万元的部分按10%提成,高于10万元的部分,可可提    成7.5%;20万到40万之间时,高于20万元的部分,可提成5%;40万到60万之间时高于    40万元的部分,可提成3%;60万到100万之间时,高于60万元的部分,可提成1.5_c语言贴吧顶贴机源码

偏向锁,轻量级锁与重量级锁_轻量级锁和偏向锁,重量级锁-程序员宅基地

文章浏览阅读256次。偏向锁Hotspot 的作者经过以往的研究发现大多数情况下锁不仅不存在多线程竞争,而且总是由同一线程多次获得,为了让线程获得锁的代价更低而引入了偏向锁。当一个线程访问同步块并获取锁时,会在对象头和栈帧中的锁记录里存储锁偏向的线程 ID。以后该线程在进入和退出同步块时不需要花费CAS操作来加锁和解锁,而只需简单的检验一下对象头的Mark Word里是否存储着指向当前线程的偏向锁,如果存在,表示线_轻量级锁和偏向锁,重量级锁

TMS320C6678开发例程使用手册(7)_sa tic fir-程序员宅基地

文章浏览阅读608次。3.算法Demo例程演示所有工程均位于光盘"Demo\Algorithm\Application"文件夹内,本章节例程仅演示算法功能,算法与平台和系统无关,如需使用SYS/BIOS请自行移植。使用CCS工程导入和编译步骤导入例程。备注:本节提供的例程测试结果仅供参考。3.1FIR——有限长单位冲激响应滤波器此程序的作用是进行FIR有限长单位冲激响应滤波器测试。按照工程导入步骤加载FIR.out文件,然后点击程序运行按钮,程序会在断点处停下来。点击CCS菜单"Tools->Gra_sa tic fir

Spring AOP配置标签解析_spring-aop:5.0.8.release-程序员宅基地

文章浏览阅读1.2k次。准备Spring版本:5.0.8解析过程开启 Spring AOP 注解自动代理需要配置标签 &amp;amp;amp;amp;amp;lt;aop:aspectj-autoproxy/&amp;amp;amp;amp;amp;gt;,查看 spring-aop:5.0.8.RELEASE\META-INF\spring.handlers 文件,配置以下内容:http\://www.springframework.org/schema/aop=org.sp..._spring-aop:5.0.8.release

git命令大全_git diff testtag head --name-only | xargs tar-程序员宅基地

文章浏览阅读9.2k次。git操作配置.gitignore文件作用:可以屏蔽掉某些不需要被管理的文件或文件夹,如日志文件、临时文件等。git rm -r --cached .git add .git commit -m ‘update .gitignore’新建创建一个新的git仓库。这个版本库的配置、存储等信息会被保存到.git文件中# 初始化当前项目$ git init# 新建一个目录,将其初始化为Git代码库$ git init [project-name]# 在指定目录创建一个空的 Git _git diff testtag head --name-only | xargs tar

悲催的程序员,以及程序员的悲催-程序员宅基地

文章浏览阅读458次。我尽量用平和一点的口吻跟你说说关于程序员的那点事儿。1.我在一个叫摩托罗拉的公司干过,那地方有50%的人整天干的事情就是催另外25%的人没完没了的解剩下那25%的人造成的bug。我是个程序员,每天敲敲打打,哪天电脑崩溃了你会发现我这辈子啥都没留下。大多数人甚至都没有想过我们是怎么把手机捣鼓出来的,包括是是否人手一套乐高的家庭套装工具。我那可爱的岳父岳母在向自己的亲戚朋友们介绍我的时候,总是用一种充满自豪的口吻轻描淡写的说,他在摩托罗拉上班(我离开摩托罗拉以后他

随便推点

centos7 mysql允许连接_centos7 mysql允许远程连接设置-程序员宅基地

文章浏览阅读779次。Mysql为了安全性,在默认情况下用户只允许在本地登录,可是在有此情况下,还是需要使用用户进行远程连接,因此为了使其可以远程需要进行如下操作:一、允许root用户在任何地方进行远程登录,并具有所有库任何操作权限,具体操作如下:在本机先使用root用户登录mysql:mysql -u root -p"youpassword"进行授权操作:mysql>GRANT ALL PRIVILEGES O..._centos7 mysql 允许客户端连接

【小Y学算法】️每日LeetCode打卡️——40.二叉树的后序遍历-程序员宅基地

文章浏览阅读1.3w次,点赞24次,收藏60次。没有特别幸运,那么请先特别努力,别因为懒惰而失败,还矫情地将原因归于自己倒霉。所以说,树倒了,没有一片雪花是无辜的

搬砖:ioctl函数,可以获取ip地址,修改ip地址,网卡地址等_if(ioctl(if_fd, i_push, "ip") < 0){-程序员宅基地

文章浏览阅读482次。Android配置ip地址ioctl函数,可以获取ip地址,修改ip地址,网卡地址等部分转自http://www.cnblogs.com/zht-blog/p/4025903.htmlint ioctl(int d, int request, ...);ioctl用来控制特殊设备文件的属性,第一个参数fd必须是一个已经打开的文件描述符,第三个参数一般为cha..._if(ioctl(if_fd, i_push, "ip") < 0){

USB-C 端口在您的 Mac 上无法使用如何解决?_macos 使用usbc 转接头 会提示 winusb-程序员宅基地

文章浏览阅读266次。由于 Mac 上缺少 USB-C 端口,即使一个端口停止工作,对许多用户来说也可能很麻烦。如果 MacBook 上的 USB-C 端口突然停止工作,请查看以下解决问题的一些可能解决方案。如何修复 USB-C 端口在您的 MacBook 上不工作重启你的 Mac如果 MacBook 上的 USB-C 端口突然停止工作,最简单的修复方法就是重新启动 Mac。在大多数情况下,这应该足以解决手头的问题并确保 MacBook 上的 USB-C 端口再次工作。更新到最新的 macOS 版本如果您的 MacB_macos 使用usbc 转接头 会提示 winusb

【计算机毕业设计】基于 SpringBoot+SpringCloud+Vue 电商秒杀系统-程序员宅基地

文章浏览阅读18次。基于 SpringBoot+SpringCloud+Vue 电商秒杀系统

C++编程规范---第9章 类的构造函数、析构函数与赋值函数_c++析构函数规范-程序员宅基地

文章浏览阅读574次。Blogdown--构造函数、析构函数与赋值函数是每个类最基本的函数。它们太普通以致让人容易麻痹大意,其实这些貌似简单的函数就象没有顶盖的下水道那样危险。 每个类只有一个析构函数和一个赋值函数,但可以有多个构造函数(包含一个拷贝构造函数,其它的称为普通构造函数)。对于任意一个类A,如果不想编写上述函数,C++编译器将自动为A产生四个缺省的函数,如 A(void);_c++析构函数规范

推荐文章

热门文章

相关标签