key_value

Bir şeyin ne olduğu. key_value, her satırda bir etiket ve bir değerle, siparişin kendi olgularını sunarak “1042 numaralı siparişi anlat” sorusunu yanıtlar.

Vardır çünkü alternatifi bir paragraftır. Düz metne gömülmüş bir sevkiyat tarihinin okunması gerekir; kendi satırındaki aynı tarih ise hemen bulunur.

Sipariş 1042

Verildi21 Ağu

ÜrünlerAero Glide 2, 43 numara

DurumKargoya verildi

Ekran görüntüsü değildir; tarayıcınızda SDK'nın kendi boyut ve renkleriyle canlı olarak çizilir.

Flutter SDK ve Web SDK ile, her ikisi de 0.1.0 sürümünden itibaren yerel olarak render edilir.

copy, satırın sonuna bir kopyalama butonu yerleştirir (rezervasyon kodu, hesap numarası) ve her zaman değerin tamamını kopyalar. masked, yalnızca o çizim için geçerli olmak üzere, dokunulana kadar yalnızca son dört karakteri gösterir. tone (success, warning, error, neutral), değeri renklendirir; renk seslendirilmez, bu nedenle değerin kendi sözcükleri durumu taşımalıdır (“Ödendi”, “Gecikmiş”). range_label, bir sonucun altına bir referans aralığı koyar (“4.0–5.6”). Flutter 0.40.0 ve Web 0.17.0 sürümlerinden itibaren.

Ne zaman kullanılmamalı

Aynı alanları paylaşan birden fazla şey için kullanmayın; bunun için table kullanılır: her biri bir tarih ve duruma sahip üç sipariş, her biri tek bir şeye ait üç olgu kümesi değil, bir tablodaki satırlardır.

Bir teslimatın ilerleme durumu için kullanmayın; bunun için order_tracker kullanılır. Toplanan paralar için de kullanmayın; bunun için receipt kullanılır. Fişin bir toplamı vardır ve toplam, okuyucunun yapmak zorunda kalmaması gereken bir aritmetiktir.

Props

Her blok ayrıca type ve 1 ila 300 karakterden oluşan zorunlu bir fallback_text taşır.

Prop	Tür	Zorunlu	Kısıtlamalar
`title`	string	Hayır	En fazla 120 karakter.
`rows`	array	Evet	1 ila 12 öğe.
`rows[].label`	string	Evet	1 ila 60 karakter.
`rows[].value`	string	Evet	1 ila 200 karakter.
`rows[].emphasis`	boolean	Hayır	Rampadan bir satır yukarı taşır.
`rows[].copy`	boolean	Hayır	Değerin yanında bir kopyalama butonu: bir hesap numarası, bir referans.
`rows[].masked`	boolean	Hayır	Dokunulana kadar son dört karakteri gösterilir.
`rows[].tone`	`success` \| `warning` \| `error` \| `neutral`	Hayır	Bir durum değerini renklendirir; durumu kelimeler ifade etmelidir.
`rows[].range_label`	string	Hayır	En fazla 40 karakter. Bir sonucun yanındaki referans aralığı; örneğin 4.0–5.6.
`cta`	object	Hayır	Yok
`cta.label`	string	Evet	1 ila 60 karakter.
`cta.action`	action	Evet	`{ kind: "reply", text }` veya `{ kind: "open_url", url }` veya `{ kind: "navigate", route }` veya `{ kind: "call", phone }` veya `{ kind: "copy", text }` veya `{ kind: "add_to_calendar", title, starts_at }`. Bkz. Actions.

Ağ üzerinde

{
  "id": "blk_21",
  "type": "key_value",
  "fallback_text": "Order 1042, placed 21 August, one pair, shipped.",
  "props": {
    "title": "Order #1042",
    "rows": [
      { "label": "Placed", "value": "21 Aug" },
      { "label": "Items", "value": "Aero Glide 2, size 43" },
      { "label": "Status", "value": "Shipped", "emphasis": true }
    ],
    "cta": { "label": "Track it", "action": { "kind": "reply", "text": "Track order 1042" } }
  }
}

Etkileşim

İsteğe bağlı cta; copy: true olan bir satırın yanındaki kopyalama butonu (“Kopyalandı” ile teyit eder); ve yalnızca o çizim için geçerli olmak üzere, dokunulana kadar son dört karakterini gösteren masked değer. Geriye kalan her şey salt okunur bir göstergedir.

Durumlar

Durum	SDK'nın çizdiği
Loading	Gerçek satır yüksekliğinde etiket ve değer çubukları.
Long value	Değer alt satıra kayar ve sağa dayalı kalır; etiket asla kesilmez.
Empty	Boş bir `rows` dizisi, plaka içinde `fallback_text` alanını işler.

Erişilebilirlik

Her satır, etiketi ve ardından değeri gelecek şekilde seslendirilir; böylece eşleşme tek geçişte sesli okunurken bozulmaz. emphasis, ağırlığı değiştirir, hiçbir zaman yalnızca rengi değil.

emphasis özelliğini en fazla bir kez kullanın. Her satırın vurgulandığı bir sayfada yanıt bulunmaz, yalnızca birbirine denk on iki olgu bulunur.