Compose tabanlı kullanıcı arayüzünü kullanmaya başlama

Bağımlılığı ekleme

Media3 kitaplığı, Jetpack Compose tabanlı iki kullanıcı arayüzü modülü içerir. Material3, çekirdek kitaplığa bağlı olduğundan ikisini birden eklemeniz gerekmez.

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")

Modern

// 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"

Uygulamanızı Compose'u öncelikli tutarak geliştirmenizi veya görünümleri kullanmaktan vazgeçmenizi önemle tavsiye ederiz.

Tamamen Compose ile oluşturulmuş demo uygulaması

media3-ui-compose kitaplığı, kullanıma hazır bileşenler (düğmeler, göstergeler, resimler veya iletişim kutuları gibi) içermese de tamamen Compose ile yazılmış bir demo uygulaması bulabilirsiniz. Bu uygulama, PlayerView'i AndroidView içinde sarmalama gibi birlikte çalışabilirlik çözümlerinden kaçınır. Demo uygulaması, media3-ui-compose modülündeki kullanıcı arayüzü durum bilgisi depolayıcı sınıflarını ve Compose Material3 kitaplığını kullanır.

Hangi kitaplığa ihtiyacım var?

İhtiyacınız olan özelleştirme düzeyine bağlı olarak iki Media3 Compose kitaplığından birini seçebilirsiniz. Bu farkı anlamak için kullanıcı arayüzü durum üretim ardışık düzenini düşünmek faydalı olacaktır: Business logic → UI logic → UI.

Kullanıcı arayüzü bileşenleriniz üzerinde tam kontrol sahibi olmak için media3-ui-compose kullanın.

Bu kitaplık, Business logic → UI logic bağlantısını sağlar. PlayerSurface ve ContentFrame gibi temel bileşenlerin yanı sıra Player durumunu kullanıcı arayüzü durumuna dönüştüren durum bilgisi depolayıcı sınıflarını (ör. PlayPauseButtonState, CurrentMediaItemState, PlaylistState, ErrorState) içerir.

Bu kitaplık, kullanıma hazır Materyal Tasarım bileşenleri sunmaz. Kendi kullanıcı arayüzü bileşenlerinizi oluşturmak ve bunlara stil uygulamak sizin sorumluluğunuzdadır. Görünüm ve tarz üzerinde maksimum kontrol sağlar. Bu nedenle, son derece özelleştirilmiş bir tasarım sisteminiz varsa idealdir.

Materyal Tasarım ile daha hızlı entegrasyon için media3-ui-compose-material3 kullanın.

Bu kitaplık, ardışık düzenin son UI bölümünü sağlar. media3-ui-compose'e bağlıdır ve Material3 bileşenleriyle stillendirilmiş önceden oluşturulmuş composable işlevler (Player ve MiniController composable'ları dahil) içerir. Player bileşeni; video, kontroller ve ilerleme çubuğu ile kapsamlı bir medya oynatma deneyimi sunar. Bu deneyimi PlayerDefaults kullanarak daha da özelleştirebilirsiniz. MiniController composable'ı, mevcut medya öğesiyle ilgili bilgileri gösterirken oynatıcıyı kontrol etmek için kompakt bir uygunluk sağlar. Bu sayede kendi düğmelerinizi ve diğer kullanıcı arayüzü öğelerinizi sıfırdan oluşturmanız gerekmez. Bu bileşenlerin temasını, renklerini ve simgelerini özelleştirebilirsiniz ancak temel uygulama sizin için sağlanır.

Bir bakışta

Özellik media3-ui-compose media3-ui-compose-material3
Kullanıcı Arayüzü Bileşenleri PlayerSurface ve ContentFrame gibi temel öğeler içerir ancak önceden tasarlanmış düğmeler veya kontroller içermez. Player ve MiniController composable'larının yanı sıra PlayPauseButton, SeekBackButton, PositionAndDurationText, ErrorText gibi önceden oluşturulmuş Material3 tarzı composable'ların tamamını sağlar.
Durum yönetimi Mantığı yönetmek için remember...State tutucular sağlar. Durumu dahili olarak yönetir ancak gerekirse durum bilgisi depolayıcılara erişebilirsiniz.
Bağımlılıklar androidx.compose.foundation media3-ui-compose, androidx.compose.material3, com.google.android.material
Birincil Kullanım Alanı Özel bir tasarım sistemiyle oynatıcı kullanıcı arayüzü oluşturma Görünüm ve tarz üzerinde tam kontrol sahibi olursunuz. Materyal Tasarım 3 yönergelerine uygun bir oynatıcı kullanıcı arayüzünü hızlıca oluşturma