Thêm phần phụ thuộc
Thư viện Media3 bao gồm 2 mô-đun giao diện người dùng dựa trên Jetpack Compose. Bạn không cần thêm cả hai vì Material3 phụ thuộc vào Material.
Kotlin
// Include only one of the following dependencies
implementation("androidx.media3:media3-ui-compose:1.10.1")
implementation("androidx.media3:media3-ui-compose-material3:1.10.1")
Groovy
// Include only one of the following dependencies
implementation "androidx.media3:media3-ui-compose:1.10.1"
implementation "androidx.media3:media3-ui-compose-material3:1.10.1"
Bạn nên phát triển ứng dụng theo hướng ưu tiên Compose hoặc di chuyển từ việc sử dụng Khung hiển thị.
Ứng dụng minh hoạ hoàn toàn bằng Compose
Mặc dù thư viện media3-ui-compose không bao gồm các thành phần kết hợp có sẵn (chẳng hạn như nút, chỉ báo, hình ảnh hoặc hộp thoại), nhưng bạn có thể tìm thấy một ứng dụng minh hoạ được viết hoàn toàn bằng Compose mà không cần đến bất kỳ giải pháp tương tác nào như bao bọc PlayerView trong AndroidView. Ứng dụng minh hoạ sử dụng các lớp trình giữ trạng thái giao diện người dùng trong mô-đun media3-ui-compose và thư viện Compose Material3.
Tôi cần thư viện nào?
Tuỳ thuộc vào mức độ tuỳ chỉnh mà bạn yêu cầu, bạn có thể chọn một trong hai thư viện Media3 Compose. Để hiểu rõ sự khác biệt, bạn nên nghĩ về quy trình tạo trạng thái giao diện người dùng: Business logic → UI logic → UI.
Dùng media3-ui-compose để có toàn quyền kiểm soát các thành phần trên giao diện người dùng.
Thư viện này cung cấp kết nối Business logic → UI logic. Lớp này chứa các thành phần cơ bản như PlayerSurface và ContentFrame, cùng với các lớp đối tượng lưu trữ trạng thái (ví dụ: PlayPauseButtonState, CurrentMediaItemState, PlaylistState, ErrorState) chuyển đổi trạng thái Player thành trạng thái giao diện người dùng.
Thư viện này không cung cấp các thành phần Material Design sẵn sàng sử dụng. Bạn chịu trách nhiệm tạo các thành phần giao diện người dùng của riêng mình và tạo kiểu cho các thành phần đó. Phương pháp này giúp bạn kiểm soát tối đa giao diện, khiến nó trở nên lý tưởng nếu bạn có một hệ thống thiết kế tuỳ chỉnh cao.
Sử dụng media3-ui-compose-material3 để tích hợp nhanh hơn với Material Design.
Thư viện này cung cấp phần UI cuối cùng của quy trình. Thư viện này phụ thuộc vào media3-ui-compose và bao gồm các hàm có khả năng kết hợp được tạo sẵn, được định kiểu bằng các thành phần Material3, bao gồm các thành phần kết hợp Player và MiniController. Thành phần kết hợp Player mang đến trải nghiệm phát nội dung nghe nhìn toàn diện với video, các nút điều khiển và thanh tiến trình. Bạn có thể tuỳ chỉnh thêm thành phần này bằng cách sử dụng PlayerDefaults. Thành phần kết hợp MiniController cung cấp một cơ chế tương tác nhỏ gọn để điều khiển trình phát trong khi hiển thị thông tin về mục nội dung nghe nhìn hiện tại. Việc này giúp bạn không cần phải tự tạo các nút và những thành phần khác trên giao diện người dùng từ đầu. Bạn vẫn có thể tuỳ chỉnh giao diện, màu sắc và biểu tượng của các thành phần này, nhưng hệ thống sẽ cung cấp cho bạn chế độ triển khai cốt lõi.
Xem nhanh
| Tính năng | media3-ui-compose |
media3-ui-compose-material3 |
|---|---|---|
| Thành phần giao diện người dùng | Các phần tử cơ bản như PlayerSurface và ContentFrame, nhưng không có các nút hoặc thành phần điều khiển được tạo kiểu sẵn. |
Cung cấp các thành phần kết hợp Player và MiniController, cũng như một bộ đầy đủ các thành phần kết hợp được tạo sẵn theo kiểu Material3, chẳng hạn như PlayPauseButton, SeekBackButton, PositionAndDurationText, ErrorText, v.v. |
| Quản lý trạng thái | Cung cấp các đối tượng giữ remember...State để quản lý logic. |
Quản lý trạng thái nội bộ, nhưng bạn vẫn có thể truy cập vào các đối tượng giữ trạng thái nếu cần. |
| Phần phụ thuộc | androidx.compose.foundation |
media3-ui-compose, androidx.compose.material3, com.google.android.material |
| Trường hợp sử dụng chính | Tạo giao diện người dùng của trình phát bằng hệ thống thiết kế tuỳ chỉnh. Toàn quyền kiểm soát giao diện. | Nhanh chóng tạo giao diện người dùng của trình phát tuân theo các nguyên tắc của Material Design 3. |