stat_group

Bir bakışta okunmaya değer sayılar. stat_group, güncellendikçe hiçbir şey oynamasın diye tablo rakamları kullanarak isteğe bağlı değişimlerle birlikte en fazla altı etiket/değer çiftini yerleştirir.

En fazla üç tanesi alanı eşit bir şerit olarak paylaşır. Üçten fazlası alt satıra geçer; çünkü telefonda dört eşit sütun, kesilmiş dört sayı demektir.

as_of (ofsetli ISO 8601), anlık bir görüntü niteliğindeki sayıları işaretler ve “as of 14:02” şeklinde çizilir (Flutter 0.40.0, Web 0.17.0).

Harcanan$1,284Tem'e kıyasla +%18

Siparişler9Tem'e kıyasla +2

Kaydedildi$96Temmuz ile aynı

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.

Ne zaman kullanılmamalı

Bunu bir trend göstermek için kullanmayın. Oklu tek bir sayı, altı aylık veriden daha azını anlatır: chart bileşenini kullanın.

Bir limite karşı bir değer göstermek için de kullanmayın. “15 GB” yanındaki “8.2 GB”, okuyucuyu bölme işlemi yapmaya zorlar; progress ise oranı gösterir.

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
`items`	array	Evet	1 ila 6 öğe.
`items[].label`	string	Evet	1 ila 60 karakter. Büyük harfle render edilir.
`items[].value`	string	Evet	1 ila 30 karakter. Sizin tarafınızdan biçimlendirilir.
`items[].delta`	string	Hayır	En fazla 20 karakter.
`items[].trend`	`up` \| `down` \| `flat`	Hayır	`up` ve `down` bir ok glifi çizer, asla bir renk çizmez. `flat` hiçbir glif çizmez.
`as_of`	string	Hayır	Farkıyla birlikte ISO 8601 (`2026-10-10T09:30:00+03:00`) veya `Z`.

Ağ üzerinde

{
  "id": "blk_05",
  "type": "stat_group",
  "fallback_text": "Spent $1,284 across 9 orders, saving $96.",
  "props": {
    "items": [
      {
        "label": "Spent",
        "value": "$1,284",
        "delta": "18%",
        "trend": "up"
      },
      {
        "label": "Orders",
        "value": "9",
        "delta": "2",
        "trend": "up"
      },
      {
        "label": "Saved",
        "value": "$96",
        "delta": "no change",
        "trend": "flat"
      }
    ]
  }
}

Etkileşim

Yoktur. stat_group bir göstergedir ve etkileşimli prop'ları yoktur.

Durumlar

Durum	SDK'nın çizdiği içerik
Yükleme	Aynı eşit şeritte üç etiket ve değer yer tutucu çifti.
Boş	Boş bir `items` dizisi, alanın içinde `fallback_text` işler.
Uzun değerler	Değer, alt satıra geçmeden önce üç nokta ile kısaltılır; uzun bir sayının kendi değişimini alanın dışına asla itmemesi için değişim, yanına gelmek yerine altına yerleşir.

Erişilebilirlik

trend, kırmızı veya yeşil bir ton yerine bir ok olarak çizilir; çünkü yalnızca renge dayalı bir değişim değeri, renk körü kullanıcıların üçte biri için okunamazdır. Yön içeren bir değişim değeri bunu sözcüklerle seslendirir: “%18, yukarı”. flat bir değişim ise yalnızca sayıyı seslendirir.

Etiketler tek başlarına zor okunan büyük harfli parçalar olduğundan, fallback_text sayıları bir cümle içinde belirtmelidir.