Udostępnij za pośrednictwem

Praca z kontrolerami paska kart systemu tvOS na platformie Xamarin

  • Artykuł

W przypadku wielu typów aplikacji systemu tvOS podstawowa nawigacja jest wyświetlana jako pasek tabulacji uruchomiony w górnej części ekranu. Użytkownik przesuwa palcem w lewo i w prawo na liście możliwych kategorii i obszaru zawartości poniżej zmian, aby odzwierciedlić wybór użytkownika.

Przykładowy pasek karty

Pasek karty jest domyślnie przezroczysty i zawsze pojawia się w górnej części ekranu. Gdy w trybie koncentracji uwagi pasek karty obejmie górną 140 pikseli ekranu, ale szybko odsunie się, gdy fokus zostanie przesunięty do obszaru zawartości poniżej.

Paski kart w systemie tvOS

Działa UITabViewController w podobny sposób i służy podobnemu celowi w systemie tvOS, podobnie jak w systemie iOS, z następującymi kluczowymi różnicami:

  • W przeciwieństwie do paska tabulatora w systemie iOS, który jest wyświetlany w dolnej części ekranu, paski kart w systemie tvOS zajmują górne 140 pikseli ekranu i są domyślnie przezroczyste.
  • Gdy fokus opuszcza pasek tabulatora dla obszaru zawartości poniżej, pasek karty szybko przesuwa się u góry ekranu i jest ukryty. Użytkownik może nacisnąć przycisk Menu raz lub przesunąć palcem w górę na Ekranie zdalnym Siri, aby ponownie wyświetlić pasek kart.
  • Przesuwanie palcem w dół na zdalnym siri spowoduje przeniesienie fokusu do obszaru zawartości poniżej paska karty do pierwszego elementu fokusowego w wyświetlanej zawartości. Ponownie spowoduje to ukrycie paska tabulacji po przesunięciu fokusu.
  • Kliknięcie, aby wybrać kategorię wyświetlaną na pasku kart, spowoduje przełączenie do zawartości tej kategorii, a fokus zostanie przełączony na pierwszy element z możliwością koncentracji uwagi w tym widoku.
  • Liczba kategorii wyświetlanych na pasku karty powinna być stała, a wszystkie kategorie powinny być dostępne przez cały czas, a dana kategoria nigdy nie powinna być wyłączona.
  • Paski kart nie obsługują dostosowywania w systemie tvOS. Ponadto nie wyświetlają większej liczby kategorii (na przykład systemu iOS), jeśli na pasku karty znajduje się więcej kategorii, niż można je zmieścić.

Firma Apple ma następujące sugestie dotyczące pracy z paskami kart:

  • Użyj pasków kart do logicznego organizowania zawartości — użyj paska kart, aby logicznie zorganizować zawartość, z którą działa aplikacja tvOS. Na przykład Polecane, Najważniejsze wykresy, Zakupione i Wyszukiwanie.
  • Dodaj znaczki, aby poinformować użytkowników o nowej zawartości — opcjonalnie możesz wyświetlić wskaźnik (czerwony owalny z białą liczbą lub wykrzyknikiem), aby poinformować użytkownika o nowej zawartości w kategorii.
  • Używaj znaczków oszczędnie — nie zaśmiecaj paska kart z znaczkami i wyświetlaj je tylko wtedy, gdy udostępniają użytkownikowi krytyczne informacje.
  • Ogranicz liczbę kategorii — aby zmniejszyć złożoność i zachować możliwość zarządzania aplikacją, nie przeciąż paska kart z kategoriami i upewnij się, że wszystkie kategorie są widoczne i nie są zatłoczone. Proste, krótkie tytuły działają najlepiej.
  • Nie wyłączaj kategorii — wszystkie karty (kategorie) powinny być zawsze widoczne i włączone przez cały czas. Jeśli dana karta nie ma zawartości, podaj wyjaśnienie dla użytkownika, dlaczego. Na przykład karta Zakupy będzie pusta, jeśli użytkownik nie dokonał zakupów.

Elementy paska kart

Każda kategoria (karta) na pasku karty jest reprezentowana przez element paska kart (UITabBarItem). Firma Apple ma następujące sugestie dotyczące pracy z elementami paska kart:

  • Używanie kart opartych na tekście — chociaż element paska karty jest w stanie być reprezentowany jako ikona, firma Apple sugeruje używanie tekstu tylko dlatego, że zwięzły tytuł jest łatwiejszy do zinterpretowania niż ikona.
  • Użyj krótkich, znaczących rzeczowników lub czasowników — element paska karty powinien wyraźnie przekazać zawartość, która zawiera i działa najlepiej, gdy jest to prosty rzeczownik (taki jak Zdjęcia, Filmy lub Muzyka) lub czasowniki (takie jak Wyszukiwanie lub Odtwarzanie).

Paski kart i scenorysy

Najprostszym sposobem pracy z paskami kart w aplikacji platformy Xamarin.tvOS jest dodanie ich do interfejsu użytkownika aplikacji przy użyciu Projektant systemu iOS.

  1. Uruchom nową aplikację platformy Xamarin.tvOS i wybierz pozycję aplikacja> z kartami systemu tvOS:>

    Wybieranie aplikacji z kartami

  2. Postępuj zgodnie ze wszystkimi monitami, aby utworzyć nowe rozwiązanie Xamarin.tvOS.

  3. W okienku rozwiązania kliknij Main.storyboard dwukrotnie plik i otwórz go do edycji.

  4. Aby zmienić ikonę lub tytuł dla danej kategorii, wybierz element paska tabulatora dla kontrolera widoku w konspekcie dokumentu:

    Element paska kart dla kontrolera widoku w konspekcie dokumentu

  5. Następnie ustaw wymagane właściwości na karcie Widżet Eksploratora właściwości:

    Karta Widżet

  6. Aby dodać nową kategorię (tabulator), upuść kontroler widoku na powierzchni projektowej:

    Kontroler widoku

  7. Kliknij i przeciągnij z kontrolera widoku karty do nowego kontrolera widoku.

  8. W oknie podręcznym wybierz pozycję Kontrolery widoku, aby dodać nowy widok jako kartę (kategoria):

    Wybieranie karty

  9. Zaprojektuj układ interfejsu użytkownika dla każdego obszaru zawartości Caterogies w zwykły sposób, dodając elementy interfejsu użytkownika w Projektant systemu iOS.

  10. Uwidaczniaj wszystkie wymagane zdarzenia do pracy z kontrolkami interfejsu użytkownika w kodzie języka C#.

  11. Nazwij wszystkie kontrolki interfejsu użytkownika, które mają być uwidocznine w kodzie języka C#.

  12. Zapisz zmiany.

Ważne

Chociaż istnieje możliwość przypisania zdarzeń, takich jak TouchUpInsideUIButtondo elementu interfejsu użytkownika (na przykład ) w Projektant systemu iOS, nigdy nie będzie wywoływana, ponieważ urządzenie Apple TV nie ma ekranu dotykowego ani nie obsługuje zdarzeń dotykowych. Zdarzenie należy zawsze używać Primary Action podczas tworzenia procedur obsługi zdarzeń dla elementów interfejsu użytkownika systemu tvOS.

Aby uzyskać więcej informacji na temat pracy z scenorysami, zobacz przewodnik Szybki start dotyczący funkcji Hello, tvOS.

Praca z paskami kart

Items Użyj właściwości , UITabBar aby uzyskać dostęp do kolekcji UITabBarItems zawierającej jako tablicę indeksowaną zero (0). Właściwość SelectedItem zwróci aktualnie wybraną kartę (kategoria) jako UITabBarItem.

Praca z elementami paska kart

Aby wyświetlić znaczek na danej karcie (czerwony owalny z białym tekstem), użyj następującego kodu:

// Display a badge
TabBar.Items [2].BadgeValue = "10";

Co spowoduje wygenerowanie następujących wyników podczas uruchamiania:

Element paska karty z znaczkiem

Title Użyj właściwości , UITabBarItem aby zmienić tytuł i Image właściwość, aby zmienić ikonę.

Podsumowanie

W tym artykule opisano projektowanie i pracę z kontrolerem paska kart w aplikacji platformy Xamarin.tvOS.