screenRIG
EntrarComece

Cartão de código QR

Qualquer ação como um código nítido e escaneável em seu próprio cartão: um link, uma chamada, Wi-Fi, um contato, um evento ou um link para app store.

Um código nítido para um link, Wi-Fi, um contato, um evento ou uma loja de aplicativos fica em papel claro com módulos escuros e nítidos, para que escaneie limpo de longe. Ele preenche a tela, fica no meio, se encaixa em um canto, corre como uma linha em um canto ou se estende como uma faixa ao longo de uma borda. Você define o que o código carrega, adiciona uma legenda e uma linha menor abaixo, escolhe as cores da tinta e do papel e as formas do módulo e do olho localizador, e adiciona um logo em tamanho pequeno ou grande ou um ícone, com um chamado à ação emoldurado.

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: Códigos QR, Lojas, Restaurantes e cafés, Saguões e recepção.

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
eccstring"M""L", "M", "Q", "H"
inkstring"#111111"padrão: "^#[0-9A-Fa-f]{6}$"Cor do módulo. Mantenha escuro sobre papel claro.
paperstring"#FFFFFF"padrão: "^#[0-9A-Fa-f]{6}$"Cor do cartão atrás do código.
styleobjectadditionalProperties: falseFormas do módulo e do olho localizador; cada um usa o padrão do tema.
style.modulesstring"square", "rounded", "dots", "connected"
style.eyesstring"square", "rounded", "circle", "leaf"
logonulo, stringnullnull, "activity-01", "air-vent", "airplane-01", "alert-01", "alert-02", "american-football", "analytics-up", "apple", "arrow-down-01", "arrow-down-right-01", "arrow-up-01", "arrow-up-right-01", "award-01", "baseball", "basketball-01", "battery-full", "bell-ring", "bicycle", "birthday-cake", "bitcoin", "bus-01", "calendar-03", "calendar-04", "calendar-add-01", "calendar-check", "call-02", "camera-01", "cancel-circle", "car-01", "champion", "chart-decrease", "chart-increase", "checkmark-circle-02", "clock-01", "clock-02", "cloud", "cloud-angled-rain", "cloud-angled-zap", "cloud-big-rain", "cloud-drizzle", "cloud-fog", "cloud-hailstone", "cloud-snow", "coffee-01", "coffee-02", "contact-01", "container-truck-01", "cricket-bat", "crown", "delivery-truck-01", "dices", "discord", "discount-tag-01", "dollar-02", "door-closed-locked", "door-open", "drink", "droplet", "ethereum", "euro", "exchange-01", "facebook-01", "factory", "fast-wind", "favourite", "ferry-boat", "fire", "fire-02", "first-aid-kit", "flag-01", "flag-02", "flash", "flower-01", "football", "gauge", "gift", "git-branch", "globe-02", "google", "hand-prayer", "heart", "help-circle", "home-01", "hourglass", "humidity", "ice-hockey", "information-circle", "instagram", "lamp-01", "lantern", "leaf-01", "leaf-02", "lightbulb", "link-01", "linkedin-01", "litecoin", "location-01", "location-04", "mail-01", "medal-first-place", "medical-mask", "meeting-room", "megaphone-01", "message-01", "money-exchange-02", "moon-02", "moon-cloud", "moon-star", "music-note-01", "navigation-03", "new-releases", "new-twitter", "news", "news-01", "noodles", "package-delivered", "parking-area-square", "party", "party-popper", "pause-circle", "percent-circle", "pinterest", "pizza-01", "play-circle", "play-store", "podium", "pound", "pumpkin", "qr-code", "qr-code-01", "queue-01", "quote-down", "quote-up", "ranking", "restaurant-01", "rocket-01", "rss", "running-shoes", "sale-tag-01", "security-check", "shop-sign", "shopping-bag-01", "siren", "smart-phone-01", "snapchat", "snowflake", "sparkles", "spotify", "star", "star-half", "star-off", "stop-circle", "store-01", "sun-03", "sun-cloud-02", "sunrise", "sunset", "swimming", "tag-01", "target-02", "temperature", "tennis-ball", "thermometer", "thermometer-cold", "thermometer-warm", "threads", "ticket-01", "tiktok", "time-quarter-pass", "timer-01", "tornado-02", "train-01", "tram", "trophy", "tropical-storm", "tsunami", "user-02", "user-group", "user-love-01", "vegetarian-food", "volleyball", "volume-high", "vote", "walking", "warehouse", "waves", "whatsapp", "wheat-off", "wifi-01", "wifi-full-signal", "wifi-lock", "wrench-01", "yen", "youtube"Um ícone centralizado em um suporte de papel recortado; null para nenhum. Eleva ECC para Q (H quando grande).
logoScalestring"small""small", "large"
framestring"none""none", "card", "ticket", "badge"Um quadro contendo o chamado para ação.
textlessbooleanfalseApenas código: sem legenda, detalhe, rótulo ou chamada para ação, em todas as visualizações.
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
valuestring""maxLength: 1024Um payload bruto. Quando definido, tem prioridade sobre action.
actionobjectadditionalProperties: falseConstrói o payload quando value está vazio. Campos por tipo: url {url, utm}; phone {number}; sms {number, message}; email {to, subject, body}; wifi {ssid, password, security, hidden}; vcard {first, last, org, title, phone, email, url, address}; event {title, start, end, location, description}; geo {latitude, longitude, label}; whatsapp {number, message}; social {network, handle}; review {placeId}; app {ios, android}; text {text}.
action.typestring"url", "phone", "sms", "email", "wifi", "vcard", "event", "geo", "whatsapp", "social", "review", "app", "text"; Obrigatório
action.urlstringmaxLength: 1024
action.utmobjectadditionalProperties: false
action.utm.sourcestringmaxLength: 100
action.utm.mediumstringmaxLength: 100
action.utm.campaignstringmaxLength: 100
action.utm.contentstringmaxLength: 100
action.utm.termstringmaxLength: 100
action.numberstringmaxLength: 40
action.messagestringmaxLength: 300
action.tostringmaxLength: 200
action.subjectstringmaxLength: 200
action.bodystringmaxLength: 600
action.ssidstringmaxLength: 64
action.passwordstringmaxLength: 64
action.securitystring"WPA", "WEP", "nopass"
action.hiddenboolean
action.firststringmaxLength: 80
action.laststringmaxLength: 80
action.orgstringmaxLength: 120
action.titlestringmaxLength: 120
action.phonestringmaxLength: 40
action.emailstringmaxLength: 200
action.addressstringmaxLength: 300
action.startstringmaxLength: 40
action.endstringmaxLength: 40
action.locationstringmaxLength: 200
action.descriptionstringmaxLength: 600
action.latitudenumbermínimo: -90; máximo: 90
action.longitudenumbermínimo: -180; máximo: 180
action.labelstringmaxLength: 120
action.networkstring"instagram", "facebook", "x", "linkedin", "tiktok", "youtube", "threads"
action.handlestringmaxLength: 80
action.placeIdstringmaxLength: 200
action.iosstringmaxLength: 1024
action.androidstringmaxLength: 1024
action.textstringmaxLength: 1024
captionstring""maxLength: 80
detailstring""maxLength: 120Linha pequena sob a legenda; vazio mostra o valor quando é uma URL.
ctastring""maxLength: 40Chamada para ação; um quadro sem nenhuma exibe "Escaneie-me".

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 qr-code --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": "qr-code",
  "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:

{
  "value": "",
  "action": {
    "type": "url"
  },
  "caption": "",
  "detail": "",
  "cta": ""
}
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":{"value":"","action":{"type":"url"},"caption":"","detail":"","cta":""}}'