My App.js:
import { Suspense } from 'react';\nimport { Canvas } from '@react-three/fiber/native';\nimport { useGLTF } from '@react-three/drei/native';\nimport { StatusBar } from 'expo-status-bar';\nimport { StyleSheet, Text, View } from 'react-native';\n\nexport default function App() {\n return (\n <View>\n <Text>Hello, world!</Text>\n <Canvas>\n <ambientLight />\n <mesh>\n <boxGeometry />\n <meshStandardMaterial />\n </mesh>\n </Canvas>\n </View>\n );\n}This renders a blank screen. Doesn't matter if I remove <View> and/or <Text>, no scene renders, just a white screen:
\nThis is after following the instructions on https://docs.pmnd.rs/react-three-fiber/getting-started/installation#react-native
\nI also get one of the same warnings (shown in the screenshot) as #2823
","upvoteCount":2,"answerCount":2,"acceptedAnswer":{"@type":"Answer","text":"Have you tested on device? Unfortunately OpenGL doesn't render on XCode emulator with expo-gl.
Blank/white screen with react-three-fiber, iOS, and React Native #3064
-
|
Example project: https://github.com/AndrewRayCode/expo-react-native-test To run, run the iOS simulator, then: My import { Suspense } from 'react';
import { Canvas } from '@react-three/fiber/native';
import { useGLTF } from '@react-three/drei/native';
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
export default function App() {
return (
<View>
<Text>Hello, world!</Text>
<Canvas>
<ambientLight />
<mesh>
<boxGeometry />
<meshStandardMaterial />
</mesh>
</Canvas>
</View>
);
}This renders a blank screen. Doesn't matter if I remove 
This is after following the instructions on https://docs.pmnd.rs/react-three-fiber/getting-started/installation#react-native I also get one of the same warnings (shown in the screenshot) as #2823 |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 2 replies
-
|
Have you tested on device? Unfortunately OpenGL doesn't render on XCode emulator with |
Beta Was this translation helpful? Give feedback.
-
|
I have the same problem with example project above, and with my test project - blank screen instead of the Canvas. Both in Simulator and on the device. Anyone was able to resolve this? |
Beta Was this translation helpful? Give feedback.
-
|
same here |
Beta Was this translation helpful? Give feedback.
-
|
same here. tried useHelper pointLightHelper, and console.log(meshRef.current.position), and dev={true}. But no clear error messages come up. |
Beta Was this translation helpful? Give feedback.
Have you tested on device? Unfortunately OpenGL doesn't render on XCode emulator with
expo-gl.