ARKit: Jak wykrywać, śledzić i wyświetlać wideo z Alphą na płaszczyźnie obrazu

Rozpoznawanie obrazu i wideo wyświetlane w rzeczywistości rozszerzonej.

Wykrywanie i wyświetlanie wideo na obrazie za pomocą ARKit może być trudne, gdy zaczyna się rozwijać. Ten przewodnik ma na celu pomóc programistom w szybkim osiągnięciu tego celu, wykorzystując ARKit i łącząc przykładowy projekt narzędzia do rozpoznawania obrazów Apple z kilkoma niestandardowymi wierszami kodu.

Przede wszystkim, aby zaimplementować ARKit, musimy dodać storyboard z ARSCNView. Ta scena będzie odpowiedzialna za używanie kamery do śledzenia rzeczywistego świata wokół użytkownika. Należy również dodać folder zasobów AR Resources, aby przechowywać wszystkie obrazy, które będą wykrywane i śledzone.

Śledzenie obrazu

Ważne jest, aby dodać obrazy, które chcesz wykryć, do folderu AR Resources naszego projektu:

Uwaga: obrazy do rozpoznania można również uzyskać z interfejsu API i utworzyć programowo.
Obrazy folderów zasobów AR

W naszym ViewController musimy dodać odwołanie do ARSCNView i zastosować delegatów w viewDidLoad, a także dodać akcesorium do sesji sceneView.

W naszym viewDidAppear musimy dodać metodę resetTracking:

Metoda resetTracking odpowiada za:

  • Rozpoczęcie sesji ARS
  • Ustawianie konfiguracji ARSession
  • Mówiąc ARSession, które znane obrazy będą śledzone

Gdy dowolny obraz dodany do folderu AR Resources zostanie wykryty podczas korzystania z kamery urządzenia, ARSCNView wywołuje następującego delegata:

Delegat przechowuje informacje o wykrytym obrazie w kotwicy, a po wykryciu wyświetla nazwę wykrytego obrazu:

Wykryto obraz zasobów AR.

Wyświetlanie wideo na wykrytej płaszczyźnie obrazu

Możemy już wykryć obraz z tym kodem. Teraz chodzi o wyświetlenie wideo na górze obrazu. Spójrz na delegata, w którym już mamy wykryty obraz:

Chodzi o to, aby dodać metodę displayVideo do pomocnika, przekazując trzy parametry:

  • wykryty obraz odniesienia
  • węzeł
  • wideo do pokazania

Metoda displayVideo w VideoHelper odpowiada za wyświetlanie wideo. Zasadniczo wykonuje następujące czynności:

  1. Uzyskaj fizyczną szerokość i wysokość obrazu referencyjnego
  2. Utwórz węzeł do przechowywania odtwarzacza wideo
  3. Utwórz odtwarzacz wideo
  4. Dodaj węzeł trzymający odtwarzacz wideo do oryginalnego wykrytego węzła
  5. Skonfiguruj węzeł wideo

Metoda setupVideoOnNode odpowiada za konfigurację wideo w płaszczyźnie uchwytu wideo:

  1. Utwórz odtwarzacz wideo
  2. Utwórz SKVideoNode z wideoPlayerem zawierającym wideo
  3. Utwórz spriteKitScene, aby umieścić wideo w środku
  4. Dodaj przezroczystość alfa
  5. Odtwarzanie wideo
  6. Zapętlanie wideo

Przejrzystość alfa wideo

Zauważ, że getAlphaShader jest dodawany przez klasę pomocniczą EffectNodeHelper, która odpowiada za stosowanie SKShadera. Obiekt SKShader zawiera niestandardowy moduł cieniujący fragmenty OpenGL ES, używany do dostosowywania zachowania rysowania wielu różnych rodzajów węzłów. W takim przypadku stosowana jest alfa.

Ilustrowana hierarchia węzłów.

Wynik

W rezultacie po wykryciu rozpoznawalnego obrazu na wykrytej płaszczyźnie wyświetlany jest film z przezroczystością alfa.

Film z przezroczystością alfa jest wyświetlany na rozpoznanym obrazie.

Ważne jest, aby wspomnieć, że obrazy muszą mieć dobre punkty odniesienia i kontrasty, aby pracować ze śledzeniem obrazów w iOS12.

Projekt demonstracyjny jest dostępny tutaj. Zasadniczo jest to przykładowy projekt programu do rozpoznawania obrazów z jabłkiem, z pewnymi zmianami dodającymi wideo na górze obrazu.

Przydatne zasoby

  • Śledzenie obrazu za pomocą ARKit 2.0
  • Wprowadzenie do śledzenia obrazu ARKit 2
  • Odtwarzanie filmów w rzeczywistości rozszerzonej za pomocą ARKit

Czy znasz jakieś sugestie? Zostaw komentarz! Naprawdę to doceniamy.

Major League to agencja pracownicza i zaopatrzeniowa firmy Lateral View.