跳到主要内容

椭圆

圆​

绘制一个圆。

名称类型描述
cx数字起始点。
cy数字终点。
r数字半径。
tsx
import {Canvas, Circle} from "@shopify/react-native-skia";
 
const CircleDemo = () => {
  const r = 128;
  return (
    <Canvas style={{ flex: 1 }}>
      <Circle cx={r} cy={r} r={r} color="lightblue" />
    </Canvas>
  );
};
tsx
import {Canvas, Circle} from "@shopify/react-native-skia";
 
const CircleDemo = () => {
  const r = 128;
  return (
    <Canvas style={{ flex: 1 }}>
      <Circle cx={r} cy={r} r={r} color="lightblue" />
    </Canvas>
  );
};

Circle

椭圆​

基于其边界矩形绘制一个椭圆。

名称类型描述
x数字边界矩形的 X 坐标。
y数字边界矩形的 Y 坐标。
width数字边界矩形的宽度。
height数字边界矩形的高度。
tsx
import {Canvas, Oval} from "@shopify/react-native-skia";
 
const OvalDemo = () => {
  return (
    <Canvas style={{ flex: 1 }}>
      <Oval x={64} y={0} width={128} height={256} color="lightblue" />
    </Canvas>
  );
};
tsx
import {Canvas, Oval} from "@shopify/react-native-skia";
 
const OvalDemo = () => {
  return (
    <Canvas style={{ flex: 1 }}>
      <Oval x={64} y={0} width={128} height={256} color="lightblue" />
    </Canvas>
  );
};

Oval