Update useImageAsTexture implementation

Shopify · Sep 17, 2024 · b0031dc · b0031dc
1 parent ac1172f
commit b0031dc
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 22 deletions.
diff --git a/packages/skia/src/external/reanimated/textures.tsx b/packages/skia/src/external/reanimated/textures.tsx
@@ -67,27 +67,12 @@ export const usePictureAsTexture = (
 };
 
 export const useImageAsTexture = (source: DataSourceParam) => {
+  const texture = Rea.useSharedValue<SkImage | null>(null);
   const image = useImage(source);
-  const size = useMemo(() => {
-    if (image) {
-      return { width: image.width(), height: image.height() };
-    }
-    return { width: 0, height: 0 };
-  }, [image]);
-  const picture = useMemo(() => {
-    if (image) {
-      const recorder = Skia.PictureRecorder();
-      const canvas = recorder.beginRecording({
-        x: 0,
-        y: 0,
-        width: size.width,
-        height: size.height,
-      });
-      canvas.drawImage(image, 0, 0);
-      return recorder.finishRecordingAsPicture();
-    } else {
-      return null;
+  useEffect(() => {
+    if (image !== null) {
+      texture.value = Skia.Image.MakeTextureFromImage(image);
     }
-  }, [size, image]);
-  return usePictureAsTexture(picture, size);
+  });
+  return texture;
 };
diff --git a/packages/skia/src/renderer/__tests__/e2e/Offscreen.spec.tsx b/packages/skia/src/renderer/__tests__/e2e/Offscreen.spec.tsx
@@ -30,7 +30,11 @@ describe("Offscreen Drawings", () => {
         if (!r2) {
           return [];
         }
-        return [r0.isTextureBacked(), r1.isTextureBacked(), r2.isTextureBacked()];
+        return [
+          r0.isTextureBacked(),
+          r1.isTextureBacked(),
+          r2.isTextureBacked(),
+        ];
       },
       { width, height, CI }
     );