إضافة التبعية
تتضمّن مكتبة Media3 وحدتَين لواجهة المستخدم تستندان إلى Jetpack Compose. ليس عليك إضافة كليهما لأنّ Material3 يعتمد على Core.
Kotlin
// Include only one of the following dependencies
implementation("androidx.media3:media3-ui-compose:1.11.1")
implementation("androidx.media3:media3-ui-compose-material3:1.11.1")
أنيق
// Include only one of the following dependencies
implementation "androidx.media3:media3-ui-compose:1.11.1"
implementation "androidx.media3:media3-ui-compose-material3:1.11.1"
ننصحك بشدة بتطوير تطبيقك باستخدام Compose أولاً أو نقل البيانات من Views.
تطبيق تجريبي لـ Fully Compose
على الرغم من أنّ مكتبة media3-ui-compose لا تتضمّن دوال مركّبة جاهزة للاستخدام
(مثل الأزرار أو المؤشرات أو الصور أو مربّعات الحوار)، يمكنك العثور على تطبيق تجريبي
مكتوب بالكامل في 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 وCurrentMediaItemState وPlaylistState وErrorState) التي تحوّل حالة Player إلى حالة واجهة المستخدم.
لا توفّر هذه المكتبة مكوّنات جاهزة للاستخدام من "التصميم المتعدد الأبعاد". وتقع على عاتقك مسؤولية إنشاء مكوّنات واجهة المستخدم وتصميمها. تمنحك هذه الطريقة أقصى قدر من التحكّم في المظهر، ما يجعلها مثالية إذا كان لديك نظام تصميم مخصّص للغاية.
استخدام media3-ui-compose-material3 لدمج أسرع مع Material Design
توفّر هذه المكتبة الجزء الأخير من مسار الإحالة الناجحة UI. تعتمد هذه المكتبة على media3-ui-compose وتتضمّن دوال مركّبة مُنشأة مسبقًا ومصمَّمة باستخدام مكوّنات Material3، بما في ذلك الدوال المركّبة Player وMiniController. توفّر الدالة المركّبة Player تجربة شاملة لتشغيل الوسائط،
بما في ذلك الفيديو وعناصر التحكّم وشريط التقدّم، ويمكنك تخصيصها بشكل أكبر
باستخدام PlayerDefaults. توفّر الدالة المركّبة MiniController إمكانية التحكّم في المشغّل بشكل مدمج مع عرض معلومات عن ملف الوسائط الحالي. فهي تلغي الحاجة إلى إنشاء الأزرار الخاصة بك
وعناصر واجهة المستخدم الأخرى من البداية. لا يزال بإمكانك تخصيص المظهر والألوان والرموز لهذه المكوّنات، ولكن يتم توفير التنفيذ الأساسي لك.
نظرة سريعة
| الميزة | media3-ui-compose |
media3-ui-compose-material3 |
|---|---|---|
| مكوّنات واجهة المستخدم | عناصر أساسية مثل PlayerSurface وContentFrame، ولكن بدون أزرار أو عناصر تحكّم ذات أنماط محدّدة مسبقًا |
توفّر الدالتَين المركّبتَين Player وMiniController ومجموعة كاملة من الدوال المركّبة المُنشأة مسبقًا بنمط Material3، مثل PlayPauseButton وSeekBackButton وPositionAndDurationText وErrorText وما إلى ذلك. |
| إدارة الحالة | توفير عناصر نائبة لـ remember...State لإدارة المنطق |
يدير الحالة داخليًا، ولكن لا يزال بإمكانك الوصول إلى عناصر الاحتفاظ بالحالة إذا لزم الأمر. |
| الاعتمادية | androidx.compose.foundation |
media3-ui-compose وandroidx.compose.material3 وcom.google.android.material |
| حالة الاستخدام الأساسية | إنشاء واجهة مستخدم للمشغّل باستخدام نظام تصميم مخصّص التحكّم الكامل في المظهر والأسلوب | إنشاء واجهة مستخدم للمشغّل بسرعة تتوافق مع إرشادات التصميم المتعدد الأبعاد 3 |