リーダーボード、スケジュール、価格表は、フォーマットされた列、ランク、強調表示された行で清潔なテーブルとして表示され、部屋全体で読みやすくなっています。画面全体に表示され、中央に配置され、コーナーに収まり、1行または端に沿ったバンドとして動作します。タイトル、列と行、強調行とその色、リーダーバンド、ソート順、ページごとの行数とページタイミングを設定します。
ライブカード
カテゴリ: オペレーション。タグ: チャートとゲージ、数値と指標、オフィスと職場。
レイアウト
このコアカードはすべてのレイアウトに適合します：全画面、中央、ワイド、コーナー、チップ、ストリップ、または任意の自由な長方形。
レイアウト：フル、センター、ワイド、コーナー、チップ、ストリップ。フォーム：ランドスケープ、ポートレート、スクエア、ストリップ。
データとプライバシー
このカードは設定されたプロパティとライブカードデータを使用します。
プロパティ
テーマ、背景、アクセント、位置については共通プロパティを参照してください。
カードの作成時に、静的プロパティをカードのparamsに設定します。データドキュメントは動的プロパティのみを保持します。ネストされた行は親プロパティの内容を説明します。
静的プロパティ
| 名前 | タイプ | デフォルト | 値と制限 | 説明 |
|---|---|---|---|---|
title | string | "" | maxLength：60 | |
columns | array | minItems：1；maxItems：8；必須 | ||
columns[].key | string | maxLength：40；必須 | ||
columns[].label | string | maxLength：30；必須 | ||
columns[].align | string | "auto" | "auto", "left", "right", "center" | 自動は数字を右揃え、テキストを左揃えにします。 |
columns[].format | string | "text" | "text", "number", "percent", "currency", "delta" | パーセントは数値に % 記号を付けて表示（12.5 → 12.5%）。 |
columns[].decimals | 整数、null | null | 最小値：0；最大値：4 | null：数値 0、パーセント 1、通貨 2、差分 1。 |
columns[].width | 数値、null | null | 最小値：0.2；最大値：10 | 相対幅。nullは列のサイズを内容に合わせます。 |
columns[].priority | 整数、null | null | 最小値：1；最大値：8 | 小ボックスが保持する列、1が最初。中央カードで3列超は最初と残りの最重要列（ソート列、なければ最低優先番号）を保持。 |
highlight | 整数、文字列、null | null | ソート後の行インデックス（0が最初）または最初の列の値。 | |
striped | boolean | true | ||
showRank | boolean | false | ||
sortBy | string | "" | maxLength：40 | |
sortDesc | boolean | false | ||
maxRows | integer | 0 | 最小値：0；最大値：50 | 1ページあたりの行数。0は収まるだけ表示します。ページは壁掛け時計で切り替わります。 |
pageSeconds | integer | 10 | 最小値：5；最大値：120 | |
currency | string | "$" | maxLength：4 | |
leader | boolean | false | 最初の行をテーブルの上のリーダーバンドとして表示します：順位、大きな名前、主要数値をヒーローとして。 | |
highlightTone | 文字列、null | null | パターン："^(#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?|base|text|muted|faint|accent|accent2|accent3|onAccent|surface|surfaceStrong|stroke|highlight|danger|warning|success|cool|warm)$" | 強調表示行のパレットキーまたは #RRGGBB カラー。null はテーマのアクセント。 |
backgroundColor | 文字列、null | null | パターン："^#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$" | カードの背景とプレートをフラットなCSS順序の色で上書きします。#RRGGBBAAは不透明度を指定します。background noneが優先されます。 |
textColor | 文字列、null | null | パターン："^#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$" | メインとセカンダリのテキスト色を上書きします。アクセントと意味的な状態色はそのまま維持されます。 |
動的プロパティ
| 名前 | タイプ | デフォルト | 値と制限 | 説明 |
|---|---|---|---|---|
rows | array | minItems：1；maxItems：50；必須 |
キャンバス例
静的プロパティを params.json として保存し、カードを作成します。結果にはその crd_ ID が含まれます。
{
"theme": "neomustard",
"columns": [
{
"key": "Example",
"label": "Example"
}
]
}screenrig card create --type table --major 1 --file params.jsonこのアイテムをプレイリストページのprimitivesに追加し、サンプルの ID をその ID に置き換えます。プレイリストを公開してスクリーンに割り当ててください。
{
"id": "table",
"primitive": "card",
"card": "crd_01EXAMPLECARD000000000",
"layout": "full",
"content_fit": "fill"
}ライブデータを書き込む
カードを作成した後にドキュメントを書き込み、画面を再公開せずに更新するには置き換えます。カードは書き込みのたびに動的プロパティと照合し、受け付けないドキュメントは拒否します。プレイリストと同じプロジェクトを使用してください。
ドキュメントを card-data.json として保存します。CLIはラッパーなしでドキュメント自体を読み取ります。
{
"rows": [
{}
]
}screenrig card data put crd_01EXAMPLECARD000000000 --file card-data.jsonまたはAPIを直接呼び出します。APIは同じドキュメントをdocumentフィールドにラップします。エージェントトークンはすでにプロジェクト名を含むため、プロジェクトヘッダーは送信しません。ScreenRig-Projectを送信する場合はトークンのプロジェクトと一致する必要があります。API認証は環境変数で提供してください。詳細は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":{"rows":[{}]}}'