Please provide the following:
- SDK Version: 38
- Platforms(Android/iOS/web/all): iOS
Following the gl-hello-world thing found here
The only change I made was turning it into a component, other than that I didn’t modify anything, but the compiling fails with error:
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s, undefined, You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Code:
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { GLView } from 'expo';
const vertSrc = `
void main(void) {
gl_Position = vec4(0.0, 0.0, 0.0, 1.0);
gl_PointSize = 100.0;
}
`;
const fragSrc = `
void main(void) {
gl_FragColor = vec4(1.0,0.0,0.0,1.0);
}
`;
let _initialized = false;
// lol
class GLTest extends React.Component {
render() {
return (
<View style={styles.container}>
<GLView
style={{ width: 300, height: 300 }}
onContextCreate={this._onContextCreate}
/>
</View>
);
}
_onContextCreate = gl => {
//if (_initialized) {
//return;
//}
gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
gl.clearColor(0, 1, 1, 1);
// Compile vertex and fragment shader
const vert = gl.createShader(gl.VERTEX_SHADER);
gl.shaderSource(vert, vertSrc);
gl.compileShader(vert);
const frag = gl.createShader(gl.FRAGMENT_SHADER);
gl.shaderSource(frag, fragSrc);
gl.compileShader(frag);
// Link together into a program
const program = gl.createProgram();
gl.attachShader(program, vert);
gl.attachShader(program, frag);
gl.linkProgram(program);
gl.useProgram(program);
gl.clear(gl.COLOR_BUFFER_BIT);
gl.drawArrays(gl.POINTS, 0, 1);
gl.flush();
gl.endFrameEXP();
_initialized = true;
};
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
},
});
export default GLTest
Usually, this error comes when you have improper inputs, but this shouldn’t be the case here, as I just directly copy-pasted the code from the expo repo.