MPAndroidChart 折线图饼状图条形图最简单使用方式（kotlin）

qq_63833495

已于 2023-02-23 17:27:50 修改

阅读量1.1k

点赞数 6

文章标签： android-studio androidx android xml kotlin Powered by 金山文档

于 2023-02-11 01:03:40 首次发布

本文链接：https://blog.csdn.net/qq_63833495/article/details/128979316

版权

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

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

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

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

首先需要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>()   //声明一个数组用来存饼状图的数据，这里要求数组类型是 PieEntry
        data.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) //然后这里传递给PieData
        pc.setData(pieData) //最后一步，把数据传递给饼状图组件，有数据之后饼状图就会显示了

    }

3.下面是条形图代码

fun barchart() {//条形图
        val barChart = findViewById<BarChart>(R.id.barchart)//首先获取条形图组件

        val barEntryList = ArrayList<BarEntry>() //声明一个数组用来存条形图的数据，这里要求数组类型是 BarEntry
        barEntryList.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) //然后这里传递给BarData
        barChart.setData(barData) //最后一步，把数据传递给条形图组件，有数据之后条形图就会显示了


    }

4.下面是折线图代码

fun linechart() { //折线图
        val lc = findViewById<LineChart>(R.id.linechart)//首先获取折线图组件

        lc.setDrawBorders(true) //设置边框 可不写，写上美观程度好一些
        //设置数据
        val entries = ArrayList<Entry>() //声明一个数组用来存折线图的数据，这里要求数组类型是 Entry
        entries.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) //然后这里把数据传递给LineData
        lc.setData(data) //最后一步，把数据传递给条形图组件，有数据之后折线图就会显示了


    }

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

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        pieChart()//给饼状图写入数据
        barchart()//给条形图写入数据
        linechart()//给折线图写入数据
    }

最后就变成了

package com.example.test

import 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.getColor

class 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>()   //声明一个数组用来存饼状图的数据，这里要求数组类型是 PieEntry
        data.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) //然后这里传递给PieData
        pc.setData(pieData) //最后一步，把数据传递给饼状图组件，有数据之后饼状图就会显示了

    }

    fun barchart() {//条形图
        val barChart = findViewById<BarChart>(R.id.barchart)//首先获取条形图组件

        val barEntryList = ArrayList<BarEntry>() //声明一个数组用来存条形图的数据，这里要求数组类型是 BarEntry
        barEntryList.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) //然后这里传递给BarData
        barChart.setData(barData) //最后一步，把数据传递给条形图组件，有数据之后条形图就会显示了


    }

    fun linechart() { //折线图
        val lc = findViewById<LineChart>(R.id.linechart)//首先获取折线图组件

        lc.setDrawBorders(true) //设置边框 可不写，写上美观程度好一些
        //设置数据
        val entries = ArrayList<Entry>() //声明一个数组用来存折线图的数据，这里要求数组类型是 Entry
        entries.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) //然后这里把数据传递给LineData
        lc.setData(data) //最后一步，把数据传递给条形图组件，有数据之后折线图就会显示了


    }
}

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

qq_63833495

关注

6
点赞
踩
10

收藏

觉得还不错? 一键收藏
4
评论
MPAndroidChart 折线图饼状图条形图最简单使用方式（kotlin）

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

扫一扫