MPAndroidChart для Kotlin: полное руководство с примерами

MPAndroidChart — это мощная и гибкая библиотека с открытым исходным кодом для создания графиков и диаграмм в Android-приложениях. Написанная на Java, она идеально совместима с Kotlin благодаря полной интероперабельности. Эта библиотека является стандартом де-факто для визуализации данных в экосистеме Android, предлагая широкий спектр типов диаграмм: от простых линейных и столбчатых до сложных круговых, пузырьковых и комбинированных.

Зачем нужна MPAndroidChart? В современной мобильной разработке визуализация данных играет ключевую роль. Будь то отображение финансовых показателей, результатов спортивных тренировок, статистики использования приложения или динамики изменения температуры — качественный график делает информацию наглядной и понятной. MPAndroidChart берёт на себя всю тяжёлую работу по отрисовке, анимации, обработке касаний и масштабированию, позволяя разработчику сосредоточиться на логике приложения. Библиотека поддерживает тысячи точек данных, работает плавно даже на старых устройствах и предоставляет десятки параметров кастомизации.

В этом руководстве мы подробно разберём установку библиотеки, основные классы и методы, напишем несколько рабочих примеров на Kotlin и дадим практические советы по оптимизации производительности. К концу статьи вы сможете уверенно интегрировать любые типы графиков в своё Android-приложение.

1. Установка

MPAndroidChart распространяется через Maven Central. Для установки добавьте зависимость в файл build.gradle вашего модуля (обычно app/build.gradle).

Точная команда (Gradle):

dependencies {
    implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
}

После добавления строки синхронизируйте проект (Sync Now). Библиотека готова к использованию.

Важно: Убедитесь, что в корневом build.gradle (уровень проекта) добавлен репозиторий Maven Central:

allprojects {
    repositories {
        google()
        mavenCentral()
    }
}

Если вы используете новый способ настройки (Gradle 7+), добавьте репозиторий в settings.gradle.kts:

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
    }
}

2. Быстрый старт — минимальный рабочий пример

Создадим простую линейную диаграмму с тремя точками данных. Для начала добавьте LineChart в ваш XML-макет:

<!-- activity_main.xml -->
<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.LineChart
        android:id="@+id/lineChart"
        android:layout_width="match_parent"
        android:layout_height="400dp" />

</LinearLayout>

Теперь код в Activity (Kotlin):

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import com.github.mikephil.charting.charts.LineChart
import com.github.mikephil.charting.data.Entry
import com.github.mikephil.charting.data.LineData
import com.github.mikephil.charting.data.LineDataSet

class MainActivity : AppCompatActivity() {

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

        val lineChart: LineChart = findViewById(R.id.lineChart)

        // 1. Создаём точки данных (Entry)
        val entries = listOf(
            Entry(0f, 10f),   // x=0, y=10
            Entry(1f, 20f),   // x=1, y=20
            Entry(2f, 15f)    // x=2, y=15
        )

        // 2. Создаём набор данных (DataSet)
        val dataSet = LineDataSet(entries, "Пример данных")
        dataSet.color = android.graphics.Color.BLUE
        dataSet.valueTextColor = android.graphics.Color.BLACK

        // 3. Оборачиваем в LineData
        val lineData = LineData(dataSet)

        // 4. Устанавливаем данные в график
        lineChart.data = lineData

        // 5. Обновляем график
        lineChart.invalidate()
    }
}

После запуска вы увидите простой линейный график с тремя точками, соединёнными синей линией.

3. Основные классы и методы

Рассмотрим ключевые классы и методы библиотеки. Каждый метод сопровождается сигнатурой, описанием и примером кода.

3.1. Entry

Сигнатура: Entry(float x, float y)

Описание: Базовый класс, представляющий одну точку данных на графике. Хранит координаты X и Y, а также может содержать дополнительные данные (например, иконку).

Пример:

val entry1 = Entry(0f, 100f)
val entry2 = Entry(1f, 150f)
val entry3 = Entry(2f, 120f)

3.2. LineDataSet

Сигнатура: LineDataSet(List<Entry> entries, String label)

Описание: Класс, который группирует набор точек Entry в одну линию. Позволяет настроить цвет линии, толщину, форму точек, режим сглаживания (Cubic) и многое другое.

Пример:

val entries = listOf(Entry(0f, 10f), Entry(1f, 20f))
val dataSet = LineDataSet(entries, "Моя линия")
dataSet.color = Color.RED
dataSet.setCircleColor(Color.RED)
dataSet.lineWidth = 2f
dataSet.setDrawCircles(true)
dataSet.mode = LineDataSet.Mode.CUBIC_BEZIER // плавная кривая

3.3. LineData

Сигнатура: LineData(LineDataSet... dataSets)

Описание: Контейнер, который содержит один или несколько наборов LineDataSet. Именно этот объект передаётся в график.

Пример:

val dataSet1 = LineDataSet(entries1, "Линия 1")
val dataSet2 = LineDataSet(entries2, "Линия 2")
val lineData = LineData(dataSet1, dataSet2)
lineChart.data = lineData

3.4. BarEntry

Сигнатура: BarEntry(float x, float y)

Описание: Аналог Entry, но для столбчатых диаграмм. Поддерживает также stacked-значения (для составных столбцов).

Пример:

val barEntry1 = BarEntry(0f, 50f)
val barEntry2 = BarEntry(1f, 75f)
val barEntry3 = BarEntry(2f, 60f)

3.5. BarDataSet

Сигнатура: BarDataSet(List<BarEntry> entries, String label)

Описание: Набор данных для столбчатой диаграммы. Позволяет настроить цвет столбцов, их ширину и градиент.

Пример:

val barEntries = listOf(BarEntry(0f, 10f), BarEntry(1f, 20f))
val barDataSet = BarDataSet(barEntries, "Продажи")
barDataSet.color = Color.parseColor("#FF5722")
barDataSet.valueTextSize = 14f

3.6. PieEntry

Сигнатура: PieEntry(float value, String label)

Описание: Точка данных для круговой диаграммы. В отличие от линейных графиков, здесь нет оси X, только значение и подпись.

Пример:

val pieEntry1 = PieEntry(40f, "Январь")
val pieEntry2 = PieEntry(30f, "Февраль")
val pieEntry3 = PieEntry(30f, "Март")

3.7. PieDataSet

Сигнатура: PieDataSet(List<PieEntry> entries, String label)

Описание: Набор данных для круговой диаграммы. Позволяет настроить цвета сегментов, расстояние между ними (slice space) и отображение значений.

Пример:

val pieEntries = listOf(PieEntry(40f, "A"), PieEntry(60f, "B"))
val pieDataSet = PieDataSet(pieEntries, "Бюджет")
pieDataSet.colors = listOf(Color.RED, Color.GREEN)
pieDataSet.sliceSpace = 2f
pieDataSet.valueTextSize = 12f

3.8. XAxis и YAxis

Сигнатура (пример для XAxis): chart.xAxis

Описание: Классы для настройки осей. Позволяют задать количество линий сетки, формат меток, положение оси (снизу/сверху), кастомные значения и многое другое.

Пример:

val xAxis = lineChart.xAxis
xAxis.position = XAxis.XAxisPosition.BOTTOM
xAxis.setDrawGridLines(false)
xAxis.granularity = 1f // шаг между метками

val yAxisLeft = lineChart.axisLeft
yAxisLeft.setDrawGridLines(true)
yAxisLeft.axisMinimum = 0f // минимальное значение оси Y

val yAxisRight = lineChart.axisRight
yAxisRight.isEnabled = false // отключаем правую ось

3.9. Legend

Сигнатура: chart.legend

Описание: Класс для управления легендой графика. Позволяет настроить положение, ориентацию, размер текста и цвета.

Пример:

val legend = lineChart.legend
legend.isEnabled = true
legend.textSize = 14f
legend.verticalAlignment = Legend.LegendVerticalAlignment.TOP
legend.horizontalAlignment = Legend.LegendHorizontalAlignment.RIGHT
legend.orientation = Legend.LegendOrientation.VERTICAL

3.10. Description

Сигнатура: chart.description

Описание: Позволяет добавить текстовое описание под графиком. Можно настроить текст, цвет, размер и положение.

Пример:

val description = lineChart.description
description.text = "Динамика продаж за 2024 год"
description.textColor = Color.GRAY
description.textSize = 12f
description.position = null // автоматическое положение

3.11. animateX() и animateY()

Сигнатура: chart.animateX(int durationMillis) и chart.animateY(int durationMillis)

Описание: Методы для анимации появления графика. animateX анимирует по оси X (слева направо), animateY — по оси Y (снизу вверх).

Пример:

lineChart.animateX(1000) // анимация длительностью 1 секунда
// lineChart.animateY(1500) // анимация по оси Y

3.12. setTouchEnabled()

Сигнатура: chart.setTouchEnabled(boolean enabled)

Описание: Включает или отключает обработку касаний (масштабирование, перетаскивание, выделение точек).

Пример:

lineChart.setTouchEnabled(true) // включить масштабирование
lineChart.setPinchZoom(true) // включить zoom двумя пальцами

4. Реальный практический пример (150+ строк кода)

Создадим приложение, которое отображает статистику продаж по месяцам в виде столбчатой диаграммы с возможностью переключения между годами. Также добавим кастомный маркер для отображения точного значения при нажатии.

Шаг 1: XML-макет (activity_main.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"
    android:padding="16dp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Продажи по месяцам"
        android:textSize="20sp"
        android:textStyle="bold" />

    <com.github.mikephil.charting.charts.BarChart
        android:id="@+id/barChart"
        android:layout_width="match_parent"
        android:layout_height="350dp"
        android:layout_marginTop="16dp" />

    <Button
        android:id="@+id/btnSwitchYear"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="16dp"
        android:text="Переключить на 2025" />

</LinearLayout>

Шаг 2: Код Activity (MainActivity.kt)

import android.graphics.Color
import android.os.Bundle
import android.widget.Button
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import com.github.mikephil.charting.charts.BarChart
import com.github.mikephil.charting.components.MarkerView
import com.github.mikephil.charting.data.BarData


                
    
  Также в библиотеке
  
                
                  
                 JSON обработка в TypeScript: полное руководство с примерами
      
                
                  
                 Конфигурация приложений на C++: библиотеки и инструменты для гибкой настройки
      
                
                  
                 Конфигурация Node.js приложений: лучшие библиотеки и практики
      
                
                  
                 Работа с датами в Swift (iOS/macOS): библиотеки и инструменты
      
                
                  
                 GraphQL в C# (.NET): библиотеки Hot Chocolate и GraphQL.NET для создания API