From b89094eca809bb84fbe14c92347267c274fe80f1 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Sun, 10 Aug 2025 18:20:43 +0200
Subject: [PATCH 1/7] :wrench:

---
 apps/example/ios/Podfile.lock              | 8 ++++----
 apps/example/src/Examples/API/Snapshot.tsx | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/example/ios/Podfile.lock b/apps/example/ios/Podfile.lock
index 6418e5fb02..bb01ff786b 100644
--- a/apps/example/ios/Podfile.lock
+++ b/apps/example/ios/Podfile.lock
@@ -1327,7 +1327,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - react-native-slider (4.5.6):
+  - react-native-slider (4.5.7):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -1340,7 +1340,7 @@ PODS:
     - React-featureflags
     - React-graphics
     - React-ImageManager
-    - react-native-slider/common (= 4.5.6)
+    - react-native-slider/common (= 4.5.7)
     - React-NativeModulesApple
     - React-RCTFabric
     - React-rendererdebug
@@ -1349,7 +1349,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - react-native-slider/common (4.5.6):
+  - react-native-slider/common (4.5.7):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2194,7 +2194,7 @@ SPEC CHECKSUMS:
   React-microtasksnativemodule: 843f352b32aacbe13a9c750190d34df44c3e6c2c
   react-native-safe-area-context: 0f14bce545abcdfbff79ce2e3c78c109f0be283e
   react-native-skia: d696b43cb1a6560ec3902856cdc8f0838cc25b64
-  react-native-slider: bb7eb4732940fab78217e1c096bb647d8b0d1cf3
+  react-native-slider: 310d3f89edd6ca8344a974bfe83a29a3fbb60e5a
   React-NativeModulesApple: 88433b6946778bea9c153e27b671de15411bf225
   React-perflogger: 9e8d3c0dc0194eb932162812a168aa5dc662f418
   React-performancetimeline: 5a2d6efef52bdcefac079c7baa30934978acd023
diff --git a/apps/example/src/Examples/API/Snapshot.tsx b/apps/example/src/Examples/API/Snapshot.tsx
index 2891efa60d..4673612b8f 100644
--- a/apps/example/src/Examples/API/Snapshot.tsx
+++ b/apps/example/src/Examples/API/Snapshot.tsx
@@ -54,7 +54,7 @@ export const Snapshot = () => {
 
   return (
     <View style={{ flex: 1 }}>
-      <View ref={viewRef} style={styles.view}>
+      <View ref={viewRef} style={styles.view} collapsable={false}>
         <Component />
       </View>
       <Button title="Take snapshot" onPress={takeSnapshot} />

From eb2df3a9c7f8c979155f0c621fd637ef8c08b196 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Sun, 10 Aug 2025 18:23:07 +0200
Subject: [PATCH 2/7] :wrench:

---
 apps/example/src/Examples/API/Snapshot.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/apps/example/src/Examples/API/Snapshot.tsx b/apps/example/src/Examples/API/Snapshot.tsx
index 4673612b8f..8c7bdec316 100644
--- a/apps/example/src/Examples/API/Snapshot.tsx
+++ b/apps/example/src/Examples/API/Snapshot.tsx
@@ -48,7 +48,10 @@ export const Snapshot = () => {
   const image = useSharedValue<SkImage | null>(null);
   const takeSnapshot = useCallback(async () => {
     if (viewRef.current != null) {
+      const start = performance.now();
       image.value = await makeImageFromView(viewRef as RefObject<View>);
+      const end = performance.now();
+      console.log("Performance: " + Math.round(end - start) + " ms");
     }
   }, [image]);
 

From 285e3536f10b14af8d23a0695b8d195473f23e71 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Sun, 10 Aug 2025 18:50:23 +0200
Subject: [PATCH 3/7] :wrench:

---
 packages/skia/apple/ViewScreenshotService.mm | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/skia/apple/ViewScreenshotService.mm b/packages/skia/apple/ViewScreenshotService.mm
index 06fd0d82d1..5e8aec52a7 100644
--- a/packages/skia/apple/ViewScreenshotService.mm
+++ b/packages/skia/apple/ViewScreenshotService.mm
@@ -44,8 +44,11 @@ - (instancetype)initWithUiManager:(RCTUIManager *)uiManager {
   // up in the profiler!
   UIImage *image = [renderer
       imageWithActions:^(UIGraphicsImageRendererContext *_Nonnull context) {
+        //CFTimeInterval startTime = CACurrentMediaTime();
         [view drawViewHierarchyInRect:(CGRect){CGPointZero, size}
-                   afterScreenUpdates:YES];
+                   afterScreenUpdates:NO];
+        //CFTimeInterval endTime = CACurrentMediaTime();
+        //NSLog(@"drawViewHierarchyInRect took %.2f ms", (endTime - startTime) * 1000.0);
       }];
 
   // Convert from UIImage -> CGImage -> SkImage

From 3bbfe53470cb2217244ef7f9861652df0fa78768 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Mon, 11 Aug 2025 12:09:42 +0200
Subject: [PATCH 4/7] :wrench:

---
 apps/example/src/App.tsx                      |  2 +-
 .../example/src/Examples/LiquidGlass/List.tsx |  4 +++
 .../src/Examples/LiquidGlass/Routes.ts        |  1 +
 .../src/Examples/LiquidGlass/index.tsx        | 10 +++++-
 packages/skia/cpp/api/recorder/Drawings.h     | 34 ++++++++++---------
 5 files changed, 33 insertions(+), 18 deletions(-)

diff --git a/apps/example/src/App.tsx b/apps/example/src/App.tsx
index 277e37330d..90f506ec40 100644
--- a/apps/example/src/App.tsx
+++ b/apps/example/src/App.tsx
@@ -107,7 +107,7 @@ const App = () => {
             screenOptions={{
               headerLeft: HeaderLeft,
             }}
-            initialRouteName={CI ? "Tests" : "Home"}
+            initialRouteName={CI ? "Tests" : "LiquidGlass"}
           >
             <Stack.Screen
               name="Home"
diff --git a/apps/example/src/Examples/LiquidGlass/List.tsx b/apps/example/src/Examples/LiquidGlass/List.tsx
index 56d17cb2de..1b31e0aafa 100644
--- a/apps/example/src/Examples/LiquidGlass/List.tsx
+++ b/apps/example/src/Examples/LiquidGlass/List.tsx
@@ -26,6 +26,10 @@ export const examples = [
     screen: "Shader2",
     title: "🎨 Shader 2",
   },
+  {
+    screen: "NativeView",
+    title: "📱 Native View",
+  },
 ] as const;
 
 const styles = StyleSheet.create({
diff --git a/apps/example/src/Examples/LiquidGlass/Routes.ts b/apps/example/src/Examples/LiquidGlass/Routes.ts
index 86e83fac66..7dd48bfcfc 100644
--- a/apps/example/src/Examples/LiquidGlass/Routes.ts
+++ b/apps/example/src/Examples/LiquidGlass/Routes.ts
@@ -5,4 +5,5 @@ export type Routes = {
   DisplacementMap2: undefined;
   Shader1: undefined;
   Shader2: undefined;
+  NativeView: undefined;
 };
diff --git a/apps/example/src/Examples/LiquidGlass/index.tsx b/apps/example/src/Examples/LiquidGlass/index.tsx
index f75175f8f1..e9897fb5d1 100644
--- a/apps/example/src/Examples/LiquidGlass/index.tsx
+++ b/apps/example/src/Examples/LiquidGlass/index.tsx
@@ -8,11 +8,12 @@ import { DisplacementMap1 } from "./DisplacementMap1";
 import { DisplacementMap2 } from "./DisplacementMap2";
 import { Shader1 } from "./Shader1";
 import { Shader2 } from "./Shader2";
+import { NativeView } from "./NativeView";
 
 const Stack = createNativeStackNavigator<Routes>();
 export const LiquidGlass = () => {
   return (
-    <Stack.Navigator>
+    <Stack.Navigator initialRouteName="NativeView">
       <Stack.Screen
         name="List"
         component={List}
@@ -56,6 +57,13 @@ export const LiquidGlass = () => {
           title: "🎨 Shader 2",
         }}
       />
+      <Stack.Screen
+        name="NativeView"
+        component={NativeView}
+        options={{
+          title: "📱 Native View",
+        }}
+      />
     </Stack.Navigator>
   );
 };
diff --git a/packages/skia/cpp/api/recorder/Drawings.h b/packages/skia/cpp/api/recorder/Drawings.h
index a4f9510b73..d6a984076b 100644
--- a/packages/skia/cpp/api/recorder/Drawings.h
+++ b/packages/skia/cpp/api/recorder/Drawings.h
@@ -496,22 +496,24 @@ class ImageCmd : public Command {
     auto [x, y, width, height, rect, fit, image, sampling] = props;
     if (image.has_value()) {
       auto img = image.value();
-      auto hasRect =
-          rect.has_value() || (width.has_value() && height.has_value());
-      if (hasRect) {
-        auto src = SkRect::MakeXYWH(0, 0, img->width(), img->height());
-        auto dst = rect.has_value()
-                       ? rect.value()
-                       : SkRect::MakeXYWH(x, y, width.value(), height.value());
-        auto rects = RNSkiaImage::fitRects(fit, src, dst);
-        ctx->canvas->drawImageRect(
-            img, rects.src, rects.dst,
-            sampling.value_or(SkSamplingOptions(SkFilterMode::kLinear)),
-            &(ctx->getPaint()), SkCanvas::kStrict_SrcRectConstraint);
-      } else {
-        throw std::runtime_error(
-            "Image node could not resolve image dimension props.");
-      }
+        if (img != nullptr) {
+            auto hasRect =
+            rect.has_value() || (width.has_value() && height.has_value());
+            if (hasRect) {
+                auto src = SkRect::MakeXYWH(0, 0, img->width(), img->height());
+                auto dst = rect.has_value()
+                ? rect.value()
+                : SkRect::MakeXYWH(x, y, width.value(), height.value());
+                auto rects = RNSkiaImage::fitRects(fit, src, dst);
+                ctx->canvas->drawImageRect(
+                                           img, rects.src, rects.dst,
+                                           sampling.value_or(SkSamplingOptions(SkFilterMode::kLinear)),
+                                           &(ctx->getPaint()), SkCanvas::kStrict_SrcRectConstraint);
+            } else {
+                throw std::runtime_error(
+                                         "Image node could not resolve image dimension props.");
+            }
+        }
     }
   }
 };

From 0510786c10b6d2ceabd0c323968aa0689ca66537 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Mon, 11 Aug 2025 12:27:32 +0200
Subject: [PATCH 5/7] :wrench:

---
 .../src/Examples/LiquidGlass/NativeView.tsx   | 86 +++++++++++++++++++
 packages/skia/cpp/api/JsiSkImageFactory.h     | 13 +++
 2 files changed, 99 insertions(+)
 create mode 100644 apps/example/src/Examples/LiquidGlass/NativeView.tsx

diff --git a/apps/example/src/Examples/LiquidGlass/NativeView.tsx b/apps/example/src/Examples/LiquidGlass/NativeView.tsx
new file mode 100644
index 0000000000..4a2ae9494b
--- /dev/null
+++ b/apps/example/src/Examples/LiquidGlass/NativeView.tsx
@@ -0,0 +1,86 @@
+import {
+  Canvas,
+  Skia,
+  useClock,
+  Image as SkImage,
+} from "@shopify/react-native-skia";
+import React, { useLayoutEffect, useRef } from "react";
+import { View, PixelRatio, StyleSheet, findNodeHandle } from "react-native";
+import Animated, {
+  useAnimatedReaction,
+  useAnimatedStyle,
+  useDerivedValue,
+  useSharedValue,
+} from "react-native-reanimated";
+
+const style = {
+  flex: 1,
+  overflow: "hidden" as const,
+};
+
+export const NativeView = () => {
+  const canvasSize = useSharedValue({ width: 0, height: 0 });
+  const viewTag = useRef(-1);
+  const image = useSharedValue(Skia.Image.MakeNull());
+  const ref = useRef<View>(null);
+  const clock = useClock();
+  const imageHeight = 1920 / PixelRatio.get();
+
+  const translateY = useDerivedValue(() => clock.value / 10);
+
+  useLayoutEffect(() => {
+    viewTag.current = findNodeHandle(ref.current)!;
+  }, []);
+
+  const animatedStyle = useAnimatedStyle(() => {
+    return {
+      transform: [{ translateY: -translateY.value % imageHeight }],
+    };
+  });
+
+  useAnimatedReaction(
+    () => clock.value,
+    () => {
+      Skia.Image.MakeImageFromViewTagSync(viewTag.current, image.value);
+    }
+  );
+
+  const rect = useDerivedValue(() => ({
+    x: 0,
+    y: 0,
+    width: canvasSize.value.width,
+    height: canvasSize.value.height,
+  }));
+
+  return (
+    <View style={{ flex: 1 }}>
+      <View style={style} collapsable={false} ref={ref}>
+        <Animated.Image
+          style={[
+            {
+              resizeMode: "repeat",
+              width: "100%",
+              height: imageHeight * 2,
+            },
+            animatedStyle,
+          ]}
+          source={require("./assets/flowers.jpg")}
+        />
+        <Animated.Image
+          style={[
+            {
+              resizeMode: "repeat",
+              width: "100%",
+              height: imageHeight * 2,
+            },
+            animatedStyle,
+          ]}
+          source={require("./assets/flowers.jpg")}
+        />
+      </View>
+      <Canvas style={StyleSheet.absoluteFillObject} onSize={canvasSize}>
+        <SkImage image={image} rect={rect} />
+      </Canvas>
+    </View>
+  );
+};
diff --git a/packages/skia/cpp/api/JsiSkImageFactory.h b/packages/skia/cpp/api/JsiSkImageFactory.h
index 12c525db4f..8190a76960 100644
--- a/packages/skia/cpp/api/JsiSkImageFactory.h
+++ b/packages/skia/cpp/api/JsiSkImageFactory.h
@@ -83,6 +83,18 @@ class JsiSkImageFactory : public JsiSkHostObject {
         });
   }
 
+  JSI_HOST_FUNCTION(MakeImageFromViewTagSync) {
+    // TODO: add safety checks on args[0] and args[1]
+    auto viewTag = arguments[0].asNumber();
+    auto image = JsiSkImage::fromValue(runtime, arguments[1]);
+    auto context = getContext();
+    // TODO: check we are on the main thread
+    if (viewTag != -1) {
+
+    }
+    return jsi::Value::undefined();
+  }
+
   JSI_HOST_FUNCTION(MakeImageFromNativeTextureUnstable) {
     auto texInfo = JsiTextureInfo::fromValue(runtime, arguments[0]);
     auto image = getContext()->makeImageFromNativeTexture(
@@ -104,6 +116,7 @@ class JsiSkImageFactory : public JsiSkHostObject {
 
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkImageFactory, MakeImageFromEncoded),
                        JSI_EXPORT_FUNC(JsiSkImageFactory, MakeImageFromViewTag),
+                       JSI_EXPORT_FUNC(JsiSkImageFactory, MakeImageFromViewTagSync),
                        JSI_EXPORT_FUNC(JsiSkImageFactory,
                                        MakeImageFromNativeBuffer),
                        JSI_EXPORT_FUNC(JsiSkImageFactory,

From a00eaa1d34730d5c05bb7ffb6f0c50d85ac50f09 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Mon, 11 Aug 2025 12:59:45 +0200
Subject: [PATCH 6/7] :wrench:

---
 .../src/Examples/LiquidGlass/NativeView.tsx   | 39 +++++++++++++++----
 packages/skia/cpp/api/JsiSkImageFactory.h     | 13 ++++++-
 .../skia/cpp/rnskia/RNSkPlatformContext.h     | 10 +++++
 3 files changed, 52 insertions(+), 10 deletions(-)

diff --git a/apps/example/src/Examples/LiquidGlass/NativeView.tsx b/apps/example/src/Examples/LiquidGlass/NativeView.tsx
index 4a2ae9494b..4c433552b8 100644
--- a/apps/example/src/Examples/LiquidGlass/NativeView.tsx
+++ b/apps/example/src/Examples/LiquidGlass/NativeView.tsx
@@ -3,9 +3,17 @@ import {
   Skia,
   useClock,
   Image as SkImage,
+  Fill,
+  ColorMatrix,
 } from "@shopify/react-native-skia";
 import React, { useLayoutEffect, useRef } from "react";
-import { View, PixelRatio, StyleSheet, findNodeHandle } from "react-native";
+import {
+  View,
+  PixelRatio,
+  StyleSheet,
+  findNodeHandle,
+  Platform,
+} from "react-native";
 import Animated, {
   useAnimatedReaction,
   useAnimatedStyle,
@@ -38,12 +46,20 @@ export const NativeView = () => {
     };
   });
 
-  useAnimatedReaction(
-    () => clock.value,
-    () => {
-      Skia.Image.MakeImageFromViewTagSync(viewTag.current, image.value);
-    }
-  );
+  // useAnimatedReaction(
+  //   () => clock.value,
+  //   () => {
+  //     console.log("take snapshot on " + Platform.OS + " at " + new Date());
+  //     Skia.Image.MakeImageFromViewTagSync(viewTag.current, image.value);
+  //   }
+  // );
+  const result = useDerivedValue(() => {
+    console.log(clock.value);
+    return Skia.Image.MakeImageFromViewTagSync(
+      viewTag.current,
+      image.value
+    ) as SkImage;
+  });
 
   const rect = useDerivedValue(() => ({
     x: 0,
@@ -79,7 +95,14 @@ export const NativeView = () => {
         />
       </View>
       <Canvas style={StyleSheet.absoluteFillObject} onSize={canvasSize}>
-        <SkImage image={image} rect={rect} />
+        <SkImage image={result} rect={rect}>
+          <ColorMatrix
+            matrix={[
+              -0.578, 0.99, 0.588, 0, 0, 0.469, 0.535, -0.003, 0, 0, 0.015,
+              1.69, -0.703, 0, 0, 0, 0, 0, 1, 0,
+            ]}
+          />
+        </SkImage>
       </Canvas>
     </View>
   );
diff --git a/packages/skia/cpp/api/JsiSkImageFactory.h b/packages/skia/cpp/api/JsiSkImageFactory.h
index 8190a76960..a6ef3f696f 100644
--- a/packages/skia/cpp/api/JsiSkImageFactory.h
+++ b/packages/skia/cpp/api/JsiSkImageFactory.h
@@ -86,11 +86,20 @@ class JsiSkImageFactory : public JsiSkHostObject {
   JSI_HOST_FUNCTION(MakeImageFromViewTagSync) {
     // TODO: add safety checks on args[0] and args[1]
     auto viewTag = arguments[0].asNumber();
-    auto image = JsiSkImage::fromValue(runtime, arguments[1]);
+    auto jsiImage = arguments[1].asObject(runtime).asHostObject<JsiSkImage>(runtime);
     auto context = getContext();
     // TODO: check we are on the main thread
     if (viewTag != -1) {
-
+      auto result = context->makeViewScreenshotSync(viewTag);
+      SkDebugf("MakeImageFromViewTagSync: viewTag=%d, result=%s\n", 
+               static_cast<int>(viewTag), 
+               result != nullptr ? "not null" : "null");
+      jsiImage->setObject(result);
+      return jsi::Object::createFromHostObject(
+            runtime, std::make_shared<JsiSkImage>(getContext(), std::move(result)));
+    } else {
+            SkDebugf("MakeImageFromViewTagSync failed: viewTag=%d\n", 
+               static_cast<int>(viewTag));
     }
     return jsi::Value::undefined();
   }
diff --git a/packages/skia/cpp/rnskia/RNSkPlatformContext.h b/packages/skia/cpp/rnskia/RNSkPlatformContext.h
index 1a23181756..a67be50f12 100644
--- a/packages/skia/cpp/rnskia/RNSkPlatformContext.h
+++ b/packages/skia/cpp/rnskia/RNSkPlatformContext.h
@@ -160,6 +160,16 @@ class RNSkPlatformContext {
     });
   }
 
+  /**
+   * Creates an skImage containing the screenshot of a native view and its
+   * children. This method assumes it's already running on the main thread.
+   * @param viewTag React viewtag
+   * @return sk_sp<SkImage> The screenshot image or nullptr if failed
+   */
+  virtual sk_sp<SkImage> makeViewScreenshotSync(int viewTag) {
+    return takeScreenshotFromViewTag(viewTag);
+  }
+
   /**
    * Raises an exception on the platform. This function does not necessarily
    * throw an exception and stop execution, so it is important to stop execution

From 2b6f4699a71b9286842e99678ce96e2154a19484 Mon Sep 17 00:00:00 2001
From: William Candillon <wcandillon@gmail.com>
Date: Mon, 11 Aug 2025 14:18:49 +0200
Subject: [PATCH 7/7] Android example

---
 .../src/Examples/LiquidGlass/NativeView.tsx   | 30 +++++++++----------
 .../android/cpp/jni/JniPlatformContext.cpp    | 11 +++++++
 .../cpp/jni/include/JniPlatformContext.h      |  2 ++
 .../RNSkAndroidPlatformContext.h              |  4 +++
 .../reactnative/skia/PlatformContext.java     | 27 +++++++++++++++++
 packages/skia/cpp/api/JsiSkImageFactory.h     | 15 ++++++----
 .../skia/cpp/rnskia/RNSkPlatformContext.h     |  9 ++++++
 7 files changed, 77 insertions(+), 21 deletions(-)

diff --git a/apps/example/src/Examples/LiquidGlass/NativeView.tsx b/apps/example/src/Examples/LiquidGlass/NativeView.tsx
index 4c433552b8..2cd1e722ca 100644
--- a/apps/example/src/Examples/LiquidGlass/NativeView.tsx
+++ b/apps/example/src/Examples/LiquidGlass/NativeView.tsx
@@ -5,6 +5,7 @@ import {
   Image as SkImage,
   Fill,
   ColorMatrix,
+  notifyChange,
 } from "@shopify/react-native-skia";
 import React, { useLayoutEffect, useRef } from "react";
 import {
@@ -38,6 +39,10 @@ export const NativeView = () => {
 
   useLayoutEffect(() => {
     viewTag.current = findNodeHandle(ref.current)!;
+    if (Platform.OS === "android") {
+      console.log("SetRenderEffect!");
+      Skia.Image.setRenderEffectAndroid(viewTag.current, "");
+    }
   }, []);
 
   const animatedStyle = useAnimatedStyle(() => {
@@ -46,20 +51,15 @@ export const NativeView = () => {
     };
   });
 
-  // useAnimatedReaction(
-  //   () => clock.value,
-  //   () => {
-  //     console.log("take snapshot on " + Platform.OS + " at " + new Date());
-  //     Skia.Image.MakeImageFromViewTagSync(viewTag.current, image.value);
-  //   }
-  // );
-  const result = useDerivedValue(() => {
-    console.log(clock.value);
-    return Skia.Image.MakeImageFromViewTagSync(
-      viewTag.current,
-      image.value
-    ) as SkImage;
-  });
+  useAnimatedReaction(
+    () => clock.value,
+    () => {
+      if (Platform.OS === "ios") {
+        Skia.Image.MakeImageFromViewTagSync(viewTag.current, image.value);
+        notifyChange(image);
+      }
+    }
+  );
 
   const rect = useDerivedValue(() => ({
     x: 0,
@@ -95,7 +95,7 @@ export const NativeView = () => {
         />
       </View>
       <Canvas style={StyleSheet.absoluteFillObject} onSize={canvasSize}>
-        <SkImage image={result} rect={rect}>
+        <SkImage image={image} rect={rect}>
           <ColorMatrix
             matrix={[
               -0.578, 0.99, 0.588, 0, 0, 0.469, 0.535, -0.003, 0, 0, 0.015,
diff --git a/packages/skia/android/cpp/jni/JniPlatformContext.cpp b/packages/skia/android/cpp/jni/JniPlatformContext.cpp
index ab7b3354ce..a811da217a 100644
--- a/packages/skia/android/cpp/jni/JniPlatformContext.cpp
+++ b/packages/skia/android/cpp/jni/JniPlatformContext.cpp
@@ -130,6 +130,17 @@ sk_sp<SkImage> JniPlatformContext::takeScreenshotFromViewTag(size_t tag) {
   return skImage;
 }
 
+void JniPlatformContext::setRenderEffectAndroid(int viewTag, const std::string &shaderString) {
+  auto env = jni::Environment::current();
+  static auto method = javaPart_->getClass()->getMethod<void(int, jstring)>("setRenderEffectAndroid");
+  
+  jstring jShaderString = env->NewStringUTF(shaderString.c_str());
+  
+  method(javaPart_.get(), viewTag, jShaderString);
+  
+  env->DeleteLocalRef(jShaderString);
+}
+
 void JniPlatformContext::performStreamOperation(
     const std::string &sourceUri,
     const std::function<void(std::unique_ptr<SkStreamAsset>)> &op) {
diff --git a/packages/skia/android/cpp/jni/include/JniPlatformContext.h b/packages/skia/android/cpp/jni/include/JniPlatformContext.h
index 2856a13660..167591ff7e 100644
--- a/packages/skia/android/cpp/jni/include/JniPlatformContext.h
+++ b/packages/skia/android/cpp/jni/include/JniPlatformContext.h
@@ -42,6 +42,8 @@ class JniPlatformContext : public jni::HybridClass<JniPlatformContext> {
 
   sk_sp<SkImage> takeScreenshotFromViewTag(size_t tag);
 
+  void setRenderEffectAndroid(int viewTag, const std::string &shaderString);
+
   jni::global_ref<jobject> createVideo(const std::string &url);
 
 private:
diff --git a/packages/skia/android/cpp/rnskia-android/RNSkAndroidPlatformContext.h b/packages/skia/android/cpp/rnskia-android/RNSkAndroidPlatformContext.h
index 2f1cfe4326..f12f9ba052 100644
--- a/packages/skia/android/cpp/rnskia-android/RNSkAndroidPlatformContext.h
+++ b/packages/skia/android/cpp/rnskia-android/RNSkAndroidPlatformContext.h
@@ -226,6 +226,10 @@ class RNSkAndroidPlatformContext : public RNSkPlatformContext {
     return _jniPlatformContext->takeScreenshotFromViewTag(tag);
   }
 
+  void setRenderEffectAndroid(int viewTag, const std::string &shaderString) override {
+    _jniPlatformContext->setRenderEffectAndroid(viewTag, shaderString);
+  }
+
 private:
   JniPlatformContext *_jniPlatformContext;
 };
diff --git a/packages/skia/android/src/main/java/com/shopify/reactnative/skia/PlatformContext.java b/packages/skia/android/src/main/java/com/shopify/reactnative/skia/PlatformContext.java
index 6e675ff9f3..9bbacb4756 100644
--- a/packages/skia/android/src/main/java/com/shopify/reactnative/skia/PlatformContext.java
+++ b/packages/skia/android/src/main/java/com/shopify/reactnative/skia/PlatformContext.java
@@ -1,11 +1,18 @@
 package com.shopify.reactnative.skia;
 
+import android.os.Build;
 import android.os.Handler;
 import android.os.Looper;
+import android.graphics.RenderEffect;
+import android.graphics.Shader;
+import android.view.View;
 
 import com.facebook.jni.HybridData;
 import com.facebook.proguard.annotations.DoNotStrip;
 import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.UIManager;
+import com.facebook.react.uimanager.UIManagerHelper;
+import com.facebook.react.uimanager.UIManagerModule;
 
 import java.io.BufferedInputStream;
 import java.io.ByteArrayOutputStream;
@@ -115,6 +122,26 @@ public void run() {
         });
     }
 
+    @DoNotStrip
+    public void setRenderEffectAndroid(final int tag, final String shaderString) {
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
+            UIManager uiManager = UIManagerHelper.getUIManagerForReactTag(mContext, tag);
+            View view = null;
+            try {
+                view = uiManager.resolveView(tag);
+            } catch (RuntimeException e) {
+                mContext.handleException(e);
+            }
+            if (view != null) {
+                    // For now, ignore shaderString and use a fixed blur effect
+                    RenderEffect blurEffect = null;
+                    blurEffect = RenderEffect.createBlurEffect(
+                            10, 10, null, Shader.TileMode.CLAMP);
+                    view.setRenderEffect(blurEffect);
+            }
+        }
+    }
+
     // Private c++ native methods
     private native HybridData initHybrid(float pixelDensity);
 }
diff --git a/packages/skia/cpp/api/JsiSkImageFactory.h b/packages/skia/cpp/api/JsiSkImageFactory.h
index a6ef3f696f..d8c9db298a 100644
--- a/packages/skia/cpp/api/JsiSkImageFactory.h
+++ b/packages/skia/cpp/api/JsiSkImageFactory.h
@@ -91,19 +91,21 @@ class JsiSkImageFactory : public JsiSkHostObject {
     // TODO: check we are on the main thread
     if (viewTag != -1) {
       auto result = context->makeViewScreenshotSync(viewTag);
-      SkDebugf("MakeImageFromViewTagSync: viewTag=%d, result=%s\n", 
-               static_cast<int>(viewTag), 
-               result != nullptr ? "not null" : "null");
       jsiImage->setObject(result);
       return jsi::Object::createFromHostObject(
             runtime, std::make_shared<JsiSkImage>(getContext(), std::move(result)));
-    } else {
-            SkDebugf("MakeImageFromViewTagSync failed: viewTag=%d\n", 
-               static_cast<int>(viewTag));
     }
     return jsi::Value::undefined();
   }
 
+  JSI_HOST_FUNCTION(setRenderEffectAndroid) {
+    auto viewTag = static_cast<int>(arguments[0].asNumber());
+    auto shaderString = arguments[1].asString(runtime).utf8(runtime);
+    auto context = getContext();
+    context->setRenderEffectAndroid(viewTag, shaderString);
+    return jsi::Value::undefined();
+  }
+
   JSI_HOST_FUNCTION(MakeImageFromNativeTextureUnstable) {
     auto texInfo = JsiTextureInfo::fromValue(runtime, arguments[0]);
     auto image = getContext()->makeImageFromNativeTexture(
@@ -126,6 +128,7 @@ class JsiSkImageFactory : public JsiSkHostObject {
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkImageFactory, MakeImageFromEncoded),
                        JSI_EXPORT_FUNC(JsiSkImageFactory, MakeImageFromViewTag),
                        JSI_EXPORT_FUNC(JsiSkImageFactory, MakeImageFromViewTagSync),
+                       JSI_EXPORT_FUNC(JsiSkImageFactory, setRenderEffectAndroid),
                        JSI_EXPORT_FUNC(JsiSkImageFactory,
                                        MakeImageFromNativeBuffer),
                        JSI_EXPORT_FUNC(JsiSkImageFactory,
diff --git a/packages/skia/cpp/rnskia/RNSkPlatformContext.h b/packages/skia/cpp/rnskia/RNSkPlatformContext.h
index a67be50f12..9a8a0f99b0 100644
--- a/packages/skia/cpp/rnskia/RNSkPlatformContext.h
+++ b/packages/skia/cpp/rnskia/RNSkPlatformContext.h
@@ -170,6 +170,15 @@ class RNSkPlatformContext {
     return takeScreenshotFromViewTag(viewTag);
   }
 
+  /**
+   * Sets a render effect on an Android view. No-op on other platforms.
+   * @param viewTag React viewtag
+   * @param shaderString Shader string (not used in initial implementation)
+   */
+  virtual void setRenderEffectAndroid(int viewTag, const std::string &shaderString) {
+    // No-op by default (iOS and other platforms)
+  }
+
   /**
    * Raises an exception on the platform. This function does not necessarily
    * throw an exception and stop execution, so it is important to stop execution