Sémantiques Jetpack Compose pour les agents IA

Introduction

Jetpack Compose dispose d'un mécanisme interne appelé l'Arbre Sémantique — une structure sémantique de votre interface utilisateur que les services d'accessibilité, les outils de test UI et les agents IA d'automatisation utilisent pour comprendre ce qui est affiché à l'écran.

Avec une conception Sémantique appropriée, les agents IA peuvent comprendre les éléments UI non pas comme "couleur, position et taille" mais comme "ce que fait ce bouton, ce qui se passe quand on appuie, et dans quel état il se trouve actuellement."

Attributs Sémantiques clés

contentDescription

Essentiel pour les éléments UI dont la signification ne peut pas être déduite visuellement — comme les boutons avec icône uniquement.

IconButton(
    onClick = onDelete,
    modifier = Modifier.semantics {
        contentDescription = "Supprimer"
    }
) {
    Icon(Icons.Default.Delete, contentDescription = null)
}

Les outils IA et d'accessibilité reconnaîtront ceci comme "bouton Supprimer (cliquable)."

role

Ajouter un role à l'interface personnalisée permet à l'IA de comprendre clairement le type d'interface.

Modifier.semantics {
    role = Role.Button
}

Un simple Box(clickable) s'enregistre comme "quelque chose de cliquable." Avec un role, il devient un type spécifique : Bouton, Interrupteur, Case à cocher, Onglet, etc.

stateDescription

Communique l'état actuel à l'IA.

Modifier.semantics {
    stateDescription =
        if (subscribed) "Abonné"
        else "Non abonné"
}

Au-delà de TalkBack, cela aide les agents IA à prendre des décisions basées sur l'état — comme "la lecture est en pause, donc appuyez sur le bouton play."

testTag

L'un des attributs les plus importants pour l'automatisation IA et les tests UI.

Modifier.testTag("login_button")

Assigner un identifiant unique permet à Compose UI Test, Appium, UIAutomator et les agents basés sur MCP de cibler les éléments de manière fiable.

Configuration pour l'intégration UIAutomator

Parce que Compose ne génère pas une hiérarchie de vues natives, UIAutomator ne peut pas référencer testTag par défaut. Ajoutez ceci à votre racine pour corriger cela :

Scaffold(
    modifier = Modifier.semantics {
        testTagsAsResourceId = true
    }
)

Cela rend les valeurs testTag disponibles comme IDs de ressources dans UIAutomator.

En pratique : La conception la plus lisible pour l'IA

Button(
    onClick = login,
    modifier = Modifier
        .testTag("login_button")
        .semantics {
            contentDescription = "Se connecter"
            role = Role.Button
        }
) {
    Text("Se connecter")
}

Regrouper une interface complexe en une seule signification

Pour une interface composée de plusieurs éléments — icônes, texte, badges — utilisez clearAndSetSemantics pour la présenter comme une unité cohérente :

Modifier.clearAndSetSemantics {
    contentDescription = "Ajouter l'article au panier"
    role = Role.Button
}

L'IA reçoit uniquement la signification logique, ignorant la complexité visuelle et la structure d'imbrication.

Ce que la conception Sémantique permet

1. Automatisation qui survit aux changements d'interface

L'identification basée sur testTag ne dépend pas des coordonnées, de l'OCR ou du texte. Si la position ou l'apparence d'un bouton change mais que le tag reste le même, l'automatisation ne se cassera pas.

2. Analyse de la signification de l'écran via MCP

Récupérer l'Arbre Sémantique vous permet de représenter les informations d'écran comme des données structurées légères :

[
  {"role": "Button", "label": "Se connecter", "enabled": true, "tag": "login_button"},
  {"role": "TextField", "label": "Adresse e-mail"}
]

3. Moins de dépendance aux captures d'écran, moins de tokens

L'analyse d'image consomme beaucoup de tokens. L'Arbre Sémantique transmet les mêmes informations comme données texte ultraléger. Particulièrement précieux pour les sessions d'automatisation longues ou le parcours complet de l'écran où la consommation de contexte importe.

4. L'IA comprend l'écran comme une machine à états

Avec stateDescription, l'IA peut déterminer l'état actuel et prendre des décisions contextuelles — "la lecture est arrêtée, donc appuyer sur play."

5. Génération automatique de cas de test

À partir d'informations Sémantiques comme "le bouton de connexion existe → appuyer dessus → l'écran d'accueil apparaît," vous pouvez dériver des transitions d'état et les utiliser pour générer automatiquement des cas de test.

L'équivalent Android d'ARIA sur le Web

L'Arbre Sémantique Compose est à Android ce que HTML / ARIA / DOM est au développement web. Les agents IA comprennent votre application non pas à travers son "interface visuelle" mais à travers son "DOM sémantique."

La force de Compose est qu'il vous permet de concevoir "l'apparence" et la "signification" séparément. C'est l'essence de la conception Sémantique — et le fondement de l'intégration IA.

Résumé

Si vous utilisez MCP, UIAutomator ou des agents IA, standardiser testTag et semantics dans vos composants est le fondement d'une automatisation fiable.