Compose पर आधारित यूज़र इंटरफ़ेस (यूआई) का इस्तेमाल शुरू करना

डिपेंडेंसी जोड़ें

Media3 लाइब्रेरी में, Jetpack Compose पर आधारित दो यूज़र इंटरफ़ेस (यूआई) मॉड्यूल शामिल हैं. आपको दोनों जोड़ने की ज़रूरत नहीं है, क्योंकि Material3 वाली डिपेंडेंसी, कोर डिपेंडेंसी पर निर्भर करती है.

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

Groovy

// 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-फ़र्स्ट तरीके से डेवलप करें या व्यू का इस्तेमाल करने से माइग्रेट करें.

पूरी तरह से 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 का इस्तेमाल करें.

यह लाइब्रेरी, पाइपलाइन का आखिरी UI हिस्सा उपलब्ध कराती है. यह media3-ui-compose पर निर्भर करता है. इसमें पहले से बने ऐसे composable फ़ंक्शन शामिल होते हैं जिन्हें Material3 कॉम्पोनेंट के साथ स्टाइल किया जाता है. इनमें Player और MiniController composable शामिल हैं. 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 के दिशा-निर्देशों का पालन करने वाला प्लेयर यूज़र इंटरफ़ेस (यूआई) तेज़ी से बनाना.