Odbiorca odtwarza treść i przekazuje użytkownikowi jej stan. Odbiorca musi natychmiast odpowiadać na działania w aplikacji nadawcy . Jeśli na przykład odtwarzanie treści na odbiorniku zostanie wstrzymane, pojawi się ikona wstrzymania, a użytkownik naciśnie przycisk odtwarzania w aplikacji nadawcy, a odbiorca zacznie odtwarzać treści i usuwa ikonę wstrzymywania.
Przykłady opinii w interfejsie odbiorcy:
- Odtwarzam
- Wstrzymano
- Pozycja odtwarzania / przewijanie
- Buforuję
Interfejs odbiornika
Wymagany
A Większość elementów interfejsu należy umieścić w dolnej 1/4 ekranu i zachować spójność z innymi elementami interfejsu.
B Nie prezentuj elementów jako interaktywnych elementów sterujących. Na przykład nie odtwarzaj UI nadawcy w interfejsie odbiorcy.
Sprawdzone metody
- Użyj przejścia (zanikania), przezroczystości i niuansów, aby złagodzić efekt wizualny.
- Zastanów się, czy użytkownicy chcą mieć dostęp do jak największej ilości treści. Użytkownicy często wstrzymują treści, aby je sprawdzić, więc jeśli to możliwe, umieszczaj niepotrzebne elementy interfejsu.
Android
Interfejs nadawcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-persistent-control2.png?authuser=8&hl=pl)
Interfejs odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-elements1_a.png?authuser=8&hl=pl)
iOS
Interfejs nadawcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-persistent-control2.png?authuser=8&hl=pl)
Interfejs odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-elements1_a.png?authuser=8&hl=pl)
Chrome
Interfejs nadawcy
![Interfejs nadawcy](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-persistent-control2.png?authuser=8&hl=pl)
Interfejs odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-elements1_a.png?authuser=8&hl=pl)
Nieaktywna aplikacja odbiornika
Gdy odbiornik jest połączony z nadawcą, ale nie przesyła, na odbiorniku jest wyświetlany ekran bezczynności.
Wymagany
A Określ, która aplikacja odbierająca jest załadowana
Sprawdzone metody
- Użyj ekranu bezczynności, aby promować treści lub funkcje aplikacji nadawcy.
- Zmieniaj treść co 30–60 sekund, aby wyświetlać więcej i zapobiegać wypaleniu ekranu.
- Odłącz się od aplikacji odbierającej i wyłącz jej działanie, jeśli będzie nieaktywna przez 5 minut. Po zatrzymaniu pojawia się ekran główny odbiornika, co pomaga zapobiegać wypaleniu ekranu.
Android
Okno przesyłania – połączono, ale nie przesyłasz
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-menu-connected1.png?authuser=8&hl=pl)
Aplikacja odbiornika załadowana / bezczynna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1_a.png?authuser=8&hl=pl)
iOS
Okno przesyłania – połączono, ale nie przesyłasz
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-menu-connected1.png?authuser=8&hl=pl)
Aplikacja odbiornika załadowana / bezczynna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1_a.png?authuser=8&hl=pl)
Wczytywanie aplikacji odbiornika
Gdy użytkownik łączy się z odbiornikiem, aplikacja odbierająca musi się najpierw wczytać, aby wyświetlić stan bezczynności aplikacji lub rozpocząć odtwarzanie treści.
Wymagany
A Sprawdzanie, która aplikacja odbiornika wczytuje się,
wyświetlając jej logo
B Sprawdzanie, czy aplikacja odbierająca się wczytuje, wyświetlając animowany wskaźnik postępu.
Android
Nadawca łączy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states4.png?authuser=8&hl=pl)
Wczytuję aplikację odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1_a.gif?authuser=8&hl=pl)
iOS
Nadawca łączy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states4.png?authuser=8&hl=pl)
Wczytuję aplikację odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1_a.gif?authuser=8&hl=pl)
Chrome
Nadawca łączy
![Nadawca łączy](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states4.png?authuser=8&hl=pl)
Wczytuję aplikację odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1_a.gif?authuser=8&hl=pl)
Wczytywanie treści odbiornika
Po załadowaniu aplikacji odbierającej treści można zacząć przesyłać strumieniowo.
Wymagany
A Określ, jakie treści są wczytywane, wyświetlając tytuł lub grafikę w sekcji
B Sprawdź, czy treść się wczytuje, wyświetlając animowany wskaźnik postępu.
Sprawdzone metody
Podczas wznawiania wstrzymanych treści przewiń odtwarzanie do tyłu o 5–10 sekund, aby widz niczego nie przegapił w trakcie przechodzenia od nadawcy do odbiorcy.
Android
Wczytuję treść nadawcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-control-elements1.gif?authuser=8&hl=pl)
Wczytuję zawartość odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-content-loading1_a.gif?authuser=8&hl=pl)
iOS
Wczytuję treść nadawcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-control-elements1.gif?authuser=8&hl=pl)
Wczytuję zawartość odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-content-loading1_a.gif?authuser=8&hl=pl)
Chrome
Wczytuję treść nadawcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-control-elements1.gif?authuser=8&hl=pl)
Wczytuję zawartość odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-content-loading1_a.gif?authuser=8&hl=pl)
Odtwarzanie odbiornika
Wymagany
A Określ, co jest odtwarzane po rozpoczęciu odtwarzania
B Określ pozycję odtwarzania po zmianie pozycji
C Sprawdź, czy odbiornik szuka treści, gdy
pozycja odtwarzania jest zmieniona,
ale urządzenie jeszcze nie jest odtwarzane
Android
Nadawca dostosowuje pozycję odtwarzania
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-control-elements3.gif?authuser=8&hl=pl)
Przewijanie treści odbiorcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-seek1_a.gif?authuser=8&hl=pl)
iOS
Nadawca dostosowuje pozycję odtwarzania
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-control-elements3.gif?authuser=8&hl=pl)
Przewijanie treści odbiorcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-seek1_a.gif?authuser=8&hl=pl)
Chrome
Nadawca dostosowuje pozycję odtwarzania
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-control-elements3.gif?authuser=8&hl=pl)
Przewijanie treści odbiorcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-seek1_a.gif?authuser=8&hl=pl)
Odbiornik wstrzymany
Wymagany
A Sprawdź, czy odtwarzanie treści jest wstrzymane, wyświetlając ikonę wstrzymania i pozycję odtwarzania
B Wyświetl tytuł lub grafikę, aby sprawdzić, które treści zostały wstrzymane
C Aby określić, która aplikacja odbierająca została wczytana,
wyświetlając jej logo
Sprawdzone metody
- Użytkownicy często wstrzymują treści, aby je sprawdzić, więc niepotrzebne zanikanie interfejsu po wstrzymaniu na kilka sekund może być spowodowane wyświetleniem ikony wstrzymania.
- Aplikacja odbierająca nie powinna kontynuować odtwarzania treści, chyba że użytkownik wyraźnie poprosi o rozpoczęcie odtwarzania, na przykład wznowić odtwarzanie lub pominąć element w kolejce.
- Odłącz się od aplikacji odbierającej i wyłącz ją, jeśli jest nieaktywna przez 20 minut. Po zatrzymaniu pojawia się ekran główny odbiornika, co pomaga zapobiegać wypaleniu ekranu. Zapisuje lokalizację wstrzymania, aby użytkownik mógł później wznowić odtwarzanie od tego momentu.
Android
Nadawca wstrzymany
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-persistent-control2.png?authuser=8&hl=pl)
Zawartość odbiornika została wstrzymana
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause1_a.png?authuser=8&hl=pl)
Nadawca wstrzymany
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-persistent-control2.png?authuser=8&hl=pl)
Odbiornik wstrzymany po 5 sekundach
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause2.png?authuser=8&hl=pl)
iOS
Nadawca wstrzymany
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-persistent-control2.png?authuser=8&hl=pl)
Zawartość odbiornika została wstrzymana
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause1_a.png?authuser=8&hl=pl)
Nadawca wstrzymany
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-persistent-control2.png?authuser=8&hl=pl)
Odbiornik wstrzymany po 5 sekundach
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause2.png?authuser=8&hl=pl)
Chrome
Nadawca wstrzymany
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-persistent-control2.jpg?authuser=8&hl=pl)
Zawartość odbiornika została wstrzymana
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause1_a.png?authuser=8&hl=pl)
Nadawca wstrzymany
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-persistent-control2.jpg?authuser=8&hl=pl)
Odbiornik wstrzymany po 5 sekundach
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause2.png?authuser=8&hl=pl)
Buforowanie odbiornika
Buforowanie na odbiorniku ma miejsce, gdy opóźnienie sieci lub inne czynniki powodują opóźnienie odtwarzania.
Wymagany
A Sprawdź, czy odbiornik buforuje się po kilku sekundach, wyświetlając wskaźnik postępu buforowania. Odczekanie kilku sekund w celu wskazania, że trwa buforowanie, zapobiegnie zbyt częstemu wyświetlaniu się wskaźnika buforowania w przypadku problemów z siecią.
Sprawdzone metody
Określ, które treści są buforowane, jeśli buforowanie trwa nadal przez 5 sekund.
Android
Nadawca wskazuje buforowanie odbiorcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-control-elements3.gif?authuser=8&hl=pl)
Buforowanie treści odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-buffer1_a.gif?authuser=8&hl=pl)
iOS
Nadawca wskazuje buforowanie odbiorcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-control-elements3.gif?authuser=8&hl=pl)
Buforowanie treści odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-buffer1_a.gif?authuser=8&hl=pl)
Chrome
Nadawca wskazuje buforowanie odbiorcy
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-control-elements3.gif?authuser=8&hl=pl)
Buforowanie treści odbiornika
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-buffer1_a.gif?authuser=8&hl=pl)
Odbiornik zatrzymuje przesyłanie
Gdy odtwarzanie zatrzyma się lub minie limit czasu, UI odbiorcy powinien promować inne treści lub funkcje dostępne w aplikacji nadawcy.
Wymagany
A Określ, która aplikacja odbierająca jest załadowana, a która jest nieaktywna, wyświetlając jej logo
Sprawdzone metody
- Korzystaj z ekranu bezczynności po odtworzeniu, aby polecać treści lub funkcje z aplikacji nadawcy na podstawie tego, co zostało właśnie przesłane
- Zmieniaj zawartość nieaktywnego ekranu co 30–60 sekund, aby zapobiec wypaleniu ekranu
- Odłącz się od aplikacji odbierającej i wyłącz jej działanie, jeśli będzie nieaktywna przez 5 minut. Po zatrzymaniu pojawia się ekran główny odbiornika, co pomaga zapobiegać wypaleniu ekranu.
Android
Aplikacja nadawcy jest nieaktywna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states4.png?authuser=8&hl=pl)
Aplikacja odbiornika jest nieaktywna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-complete1_a.png?authuser=8&hl=pl)
Nadawca został rozłączony
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states2.png?authuser=8&hl=pl)
Prześlij ekran główny
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=8&hl=pl)
iOS
Aplikacja nadawcy jest nieaktywna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states4.png?authuser=8&hl=pl)
Aplikacja odbiornika jest nieaktywna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-complete1_a.png?authuser=8&hl=pl)
Nadawca został rozłączony
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states2.png?authuser=8&hl=pl)
Prześlij ekran główny
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=8&hl=pl)
Chrome
Aplikacja nadawcy jest nieaktywna
![Aplikacja nadawcy jest nieaktywna](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states4.png?authuser=8&hl=pl)
Aplikacja odbiornika jest nieaktywna
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-complete1_a.png?authuser=8&hl=pl)
Nadawca został rozłączony
![Nadawca został rozłączony](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states2.png?authuser=8&hl=pl)
Prześlij ekran główny
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=8&hl=pl)
Obrazy użyte w tym przewodniku projektowym pochodzą od Blender Foundation i są udostępniane na licencji Creative Commons.
- Elephant's Dream: (c) prawa autorskie 2006, Blender Foundation / Holandia Media Art Institute / www.elephantsdream.org
- Sintel: (c) fundacja Blendera praw autorskich | www.sintel.org
- Tears of Steel: (CC) Blender Foundation | mango.blender.org
- Big Buck Bunny: (c) prawa autorskie 2008, Blender Foundation / www.bigbuckbunny.org