首先,我是一个小白,最近做安卓,突然碰到需要做一个饼状图 一个折线图 一个条形图显示出来,没有什么要求,只要能显示出来就可以,既然这样的话,那我就需要找到这三个图最简单的实现方式,发现使用MPAndroidChart可以快速实现。

我搜了一下 MPAndroidChart的使用方法,不管是实现哪一种图,找到的方法里面都是一大堆代码,并没有说最简单的使用方法,大部分都是java所写,因为我是使用kotlin写安卓,java写的安卓代码能看懂,但是转换起来也是有一点麻烦,在不了解MPAndroidChart的使用逻辑的情况下,看着那一堆代码让我很头大。

在搜了很多文章并且自己进行实验后,我总结出了使用kotlin实现这三种图最简单的方式,希望能够帮助到跟我一样初次使用MPAndroidChart的人。

先看一下最终能实现的效果

  1. 首先需要MPAndroidChart添加依赖

我这里使用的是本地依赖方式,如果没有MPAndroidChart插件的话点击

链接:https://pan.baidu.com/s/1ynIBQYHm9FNSjOu6zyYqlQ

提取码:lkop

下载,下载好之后

将MPAndroidChart插件复制粘贴到libs文件夹下,并且在app目录下的build.gradle文件中添加

 implementation files('libs/MPAndroidChart-v3.1.0.aar')

然后点击右上角的Sync Now即可完成依赖添加

2.然后看代码

1.首先在布局文件中添加组件

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><com.github.mikephil.charting.charts.PieChart //饼状图组件android:id="@+id/piechart"android:layout_width="match_parent"android:layout_height="200dp"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><com.github.mikephil.charting.charts.BarChart //条形图组件android:id="@+id/barchart"android:layout_width="match_parent"android:layout_height="200dp"android:layout_marginTop="32dp"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toBottomOf="@+id/piechart" /><com.github.mikephil.charting.charts.LineChart //折线图组件android:id="@+id/linechart"android:layout_width="match_parent"android:layout_height="200dp"android:layout_marginTop="32dp"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toBottomOf="@+id/barchart" />
</androidx.constraintlayout.widget.ConstraintLayout>

2.下面是饼状图代码

fun pieChart() { //饼状图val pc = findViewById<PieChart>(R.id.piechart) //首先获取饼状图组件val data = ArrayList<PieEntry>()   //声明一个数组用来存饼状图的数据,这里要求数组类型是 PieEntrydata.add(PieEntry(36.7f, "有违章"))//添加数据data.add(PieEntry(13.3f, "无违章"))//添加数据val color = ArrayList<Int>() //设置颜色 声明一个数组来存储饼状图每一部分的颜色color.add(Color.parseColor("#1abc9c"))//添加数据color.add(Color.parseColor("#ffa502"))//添加数据val pieDataSet = PieDataSet(data, "") //这里应该是一个中间变量先把数据和颜色传递到这里pieDataSet.setColors(color)val pieData = PieData(pieDataSet) //然后这里传递给PieDatapc.setData(pieData) //最后一步,把数据传递给饼状图组件,有数据之后饼状图就会显示了}

3.下面是条形图代码

fun barchart() {//条形图val barChart = findViewById<BarChart>(R.id.barchart)//首先获取条形图组件val barEntryList = ArrayList<BarEntry>() //声明一个数组用来存条形图的数据,这里要求数组类型是 BarEntrybarEntryList.add(BarEntry(1f, 11f)) //添加数据barEntryList.add(BarEntry(2f, 36f)) //添加数据barEntryList.add(BarEntry(3f, 23f)) //添加数据val colors = ArrayList<Int>() //设置颜色 声明一个数组来存储条形图每一部分的颜色 这里设置三个一样的颜色colors.add(Color.parseColor("#FFBB86FC")) //添加数据colors.add(Color.parseColor("#FFBB86FC")) //添加数据colors.add(Color.parseColor("#FFBB86FC")) //添加数据val barDataSet = BarDataSet(barEntryList, "") //这里应该是一个中间变量先把数据和颜色传递到这里barDataSet.setColors(colors)val barData = BarData(barDataSet) //然后这里传递给BarDatabarChart.setData(barData) //最后一步,把数据传递给条形图组件,有数据之后条形图就会显示了}

4.下面是折线图代码

fun linechart() { //折线图val lc = findViewById<LineChart>(R.id.linechart)//首先获取折线图组件lc.setDrawBorders(true) //设置边框 可不写,写上美观程度好一些//设置数据val entries = ArrayList<Entry>() //声明一个数组用来存折线图的数据,这里要求数组类型是 Entryentries.add(Entry(1f, 20f)) //添加数据entries.add(Entry(2f, 40f)) //添加数据entries.add(Entry(3f, 30f)) //添加数据entries.add(Entry(4f, 60f)) //添加数据entries.add(Entry(5f, 20f)) //添加数据val lineDataSet = LineDataSet(entries, "温度") //将数据传递给中间变量lineDataSet.setColor(Color.parseColor("#FFBB86FC")) //设置折线图的颜色val data = LineData(lineDataSet) //然后这里把数据传递给LineDatalc.setData(data) //最后一步,把数据传递给条形图组件,有数据之后折线图就会显示了}

5.最后,我们在oncreate里面调用这几个函数

override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)pieChart()//给饼状图写入数据barchart()//给条形图写入数据linechart()//给折线图写入数据}

最后就变成了

package com.example.testimport android.content.res.Resources
import android.graphics.Color
import android.icu.number.IntegerWidth
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.service.autofill.FieldClassification.Match
import androidx.core.app.NotificationCompat.getColor
import androidx.core.content.ContextCompat.getColor
import com.github.mikephil.charting.charts.BarChart
import com.github.mikephil.charting.charts.LineChart
import com.github.mikephil.charting.charts.PieChart
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.data.LineData
import com.github.mikephil.charting.data.LineDataSet
import com.github.mikephil.charting.data.PieData
import com.github.mikephil.charting.data.PieDataSet
import com.github.mikephil.charting.data.PieEntry
import com.google.android.material.color.MaterialColors.getColorclass MainActivity : AppCompatActivity() {override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)pieChart()//给饼状图写入数据barchart()//给条形图写入数据linechart()//给折线图写入数据}fun pieChart() { //饼状图val pc = findViewById<PieChart>(R.id.piechart) //首先获取饼状图组件val data = ArrayList<PieEntry>()   //声明一个数组用来存饼状图的数据,这里要求数组类型是 PieEntrydata.add(PieEntry(36.7f, "有违章"))//添加数据data.add(PieEntry(13.3f, "无违章"))//添加数据val color = ArrayList<Int>() //设置颜色 声明一个数组来存储饼状图每一部分的颜色color.add(Color.parseColor("#1abc9c"))//添加数据color.add(Color.parseColor("#ffa502"))//添加数据val pieDataSet = PieDataSet(data, "") //这里应该是一个中间变量先把数据和颜色传递到这里pieDataSet.setColors(color)val pieData = PieData(pieDataSet) //然后这里传递给PieDatapc.setData(pieData) //最后一步,把数据传递给饼状图组件,有数据之后饼状图就会显示了}fun barchart() {//条形图val barChart = findViewById<BarChart>(R.id.barchart)//首先获取条形图组件val barEntryList = ArrayList<BarEntry>() //声明一个数组用来存条形图的数据,这里要求数组类型是 BarEntrybarEntryList.add(BarEntry(1f, 11f)) //添加数据barEntryList.add(BarEntry(2f, 36f)) //添加数据barEntryList.add(BarEntry(3f, 23f)) //添加数据val colors = ArrayList<Int>() //设置颜色 声明一个数组来存储条形图每一部分的颜色 这里设置三个一样的颜色colors.add(Color.parseColor("#FFBB86FC")) //添加数据colors.add(Color.parseColor("#FFBB86FC")) //添加数据colors.add(Color.parseColor("#FFBB86FC")) //添加数据val barDataSet = BarDataSet(barEntryList, "") //这里应该是一个中间变量先把数据和颜色传递到这里barDataSet.setColors(colors)val barData = BarData(barDataSet) //然后这里传递给BarDatabarChart.setData(barData) //最后一步,把数据传递给条形图组件,有数据之后条形图就会显示了}fun linechart() { //折线图val lc = findViewById<LineChart>(R.id.linechart)//首先获取折线图组件lc.setDrawBorders(true) //设置边框 可不写,写上美观程度好一些//设置数据val entries = ArrayList<Entry>() //声明一个数组用来存折线图的数据,这里要求数组类型是 Entryentries.add(Entry(1f, 20f)) //添加数据entries.add(Entry(2f, 40f)) //添加数据entries.add(Entry(3f, 30f)) //添加数据entries.add(Entry(4f, 60f)) //添加数据entries.add(Entry(5f, 20f)) //添加数据val lineDataSet = LineDataSet(entries, "温度") //将数据传递给中间变量lineDataSet.setColor(Color.parseColor("#FFBB86FC")) //设置折线图线的颜色val data = LineData(lineDataSet) //然后这里把数据传递给LineDatalc.setData(data) //最后一步,把数据传递给条形图组件,有数据之后折线图就会显示了}
}

最终呈现出文章开头的效果

MPAndroidChart 折线图 饼状图 条形图 最简单使用方式(kotlin)相关推荐

  1. canvas制作柱形图/折线图/饼状图,Konva写动态饼状图

    制作饼状图 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  2. echart关系树状图_echart.js制作树状图饼状图;

    // Step:3 conifg ECharts's path, link to echarts.js from current page. // Step:3 为模块加载器配置echarts的路径, ...

  3. Plotly.js使用详细介绍(折线图、饼状图、点图、水平条形图、桑基图、树状图、等值线图)

    目录 0 写在前面 1 HTML代码 2 折线图 2.1 基本折线图 2.2 复杂折线图 2.2.1 轨迹 2.2.2 布局 3 饼状图 3.1 基本饼状图 3.2 饼图子图 3.3 甜甜圈图 4 点 ...

  4. python中输出手机话费_用Python生成柱状图、折线图、饼状图来统计自己的手机话费...

    环境 macOS PyCharm 依赖库 matplotlib numpy 中文字体 步骤详解 一.配置依赖包 使用pycharm,直接依赖 matplotlib,如果当前环境变量的pip中不包含 m ...

  5. Poi 如何使用Java和POI技术生成折线图,柱状图,饼状图导出到word文档

    这篇文章主要介绍POI生成图表并导出word文档的基本操作.主要介绍三种图表:折线图.柱状图.饼状图. 一.效果展示 使用Java和POI技术生成的折线图,柱状图,饼状图的效果如下图所示: 二.环境准 ...

  6. vue中使用echart绘制柱状图、折现图、饼状图

    echarts有几个主要的字段,title.legend.xAxis. yAxis.tooltip.series. title 图表的标题 legend 用来标志图表数据,data字段的数组需要对应每 ...

  7. python饼状图顺时针_Python:饼状图 (二十七)

    饼状图 饼状图是一种常见的单变量图形,用于描绘分类变量级别的相对频率.饼图中的频率用圆形的扇区表示:角度或面积越大,该分类值就越常见. 遗憾的是,饼状图是一种应用场合很有限的图形类型,图形创建者很容易 ...

  8. 封装构造函数,用canvas写饼状图和柱状图

    封装构造函数,用canvas写饼状图和柱状图 封装函数 // 场景 function XDLScence( options ) {this.stage = options.stage;//执行场景的初 ...

  9. HelloCharts-android 之饼状图的使用

    HelloCharts 框架之饼状图的简单使用,以及属性介绍 hellocharts 地址:https://github.com/lecho/hell... hellocharts是一个非常好用的第三 ...

最新文章

  1. 要在某一房间中两台计算机之间实现网络通信,大学计算机计算思维导论期末考试综述.doc...
  2. 篝火 2004 年11-15
  3. mysql设置ssh连接_ssh修改连接数据库 将mysql改为sql连接
  4. js检测鼠标是否在操作_原生JS趣味demo:炫酷头像鼠标追随效果的实现
  5. PHP个人博客项目------切切歆语博客
  6. python合并两个数据框_使用python合并两个数据框
  7. 必备知识:大数据处理应遵循的原则
  8. 采集浏览器访问某网站时产生的流量,并保存为pcap文件
  9. es-03-DSL的简单使用
  10. atitit.web 推送实现方案集合
  11. Multisim基础 桥式整流二极管电路
  12. 查看计算机真实用户名(username)
  13. 中规院交通院《上海全球城市综合交通体系承载能力与开发研究》
  14. 当面试官问:JS中原始类型有哪些?
  15. java体系的中间件适用于go吗,Go语言经典库使用分析(五)| Negroni 中间件(一)...
  16. C语言实现科学计算器
  17. java虚拟机预先加载哪些类_Java虚拟机JVM学习02 类的加载概述
  18. 网络工作室官网HTML源码
  19. 泰山OFFICE技术讲座:同一行不同字号的字如何对齐绘制
  20. 解决windows下WslRegisterDistribution failed with error: 0x80070050的问题

热门文章

  1. 后pc时代和新一代计算机定义,新一代GPS的线性尺寸查询及标注系统设计
  2. Vue中如何进行数据可视化大屏展示
  3. JVM-HotSpot虚拟机-即时编译器、编译优化等相关知识
  4. 置信椭圆-python
  5. 数据交易思享会 | 美创科技分享《数据交易准入安全》
  6. iOS中的UINavigationController
  7. 基于JAVA乐购游戏商城系统计算机毕业设计源码+数据库+lw文档+系统+部署
  8. hoj 2662 Pieces Assignment
  9. NOJ[1508] 火烧赤壁2
  10. 第一次用IDEA创建maven工程时间