olorehq/olore/2-2-12

react-native-skia Documentation

React Native Skia documentation. Use for high-performance 2D graphics, shaders, animations, canvas rendering, image filters, path effects, and Skia API in React Native.

Documentation Structure

contents/
├── getting-started/    # Installation, hello world, web, headless, bundle size (5 files)
├── canvas/             # Canvas component and contexts (2 files)
├── shapes/             # Paths, ellipses, boxes, polygons, vertices, atlas, patch, pictures (8 files)
├── animations/         # Reanimated 3 integration, hooks, gestures, textures (4 files)
├── shaders/            # Gradients, colors, image shaders, SKSL language, Perlin noise (5 files)
├── image-filters/      # Blur, shadows, displacement, morphology, runtime shaders (7 files)
├── text/               # Text, blobs, glyphs, paragraphs, text on path (5 files)
├── paint/              # Paint overview and properties (2 files)
└── (root)              # Images, SVG, masks, filters, effects, video, Skottie (13 files)

Topic Guide

When to use

Use this skill when the user asks about:

• Drawing 2D graphics in React Native (shapes, paths, images)
• Shaders, gradients, and visual effects in React Native
• Animating canvas content with Reanimated or gesture handlers
• Image filters: blur, drop shadow, displacement maps, morphology
• Text rendering, paragraphs, and text along paths
• Skia API usage: Paint, Canvas, Groups, Masks
• Video rendering, Lottie animations (Skottie)
• Web support or headless Skia rendering

How to find information

1. Use Topic Guide above to identify relevant files
2. Read TOC.md for complete file listing by directory
3. Read specific files from contents/{path}