gl react native未在物理iOS设备上显示图像

我试图从gl react获得饱和度示例： 在iphone上工作，但由于某种原因，图像只显示在iOS模拟器上，而不是真实的设备上

这是运行iOS 10.3的iphone SE模拟器上显示的内容（如示例中所示，一切都很完美）。 这是运行iOS 10.3的实际iphone SE上显示的内容

这就是代码

 /**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import { Shaders, Node, GLSL } from 'gl-react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Slider
} from 'react-native';
import { Surface } from 'gl-react-native';

const shaders = Shaders.create({
  Saturate: {
    frag: GLSL`
  precision highp float;
  varying vec2 uv;
  uniform sampler2D t;
  uniform float contrast, saturation, brightness;
  const vec3 L = vec3(0.2125, 0.7154, 0.0721);
  void main() {
    vec4 c = texture2D(t, uv);
    vec3 brt = c.rgb * brightness;
    gl_FragColor = vec4(mix(
      vec3(0.5),
      mix(vec3(dot(brt, L)), brt, saturation),
      contrast), c.a);
  }
  `
  }
});

export const Saturate = ({ contrast, saturation, brightness, children }) =>
  <Node
    shader={shaders.Saturate}
    uniforms={{ contrast, saturation, brightness, t: children }}
  />;



export default class App extends Component<{}> {
  state = {
    contrast: 1,
    saturation: 1,
    brightness: 1
  }

  render() {
    const { contrast, saturation, brightness } = this.state;

    const filter = {
      contrast,
      brightness,
      saturation
    }

    return (
      <View>
        <Text style={styles.header}>
          SaturateGL
        </Text>
        <Surface style={{ width: 300, height: 300 }}>
          <Saturate {...filter}>
            {{ uri: "https://i.imgur.com/uTP9Xfr.jpg" }}
          </Saturate>
        </Surface>
        <Slider
          minimumValue={0}
          maximumValue={4}
          step={0.01}
          value={ contrast }
          onValueChange={ contrast => this.setState({ contrast }) }>
        </Slider>
        <Slider
          minimumValue={0}
          maximumValue={4}
          step={0.01}
          value={ saturation }
          onValueChange={ saturation => this.setState({ saturation }) }>
        </Slider>
        <Slider
          minimumValue={0}
          maximumValue={4}
          step={0.01}
          value={ brightness }
          onValueChange={ brightness => this.setState({ brightness }) }>
        </Slider>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  header: {
    fontSize: 24,
    textAlign: 'center',
    padding: 10,
  },
});

/**
*示例React本机应用程序
* https://github.com/facebook/react-native
*@flow
*/
从“React”导入React，{Component}；
从“gl react”导入{Shaders，Node，GLSL}；
进口{
平台，
样式表，
文本，
看法
滑块
}从“反应本机”；
从“gl react native”导入{Surface}；
const shaders=shaders.create({
饱和：{
frag:GLSL`
高精度浮点；
可变vec2紫外线；
均匀采样；
均匀的浮动对比度、饱和度、亮度；
常数vec3 L=vec3（0.2125,0.7154,0.0721）；
void main（）{
vec4 c=织构2d（t，uv）；
vec3 brt=c.rgb*亮度；
gl_FragColor=vec4（混合(
vec3（0.5），
混合（vec3（dot（brt，L）），brt，饱和），
对比），c.a）；
}
`
}
});
导出常数饱和=（{对比度、饱和度、亮度、子项}）=>
;
导出默认类应用程序扩展组件{
状态={
对比：1，
饱和度：1，
亮度：1
}
render（）{
常数{对比度、饱和度、亮度}=此状态；
常数过滤器={
相比之下，
亮度
饱和
}
返回(
饱和甘油
{{uri:“https://i.imgur.com/uTP9Xfr.jpg" }}
this.setState（{contrast}}>
this.setState（{saturation}}>
this.setState（{brightness}}>
);
}
}
const styles=StyleSheet.create({
标题：{
尺寸：24，
textAlign:'中心'，
填充：10，
},
});

我在跑步

• 德国劳埃德船级社-react@3.13.0
• gl反应-native@3.13.0
• 自然反应-webgl@0.70

并且react native webgl设置正确（我已经按照安装说明在xcode中链接了libRNWebGL.a并删除了libGPUImage.a）

我是个新手，不太会用母语来表达，所以我可能做过（或者更糟糕的是，没有做过）有点愚蠢的事情。但如果有人能帮我指出为什么会发生这种情况，我将不胜感激。这真让我讨厌

---

谢谢

尝试更改

{{uri:https://i.imgur.com/uTP9Xfr.jpg“}}

至

{{image:{uri:https://i.imgur.com/uTP9Xfr.jpg“}}

或

{{image:https://i.imgur.com/uTP9Xfr.jpg“}}

您好，您可能忘了设置曲面的样式？我花了很长时间才意识到这个错误

请解释您的代码行，以便其他用户能够理解它的功能。谢谢我认为它本身很有解释性，搜索字符串，用第一个或第二个选项替换代码的这一部分你好@user3075259我也有同样的问题，你找到解决办法了吗？嗨@Priya不，对不起，我从来没有找到过。我认为gl react使用的一个库在我发布这篇文章时仍在开发中，并且不是所有的功能都已经实现（如果我没记错的话，我可能是错的），所以我不知道这已经改变了。我也没有尝试下面发布的代码ESA2012，因为那时我已经放弃了这个项目，所以我不知道这是否有效。我也不再有我的苹果开发者帐户，所以我无法尝试。我会给他们一个机会，如果有，我会投票给他们，除此之外，我可能会在git上发布一个问题。这应该是评论，而不是回答。