comparison

Yan yana. comparison, iki ila dört ögeyi (ayakkabılar, planlar, oteller, telefonlar) aynı satırlarda hizalar; böylece “hangisi daha hafif” sorusu iki liste yerine tek bir satır boyunca okunarak yanıtlanır.

Her satır kendi etiketini değerlerin üzerine yerleştirir; böylece bir telefonda dört öge olsa bile bir değer tüm sütunu kaplar ve hiçbir şey yana kaydırılmaz. Ögelerin kendi başlığı kaydırılarak ekrandan çıktığında, satırlar akıp giderken adları en üstte sabit kalır.

Aero Glide 2$129Trail Circuit$149

Ağırlık248 g296 g

Drop8 mm6 mm

Su geçirmez—

Vurgulanan: kendi satırındaki en iyisi.

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

Flutter SDK ile 0.40.0 ve Web SDK ile 0.17.0 sürümünden itibaren yerel olarak render edilir. Bunu bildirmeyen bir derlemeye asla sunulmaz.

En iyi değer ve görüş

best_index, bir satırdaki en iyi değeri yalnızca verinin bunu ölçülebilir şekilde en iyi kıldığı durumlarda işaretler: en düşük fiyat, en fazla depolama alanı, en hafif ayakkabı. Kullanıcının hangisini satın alması gerektiği bir görüştür ve bir görüş tablonun altında, summary içinde kelimelerle yer alır.

kind: "check" satırları "yes" veya "no" değerlerini tutar ve ✓ ile — olarak çizilir.

Ne zaman kullanılmamalı

Tek bir ögenin ayrıntıları için kullanılmaz, bunun için key_value vardır. Sütunları paylaşan çok sayıda kayıt için kullanılmaz, bunun için table vardır. Eski plan_comparison bileşeninin yerini alır: planlar ögelerdir, özellikler ise check satırlarıdır.

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 80 karakter.
`items`	array	Evet	2 ila 4 öğe.
`items[].title`	string	Evet	1 ila 60 karakter.
`items[].subtitle`	string	Hayır	En fazla 80 karakter.
`items[].image_url`	string	Hayır	Yok
`items[].price`	string	Hayır	En fazla 30 karakter.
`items[].badge`	string	Hayır	En fazla 24 karakter.
`items[].action`	action	Hayır	`{ 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.
`rows`	array	Evet	1 ila 12 öğe.
`rows[].label`	string	Evet	1 ila 40 karakter.
`rows[].values`	string[]	Evet	Her biri en fazla 60 karakterlik 2 ila 4 dize.
`rows[].best_index`	integer	Hayır	0 ila 3.
`rows[].kind`	`text` \| `check`	Hayır	Yok
`summary`	string	Hayır	En fazla 200 karakter.

Ağ üzerinde

{
  "id": "blk_70",
  "type": "comparison",
  "fallback_text": "Aero Glide 2 is lighter; Trail Circuit is waterproof.",
  "props": {
    "items": [
      { "title": "Aero Glide 2", "price": "$129", "image_url": "https://…" },
      { "title": "Trail Circuit", "price": "$149", "image_url": "https://…" }
    ],
    "rows": [
      { "label": "Weight", "values": ["248 g", "296 g"], "best_index": 0 },
      { "label": "Drop", "values": ["8 mm", "6 mm"] },
      { "label": "Waterproof", "values": ["no", "yes"], "kind": "check" }
    ],
    "summary": "On the road the Aero Glide is lighter and softer; on wet trails the Trail Circuit grips."
  }
}

Etkileşim

Bir yanıt sayfasında, bir action içeren bir ögenin başlığına (resim, başlık, fiyat) dokunmak, tıpkı bir ürün kartında olduğu gibi onu detayına açar; bir bağlantı aksiyonu ise bunun yerine bağlantıyı açar. subtitle, başlığın altında tek bir satırdır ve badge, kısa bir vurgu işaretidir (“Çok satan”). Satırlar bir göstergedir.

Erişilebilirlik

Gerçek bir tablo: ögeler sütun başlıklarıdır, her satırın etiketi kendi satır başlığıdır ve en iyi değer en iyi olarak seslendirilir.