iddan / react-native-canvas

A Canvas component for React Native
MIT License
981 stars 172 forks source link

Doesn't work at all with Expo #323

Closed tomdoeslinux closed 2 months ago

tomdoeslinux commented 7 months ago

Hello, I seem to be getting Uncaught ReferenceError: regeneratorRuntime when using react-native-canvas using EXPO.

I'm unsure what to do.

Code:

import {useEffect, useRef} from "react";
import {SafeAreaView} from "react-native-safe-area-context";
import Canvas from 'react-native-canvas'
import {StyleSheet} from "react-native";

export default function Foundation() {
  const ref = useRef<Canvas | null>(null)

  useEffect(() => {
    if (ref.current) {
      const ctx = ref.current.getContext('2d')

      if (ctx) {
        ctx.fillStyle = 'red'
        ctx.fillRect(20, 20, 100, 100)
      }
    }
  }, [ref])

  return (
    <Canvas ref={ref} style={styles.canvas} />
  );
}

const styles = StyleSheet.create({
  root: {
    height: '100%',
    alignItems: 'center',
    justifyContent: 'center',
  },
  canvas: {
    width: '100%',
    height: '100%',
    backgroundColor: 'black',
  }
2wons commented 6 months ago

@tomdoeslinux were you able to find any work around on this issue?

tomdoeslinux commented 6 months ago

@tomdoeslinux were you able to find any work around on this issue?

Nope, I switched to WebGL.

bazylevnik0 commented 4 months ago

In my case was helpfull to add in App.js import of runtime: import regeneratorRuntime from "regenerator-runtime";

Answer from here: https://stackoverflow.com/questions/61755999/uncaught-referenceerror-regeneratorruntime-is-not-defined-in-react

iddan commented 2 months ago

This should be fixed with the new version.

tomdoeslinux commented 2 months ago

This should be fixed with the new version.

Great to see that it's fixed, but I've already moved to Flutter -- it has great support for canvas operations since it's fully based on Skia. Thanks anyways!