Skip to content

Instantly share code, notes, and snippets.

@DenisDov
Created January 15, 2024 17:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save DenisDov/5368ba9659f18bfc1c0da8f548602ab6 to your computer and use it in GitHub Desktop.
Save DenisDov/5368ba9659f18bfc1c0da8f548602ab6 to your computer and use it in GitHub Desktop.
React Native Skia windmill
const { width } = useWindowDimensions();
const RADIUS = width / 2;
const NUM_SLICES = 8;
const renderPath = () => {
const sliceAngle = (2 * Math.PI) / NUM_SLICES;
const paths = [];
const colors = [
"#FF5733",
"#FFC300",
"#36A2EB",
"#4CAF50",
"#FF6384",
"#9966FF",
"#FF9800",
"#8E44AD",
];
for (let i = 0; i < NUM_SLICES; i++) {
const startAngle = i * sliceAngle;
const endAngle = (i + 1) * sliceAngle;
const path = Skia.Path.Make();
path.moveTo(RADIUS, RADIUS);
path.rArcTo(
RADIUS,
RADIUS,
0,
true,
false,
RADIUS * Math.cos(startAngle),
RADIUS * Math.sin(startAngle)
);
paths.push({ path, color: colors[i] });
}
return paths.map((pathData, index) => {
return <Path key={index} path={pathData.path} color={pathData.color} />;
});
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment