स्मार्ट डिसप्ले के लिए ऑप्टिमाइज़ करना

स्मार्ट डिसप्ले ऐसे डिवाइस होते हैं जिन पर टच कंट्रोल की सुविधा होती है. साथ ही, इनका काम वेब रिसीवर ऐप्लिकेशन को टच कंट्रोल की सुविधा देने की अनुमति देना होता है. वेब रिसीवर SDK टूल, प्लेयर कंट्रोल के अतिरिक्त कस्टमाइज़ेशन के साथ डिफ़ॉल्ट यूआई अनुभव देता है.

इस गाइड में बताया गया है कि स्मार्ट डिसप्ले पर लॉन्च करने के बाद, आप वेब रिसीवर ऐप्लिकेशन को कैसे ऑप्टिमाइज़ कर सकते हैं. साथ ही, प्लेयर कंट्रोल को अपनी पसंद के मुताबिक बनाने का तरीका भी बताया गया है.

ध्यान दें: इस कस्टमाइज़ेशन के लिए, पहले से मौजूद प्लेयर यूज़र इंटरफ़ेस (यूआई) cast-media-player एलिमेंट का इस्तेमाल करना ज़रूरी है. अगर इस एलिमेंट का इस्तेमाल नहीं किया जाता है, तो यूज़र इंटरफ़ेस (यूआई) की स्थिति को ट्रैक करना, ब्रैंडिंग करना, और दूसरे कस्टमाइज़ेशन मैन्युअल तरीके से किए जाने चाहिए.

यूज़र इंटरफ़ेस (यूआई) कंट्रोल ऐक्सेस किए जा रहे हैं

यूज़र इंटरफ़ेस (यूआई) कंट्रोल ऑब्जेक्ट को यहां दिए गए कोड से ऐक्सेस किया जा सकता है:

const controls = cast.framework.ui.Controls.getInstance();

अगर cast-media-player एलिमेंट का इस्तेमाल नहीं किया जा रहा है, तो आपको UiConfig में UiConfig में touchScreenOptimizedApp प्रॉपर्टी को true पर सेट करना होगा.

context.start({
  uiConfig: {
    touchScreenOptimizedApp: true
  }
});

डिफ़ॉल्ट वीडियो यूज़र इंटरफ़ेस (यूआई)

MetadataType और MediaStatus.supportedMediaCommands के आधार पर, हर स्लॉट को डिफ़ॉल्ट कंट्रोल बटन असाइन किए जाते हैं.

मेटाडेटाType.Movie, मेटाडेटाType.जेनेरिक

जवाब --playback-logo-image

B. MovieMediaMetadata.subtitle या GenericMediaMetadata.subtitle.

C. MovieMediaMetadata.title या GenericMediaMetadata.title.

D. MediaStatus.currentTime

एपिसोड MediaInformation.duration

शुक्र ControlsSlot.SLOT_SECONDARY_1

जी. ControlsSlot.SLOT_PRIMARY_1

H. चलाएं / रोकें

I. ControlsSlot.SLOT_PRIMARY_2

जर्नल ControlsSlot.SLOT_SECONDARY_2

जब supportedMediaCommands की वैल्यू ALL_BASIC_MEDIA के बराबर होती है, तो डिफ़ॉल्ट कंट्रोल लेआउट नीचे दिए गए तरीके से दिखेगा:

supportedMediaCommands की वैल्यू ALL_BASIC_MEDIA | QUEUE_PREV | QUEUE_NEXT के बराबर होने पर, डिफ़ॉल्ट कंट्रोल लेआउट नीचे दिए गए तरीके से दिखेगा:

supportedMediaCommands की वैल्यू PAUSE | QUEUE_PREV | QUEUE_NEXT के बराबर होने पर, डिफ़ॉल्ट कंट्रोल लेआउट नीचे दिए गए तरीके से दिखेगा:

जब टेक्स्ट ट्रैक उपलब्ध होंगे, तो सबटाइटल बटन हमेशा SLOT_SECONDARY_1 पर दिखाया जाएगा.

किसी रिसीवर का प्रसंग शुरू करने के बाद supportedMediaCommands का मान डायनामिक रूप से बदलने के लिए, आप मान को ओवरराइड करने के लिए PlayerManager.setSupportedMediaCommands को कॉल कर सकते हैं. साथ ही, addSupportedMediaCommands का इस्तेमाल करके नया निर्देश जोड़ा जा सकता है या removeSupportedMediaCommands का इस्तेमाल करके मौजूदा निर्देश हटाया जा सकता है.

डिफ़ॉल्ट ऑडियो यूज़र इंटरफ़ेस (यूआई)

मेटाडेटा प्रकार.Music_TRACK

जवाब --playback-logo-image

ब. MusicTrackMediaMetadata.albumName

सी. MusicTrackMediaMetadata.title

D. MusicTrackMediaMetadata.albumArtist, MusicTrackMediaMetadata.artist या MusicTrackMediaMetadata.composer

एपिसोड MusicTrackMediaMetadata.images[0]

शुक्र MediaStatus.currentTime

जी. MediaInformation.duration

हीटिंग ControlsSlot.SLOT_SECONDARY_1

I. ControlsSlot.SLOT_PRIMARY_1

J. चलाएं / रोकें

के. ControlsSlot.SLOT_PRIMARY_2

एल. ControlsSlot.SLOT_SECONDARY_2

जब supportedMediaCommands की वैल्यू ALL_BASIC_MEDIA के बराबर होती है, तो डिफ़ॉल्ट कंट्रोल लेआउट नीचे दिए गए तरीके से दिखता है:

supportedMediaCommands की वैल्यू ALL_BASIC_MEDIA | QUEUE_PREV | QUEUE_NEXT के बराबर होने पर, डिफ़ॉल्ट कंट्रोल लेआउट नीचे दिए गए तरीके से दिखेगा:

'वेब रिसीवर' का संदर्भ शुरू करने के बाद, supportedMediaCommands की वैल्यू डाइनैमिक तौर पर बदलने के लिए, वैल्यू को बदलने के लिए PlayerManager.setSupportedMediaCommands पर कॉल करें. साथ ही, addSupportedMediaCommands का इस्तेमाल करके नए निर्देश जोड़े जा सकते हैं या मौजूदा निर्देशों को हटाने के लिए, removeSupportedMediaCommands का इस्तेमाल किया जा सकता है.

यूज़र इंटरफ़ेस (यूआई) कंट्रोल बटन का लेआउट पसंद के मुताबिक बनाएं

अगर आपको यूज़र इंटरफ़ेस (यूआई) कंट्रोल के बटन को बदलना है, तो कस्टम लेआउट का इस्तेमाल करें.

अहम जानकारी: कस्टम और डिफ़ॉल्ट लेआउट के बीच टकराव रोकने के लिए, स्लॉट के लिए कंट्रोल बटन असाइन करने से पहले सभी डिफ़ॉल्ट बटन हटाने होंगे.

const controls = cast.framework.ui.Controls.getInstance();
controls.clearDefaultSlotAssignments();

इसके बाद, assignButton को कॉल करके, चार स्लॉट के लिए कंट्रोल बटन असाइन किए जा सकते हैं.

controls.assignButton(
  cast.framework.ui.ControlsSlot.SLOT_SECONDARY_1,
  cast.framework.ui.ControlsButton.LIKE
)

controls.assignButton(
  cast.framework.ui.ControlsSlot.SLOT_SECONDARY_2,
  cast.framework.ui.ControlsButton.DISLIKE
)

पसंद के मुताबिक लेआउट कुछ इस तरह दिखेगा:

जब असाइन किया गया बटन MediaStatus.supportedMediaCommands में काम नहीं करता, तो बटन धूसर हो जाता है. उदाहरण के लिए, अगर supportedMediaCommands का मान ALL_BASIC_MEDIA | QUEUE_NEXT | LIKE | DISLIKE है, तो QUEUE_PREV बटन को बंद कर दिया जाता है.

वेब रिसीवर का संदर्भ शुरू करने के बाद supportedMediaCommands का मान डायनामिक रूप से बदलने के लिए, आप मान को ओवरराइड करने के लिए PlayerManager.setSupportedMediaCommands को कॉल कर सकते हैं. साथ ही, addSupportedMediaCommands का इस्तेमाल करके नए निर्देश जोड़े जा सकते हैं या removeSupportedMediaCommands का इस्तेमाल करके मौजूदा निर्देश हटाए जा सकते हैं.

दूसरी इमेज

दूसरी इमेज, Cast डेवलपर को ऑडियो और वीडियो ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) में जानकारी देने वाली इमेज जोड़ने की सुविधा देती है. जैसे, स्थानीय चैनल के लोगो या मीडिया फ़ॉर्मैट दिखाने के लिए. इस नई सुविधा को ओवरहेड की सुविधा दी गई है. इससे, कास् ट करने के लिए अलग-अलग डिसप्ले प्लैटफ़ॉर्म पर दोनों जगह एक जैसा यूज़र इंटरफ़ेस (यूआई) बना रहता है: Chromecast, स्मार्ट डिसप्ले, और Chromecast with Google TV.