首页 > 解决方案 > 如何在 React Native Expo 中实现 Processingview?

问题描述

在此处输入图像描述这里我在 Expo App 中实现了 ProcessingView。但我收到此错误“检查 . 的渲染方法ProcessingView”。我无法找到解决方案。如果有人有想法,请指导我。在这里我还附上了屏幕的图像

import React from 'react';
import { ProcessingView } from 'expo-processing';

export default class App extends React.Component {
  render() {
    return (
      <ProcessingView style={{ flex: 1 }} sketch={this._sketch} />
    );
  }

  _sketch = (p) => {
    p.setup = () => {
      p.strokeWeight(7);
    }

    const harom = (ax, ay, bx, by, level, ratio) => {
      if (level <= 0) {
        return;
      }

      const vx = bx - ax;
      const vy = by - ay;
      const nx = p.cos(p.PI / 3) * vx - p.sin(p.PI / 3) * vy;
      const ny = p.sin(p.PI / 3) * vx + p.cos(p.PI / 3) * vy;
      const cx = ax + nx;
      const cy = ay + ny;
      p.line(ax, ay, bx, by);
      p.line(ax, ay, cx, cy);
      p.line(cx, cy, bx, by);

      harom(
        ax * ratio + cx * (1 - ratio),
        ay * ratio + cy * (1 - ratio),
        ax * (1 - ratio) + bx * ratio,
        ay * (1 - ratio) + by * ratio,
        level - 1,
        ratio);
    }

    p.draw = () => {
      p.background(240);
      harom(
        p.width - 142, p.height - 142, 142, p.height - 142, 6,
        (p.sin(0.0005 * Date.now() % (2 * p.PI)) + 1) / 2);
    }
  }
}

标签: react-nativeexpo

解决方案


推荐阅读