react onmessage webview 3d three.js react-native webgl

onmessage - react native webview local html



Integración de React Native y THREE.js(biblioteca WebGL) (2)

No es apropiado para usted usar la vista web para procesar contenidos complejos, como modelos 3D, que no es compatible con dispositivos.

Aunque no he escrito alguna aplicación nativa de reacción, pero escribí una aplicación de Android. En la aplicación, intenté usar webview para representar la demo de stlloader de los proyectos de three.js, pero sin éxito. Y también encontré que los dispositivos móviles pueden renderizar algunas escenas 3D simples, aquí la capacidad de renderización de la vista web es menor que la del navegador móvil. Finalmente, utilizo crosswalk un motor web que se puede agregar a la aplicación. Uso XWalkView de paso de peatones para reemplazar la vista web para representar los modelos 3D. Aquí está la respuesta mía sobre el proceso.

Para usar el cruce de peatones en la aplicación nativa reaccionar, haga referencia a esto:

https://github.com/iwater/react-native-crosswalk-android

https://github.com/jordansexton/react-native-webview-crosswalk

Espero eso ayude.

Estoy trabajando en un proyecto en el que estamos usando React Web y React Native. Ya implementé un componente React Web que le permite cargar modelos 3D de OBJ, MTL y archivos de imágenes, una vez que el modelo está cargado puede editarlo, adjuntar etiquetas 3D y cosas así, y finalmente guardar su modelo 3D editado de nuevo en el servidor, y mi implementación usa THREE.js detrás de escena.

Ahora, el siguiente paso es poder recuperar estos archivos del servidor y representar el Modelo 3D editado dentro de una aplicación React Native (móvil). Entonces mi pregunta es: ¿cómo debo hacer esto? Estaba pensando en usar una vista web incrustada para reaccionar nativa para poder reutilizar la mayor cantidad de código posible del componente React Web, y luego implementar de alguna manera algún tipo de comunicación entre la vista web y la aplicación nativa, pero no soy muy Seguro acerca de cómo implementar esto realmente.

He hecho algunas investigaciones hasta ahora y lo que encontré es lo siguiente:

Native WebView for React y un puente entre la vista web y la aplicación nativa

Al leer esas páginas tuve la sensación de que lo que quiero hacer podría ser factible, pero aún no estoy seguro de cómo implementarlo. ¿Cómo realizo el componente React Web en vivo dentro de un Webview, y luego cómo hago que el código inyectado interactúe con el funcionamiento interno de mi componente web dentro de WebView?

Si mi enfoque previsto no es factible, ¿hay algún enfoque alternativo para presentar un modelo 3D de forma nativa en una aplicación React Native, con suerte con un alto nivel de abstracción comparable al de THREE.js (una especie de biblioteca TRES para Reaccionar nativo)?