Блог

Когда я хочу показать простое изображение с помощью gl-react, на Android все работает нормально, но на IOS, когда я выбираю фотографию, сделанную с помощью устройства, на поверхности будет отображаться повернутая и искаженная фотография.

Качество фотографии теряется, даже если я ее поворачиваю…

    import { Shaders, Node, GLSL, Uniform } from "gl-react";
   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);
         }`,
   });


   ...

   <Surface
       style={{
         width: 600,
         height: 300,
         borderWidth: 1,
         borderColor: "#ccc",
         }}
   >
     <Saturate
        {...{
        contrast: this.state.contrast,
        saturation: this.state.saturation,
        brightness: this.state.brightness,
        }}
     >
         {{ uri: this.imageUrl }}
     </Saturate>
   </Surface>

   ...


 

Изображение выглядит следующим образом: file:///var/mobile/Containers/Data/Application/5478AB1F-A07A-47DD-BEC4-CEC093CAFFCF/tmp/A6FE8AF8-985F-4922-8093-A4AA380CFC28.jpg

Исходное изображение

Image displayed on device

Другое дело, что если я отправлю фотографию через Интернет, скачаю ее оттуда и снова покажу, все будет в порядке.

Есть какие-нибудь идеи?