OudsFlag class

A UI element that displays a country or region flag identified by its ISO 3166-1 alpha-2 countryCode.

Purpose

The flag is purely decorative — it identifies a country or region visually and must never serve as a functional indicator (e.g. it must not represent a language choice).

Size

A flag always renders at 67 × 50 dp (base dimensions). These values are not fixed during user zoom: they are multiplied by the system text scale factor so the flag grows proportionally with the user's zoom level — in compliance with OUDS accessibility guidelines.

Assets

SVG flag assets are bundled inside ouds_core under assets/flags/<code>.svg (e.g. assets/flags/fr.svg). The countryCode is case-insensitive — 'FR' and 'fr' both resolve to the French flag. An unknown code renders an empty space of the correct scaled size.

Semantics

Flags are always excluded from the accessibility tree (decorative). The country name must be provided through a sibling text label in the UI (e.g. the OudsListItem.label next to the flag).

Example:

OudsFlag('fr')
OudsFlag('US')   // case-insensitive

Example — inside a list item:

OudsListItem(
  label: 'France',                              // country name in the label
  leading: OudsListItemLeadingFlag(OudsFlag('fr')),
)