เริ่มต้นใช้งาน UI ที่ใช้ Compose

เพิ่มทรัพยากร Dependency

ไลบรารี Media3 มีโมดูล UI 2 โมดูลที่อิงตาม Jetpack Compose คุณไม่จำเป็นต้องเพิ่มทั้ง 2 โมดูลเนื่องจากโมดูล Material3 ขึ้นอยู่กับโมดูลหลัก

Kotlin

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

ดึงดูด

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

เราขอแนะนำให้คุณพัฒนาแอปในลักษณะ Compose-first หรือ ย้ายข้อมูลจากการใช้ View

แอปเดโมที่เขียนด้วย Compose ทั้งหมด

แม้ว่าไลบรารี media3-ui-compose จะไม่มี Composables ที่พร้อมใช้งาน (เช่น ปุ่ม ตัวบ่งชี้ Google รูปภาพ หรือกล่องโต้ตอบ) แต่คุณสามารถดู แอปเดโมที่เขียนด้วย Compose ทั้งหมด ซึ่งหลีกเลี่ยงความสามารถในการทำงานร่วมกัน เช่น การรวม PlayerView ใน AndroidView แอปเดโม ใช้คลาสตัวเก็บสถานะ UI จากโมดูล media3-ui-compose และ ใช้ไลบรารี Compose Material3

ฉันต้องใช้ไลบรารีใด

คุณสามารถเลือกระหว่างไลบรารี Media3 Compose 2 ไลบรารีได้ตามระดับการปรับแต่งที่ต้องการ การทำความเข้าใจความแตกต่างจะช่วยให้คุณนึกถึง ไปป์ไลน์การสร้างสถานะ UI ได้ดังนี้: Business logic → UI logic → UI

ใช้ media3-ui-compose เพื่อควบคุมคอมโพเนนต์ UI ได้อย่างเต็มที่

ไลบรารีนี้มีการเชื่อมต่อ Business logic → UI logic โดยมีคอมโพเนนต์พื้นฐาน เช่น PlayerSurface และ ContentFrame รวมถึงคลาสตัวเก็บสถานะ (เช่น PlayPauseButtonState) ที่แปลงสถานะPlayerเป็นสถานะ UI

ไลบรารีนี้ไม่มี คอมโพเนนต์ Material Design ที่พร้อมใช้งาน คุณมีหน้าที่รับผิดชอบในการสร้างคอมโพเนนต์ UI และจัดรูปแบบคอมโพเนนต์เหล่านั้น ไลบรารีนี้ช่วยให้คุณควบคุมรูปลักษณ์และการใช้งานได้สูงสุด จึงเหมาะอย่างยิ่งหากคุณมีระบบการออกแบบที่กำหนดเองสูง

ใช้ media3-ui-compose-material3 เพื่อผสานรวมกับ Material Design ได้เร็วขึ้น

ไลบรารีนี้มีส่วน UI สุดท้ายของไปป์ไลน์ โดยขึ้นอยู่กับ media3-ui-compose และมีฟังก์ชัน Composable ที่สร้างไว้ล่วงหน้าซึ่งจัดรูปแบบ ด้วย คอมโพเนนต์ Material3 รวมถึง Composable Player ซึ่ง มอบประสบการณ์การเล่นสื่อที่ครอบคลุมด้วยวิดีโอ การควบคุม และ แถบความคืบหน้า ไลบรารีนี้ช่วยให้คุณไม่ต้องสร้างปุ่มและองค์ประกอบ UI อื่นๆ ตั้งแต่ต้น คุณยังคงปรับแต่งธีม สี และไอคอนของคอมโพเนนต์เหล่านี้ได้ แต่เราจะจัดเตรียมการใช้งานหลักไว้ให้

ข้อมูลโดยย่อ

ฟีเจอร์ media3-ui-compose media3-ui-compose-material3
คอมโพเนนต์ UI องค์ประกอบพื้นฐาน เช่น PlayerSurface และ ContentFrame แต่ไม่มี ปุ่มหรือการควบคุมที่จัดรูปแบบไว้ล่วงหน้า มี Composable Player และชุด Composables ที่สร้างไว้ล่วงหน้าทั้งหมดซึ่งจัดรูปแบบด้วย Material3 เช่น PlayPauseButton, SeekBackButton, PositionAndDurationText เป็นต้น
การจัดการสถานะ มีตัวยึด remember...State เพื่อจัดการตรรกะ จัดการสถานะภายใน แต่คุณยังคงเข้าถึงตัวยึดสถานะได้หากต้องการ
ทรัพยากร Dependency androidx.compose.foundation media3-ui-compose, androidx.compose.material3, com.google.android.material
กรณีการใช้งานหลัก การสร้าง UI ของเพลเยอร์ด้วยระบบการออกแบบที่กำหนดเอง ควบคุมรูปลักษณ์และการใช้งานได้อย่างเต็มที่ การสร้าง UI ของเพลเยอร์อย่างรวดเร็วซึ่งเป็นไปตามหลักเกณฑ์ Material Design 3