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

How can I update Path without rerendering

Open doublelam opened this issue 5 months ago • 3 comments

Description

const [path, setPath] = useState<SkPath>(Skia.Path.Make());

const panGesture = useMemo(
    () =>
      Gesture.Pan()
        .onBegin(e => {
          'worklet';

          const coords = getRelativeCoords(viewRef as any, e.absoluteX, e.absoluteY);
          path.moveTo(coords?.x||0, coords?.y||0)
        })
        .onUpdate(e => {
          'worklet';

          const coords = getRelativeCoords(viewRef as any, e.absoluteX, e.absoluteY);
          path.lineTo(coords?.x||0, coords?.y||0);
        })
    [],
  );

return (
    <GestureDetector gesture={panGesture}>
      <View ref={viewRef} style={styles.canvas}>
        <Canvas style={{flex: 1}}>
          {/* Drawing path */}
            <Path
              path={path}
              // style="stroke"
              color={strokeColor}
              stroke={{width: typeof strokeWidth === 'number' ? strokeWidth : strokeWidth.value}}
            />
        </Canvas>
      </View>
    </GestureDetector>
  );

it doesn't work. how can I change Path without rerendering?

Version

1.3.11

Steps to reproduce

Above code

Snack, code example, screenshot, or link to a repository

no

doublelam avatar Sep 17 '24 10:09 doublelam