Chapter 256: <SkiaCanvas />

Core Idea

A React Native Skia <Canvas /> component that wraps Remotion contexts.

Key Concepts

• Props
• width
• height
• Inherited props
• See also

Code Examples

const MySkiaVideo: React.FC = () => {
  const { width, height } = useVideoConfig();
  return (
    <SkiaCanvas width={width} height={height}>
      <Fill color="black" />
    </SkiaCanvas>
  );
};

• What it demonstrates: Usage pattern for <SkiaCanvas /> from the official docs.

Key Takeaways

1. Understand props when working with <SkiaCanvas />.
2. Understand width when working with <SkiaCanvas />.
3. Understand height when working with <SkiaCanvas />.
4. Understand inherited props when working with <SkiaCanvas />.
5. Understand see also when working with <SkiaCanvas />.

Connects To

• Angular: related page in the Framework & Renderer Integrations section.
• Figma: related page in the Framework & Renderer Integrations section.
• use Gsap Timeline: related page in the Framework & Renderer Integrations section.