दूसरी इमेज

कास्ट डेवलपर, ऑडियो और वीडियो ऐप्लिकेशन के लिए, यूज़र इंटरफ़ेस (यूआई) में जानकारी देने वाली (सेकंडरी) इमेज जोड़ सकते हैं. कौनसे इमेज फ़ॉर्मैट इस्तेमाल किए जा सकते हैं, यह देखें.

दूसरी इमेज, डिसप्ले के सबसे ऊपर दाईं ओर दिखती है. इसका इस्तेमाल ग्राफ़िक दिखाने के लिए किया जा सकता है. इसमें मौजूदा समय में चल रहे कॉन्टेंट के बारे में ज़्यादा जानकारी दी जा सकती है, जैसे कि कॉन्टेंट का फ़ॉर्मैट, रेडियो स्टेशन के कॉल साइन या टीवी शो की रेटिंग. दूसरी इमेज तब तक स्क्रीन पर बनी रहती है, जब तक मौजूदा कॉन्टेंट के लिए यह सुविधा चालू हो और प्लेयर कुछ समय से इस्तेमाल में न हो.

टेबल 1 में उपयोगकर्ता का अनुभव दिखाया गया है. ऐसा तब किया गया, जब यह सुविधा उन डिवाइस टाइप और कंट्रोल पर चालू की गई जिन पर यह सुविधा चालू होती है. ऑडियो और वीडियो ऐप्लिकेशन के बीच इंटिग्रेशन और लागू करने की जानकारी थोड़ी अलग होती है. अपने वेब रिसीवर में इस सुविधा को जोड़ने के लिए, नीचे दिए गए सेक्शन देखें.

टेबल 1: कॉन्टेंट और डिवाइस के टाइप के हिसाब से दूसरी इमेज का यूज़र इंटरफ़ेस (यूआई)
डिवाइस का टाइप ऑडियो कॉन्टेंट वीडियो सामग्री
Chromecast ऑडियो कॉन्टेंट के लिए Chromecast डोंगल पर दूसरी इमेज. वीडियो कॉन्टेंट के लिए Chromecast डोंगल पर दूसरी इमेज.
Google TV के साथ Chromecast ऑडियो कॉन्टेंट के लिए google TV के डोंगल के साथ, Chromecast की दूसरी इमेज. वीडियो कॉन्टेंट के लिए google TV के डोंगल के साथ, Chromecast की दूसरी इमेज.
स्मार्ट डिसप्ले स्मार्ट डिसप्ले पर ऑडियो कॉन्टेंट के लिए दूसरी इमेज. वीडियो कॉन्टेंट के लिए, स्मार्ट डिसप्ले पर दूसरी इमेज.
स्मार्ट डिसप्ले रिमोट कंट्रोल ऑडियो कॉन्टेंट के लिए, स्मार्ट डिसप्ले के रिमोट कंट्रोल पर दूसरी इमेज. ध्यान दें: वीडियो कॉन्टेंट के रिमोट कंट्रोल पर, दूसरी इमेज काम नहीं करती है.

ऑडियो

खास जानकारी

ऑडियो कॉन्टेंट के लिए दूसरी इमेज, लोड किए गए कॉन्टेंट के मेटाडेटा से ली जाती है. मीडिया आइटम लोड होने के बाद, मेटाडेटा की secondaryImage प्रॉपर्टी में किया जाने वाला कोई भी बदलाव, यूज़र इंटरफ़ेस (यूआई) में दिखता है.

अगर किसी स्मार्ट डिसप्ले को ऑडियो के रिमोट कंट्रोल के तौर पर इस्तेमाल किया जाता है, तो सेट किए जाने पर दूसरी इमेज भी स्मार्ट डिसप्ले के यूज़र इंटरफ़ेस (यूआई) पर दिखेगी.

लागू करने का तरीका

दूसरी इमेज को सेट करने, हटाने या अपडेट करने के लिए, MusicTrackMediaMetadata की secondaryImage प्रॉपर्टी में बदलाव करने की ज़रूरत है. इस प्रॉपर्टी के लिए, यूआरएल में एक Image ऑब्जेक्ट भरा जाता है, जो यह बताता है कि दूसरी इमेज कहां होस्ट की गई है.

नीचे दिए गए सैंपल में, दूसरी इमेज load इंटरसेप्टर में सेट की गई है. जब प्लेयर कॉन्टेंट लोड कर लेता है, तो दूसरी इमेज दिखती है.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
playerManager.setMessageInterceptor(
    cast.framework.messages.MessageType.LOAD, loadRequestData => {
      loadRequestData.media.metadata =
          new cast.framework.messages.MusicTrackMediaMetadata();

      // Set image on secondaryImage field of metadata object
      loadRequestData.media.metadata.secondaryImage =
          new cast.framework.messages.Image('https://www.image.png');

      return loadRequestData;
    });

प्लेबैक के दौरान दूसरी इमेज को अपडेट करने के लिए, ऐप्लिकेशन को getMediaInformation पर कॉल करके MediaInformation पाने के लिए, PlayerManager का इस्तेमाल करना चाहिए. इसके बाद, ऐप्लिकेशन को secondaryImage प्रॉपर्टी को अपनी पसंद की वैल्यू पर अपडेट करके, metadata में बदलाव करना चाहिए. आखिर में, नई जानकारी के साथ कॉलsetMediaInformation करने पर, यूज़र इंटरफ़ेस (यूआई) अपडेट हो जाएगा. इस तरीके का इस्तेमाल, वीडियो चलाने के दौरान मेटाडेटा में होने वाले बदलावों, जैसे कि EMSG या ID3 इवेंट को मैनेज करने के लिए किया जा सकता है.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
playerManager.addEventListener(cast.framework.events.EventType.EMSG, () => {
  let mediaInformation = playerManager.getMediaInformation();
  mediaInformation.metadata.secondaryImage =
      new cast.framework.messages.Image('http://anotherimage.png');
  playerManager.setMediaInformation(mediaInformation);
});

दूसरी इमेज को अनसेट करने के लिए, मेटाडेटा ऑब्जेक्ट पर secondaryImage प्रॉपर्टी को शून्य पर सेट करें.

// To unset the secondary image, set secondaryImage to null.
let mediaInformation = playerManager.getMediaInformation();
mediaInformation.metadata.secondaryImage = null;
playerManager.setMediaInformation(mediaInformation);

वीडियो

खास जानकारी

वीडियो कॉन्टेंट के लिए, दूसरी इमेज को UiManager का इस्तेमाल करके सेट किया जाता है और हटाया जाता है. दूसरी इमेज, वीडियो कंट्रोल ओवरले के साथ दिखाई गई है.

लागू करने का तरीका

दूसरी इमेज सेट करने के लिए, ऐप्लिकेशन को UiManager का इंस्टेंस पाना होगा और setSecondaryImage को कॉल करना होगा. इसके दो पैरामीटर होते हैं: SecondaryImagePosition और इमेज का यूआरएल. दूसरी इमेज कभी भी सेट की जा सकती है, लेकिन यह सिर्फ़ तब दिखाई जाएगी, जब कोई उपयोगकर्ता ओवरले को फ़ोरग्राउंड के लिए ट्रिगर करता है.

/**
 * Sets the image url for the secondary image overlay. Replaces any image that
 * was previously set.
 */
castUiManager.setSecondaryImage(
    cast.framework.ui.SecondaryImagePosition.TOP_RIGHT_VIDEO_OVERLAY,
    'http://www.image.png');

इमेज के यूआरएल को null या खाली स्ट्रिंग पर सेट करके, दूसरी इमेज हटाई जाती है.

// To  clear out the image, set the url to null or an empty string.
const castUiManager = cast.framework.ui.UiManager.getInstance();
castUiManager.setSecondaryImage(
    cast.framework.ui.SecondaryImagePosition.TOP_RIGHT_VIDEO_OVERLAY, null);

अगले चरण

इसी के साथ वे सुविधाएं खत्म हो जाती हैं जिन्हें आपके वेब रिसीवर में जोड़ा जा सकता है. अब iOS, Android या वेब पर भेजने वाला ऐप्लिकेशन बनाया जा सकता है.