字形

此组件在给定字体中，在相应的位置绘制一组字形。

名称	类型	描述
glyphs	Glyph[]	要绘制的字形
x?	number.	整个字形运行的原点 x 坐标。默认为 0
y?	number.	整个字形运行的原点 y 坐标。默认为 0
font	SkFont	要使用的字体

垂直绘制文本

tsx
import {Canvas, Glyphs, vec, useFont} from "@shopify/react-native-skia";
 
export const HelloWorld = () => {
  const fontSize = 32;
  const font = useFont(require("./my-font.otf"), fontSize);
  if (font === null) {
    return null;
  }
  const glyphs = font
    .getGlyphIDs("Hello World!")
    .map((id, i) => ({ id, pos: vec(0, (i + 1) * fontSize) }));
  return (
    <Canvas style={{ flex:  1 }}>
      <Glyphs
        font={font}
        glyphs={glyphs}
      />
    </Canvas>
  );
}

tsx
import {Canvas, Glyphs, vec, useFont} from "@shopify/react-native-skia";
 
export const HelloWorld = () => {
  const fontSize = 32;
  const font = useFont(require("./my-font.otf"), fontSize);
  if (font === null) {
    return null;
  }
  const glyphs = font
    .getGlyphIDs("Hello World!")
    .map((id, i) => ({ id, pos: vec(0, (i + 1) * fontSize) }));
  return (
    <Canvas style={{ flex:  1 }}>
      <Glyphs
        font={font}
        glyphs={glyphs}
      />
    </Canvas>
  );
}