Wenn Sie eine Anwendung unter React VR erstellt haben, können Sie sie auf die neue React 360 Runtime portieren, um einige der Leistungsvorteile zu nutzen.

Das erste, was Sie tun müssen, ist, Ihren Code durchzugehen und alle References auf das React-VR-Paket durch das neue React-360-Paket zu ersetzen.

Im Moment exportiert das Paket noch alle Legacy-Komponenten, was sich jedoch in Zukunft ändern kann.

virtual reality e

Einbinden einer Legacy-App in die neue Runtime.

Sie müssen aktualisieren, um die neue Laufzeit zu verwenden. Es wird empfohlen, dass Sie ein neues React 360-Projekt mit der CLI erstellen und anschließend Ihren React-Code in die generierte Index.js kopieren. Da der gesamte React VR-Code in einem 3D-Koordinatensystem aufgebaut ist, das auf (0, 0, 0, 0) ausgerichtet ist, sollten Sie Ihre Legacy-App an der standardmäßigen 3D-Position des Systems montieren.

Copy to Clipboard

Dies gibt Ihnen den Vorteil des verbesserten Rendering-Pfades und der konfigurierbaren Eingabemöglichkeiten. Sobald dies funktioniert, empfehlen wir Ihnen, die Dinge weiter zu verfolgen und die Benutzeroberfläche Ihrer Anwendung zu migrieren, um Oberflächen zu verwenden.

Bewegen zu Oberflächen.

Wenn Sie Ihre Benutzeroberfläche früher mit Views und Text im Raum gestaltet haben, wobei alles in Metern gemessen wurde, werden Sie Oberflächen finden, mit denen Sie leichter arbeiten können. Sie ermöglichen es Ihnen, in Pixeln zu denken und vereinfachen den Prozess der Gestaltung von Inhalten rund um den Benutzer. So sind beispielsweise Oberflächen und deren Inhalte immer auf den Benutzer ausgerichtet, so dass Sie nicht mehr über Rotationen im Raum nachdenken müssen.

Derzeit werden Oberflächen in einem festen Abstand von vier Metern mit einer anfänglichen Pixeldichte implementiert, um die Clarity zu optimieren. Die Dichte kann angepasst werden, aber es ist empfehlenswert, für die meisten Situationen den Standard zu verwenden.

Allgemeine Muster.

Mit früheren Versionen von React VR war es für Entwickler üblich, das Konzept der miteinander verbundenen Räume zu entwickeln, indem sie Links oder Doorways an bestimmten Positionen um ein 360er Foto herum platzierten. Sie können diesen Effekt immer noch erreichen, indem Sie eine Zylinderoberfläche so erweitern, dass sie sich um die Szene wickelt, und die Links mit absoluter Positionierung platzieren.

Wir hoffen, dass wir Ihnen einen kurzen Einstieg in die Arbeit mit React 360 bieten konnten. Wenn Sie Fragen oder Anregungen haben sollten, hinterlassen Sie unten einen Kommentar.

Vielen Dank für ihren Besuch.