Surface not show anything

[Hamza Iqbal]

Library version
gl-react@4.0.1
gl-react-native@4.0.1
Issue:
working on function for react native app to show HelloBlue example in Surface. But Surface doesn't render anything.
I tried to put width and height in style but app crashes by doing that.
I need to solve this issue urgently..

[@greweb]

React native surface is taking a style prop not a width/height

[Hamza Iqbal]

Yeah, when I change this to style, image still doesn't rendered and app crashes after few seconds.

[risingsunho]

me too,

[Hamza Iqbal]

I gave it a try on expo app, it works perfect but in react-native app, there is a problem I can't solve

[Narinderg]

Facing same issue. Any fix available?

[@greweb]

Any log of the crash? thanks

[Bernard Seow]

@gre I have the same issue, but without any useful log ..... , any idea ? @im-hamza-dev have you found any solutions yet for non expo react native app ?

I gave it a try on expo app, it works perfect but in react-native app, there is a problem I can't solve

[allthetime]

for me, this code works (changed width/height props to style on `Surface)

Also, make sure that you have followed all of the unimodules instructions.

import { Shaders, Node, GLSL } from "gl-react";
import { Surface } from "gl-react-native";

const shaders = Shaders.create({
    helloBlue: {
      frag: GLSL`
        precision highp float;
        varying vec2 uv;
        uniform float blue;
        void main() {
            gl_FragColor = vec4(uv.x, uv.y, blue, 1.0);
        }`
    }
});

const HelloBlue = ({ blue })=>{
    return <Node shader={shaders.helloBlue} uniforms={{ blue }} />;
}

const CanvasTest = ()=>{
    return <View
        style={{ flex: 1 }}
    >
        <Surface style={{
            width: 100,
            height: 100,
        }}>
            <HelloBlue blue={1} />
        </Surface>
    </View>
}