Przejdź do treści głównej

React Native na Meta Quest

· 9 minut czytania
Łukasz Chludziński
Łukasz Chludziński
Engineering Manager @ Callstack
Jan Jaworski
Jan Jaworski
Software Engineer @ Callstack
Markus Leyendecker
Markus Leyendecker
Product Manager @ Meta
Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

React Native zawsze koncentrował się na pomaganiu programistom w ponownym wykorzystywaniu wiedzy między platformami. To, co zaczęło się od Androida i iOS, stopniowo rozszerzyło się na Apple TV, Windows, macOS, a nawet internet dzięki react-strict-dom. W 2021 roku wpis o wizji wielu platform nakreślił przyszłość, w której React Native mógłby dostosować się do nowych urządzeń i formatów bez fragmentacji ekosystemu.

Podczas React Conf 2025 zrobiliśmy kolejny krok ku tej wizji, ogłaszając oficjalne wsparcie React Native dla urządzeń Meta Quest. Ten wpis skupia się na tym, jak rozpocząć pracę z React Native na Meta Quest, co działa obecnie, oraz jak programiści mogą tworzyć i publikować aplikacje VR przy użyciu znanych narzędzi i wzorców.

Najważniejsze zmiany

React Native na Meta Quest

React Native app running on Meta Quest headset

React Native apps running on Meta Quest.

Urządzenia Meta Quest działają pod kontrolą systemu Meta Horizon OS, opartego na Androidzie. Z perspektywy React Native oznacza to, że wszystkie istniejące narzędzia dla Androida, systemy budowania i przepływy pracy związane z debugowaniem działają przy minimalnych zmianach. Dla programistów, którzy już tworzą aplikacje React Native na Androida, większość istniejącego modelu deweloperskiego przenosi się bez zmian.

Jest to zgodne z tym, jak React Native rozszerzał się na inne środowiska oparte na Androidzie na przestrzeni czasu. Zamiast wprowadzać nowy runtime lub model deweloperski, Meta Quest buduje na tym samym fundamencie Androida i integruje się z istniejącymi abstrakcjami React Native. Pozwala to na dodawanie funkcji specyficznych dla platformy bez fragmentacji frameworka i bez konieczności stosowania oddzielnego podejścia do rozwoju.

Rozpoczęcie pracy na Meta Quest

W tej sekcji omówimy podstawowy przepływ pracy deweloperskiej na Meta Quest, zaczynając od Expo Go i przechodząc do buildów deweloperskich oraz konfiguracji specyficznej dla platformy.

Krok po kroku: Uruchamianie aplikacji Expo na Meta Quest

Aby uruchomić aplikację Expo na Meta Quest, rozpocznij standardowy projekt Expo, uruchom serwer deweloperski i otwórz aplikację przez Expo Go na urządzeniu. Poza kilkoma wymaganiami specyficznymi dla systemu Meta Horizon OS, przepływ pracy jest taki sam jak na Androidzie.

  1. Zainstaluj Expo Go na urządzeniu

    Expo Go jest dostępne w Meta Horizon Store i można je zainstalować bezpośrednio na urządzeniach Meta Quest. Jest używane do szybkiej iteracji podczas rozwoju.

  2. Utwórz (lub użyj) projekt Expo

    Jeśli zaczynasz od zera, utwórz standardową aplikację Expo. Nie jest wymagany żaden specjalny szablon.

    npx create-expo-app@latest my-quest-app
    cd my-quest-app
  3. Uruchom serwer deweloperski

    npx expo start
  4. Połącz się z Quest za pomocą Expo Go

    Otwórz Expo Go na urządzeniu i zeskanuj kod QR wyświetlany przez Expo CLI za pomocą kamery urządzenia. Aplikacja uruchomi się w nowym oknie na urządzeniu, umożliwiając live reloading i szybką iterację.

  5. Iteruj jak zwykle

    Zmiany w kodzie są natychmiast odzwierciedlane na urządzeniu, zgodnie z tym samym cyklem edycji i odświeżania, co na Androidzie i iOS.

Buildy deweloperskie i funkcje natywne

Expo Go wystarczy do wczesnego etapu rozwoju aplikacji i prac nad interfejsem użytkownika. Gdy potrzebny jest dostęp do modułów natywnych lub głębsza integracja z platformą, stosuje się buildy deweloperskie. Działają one bezpośrednio na urządzeniu Quest, wykorzystując standardowy workflow budowania w Expo.

Konfiguracja specyficzna dla platformy oraz różnice względem urządzeń mobilnych

Choć ogólny proces tworzenia aplikacji pozostaje ten sam, Meta Quest wymaga wprowadzenia kilku niewielkich, specyficznych dla platformy modyfikacji.

Konfiguracja projektu dla Meta Horizon OS

Aplikacje na Meta Quest muszą spełniać określone wymagania, aby działać poprawnie i kwalifikować się do publikacji w sklepie. Obejmują one konfigurację Androida specyficzną dla platformy, warianty produktowe (product flavors) oraz metadane aplikacji.

Expo udostępnia plugin dla Meta Horizon OS, który automatycznie stosuje te wymagania podczas budowania. Jego użycie zapewnia zgodność konfiguracji projektu z oczekiwaniami Meta Quest bez ręcznej modyfikacji plików natywnych.

Zainstaluj expo-horizon-core i dodaj go do app.json lub app.config.js:

{
"expo": {
"plugins": [
[
"expo-horizon-core",
{
"horizonAppId": "your-horizon-app-id",
"defaultHeight": "640dp",
"defaultWidth": "1024dp",
"supportedDevices": "quest2|quest3|quest3s",
"disableVrHeadtracking": false,
"allowBackup": false
}
]
]
}
}

Zmodyfikuj także wartość orientacji:

{
...
"orientation": "default",
...
}

Zaktualizuj package.json, dodając skrypty specyficzne dla Questa:

{
"scripts": {
"android": "expo run:android --variant mobileDebug",
"quest": "expo run:android --variant questDebug",
"android:release": "expo run:android --variant mobileRelease",
"quest:release": "expo run:android --variant questRelease"
}
}

Korzystanie z React Native bez Expo

Expo oferuje najprostszy sposób rozpoczęcia pracy z React Native na Meta Quest. Jeśli wolisz budować aplikacje bez frameworka, możesz również ręcznie zastosować wymaganą konfigurację Meta Horizon OS bezpośrednio w projekcie Androidowym.

Minimalnie obejmuje to:

  • Utworzenie wariantu budowania (build flavor) specyficznego dla Meta Quest w pliku android/app/build.gradle

  • Ustawienie horizonAppId

  • Zdefiniowanie domyślnego rozmiaru panelu w manifeście Androida

  • Deklarację obsługiwanych urządzeń (np.: quest2|quest3|quest3s)

  • Usunięcie zabronionych uprawnień (permissions)

  • Dostosowanie minimalnej obsługiwanej wersji SDK Androida

  • Dodanie sprawdzeń w czasie wykonania, takich jak isHorizonDevice() oraz isHorizonBuild()

Aby poznać pełną listę zmian, możesz przeanalizować implementację pluginu expo-horizon-core i ręcznie odtworzyć tę samą konfigurację.

Android bez usług Google Play

Meta Horizon OS bazuje na projekcie Android Open Source Project (AOSP), który zapewnia podstawową platformę Android bez zastrzeżonych usług Google. Z perspektywy deweloperskiej oznacza to, że aplikacje działają na standardowych API Androida, ale nie mają dostępu do usług Google Mobile Services, takich jak Play Services czy integracje specyficzne dla Sklepu Play.

Tworząc aplikacje na Meta Quest, należy unikać bezpośrednich zależności od usług Google lub zapewniać dla nich alternatywy specyficzne dla platformy.

Lista nieobsługiwanych zależności dostępna jest w dokumentacji Meta Horizon OS.

Uprawnienia i możliwości urządzenia

Niektóre uprawnienia Androida i założenia dotyczące sprzętu powszechne na urządzeniach mobilnych nie mają zastosowania w goglach VR. Funkcje komórkowe (np. SMS), określone czujniki (jak GPS) oraz ograniczone uprawnienia są niedostępne lub zabronione. Projekty muszą wyraźnie uwzględniać te różnice podczas konfiguracji.

Ocena kompatybilności bibliotek

Większość bibliotek React Native działa na Meta Quest, ale kompatybilność zależy od założeń, jakie biblioteka przyjmuje wobec platformy. W szczególności biblioteki mogą polegać na sprzęcie dostępnym tylko na urządzeniach mobilnych, wprowadzaniu dotykowym lub usługach niedostępnych w Horizon OS.

Ogólne wytyczne:

  • Biblioteki samowystarczalne, oparte wyłącznie na standardowych API React Native i Androida, zwykle działają bez zmian.

  • Biblioteki zakładające wyłącznie wprowadzanie dotykowe, sprzęt mobilny lub usługi Google Mobile Services wymagają adaptacji lub warunkowego użycia.

  • Biblioteki zależne od zabronionych uprawnień lub niedostępnych możliwości urządzenia nie są obsługiwane.

W typowych przypadkach użycia, takich jak lokalizacja czy powiadomienia, Expo oferuje gotowe rozwiązania dedykowane dla Meta Horizon OS. Inne biblioteki mogą działać bez zmian lub wymagać dostosowania w zależności od ich zależności.

Ścieżki kodu zależne od platformy

Aplikacje przeznaczone zarówno dla Meta Quest, jak i innych platform, powinny zabezpieczać funkcje specyficzne dla platformy. Meta Horizon OS udostępnia narzędzia umożliwiające wykrycie w czasie wykonania, czy aplikacja działa na urządzeniu Quest, co pozwala wyłączać lub zastępować nieobsługiwane funkcje.

import ExpoHorizon from 'expo-horizon-core';

// Check if running on a Horizon device
if (ExpoHorizon.isHorizonDevice) {
console.log('Running on Meta Horizon OS!');
}

// Check if this is a Horizon build
if (ExpoHorizon.isHorizonBuild) {
console.log('This is a Horizon build variant');
}

// Access the Horizon App ID
const appId = ExpoHorizon.horizonAppId;
console.log('Horizon App ID:', appId ?? 'Not configured');

Wzornictwo i aspekty UX w VR

Projektowanie pod kątem wyświetlacza montowanego na głowie wprowadza inne ograniczenia niż w przypadku urządzeń mobilnych z ekranem dotykowym. Interfejsy są oglądane z odległości, renderowane w przestrzeni i obsługiwane przy użyciu szerszego spektrum metod wprowadzania danych.

Elementy UI zazwyczaj wymagają większych obszarów klikalnych, zwiększonych odstępów oraz typografii czytelnej z różnych odległości. Wyzwania te przypominają te spotykane na desktopach, tabletach i urządzeniach składanych, gdzie aplikacje działają w zmieniających się oknach i układy muszą dynamicznie się adaptować.

Jedną z głównych różnic między Meta Quest a urządzeniami mobilnymi z Androidem jest sposób wprowadzania danych. Zamiast głównie dotyku, aplikacje na Meta Quest są zwykle sterowane za pomocą kontrolerów, śledzenia dłoni oraz opcjonalnie myszy i klawiatury. Kontrolery zachowują się bardziej jak urządzenia wskazujące, co wprowadza wzorce interakcji bliższe interfejsom webowym i desktopowym, w tym nawigację opartą o hover i fokus.

System zdarzeń i model komponentów React Native może obsługiwać te wzorce interakcji, ale aplikacje powinny unikać założeń opartych wyłącznie na dotyku oraz zapewniać wyraźne stany fokusu i przewidywalną nawigację podczas sterowania urządzeniami wskazującymi.

Wspólnie te rozważania przemawiają za responsywnymi układami i interakcjami niezależnymi od metody wprowadzania danych. System układów i model komponentów React Native stanowią solidną podstawę do budowania komfortowych i użytecznych interfejsów VR.

uwaga

Więcej szczegółów znajdziesz w oficjalnych wytycznych projektowych.

Przykłady i materiały referencyjne

Projekt referencyjny

Dowiedz się więcej

Podziękowania

Przeniesienie React Native na nowe platformy wymaga więcej niż tylko kodu. Jesteśmy wdzięczni wszystkim, którzy poświęcili swój czas, udzielili informacji zwrotnych i wsparcia.