بدء استخدام واجهة المستخدم المستندة إلى Compose

إضافة التبعية

تتضمّن مكتبة Media3 وحدتَين لواجهة المستخدم تستندان إلى Jetpack Compose. ليس عليك إضافة كليهما لأنّ حزمة Material3 تعتمد على الحزمة الأساسية.

Kotlin

// Include only one of the following dependencies
implementation("androidx.media3:media3-ui-compose:1.9.0")
implementation("androidx.media3:media3-ui-compose-material3:1.9.0")

Groovy

// Include only one of the following dependencies
implementation "androidx.media3:media3-ui-compose:1.9.0"
implementation "androidx.media3:media3-ui-compose-material3:1.9.0"

ننصحك بشدة بتطوير تطبيقك باستخدام Compose أولاً أو نقل البيانات من استخدام Views.

تطبيق تجريبي لـ Compose بالكامل

على الرغم من أنّ مكتبة media3-ui-compose لا تتضمّن عناصر Composables جاهزة للاستخدام (مثل الأزرار أو المؤشرات أو الصور أو مربّعات الحوار)، يمكنك العثور على تطبيق تجريبي مكتوب بالكامل بلغة Compose يتجنّب أي حلول للتوافق، مثل تضمين PlayerView في AndroidView. يستخدم التطبيق التجريبي فئات حاملة لحالة واجهة المستخدم من الوحدة media3-ui-compose، كما يستفيد من مكتبة Compose Material3.

ما هي المكتبة التي أحتاج إليها؟

استنادًا إلى مستوى التخصيص الذي تحتاجه، يمكنك الاختيار من بين مكتبتَين من مكتبات Media3 Compose. لفهم الفرق، من المفيد التفكير في مسار إنتاج حالة واجهة المستخدم: Business logic → UI logic → UI.

استخدِم media3-ui-compose للتحكّم الكامل في مكوّنات واجهة المستخدم.

توفّر هذه المكتبة عملية الربط Business logic → UI logic. ويحتوي على مكوّنات أساسية مثل PlayerSurface وContentFrame، بالإضافة إلى فئات حاملة للحالة (مثل PlayPauseButtonState) التي تحوّل حالة Player إلى حالة واجهة المستخدم.

لا توفّر هذه المكتبة مكوّنات Material Design الجاهزة للاستخدام. أنت المسؤول عن إنشاء مكوّنات واجهة المستخدم وتصميمها. تمنحك هذه الطريقة الحد الأقصى من التحكّم في المظهر، ما يجعلها مثالية إذا كان لديك نظام تصميم مخصّص للغاية.

استخدام media3-ui-compose-material3 لدمج أسرع مع Material Design

توفّر هذه المكتبة الجزء UI الأخير من سلسلة المعالجة. تعتمد هذه المكتبة على media3-ui-compose وتتضمّن دوال Composable مُنشأة مسبقًا ومصمّمة باستخدام مكوّنات Material3. وهي تغنيك عن إنشاء أزرارك وعناصر واجهة المستخدم الأخرى من البداية. سيظل بإمكانك تخصيص المظهر والألوان والأيقونات الخاصة بهذه المكوّنات، ولكن سيتم توفير التنفيذ الأساسي لك.

نظرة سريعة

الميزة media3-ui-compose media3-ui-compose-material3
مكوّنات واجهة المستخدم عناصر أساسية مثل PlayerSurface وContentFrame، ولكن بدون أزرار أو عناصر تحكّم مُعدّة مسبقًا توفّر مجموعة كاملة من عناصر Composables المُنشأة مسبقًا والمصمَّمة وفقًا لـ Material3، مثل PlayPauseButton وSeekBackButton وPositionAndDurationText وما إلى ذلك.
إدارة الحالة توفّر remember...State لحامليها لإدارة المنطق. تدير الحالة داخليًا، ولكن سيظل بإمكانك الوصول إلى عناصر الحالة إذا احتجت إلى ذلك.
الاعتمادية androidx.compose.foundation "media3-ui-compose" و"androidx.compose.material3" و"com.google.android.material"
حالة الاستخدام الأساسية إنشاء واجهة مستخدم للمشغّل باستخدام نظام تصميم مخصّص التحكّم الكامل في المظهر. إنشاء واجهة مستخدم مشغّل بسرعة تتوافق مع إرشادات Material Design 3