HoloLens (1. gen) i Azure 306: Przesyłanie strumieniowe wideo


Uwaga

Samouczki dotyczące akademii Mixed Reality zostały zaprojektowane z myślą o urządzeniach HoloLens (1. generacji) i Mixed Reality immersywnych zestawów słuchawkowych. W związku z tym uważamy, że ważne jest pozostawienie tych samouczków w miejscu dla deweloperów, którzy nadal szukają wskazówek dotyczących opracowywania tych urządzeń. Te samouczki nie zostaną zaktualizowane przy użyciu najnowszych zestawów narzędzi ani interakcji używanych do HoloLens 2. Będą one utrzymywane w celu kontynuowania pracy na obsługiwanych urządzeniach. W przyszłości zostanie opublikowana nowa seria samouczków, które pokażą, jak opracowywać HoloLens 2. To powiadomienie zostanie zaktualizowane za pomocą linku do tych samouczków po ich opublikowaniu.


Zrzut ekranu przedstawiający przykład Windows Mixed Reality V R.Zrzut ekranu przedstawiający środowisko Windows Mixed Reality V R.

W tym kursie dowiesz się, jak połączyć usługę Azure Media Services z środowiskiem Windows Mixed Reality VR, aby umożliwić przesyłanie strumieniowe 360 stopni odtwarzania wideo na immersywnych zestawach słuchawkowych.

Azure Media Services to kolekcja usług, które zapewniają usługi przesyłania strumieniowego wideo wysokiej jakości transmisji, aby dotrzeć do większej liczby odbiorców na najpopularniejszych urządzeniach przenośnych. Aby uzyskać więcej informacji, odwiedź stronę usługi Azure Media Services.

Po ukończeniu tego kursu będziesz mieć aplikację immersywną rzeczywistości mieszanej, która będzie mogła wykonać następujące czynności:

  1. Pobierz wideo 360 stopni z usługi Azure Storage za pośrednictwem usługi Azure Media Service.

  2. Wyświetl pobrany film wideo o 360 stopni w scenie aparatu Unity.

  3. Nawiguj między dwiema scenami z dwoma różnymi filmami wideo.

W aplikacji należy do Ciebie, jak zintegrować wyniki z projektem. Ten kurs został zaprojektowany, aby nauczyć cię, jak zintegrować usługę platformy Azure z projektem aparatu Unity. Twoim zadaniem jest wykorzystanie wiedzy uzyskanych z tego kursu w celu ulepszenia aplikacji rzeczywistości mieszanej.

Obsługa urządzeń

Kurs HoloLens Immersyjne zestawy słuchawkowe
MR i Azure 306: Przesyłanie strumieniowe wideo ✔️

Wymagania wstępne

Uwaga

Ten samouczek jest przeznaczony dla deweloperów, którzy mają podstawowe doświadczenie w językach Unity i C#. Należy również pamiętać, że wymagania wstępne i pisemne instrukcje zawarte w tym dokumencie reprezentują to, co zostało przetestowane i zweryfikowane w momencie pisania (maj 2018 r.). Możesz bezpłatnie korzystać z najnowszego oprogramowania, jak pokazano w artykule dotyczącym instalacji narzędzi, choć nie należy zakładać, że informacje w tym kursie doskonale pasują do tego, co znajdziesz w nowszym oprogramowaniu niż wymienione poniżej.

Na potrzeby tego kursu zalecamy następujące oprogramowanie i sprzęt:

Przed rozpoczęciem

  1. Aby uniknąć problemów z kompilowaniem tego projektu, zdecydowanie zaleca się utworzenie projektu wymienionego w tym samouczku w folderze głównym lub niemal głównym (długie ścieżki folderów mogą powodować problemy w czasie kompilacji).

  2. Skonfiguruj i przetestuj Mixed Reality immersywny zestaw słuchawkowy.

    Uwaga

    Na potrzeby tego kursu nie będzie wymagane kontrolery ruchu. Jeśli potrzebujesz pomocy technicznej podczas konfigurowania zestawu słuchawkowego immersyjnego, kliknij link, aby skonfigurować Windows Mixed Reality.

Rozdział 1 — Witryna Azure Portal: tworzenie konta usługi Azure Storage

Aby korzystać z usługi Azure Storage, należy utworzyć i skonfigurować konto magazynu w Azure Portal.

  1. Zaloguj się do witryny Azure Portal.

    Uwaga

    Jeśli nie masz jeszcze konta platformy Azure, musisz go utworzyć. Jeśli obserwujesz ten samouczek w sytuacji w klasie lub laboratorium, poproś instruktora lub jednego z opiekunów o pomoc w skonfigurowaniu nowego konta.

  2. Po zalogowaniu się kliknij pozycję Konta magazynu w menu po lewej stronie.

    Zrzut ekranu przedstawiający menu witryny Azure Portal. Konta magazynu są wyróżnione.

  3. Na karcie Konta magazynu kliknij pozycję Dodaj.

    Zrzut ekranu przedstawiający okno dialogowe konta magazynu. Dodaj jest wyróżniony.

  4. Na karcie Tworzenie konta magazynu :

    1. Wstaw nazwę konta, należy pamiętać, że to pole akceptuje tylko cyfry i małe litery.

    2. W obszarze Model wdrażania wybierz pozycję Resource Manager.

    3. W polu Rodzaj konta wybierz pozycję Magazyn (ogólnego przeznaczenia w wersji 1).

    4. W obszarze Wydajność wybierz pozycję Standardowa.*

    5. W obszarze Replikacja wybierz pozycję Magazyn lokalnie nadmiarowy (LRS).

    6. Pozostaw opcję Bezpieczny transfer wymagany jako Wyłączony.

    7. Wybierz subskrypcję.

    8. Wybierz grupę zasobów lub utwórz nową. Grupa zasobów umożliwia monitorowanie, kontrolowanie dostępu, aprowizowania i zarządzania rozliczeniami dla kolekcji zasobów platformy Azure.

    9. Określ lokalizację grupy zasobów (jeśli tworzysz nową grupę zasobów). Lokalizacja najlepiej byłaby znajdować się w regionie, w którym aplikacja zostanie uruchomiona. Niektóre zasoby platformy Azure są dostępne tylko w niektórych regionach.

  5. Musisz potwierdzić, że rozumiesz warunki i postanowienia zastosowane do tej usługi.

    Zrzut ekranu przedstawiający stronę tworzenia konta magazynu.

  6. Po kliknięciu pozycji Utwórz trzeba będzie poczekać, aż usługa zostanie utworzona, może to potrwać minutę.

  7. Po utworzeniu wystąpienia usługi w portalu zostanie wyświetlone powiadomienie.

    Zrzut ekranu przedstawiający powiadomienie o powodzeniu wdrożenia.

  8. W tym momencie nie musisz podążać za zasobem, po prostu przejdź do następnego rozdziału.

Rozdział 2 — Witryna Azure Portal: tworzenie usługi Media Service

Aby korzystać z usługi Azure Media Service, należy skonfigurować wystąpienie usługi, które ma zostać udostępnione aplikacji (gdzie właściciel konta musi być Administracja).

  1. W witrynie Azure Portal kliknij pozycję Utwórz zasób w lewym górnym rogu i wyszukaj ciąg Media Service, naciśnij klawisz Enter. Zasób, którego chcesz obecnie używać, ma różową ikonę; kliknij tę opcję, aby wyświetlić nową stronę.

    Zrzut ekranu witryny Azure Portal. Opcja Media Services jest wyróżniona.

  2. Nowa strona zawiera opis usługi Media Service. W lewym dolnym rogu tego monitu kliknij przycisk Utwórz , aby utworzyć skojarzenie z tą usługą.

    Zrzut ekranu witryny Azure Portal. Przycisk Utwórz został wyróżniony.

  3. Po kliknięciu pozycji Utwórz panel pojawi się, gdzie musisz podać pewne szczegóły dotyczące nowej usługi Media Service:

    1. Wstaw żądaną nazwę konta dla tego wystąpienia usługi.

    2. Wybierz subskrypcję.

    3. Wybierz grupę zasobów lub utwórz nową. Grupa zasobów umożliwia monitorowanie, kontrolowanie dostępu, aprowizowania i zarządzania rozliczeniami dla kolekcji zasobów platformy Azure. Zaleca się przechowywanie wszystkich usług platformy Azure skojarzonych z jednym projektem (np. takich jak te laboratoria) w ramach wspólnej grupy zasobów.

    Jeśli chcesz dowiedzieć się więcej na temat grup zasobów platformy Azure, skorzystaj z tego linku, aby dowiedzieć się, jak zarządzać grupami zasobów platformy Azure.

    1. Określ lokalizację grupy zasobów (jeśli tworzysz nową grupę zasobów). Lokalizacja najlepiej byłaby znajdować się w regionie, w którym aplikacja zostanie uruchomiona. Niektóre zasoby platformy Azure są dostępne tylko w niektórych regionach.

    2. W sekcji Konto magazynu kliknij sekcję Wybierz... i kliknij konto magazynu utworzone w ostatnim rozdziale.

    3. Musisz również potwierdzić, że rozumiesz warunki i postanowienia zastosowane do tej usługi.

    4. Kliknij pozycję Utwórz.

      Zrzut ekranu przedstawiający stronę Tworzenie konta usługi Media Service.

  4. Po kliknięciu pozycji Utwórz trzeba będzie poczekać, aż usługa zostanie utworzona, może to potrwać minutę.

  5. Po utworzeniu wystąpienia usługi w portalu zostanie wyświetlone powiadomienie.

    Zrzut ekranu przedstawiający ikonę powiadomienia w menu portalu.

  6. Kliknij powiadomienie, aby zapoznać się z nowym wystąpieniem usługi.

    Zrzut ekranu przedstawiający powiadomienie o pomyślnym wdrożeniu.

  7. Kliknij przycisk Przejdź do zasobu w powiadomieniu, aby zapoznać się z nowym wystąpieniem usługi.

  8. Na nowej stronie Usługi multimediów w panelu po lewej stronie kliknij link Zasoby , który jest około połowy w dół.

  9. Na następnej stronie w lewym górnym rogu strony kliknij pozycję Przekaż.

    Zrzut ekranu przedstawiający stronę Zasoby. Opcje przekazywania i zasobów są wyróżnione.

  10. Kliknij ikonę Folder , aby przeglądać pliki, a następnie wybierz pierwsze 360 wideo, które chcesz przesłać strumieniowo.

    Możesz skorzystać z tego linku, aby pobrać przykładowy film wideo.

    Zrzut ekranu przedstawiający stronę przekazywania elementu zawartości wideo.

Ostrzeżenie

Długie nazwy plików mogą powodować problem z koderem: aby upewnić się, że filmy wideo nie mają problemów, rozważ skrócenie długości nazw plików wideo.

  1. Pasek postępu zmieni kolor na zielony po zakończeniu przekazywania wideo.

    Zrzut ekranu przedstawiający pasek postępu przekazywania elementu zawartości wideo.

  2. Kliknij powyższy tekst (nazwa usługi — Elementy zawartości), aby powrócić do strony Zasoby .

  3. Zauważysz, że wideo zostało pomyślnie przekazane. Kliknij je.

    Zrzut ekranu przedstawiający stronę Zasoby. Wideo 1 kropka M P 4 jest wyróżniona.

  4. Strona, do której nastąpi przekierowanie, będzie zawierać szczegółowe informacje o filmie wideo. Aby móc korzystać z wideo, musisz go zakodować, klikając przycisk Koduj w lewym górnym rogu strony.

    Zrzut ekranu przedstawiający stronę elementu zawartości. Przycisk zakodowania jest wyróżniony.

  5. Po prawej stronie pojawi się nowy panel, w którym będzie można ustawić opcje kodowania dla pliku. Ustaw następujące właściwości (niektóre zostaną już ustawione domyślnie):

    1. Nazwa kodera multimediów Media Encoder Standard

    2. Kodowanie wstępnie ustawionej zawartości z adaptacyjną szybkością transmisji bitów MP4

    3. Przetwarzanie Video1.mp4 nazwy zadania Media Encoder Standard

    4. Nazwa elementu zawartości nośnika wyjściowego Video1.mp4 — kodowana Media Encoder Standard

      Zrzut ekranu przedstawiający stronę kodowania elementu zawartości.

  6. Kliknij przycisk Utwórz.

  7. Zostanie wyświetlony pasek z dodanym zadaniem kodowania, kliknięciem tego paska i wyświetleniem panelu z wyświetlonym w nim postępem Kodowanie.

    Zrzut ekranu przedstawiający dodany pasek powiadomień z etykietą zadania kodowania.

    Zrzut ekranu przedstawiający stronę przetwarzania kodera.

  8. Poczekaj na ukończenie zadania. Po zakończeniu możesz zamknąć panel z symbolem "X" w prawym górnym rogu tego panelu.

    Zrzut ekranu przedstawiający pasek postępu z ukończonym stanem.

    Zrzut ekranu przedstawiający górne menu strony przetwarzania kodera multimediów.

    Ważne

    Czas potrzebny zależy od rozmiaru pliku wideo. Ten proces może zająć sporo czasu.

  9. Po utworzeniu zakodowanej wersji wideo możesz opublikować ją, aby była dostępna. W tym celu kliknij niebieski link Zasoby , aby wrócić do strony zasobów.

    Zrzut ekranu witryny Azure Portal. Link do zasobów został wyróżniony.

  10. Zobaczysz film wideo wraz z innym, który jest typu zasobu o różnych szybkościach transmisji bitów MP4.

    Zrzut ekranu przedstawiający menu zasobów platformy Microsoft Azure.

    Uwaga

    Możesz zauważyć, że nowy zasób, obok początkowego filmu wideo, jest nieznany i ma "0" bajtów dla jego rozmiaru, po prostu odśwież okno, aby go zaktualizować.

  11. Kliknij ten nowy zasób.

    Zrzut ekranu przedstawiający katalog zawierający listę zasobów.

  12. Zobaczysz podobny panel do tego, którego użyto wcześniej, po prostu jest to inny zasób. Kliknij przycisk Publikuj znajdujący się w górnej części strony.

    Zrzut ekranu przedstawiający górny pasek menu. Przycisk Publikuj został wyróżniony.

  13. Zostanie wyświetlony monit o ustawienie lokalizatora, który jest punktem wejścia, na plik/s w zasobach. W scenariuszu ustaw następujące właściwości:

    1. Typ >lokalizatoraProgresywny.

    2. Data i godzina zostaną ustawione dla Ciebie od bieżącej daty do godziny w przyszłości (w tym przypadku sto lat). Pozostaw to, co jest, lub zmień go na odpowiedni.

    Uwaga

    Aby uzyskać więcej informacji na temat lokalizatorów i tego, co można wybrać, odwiedź dokumentację usługi Azure Media Services.

  14. W dolnej części tego panelu kliknij przycisk Dodaj .

    Zrzut ekranu przedstawiający listy katalogów z elementem zawartości do opublikowania w oknie dialogowym.

  15. Film wideo jest teraz publikowany i może być przesyłany strumieniowo przy użyciu jego punktu końcowego. W dalszej części strony znajduje się sekcja Pliki . W tym miejscu będą znajdować się różne zakodowane wersje wideo. Wybierz jedną z najwyższych możliwych rozdzielczości (na poniższej ilustracji jest to plik 1920x960), a następnie zostanie wyświetlony panel po prawej stronie. W tym miejscu znajdziesz adres URL pobierania. Skopiuj ten punkt końcowy , ponieważ będzie on używany później w kodzie.

    Zrzut ekranu przedstawiający sekcję microsoft Azure Files.

    Zrzut ekranu przedstawiający stronę informacji o zasobach.

    Uwaga

    Możesz również nacisnąć przycisk Odtwarzania , aby odtworzyć wideo i przetestować go.

  16. Teraz musisz przekazać drugi film wideo, który będzie używany w tym laboratorium. Wykonaj powyższe kroki, powtarzając ten sam proces dla drugiego filmu wideo. Upewnij się, że skopiujesz również drugi punkt końcowy . Użyj następującego linku, aby pobrać drugi film wideo.

  17. Po opublikowaniu obu filmów możesz przejść do następnego rozdziału.

Rozdział 3 — Konfigurowanie projektu aparatu Unity

Poniżej przedstawiono typową konfigurację do programowania przy użyciu Mixed Reality, a w związku z tym jest to dobry szablon dla innych projektów.

  1. Otwórz aparat Unity i kliknij pozycję Nowy.

    Zrzut ekranu przedstawiający kartę Projekty aparatu Unity. Przycisk Nowy został wyróżniony.

  2. Teraz musisz podać nazwę projektu aparatu Unity, wstawić MR_360VideoStreaming.. Upewnij się, że typ projektu jest ustawiony na wartość 3D. Ustaw lokalizację na odpowiednią dla Siebie (pamiętaj, że bliżej katalogów głównych jest lepiej). Następnie kliknij pozycję Utwórz projekt.

    Zrzut ekranu przedstawiający stronę nowych projektów aparatu Unity.

  3. Po otwarciu aparatu Unity warto sprawdzić, czy domyślny edytor skryptów jest ustawiony na program Visual Studio. Przejdź do pozycji Edytujpreferencje , a następnie w nowym oknie przejdź do pozycji Narzędzia zewnętrzne. Zmień edytor skryptów zewnętrznych na Visual Studio 2017. Zamknij okno Preferencje .

    Zrzut ekranu przedstawiający menu edytora skryptów zewnętrznych. Wybrano program Visual Studio 2017.

  4. Następnie przejdź do pozycji Ustawienia kompilacjiplików i przełącz platformę na platforma uniwersalna systemu Windows, klikając przycisk Przełącz platformę.

  5. Upewnij się również, że:

    1. Urządzenie docelowe jest ustawione na dowolne urządzenie.

    2. Typ kompilacji jest ustawiony na D3D.

    3. Zestaw SDK jest ustawiony na najnowszą zainstalowaną.

    4. Dla wersji programu Visual Studio jest ustawiona wartość Najnowsza zainstalowana.

    5. Dla opcji Build and Run (Kompilacja i uruchamianie ) ustawiono wartość Maszyna lokalna.

    6. Nie martw się o konfigurowanie scen w tej chwili, ponieważ zostaną one skonfigurowane później.

    7. Pozostałe ustawienia powinny być na razie pozostawione jako domyślne.

      Zrzut ekranu przedstawiający ekran ustawień kompilacji aparatu Unity.

  6. W oknie Ustawienia kompilacji kliknij przycisk Ustawienia odtwarzacza . Spowoduje to otwarcie powiązanego panelu w przestrzeni, w której znajduje się inspektor .

  7. W tym panelu należy zweryfikować kilka ustawień:

    1. Na karcie Inne ustawienia :

      1. Wersja środowiska uruchomieniowegoskryptów powinna być stabilna (odpowiednik platformy.NET 3.5).

      2. Zaplecze skryptów powinno mieć wartość .NET.

      3. Poziom zgodności interfejsu API powinien mieć wartość .NET 4.6.

        Zrzut ekranu przedstawiający stronę Ustawienia platforma uniwersalna systemu Windows.

    2. W dalszej części panelu w obszarze Ustawienia XR (znajdujące się poniżej ustawień publikowania) zaznacz opcję Virtual Reality Supported (Obsługa rzeczywistości wirtualnej), upewnij się, że dodano zestaw SDK Windows Mixed Reality.

      Zrzut ekranu przedstawiający ekran ustawień aparatu Unity X R.

    3. Na karcie Ustawienia publikowania w obszarze Możliwości sprawdź:

      • InternetClient

        Zrzut ekranu przedstawiający ekran Możliwości. Klient internetowy jest zaznaczony.

  8. Po wprowadzeniu tych zmian zamknij okno Ustawienia kompilacji .

  9. Zapisz projekt zapisywaniapliku projektu.

Rozdział 4 . Importowanie pakietu InsideOutSphere Unity

Ważne

Jeśli chcesz pominąć składnik Unity Set up tego kursu i kontynuować bezpośrednio w kodzie, możesz pobrać ten pakiet unitypackage, zaimportować go do projektu jako pakiet niestandardowy, a następnie kontynuować z rozdziału 5. Nadal trzeba będzie utworzyć projekt aparatu Unity.

Na potrzeby tego kursu należy pobrać pakiet zasobów aparatu Unity o nazwie InsideOutSphere.unitypackage.

Instrukcje dotyczące importowania pakietu unitypackage:

  1. Przed tobą pulpit nawigacyjny aparatu Unity kliknij pozycję Zasoby w menu w górnej części ekranu, a następnie kliknij pozycję Importuj pakiet > niestandardowy pakietu.

    Zrzut ekranu przedstawiający menu zasobów. Menu importu pakietu jest otwarte. Wybrano pakiet niestandardowy.

  2. Użyj selektora plików, aby wybrać pakiet InsideOutSphere.unitypackage , a następnie kliknij przycisk Otwórz. Zostanie wyświetlona lista składników tego zasobu. Potwierdź importowanie, klikając pozycję Importuj.

    Zrzut ekranu przedstawiający ekran Importowanie pakietu aparatu Unity.

  3. Po zakończeniu importowania do folderu Assets zostaną dodane trzy nowe foldery, materiały, modele i prefabs. Ten rodzaj struktury folderów jest typowy dla projektu aparatu Unity.

    Zrzut ekranu przedstawiający folder zasobów.

    1. Otwórz folder Models i zobaczysz, że model InsideOutSphere został zaimportowany.

    2. W folderze Materiały znajdziesz materiał InsideOutSphereslambert1 wraz z materiałem o nazwie ButtonMaterial, który jest używany przez GazeButton, który zobaczysz wkrótce.

    3. Folder Prefabs zawiera prefabInsideOutSphere, który zawiera zarówno modelInsideOutSphere, jak i GazeButton.

    4. Żaden kod nie jest uwzględniony, napiszesz kod, postępując zgodnie z tym kursem.

  4. W hierarchii wybierz obiekt Main Camera i zaktualizuj następujące składniki:

    1. Przekształcanie

      1. Pozycja = X: 0, Y: 0, Z: 0.

      2. Obrót = X: 0, Y: 0, Z: 0.

      3. Skala X: 1, Y: 1, Z: 1.

    2. Aparat fotograficzny

      1. Wyczyść flagi: kolor stały.

      2. Płaszczyzny przycinania: Blisko: 0,1, Daleko: 6.

        Zrzut ekranu przedstawiający ekran Inspector (Inspektor).

  5. Przejdź do folderu Prefab , a następnie przeciągnij prefab InsideOutSphere do panelu hierarchii .

    Zrzut ekranu przedstawiający menu folderu Prefab i środowisko deweloperskie.

  6. Rozwiń obiekt InsideOutSphere w hierarchii, klikając małą strzałkę obok niej. Zobaczysz obiekt podrzędny pod nim o nazwie GazeButton. Spowoduje to zmianę scen i filmów wideo.

    Zrzut ekranu przedstawiający kartę hierarchii.

  7. W oknie Inspektor kliknij składnik InsideOutSphere's Transform, upewnij się, że ustawiono następujące właściwości:

Przekształcanie — położenie

X Y Z
0 0 0

Przekształcanie — rotacja

X Y Z
0 -50 0

Przekształcanie — skalowanie

X Y Z
0 0 0

Zrzut ekranu przedstawiający ekran Inspektor otwarty dla funkcji Inside Out Sphere.

  1. Kliknij obiekt podrzędny GazeButton i ustaw jego przekształcenie w następujący sposób:

Przekształcanie — położenie

X Y Z
3,6 1.3 0

Przekształcanie — rotacja

X Y Z
0 0 0

Przekształcanie — skalowanie

X Y Z
1 1 1

Zrzut ekranu przedstawiający otwartą kartę sceny.

Rozdział 5 . Tworzenie klasy VideoController

Klasa VideoController hostuje dwa punkty końcowe wideo, które będą używane do przesyłania strumieniowego zawartości z usługi Azure Media Service.

Aby utworzyć tę klasę:

  1. Kliknij prawym przyciskiem myszy folder zasobów znajdujący się w panelu projektu , a następnie kliknij pozycję Utwórz > folder. Nadaj nazwę skryptom folderu.

    Zrzut ekranu przedstawiający menu folderu zasobów. Menu tworzenia jest otwarte i wybrano folder.

    Zrzut ekranu przedstawiający kartę projektu. Folder Assets jest zaznaczony.

  2. Kliknij dwukrotnie folder Skrypty , aby go otworzyć.

  3. Kliknij prawym przyciskiem myszy wewnątrz folderu, a następnie kliknij pozycję Utwórz > skrypt języka C#. Nadaj skryptowi nazwę VideoController.

    Zrzut ekranu przedstawiający plik o nazwie Video Controller.

  4. Kliknij dwukrotnie nowy skrypt VideoController , aby go otworzyć za pomocą programu Visual Studio 2017.

    Zrzut ekranu przedstawiający kod pliku kontrolera wideo.

  5. Zaktualizuj przestrzenie nazw w górnej części pliku kodu w następujący sposób:

    using System.Collections;
    using UnityEngine;
    using UnityEngine.SceneManagement;
    using UnityEngine.Video;
    
  6. Wprowadź następujące zmienne w klasie VideoController wraz z metodą Awake():

        /// <summary> 
        /// Provides Singleton-like behaviour to this class. 
        /// </summary> 
        public static VideoController instance; 
    
        /// <summary> 
        /// Reference to the Camera VideoPlayer Component.
        /// </summary> 
        private VideoPlayer videoPlayer; 
    
        /// <summary>
        /// Reference to the Camera AudioSource Component.
        /// </summary> 
        private AudioSource audioSource; 
    
        /// <summary> 
        /// Reference to the texture used to project the video streaming 
        /// </summary> 
        private RenderTexture videoStreamRenderTexture;
    
        /// <summary>
        /// Insert here the first video endpoint
        /// </summary>
        private string video1endpoint = "-- Insert video 1 Endpoint here --";
    
        /// <summary>
        /// Insert here the second video endpoint
        /// </summary>
        private string video2endpoint = "-- Insert video 2 Endpoint here --";
    
        /// <summary> 
        /// Reference to the Inside-Out Sphere. 
        /// </summary> 
        public GameObject sphere;
    
        void Awake()
        {
            instance = this;
        }
    
  7. Teraz nadszedł czas na wprowadzenie punktów końcowych z filmów wideo usługi Azure Media Service:

    1. Pierwszy w zmiennej video1endpoint .

    2. Drugi element do zmiennej video2endpoint .

    Ostrzeżenie

    Istnieje znany problem z używaniem protokołu HTTPS w środowisku Unity w wersji 2017.4.1f1. Jeśli filmy wideo zawierają błąd podczas odtwarzania, spróbuj zamiast tego użyć polecenia "http".

  8. Następnie należy edytować metodę Start(). Ta metoda zostanie wyzwolona za każdym razem, gdy użytkownik przełącza scenę (w związku z tym przełącza film wideo), przeglądając przycisk spojrzenia.

        // Use this for initialization
        void Start()
        {
            Application.runInBackground = true;
            StartCoroutine(PlayVideo());
        }
    
  9. Po metodzie Start() wstaw metodę PlayVideo()IEnumerator , która będzie używana do bezproblemowego uruchamiania filmów wideo (więc nie widać żadnej wypowiedzi).

        private IEnumerator PlayVideo()
        {
            // create a new render texture to display the video 
            videoStreamRenderTexture = new RenderTexture(2160, 1440, 32, RenderTextureFormat.ARGB32);
    
            videoStreamRenderTexture.Create();
    
            // assign the render texture to the object material 
            Material sphereMaterial = sphere.GetComponent<Renderer>().sharedMaterial;
    
            //create a VideoPlayer component 
            videoPlayer = gameObject.AddComponent<VideoPlayer>();
    
            // Set the video to loop. 
            videoPlayer.isLooping = true;
    
            // Set the VideoPlayer component to play the video from the texture 
            videoPlayer.renderMode = VideoRenderMode.RenderTexture;
    
            videoPlayer.targetTexture = videoStreamRenderTexture;
    
            // Add AudioSource 
            audioSource = gameObject.AddComponent<AudioSource>();
    
            // Pause Audio play on Awake 
            audioSource.playOnAwake = true;
            audioSource.Pause();
    
            // Set Audio Output to AudioSource 
            videoPlayer.audioOutputMode = VideoAudioOutputMode.AudioSource;
            videoPlayer.source = VideoSource.Url;
    
            // Assign the Audio from Video to AudioSource to be played 
            videoPlayer.EnableAudioTrack(0, true);
            videoPlayer.SetTargetAudioSource(0, audioSource);
    
            // Assign the video Url depending on the current scene 
            switch (SceneManager.GetActiveScene().name)
            {
                case "VideoScene1":
                    videoPlayer.url = video1endpoint;
                    break;
    
                case "VideoScene2":
                    videoPlayer.url = video2endpoint;
                    break;
    
                default:
                    break;
            }
    
            //Set video To Play then prepare Audio to prevent Buffering 
            videoPlayer.Prepare();
    
            while (!videoPlayer.isPrepared)
            {
                yield return null;
            }
    
            sphereMaterial.mainTexture = videoStreamRenderTexture;
    
            //Play Video 
            videoPlayer.Play();
    
            //Play Sound 
            audioSource.Play();
    
            while (videoPlayer.isPlaying)
            {
                yield return null;
            }
        }
    
  10. Ostatnią metodą, której potrzebujesz dla tej klasy, jest metoda ChangeScene(), która będzie używana do zamiany między scenami.

        public void ChangeScene()
        {
            SceneManager.LoadScene(SceneManager.GetActiveScene().name == "VideoScene1" ? "VideoScene2" : "VideoScene1");
        }
    

    Porada

    Metoda ChangeScene() używa przydatnej funkcji języka C# o nazwie Operator warunkowy. Dzięki temu można sprawdzić warunki, a następnie wartości zwracane na podstawie wyniku sprawdzania, wszystkie w ramach jednej instrukcji. Postępuj zgodnie z tym linkiem, aby dowiedzieć się więcej na temat operatora warunkowego.

  11. Zapisz zmiany w programie Visual Studio przed powrotem do aparatu Unity.

  12. W edytorze aparatu Unity kliknij i przeciągnij klasę VideoController [z]{.underline} folderu Scripts do obiektu Main Camera w panelu hierarchii .

  13. Kliknij aparat główny i spójrz na Panel inspektora. Zauważysz, że w nowo dodanym składniku Script znajduje się pole z pustą wartością. Jest to pole referencyjne, które jest przeznaczone dla zmiennych publicznych w kodzie.

  14. Przeciągnij obiekt InsideOutSphere z panelu hierarchii do gniazda Sphere , jak pokazano na poniższej ilustracji.

    Zrzut ekranu przedstawiający menu hierarchii. Wybrano główną kamerę.Zrzut ekranu przedstawiający gniazdo sphere.

Rozdział 6 . Tworzenie klasy Gaze

Ta klasa jest odpowiedzialna za utworzenie raycastu , który będzie przewidywany do przodu z kamery głównej, aby wykryć, który obiekt patrzy użytkownik. W takim przypadku raycast będzie musiał określić, czy użytkownik patrzy na obiekt GazeButton w scenie i wyzwoli zachowanie.

Aby utworzyć tę klasę:

  1. Przejdź do utworzonego wcześniej folderu Skrypty .

  2. Kliknij prawym przyciskiem myszy panel projektuUtwórzskrypt języka C#. Nadaj nazwę gazecie skryptu.

  3. Kliknij dwukrotnie nowy skrypt gazecie , aby otworzyć go za pomocą programu Visual Studio 2017.

  4. Upewnij się, że w górnej części skryptu znajduje się następująca przestrzeń nazw i usuń wszystkie inne elementy:

    using UnityEngine;
    
  5. Następnie dodaj następujące zmienne w klasie Gaze :

        /// <summary> 
        /// Provides Singleton-like behaviour to this class. 
        /// </summary> 
        public static Gaze instance;
    
        /// <summary> 
        /// Provides a reference to the object the user is currently looking at. 
        /// </summary> 
        public GameObject FocusedGameObject { get; private set; }
    
        /// <summary> 
        /// Provides a reference to compare whether the user is still looking at 
        /// the same object (and has not looked away). 
        /// </summary> 
        private GameObject oldFocusedObject = null;
    
        /// <summary> 
        /// Max Ray Distance 
        /// </summary> 
        float gazeMaxDistance = 300;
    
        /// <summary> 
        /// Provides whether an object has been successfully hit by the raycast. 
        /// </summary> 
        public bool Hit { get; private set; }
    
  6. Należy teraz dodać kod dla metod Awake() i Start( ).

        private void Awake()
        {
            // Set this class to behave similar to singleton 
            instance = this;
        }
    
        void Start()
        {
            FocusedGameObject = null;
        }
    
  7. Dodaj następujący kod w metodzie Update() do projektu Raycast i wykryj trafienie docelowe:

        void Update()
        {
            // Set the old focused gameobject. 
            oldFocusedObject = FocusedGameObject;
            RaycastHit hitInfo;
    
            // Initialise Raycasting. 
            Hit = Physics.Raycast(Camera.main.transform.position, Camera.main.transform.forward, out hitInfo, gazeMaxDistance);
    
            // Check whether raycast has hit. 
            if (Hit == true)
            {
                // Check whether the hit has a collider. 
                if (hitInfo.collider != null)
                {
                    // Set the focused object with what the user just looked at. 
                    FocusedGameObject = hitInfo.collider.gameObject;
                }
                else
                {
                    // Object looked on is not valid, set focused gameobject to null. 
                    FocusedGameObject = null;
                }
            }
            else
            {
                // No object looked upon, set focused gameobject to null.
                FocusedGameObject = null;
            }
    
            // Check whether the previous focused object is this same 
            // object (so to stop spamming of function). 
            if (FocusedGameObject != oldFocusedObject)
            {
                // Compare whether the new Focused Object has the desired tag we set previously. 
                if (FocusedGameObject.CompareTag("GazeButton"))
                {
                    FocusedGameObject.SetActive(false);
                    VideoController.instance.ChangeScene();
                }
            }
        }
    
  8. Zapisz zmiany w programie Visual Studio przed powrotem do aparatu Unity.

  9. Kliknij i przeciągnij klasę Gaze z folderu Scripts do obiektu Main Camera w panelu hierarchii .

Rozdział 7 — Konfigurowanie dwóch scen aparatu Unity

Celem tego rozdziału jest skonfigurowanie dwóch scen, z których każdy hostuje wideo do przesyłania strumieniowego. Zduplikujesz już utworzoną scenę, aby nie trzeba było jej ponownie konfigurować, ale następnie edytujesz nową scenę, tak aby obiekt GazeButton był w innej lokalizacji i ma inny wygląd. To jest pokazanie, jak zmienić między scenami.

  1. Zrób to, przechodząc do pozycji Plik > Zapisz scenę jako.... Zostanie wyświetlone okno zapisywania. Kliknij przycisk Nowy folder .

    Rozdział 7 — Konfigurowanie dwóch scen aparatu Unity

  2. Nazwij folder Sceny.

  3. Okno Zapisz scenę będzie nadal otwarte. Otwórz nowo utworzony folder Sceny .

  4. W polu Nazwa pliku: tekst wpisz VideoScene1, a następnie naciśnij przycisk Zapisz.

  5. Wróć do aparatu Unity, otwórz folder Sceny , a następnie kliknij lewym przyciskiem myszy plik VideoScene1 . Użyj klawiatury i naciśnij klawisze Ctrl + D , aby zduplikować ten scenę

    Porada

    Zduplikowane polecenie można również wykonać, przechodząc do pozycji Edytuj > duplikat.

  6. Aparat Unity automatycznie zwiększa numer nazw scen, ale mimo to sprawdza go, aby upewnić się, że pasuje do wcześniej wstawionego kodu.

    Powinny istnieć filmy VideoScene1 i VideoScene2.

  7. W dwóch scenach przejdź do pozycji Ustawienia kompilacji plików>. Po otwarciu okna Ustawienia kompilacji przeciągnij sceny do sekcji Sceny w kompilacji .

    Zrzut ekranu przedstawiający okno Ustawienia kompilacji.

    Porada

    Możesz wybrać obie sceny z folderu Sceny , trzymając przycisk Ctrl , a następnie klikając po lewej stronie każdą scenę, a następnie przeciągając obie strony.

  8. Zamknij okno Ustawienia kompilacji i kliknij dwukrotnie pozycję VideoScene2.

  9. Po otwarciu drugiej sceny kliknij obiekt podrzędny GazeButtonInsideOutSphere i ustaw jego przekształcenie w następujący sposób:

Przekształcanie — położenie

X Y Z
0 1.3 3,6

Przekształcanie — rotacja

X Y Z
0 0 0

Przekształcanie — skalowanie

X Y Z
1 1 1
  1. Po wybraniu elementu podrzędnego GazeButton przyjrzyj się inspektorowi i filtrowi siatki. Kliknij mały obiekt docelowy obok pola odwołania usługi Mesh :

    Zrzut ekranu przedstawiający ekran inspektora przycisku przeglądania.

  2. Zostanie wyświetlone okno podręczne Wybieranie siatki . Kliknij dwukrotnie siatkę modułu z listy Elementy zawartości.

    Zrzut ekranu przedstawiający okno podręczne Wybieranie siatki.

  3. Filtr siatki zostanie zaktualizowany, a teraz będzie modułem. Teraz kliknij ikonę koła zębatego obok pozycji Zderzacz sfery i kliknij przycisk Usuń składnik, aby usunąć zderzacz z tego obiektu.

    Zrzut ekranu przedstawiający menu Zderzacz kulis. Zaznaczono opcję Usuń składnik.

  4. Po wybraniu przycisku GazeButton kliknij przycisk Dodaj składnik w dolnej części inspektora. W polu wyszukiwania wpisz pole, a pole Box Collider będzie opcją - kliknij tę opcję, aby dodać zderzacz box do obiektu GazeButton .

    Zrzut ekranu przedstawiający pole wyszukiwania Dodaj składnik.

  5. Funkcja GazeButton jest teraz częściowo aktualizowana, aby wyglądała inaczej, jednak teraz utworzysz nowy materiał, aby wyglądała zupełnie inaczej i jest łatwiej rozpoznawana jako inny obiekt niż obiekt w pierwszej scenie.

  6. Przejdź do folderu Materiały w panelu projektów. Zduplikuj materiał ButtonMaterial (naciśnij klawisze Ctrl + D na klawiaturze lub kliknij lewym przyciskiem myszy pozycję Materiał, a następnie w menu Edytuj plik wybierz pozycję Duplikuj).

    Zrzut ekranu przedstawiający folder Materiały na karcie projektu.Zrzut ekranu przedstawiający menu edycji z zaznaczonym duplikatem.

  7. Wybierz nowy materiał ButtonMaterial (tutaj o nazwie ButtonMaterial 1) i w inspektorze kliknij okno Kolor Albedo . Zostanie wyświetlone wyskakujące okienko, w którym można wybrać inny kolor (wybierz dowolny, dowolny), a następnie zamknij wyskakujące okienko. Materiał będzie jego własnym wystąpieniem i różni się od oryginalnego.

    Zrzut ekranu przedstawiający wyskakujące okienko wyboru kolorów.

  8. Przeciągnij nowy materiał na element podrzędny GazeButton , aby teraz całkowicie zaktualizować jego wygląd, aby łatwo odróżnić go od pierwszego przycisku scen.

    Zrzut ekranu przedstawiający kartę sceny edytora projektu.

  9. W tym momencie można przetestować projekt w Edytorze przed utworzeniem projektu platformy UWP.

    • Naciśnij przycisk Odtwórz w Edytorze i nosić zestaw słuchawkowy.

      Zrzut ekranu przedstawiający przyciski odtwarzania, wstrzymywania i pomijania. Przycisk odtwarzania został wyróżniony.

  10. Spójrz na dwa obiekty GazeButton , aby przełączyć się między pierwszym i drugim wideo.

Rozdział 8 . Tworzenie rozwiązania platformy UWP

Po upewnieniu się, że edytor nie ma błędów, możesz przystąpić do kompilowania.

Aby skompilować:

  1. Zapisz bieżącą scenę, klikając pozycję Zapisz plik>.

  2. Zaznacz pole wyboru o nazwie Unity C# Projects (jest to ważne, ponieważ umożliwi edycję klas po zakończeniu kompilacji).

  3. Przejdź do pozycji Ustawienia kompilacji pliku>, kliknij pozycję Kompiluj.

  4. Zostanie wyświetlony monit o wybranie folderu, w którym chcesz skompilować rozwiązanie.

  5. Utwórz folder BUILDS i w tym folderze utwórz inny folder z wybraną odpowiednią nazwą.

  6. Kliknij nowy folder, a następnie kliknij pozycję Wybierz folder, aby wybrać ten folder, aby rozpocząć kompilację w tej lokalizacji.

    Zrzut ekranu przedstawiający wyróżniony folder BUILDS.Zrzut ekranu przedstawiający wyróżniony folder Kompilacja przesyłania strumieniowego wideo.

  7. Po zakończeniu kompilowania aparatu Unity (może to zająć trochę czasu), zostanie otwarte okno Eksplorator plików w lokalizacji kompilacji.

Rozdział 9 — Wdrażanie na komputerze lokalnym

Po zakończeniu kompilacji zostanie wyświetlone okno Eksplorator plików w lokalizacji kompilacji. Otwórz folder o nazwie i skompiluj go, a następnie kliknij dwukrotnie plik rozwiązania (sln) w tym folderze, aby otworzyć rozwiązanie za pomocą programu Visual Studio 2017.

Jedyną rzeczą, którą należy wykonać, jest wdrożenie aplikacji na komputerze (lub komputerze lokalnym).

Aby wdrożyć na komputerze lokalnym:

  1. W programie Visual Studio 2017 otwórz właśnie utworzony plik rozwiązania.

  2. W obszarze Platforma rozwiązania wybierz pozycję x86, Komputer lokalny.

  3. W obszarze Konfiguracja rozwiązania wybierz pozycję Debuguj.

    Zrzut ekranu przedstawiający menu Konfiguracja rozwiązania.

  4. Teraz musisz przywrócić wszystkie pakiety do rozwiązania. Kliknij prawym przyciskiem myszy rozwiązanie, a następnie kliknij polecenie Przywróć pakiety NuGet dla rozwiązania...

    Uwaga

    Dzieje się tak, ponieważ pakiety utworzone przez aparat Unity muszą być przeznaczone do pracy z odwołaniami do maszyn lokalnych.

  5. Przejdź do menu Kompilacja i kliknij pozycję Wdróż rozwiązanie , aby załadować aplikację bezpośrednio na maszynę. Program Visual Studio najpierw skompiluje, a następnie wdroży aplikację.

  6. Aplikacja powinna być teraz wyświetlana na liście zainstalowanych aplikacji, które będą gotowe do uruchomienia.

    Zrzut ekranu przedstawiający listę zainstalowanych aplikacji.

Po uruchomieniu aplikacji Mixed Reality będziesz znajdować się w modelu InsideOutSphere, który był używany w aplikacji. Ta sfera będzie miała miejsce, w którym wideo będzie przesyłane strumieniowo, zapewniając 360-stopniowy widok przychodzącego filmu wideo (który został nakręcony dla tego rodzaju perspektywy). Nie zdziwij się, jeśli ładowanie wideo trwa kilka sekund, aplikacja podlega dostępnej szybkości Internetu, ponieważ wideo musi zostać pobrane, a następnie pobrane, aby przesłać strumieniowo do aplikacji. Gdy wszystko będzie gotowe, zmień sceny i otwórz drugi film, patrząc na czerwoną kulę! Następnie możesz wrócić, używając niebieskiego modułu w drugiej scenie!

Zakończona aplikacja usługi Azure Media Service

Gratulacje, utworzono aplikację rzeczywistości mieszanej, która korzysta z usługi Azure Media Service do przesyłania strumieniowego 360 filmów wideo.

Zrzut ekranu przedstawiający przykładową aplikację rzeczywistości mieszanej.

Zrzut ekranu przedstawiający przykład aplikacji rzeczywistości mieszanej.

Ćwiczenia bonusowe

Ćwiczenie 1

W tym samouczku można używać tylko jednej sceny do zmieniania filmów wideo. Poeksperymentuj z aplikacją i utwórz ją w jedną scenę! Być może nawet dodać kolejny film do mieszanki.

Ćwiczenie 2

Poeksperymentuj z platformą Azure i aparatem Unity i spróbuj zaimplementować możliwość automatycznego wybrania wideo o innym rozmiarze pliku w zależności od siły połączenia internetowego.