Cartão ticker

As manchetes rolam da direita para a esquerda em faixas suaves com um selo ao vivo e um separador entre cada uma.

As manchetes rolam da direita para a esquerda em faixas suaves com um separador temático após cada uma, e faixas empilhadas de tipo grande as mantêm claras para visualização à distância. Preenche a tela, fica no meio, se encaixa em um canto como um quadrado pequeno ou uma linha, ou corre como uma faixa ao longo de uma borda. Você define as manchetes em ordem, escolhe uma rolagem lenta, normal ou rápida, ajusta essa velocidade por porcentagem, adiciona um rótulo curto, mostra um ponto ao vivo ao lado e exibe o cartão apenas enquanto houver manchetes.

Cartão ao vivo

Este cartão é desenhado no seu navegador pelo mesmo código que os Players executam, com dados de exemplo.

Categoria: Mensagens. Etiquetas: Notícias e anúncios, Saguões e recepção, Lojas.

Layouts

Este cartão principal se encaixa em qualquer layout: tela cheia, centro, largo, canto, chip, faixa ou qualquer retângulo livre.

Layouts: cheio, centro, largo, canto, chip, faixa. Formas: paisagem, retrato, quadrado, faixa.

Layouts, temas e publicação de cartões. Veja os cartões.

Dados e privacidade

Este cartão usa suas propriedades configuradas e dados ao vivo do cartão.

Propriedades

Para tema, fundo, destaque e posição, veja Propriedades comuns.

Defina as propriedades estáticas nos params do cartão ao criá-lo. O documento de dados dele contém apenas propriedades dinâmicas. Linhas aninhadas descrevem o conteúdo da propriedade pai.

Propriedades estáticas

NomeTipoPadrãoValores e limitesDescrição
speedstring"normal""slow", "normal", "fast"
speedPercentinteger100mínimo: 10; máximo: 200Porcentagem da velocidade selecionada; 75 rolagens a três quartos dessa predefinição.
labelstring""maxLength: 16A sobrancelha: um nome curto para as manchetes. Com live e sem etiqueta, lê-se Ao vivo.
livebooleanfalseMostra um ponto ao vivo ao lado do rótulo.
presencestring"always""always", "items"items mostra o cartão apenas enquanto houver itens; um ticker vazio sai.
backgroundColorstring, nulonullpadrão: "^#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$"Substitui o fundo e a placa do cartão por uma cor plana ordenada por CSS. #RRGGBBAA fornece opacidade. background none tem precedência.
textColorstring, nulonullpadrão: "^#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$"Substitui as cores do texto principal e secundário. As cores de destaque e status semântico mantêm seus papéis.

Propriedades dinâmicas

NomeTipoPadrãoValores e limitesDescrição
itemsarray[]maxItems: 50As manchetes, em ordem: cada uma uma string ou um objeto com seu texto e opcionalmente uma fonte e um instante ISO 8601. Uma faixa, centro e tela cheia mostram a fonte e sua idade em linha.

Exemplo de tela

Salve as propriedades estáticas como params.json e crie o cartão. O resultado traz o id crd_ dele.

{
  "theme": "neomustard"
}
screenrig card create --type ticker --major 1 --file params.json

Adicione este item aos primitives de uma página da playlist, com esse id no lugar do id do exemplo. Publique a playlist e atribua uma tela.

{
  "id": "ticker",
  "primitive": "card",
  "card": "crd_01EXAMPLECARD000000000",
  "layout": "full",
  "content_fit": "fill"
}

Escrever dados ao vivo

Escreva o documento no cartão depois de criá-lo e depois substitua-o para atualizar a tela sem republicar. O cartão verifica cada gravação contra suas propriedades dinâmicas e recusa um documento que ele rejeita. Use o mesmo projeto da playlist.

Salve o documento como card-data.json. O CLI lê o documento em si, sem invólucro:

{
  "items": []
}
screenrig card data put crd_01EXAMPLECARD000000000 --file card-data.json

Ou chame a API diretamente. A API envolve o mesmo documento em um campo document. Um token de agente já nomeia seu projeto, então nenhum cabeçalho de projeto é enviado; se você enviar ScreenRig-Project, ele deve corresponder ao projeto do token. Forneça sua autorização de API pelo ambiente; veja Autenticação da API.

curl --request PUT "https://api.screenrig.ai/api/cards/crd_01EXAMPLECARD000000000/data" \
  --header "Authorization: Bearer $SCREENRIG_TOKEN" \
  --header "Content-Type: application/json" \
  --data '{"document":{"items":[]}}'