Elemento de texto

1. Estrutura

interface TextClip extends BaseClip {
  type: "text";
  text: string;
}

2. Campos suportados

`text`

Tipo: string
Obrigatório: sim
Finalidade: conteúdo de texto

Campos de estilo comuns

Mais usados com texto:

style.fontFamily
style.fontSize
style.fontWeight
style.fontStyle
style.lineHeight
style.letterSpacing
style.textAlign
style.textWrap
style.fill
style.stroke
style.strokeWidth
style.shadowColor
style.shadowBlur
style.shadowOffset

3. Bons casos de uso

Títulos
Subtítulos
Textos de CTA
Blocos de copy em templates
Contagens regressivas numéricas
Textos de citação

4. Comportamento atual do runtime

O suporte para estilos de texto é relativamente completo
animations, keyframes e transitions podem ser aplicados por cima
O posicionamento é guiado principalmente por transform.x / y

5. Exemplo

{
  "type": "text",
  "start": 1,
  "duration": 3,
  "text": "Launch Today",
  "transform": {
    "x": "50%",
    "y": "20%"
  },
  "style": {
    "fontSize": 64,
    "fontWeight": 700,
    "fill": "#ffffff",
    "textAlign": "center",
    "shadowColor": "#000000",
    "shadowBlur": 20
  },
  "animations": [
    {
      "type": "slideIn",
      "direction": "up",
      "distance": 100,
      "duration": 0.6
    }
  ]
}

On this page