Я пытался использовать класс Surface класса gl-react-native, чтобы увидеть, что выводится, но всякий раз, когда я пытался запустить фрагмент кода, либо приложение вылетало, либо приложение работало, но на дисплее был только белый экран.
Вот мой код:
import { Shaders, Node, GLSL } from "gl-react";
import { Surface } from "gl-react-native";
import React from "react";
import { Shaders, Node, GLSL } from "gl-react";
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);
}`
}
});
class HelloBlue extends Component {
render() {
const { blue } = this.props;
return <Node shader={shaders.helloBlue} uniforms={{ blue }} />;
}
}
export default class App extends Component {
render() {
return (
<Surface width={300} height={300}>
<HelloBlue blue={0.5} />
</Surface>
);
}
}
Вот мои зависимости:
"dependencies": {
"buffer": "^5.5.0",
"expo-permissions": "^8.1.0",
"gl-react": "^4.0.1",
"gl-react-headless": "^4.0.1",
"gl-react-native": "^4.0.1",
"react": "16.11.0",
"react-native": "0.62.0",
"react-native-unimodules": "^0.7.0"
}
В этом случае я получаю только белый экран в качестве вывода:
import React, { Component } from "react";
import { Shaders, Node, GLSL } from "gl-react";
import { Surface } from "gl-react-native";
import React from "react";
import { Shaders, Node, GLSL } from "gl-react";
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);
}`
}
});
class HelloBlue extends Component {
render() {
const { blue } = this.props;
return <Node shader={shaders.helloBlue} uniforms={{ blue }} />;
}
}
export default class App extends Component {
render() {
return (
<Surface style={{ width: 300, height: 300 }}>
<HelloBlue blue={0.5} />
</Surface>
);
}
}
Когда я запускаю этот код, приложение вообще не отвечает, а когда я запускаю его на эмуляторе, приложение вылетает.
1 ответ
Получить версии правильно
npm i --save react-native-gl-image-filters
npm i --save gl-react@^4.0.1
npm i --save gl-react-native@^4.0.1
npm i --save buffer@^5.4.3
npm i --save react-native-unimodules@^0.7.0
Унимодули ^0.10.1 тоже будут работать
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript/JS) и его различных диалектах/реализациях (кроме ActionScript). Имейте в виду, что JavaScript — это НЕ то же самое, что Java! Включите все ярлыки, относящиеся к вашему вопросу; например, [node.js], [jQuery], [JSON], [ReactJS], [angular], [ember.js], [vue.js], [typescript], [svelte] и т. д.