react-native-canvas icon indicating copy to clipboard operation
react-native-canvas copied to clipboard

Doesn't work at all with Expo

Open tomdoeslinux opened this issue 1 year ago • 2 comments

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',
  }

tomdoeslinux avatar Feb 06 '24 08:02 tomdoeslinux

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

twoimg avatar Mar 10 '24 16:03 twoimg

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

Nope, I switched to WebGL.

tomdoeslinux avatar Mar 12 '24 08:03 tomdoeslinux

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

bazylevnik0 avatar Apr 28 '24 11:04 bazylevnik0

This should be fixed with the new version.

iddan avatar Jun 22 '24 13:06 iddan

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!

tomdoeslinux avatar Jun 27 '24 00:06 tomdoeslinux