Vlastní přístupný název místo automaticky odvozeného textu (Flutter)

Semantics umožňuje libovolnému widgetu přidat vlastní přístupný text. Háček je v tom, jak se tenhle text sloučí s texty potomků uvnitř — bez pochopení pravidel slučování snadno skončíte s jiným výsledkem, než jste čekali.

1. Jak na to — vlastní text sloučený s potomky

Semantics(
  container: true,
  label: 'Hodnocení 4 z 5 hvězdiček',
  child: Row(
    children: [/* pět widgetů s ikonami hvězdiček */],
  ),
)

container: true zajistí, že vznikne vlastní, izolovaný uzel — jinak riskujete, že se výsledný text sloučí až s nějakým vzdáleným předkem.

2. Jak na to — úplná náhrada, potomci se ignorují

Semantics(
  label: 'Zavřít dialog',
  excludeSemantics: true,
  child: Icon(Icons.close),
)

Proč to takhle je

• Bez container: true se label sloučí s texty potomků (oddělovačem je nový řádek, pořadí rodič → potomek), ale výsledný uzel může vzniknout mnohem výš ve stromu, než čekáte — konkrétně na nejbližším widgetu, který sám tvoří „hranici" stromu, což nemusí být ten, co jste obalili. container: true tohle sloučení uzamkne na místě, kde ho chcete vy.
• excludeSemantics: true udělá přesný opak sloučení — potomci se do přístupnostního stromu vůbec nezanoří, ohlásí se jen text, který jste zadali sami. Hodí se, když chcete přístupný text úplně nahradit (např. u ikony bez viditelného textu), ne doplnit.
• Obě chování jsou zdokumentovaná jako záměrná součást API, ne vedlejší efekt — jde jen o to vybrat tu, kterou situace vyžaduje.

Pravidla

• WCAG 4.1.2 (Název, role, hodnota) — přístupný název musí odpovídat tomu, co prvek skutečně dělá.
• WCAG 1.3.1 (Informace a vztahy) — obsah a jeho vztahy nesmí záviset jen na vizuálním uspořádání.