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). المكتبة جاهزة للاستخدام.

هام: تأكد من إضافة مستودع Maven Central في ملف build.gradle الرئيسي (على مستوى المشروع):

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>

الآن الكود في النشاط (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
        )