react_native_skia_canvas_with_colored_circles_blend_mode.ts

1import React from "react";
2import { Canvas, Circle, Group } from "@shopify/react-native-skia";
3
4export const HelloWorld = () => {
5  const size = 256;
6  const r = size * 0.33;
7  return (
8    <Canvas style={{ flex: 1 }}>
9      <Group blendMode="multiply">
10        <Circle cx={r} cy={r} r={r} color="cyan" />
11        <Circle cx={size - r} cy={r} r={r} color="magenta" />
12        <Circle cx={size / 2} cy={size - r} r={r} color="yellow" />
13      </Group>
14    </Canvas>
15  );
16};
17
18export default HelloWorld;