Ce guide explique comment utiliser la navigation par clavier par défaut telle qu'elle est actuellement implémentée dans Blockly.
.Utiliser la navigation au clavier
Pour que la navigation au clavier soit efficace, l'utilisateur doit pouvoir effectuer les tâches suivantes:
- Se déplacer dans l'espace de travail
- Connecter des blocs dans un espace de travail
- Ajouter un bloc à l'espace de travail
- Dissocier des blocs
- Parcourir la boîte à outils
- Parcourir le menu déroulant
- Insérer des blocs depuis le volet déroulant
La section ci-dessous explique comment la navigation par clavier par défaut de Blockly effectue ces tâches.
Activer la navigation au clavier
Un utilisateur peut activer et désactiver la navigation au clavier en appuyant sur Maj+Ctrl+k.
Lorsque la navigation au clavier est activée pour la première fois, une ligne rouge clignotante s'affiche sur l'espace de travail. Il s'agit du curseur. Il affiche la position actuelle de l'utilisateur et se met à jour à mesure que l'utilisateur navigue dans l'espace de travail.
Appuyer sur Entrée crée une ligne bleue à l'emplacement actuel représentant le repère de l'utilisateur. Un repère indique l'emplacement cible pour l'insertion du bloc. Il ne s'actualise pas lorsque vous déplacez le curseur dans l'espace de travail.
Utiliser le curseur par défaut
L'espace de travail est composé d'entrées, de champs, de connexions, de blocs et de coordonnées. Le curseur par défaut se déplace dans l'espace de travail en divisant tous les composants en différents niveaux.
Pour passer d'un niveau à l'autre, utilisez les touches A et D. Pour parcourir un niveau, utilisez les touches W et S.
Niveau de l'espace de travail
Activez le mode de navigation au clavier en appuyant sur Maj+Ctrl+k. Le curseur est alors placé sur l'espace de travail ou sur le premier bloc de l'espace de travail. Si le curseur se trouve sur un bloc, déplacez-le au niveau de l'espace de travail en appuyant deux fois sur A.
Pour déplacer le curseur dans l'espace de travail, appuyez sur Maj+WASD. Pour accéder au niveau de la pile, utilisez la touche D.
Niveau de la pile
Au niveau de la pile, vous pouvez passer d'une pile de blocs à une autre dans l'espace de travail à l'aide des touches W et S. À ce niveau, le curseur est représenté par un rectangle rouge plein autour de tous les blocs d'une pile. Pour accéder au premier bloc de la pile sélectionnée, utilisez la touche D.
Niveau de blocage et de connexion
Ce niveau contient un bloc et toutes les connexions externes au bloc. Le curseur par défaut est défini pour ignorer le bloc s'il existe une connexion précédente ou de sortie. Si aucun de ces éléments n'existe, le curseur se déplace vers le bloc, comme illustré ci-dessous.
Les trois connexions externes possibles sont présentées ci-dessous.
Au niveau du bloc et de la connexion, vous pouvez parcourir les connexions extérieures à l'aide des touches W et S. À ce niveau, le curseur est représenté par un contour rouge clignotant de la connexion actuelle. Pour accéder au premier champ ou à la première entrée d'un bloc, appuyez sur D.
Champs et niveau d'entrée
Ce niveau contient tous les champs et entrées du bloc. Vous trouverez ci-dessous des exemples de champs et d'entrées.
À ce niveau, vous pouvez parcourir les champs et les entrées modifiables du bloc actuel à l'aide des touches W et S. Pour un champ, le curseur est un rectangle rouge uni. Pour une entrée, le curseur est une pièce de puzzle rouge clignotante. Lorsque le curseur se trouve sur une entrée, appuyez sur D pour accéder au bloc connecté.
Lorsque le curseur se trouve sur un champ, appuyez sur Entrée pour le modifier.
Connecter des blocs dans l'espace de travail
- Accédez à votre connexion cible à l'aide des touches WASD.
- Marquer la connexion à l'aide de la touche Entrée
- Accédez à un point de connexion valide à l'aide des touches WASD.
- Connectez les deux blocs à l'aide de la touche I (insertion).
Déplacer un bloc dans l'espace de travail
Normalement, dans Blockly, vous déplacez un bloc vers l'espace de travail en le saisissant, en le faisant glisser jusqu'à la position souhaitée, puis en le relâchant. Avec les raccourcis clavier, vous marquez votre emplacement cible, accédez au bloc que vous souhaitez déplacer, puis lui indiquez de le faire.
- Accéder à une position dans l'espace de travail à l'aide des touches Maj+WASD
- Marquez cet emplacement dans l'espace de travail à l'aide de la touche Entrée.
- Accédez au bloc que vous souhaitez déplacer à l'aide des touches WASD.
- Déplacez le bloc à l'emplacement marqué à l'aide de la touche I.
Blocs détachables
Normalement, dans Blockly, vous déconnectez deux blocs en saisissant le bloc inférieur et en le faisant glisser loin du bloc parent. Avec les raccourcis clavier, vous pouvez dissocier des blocs en appuyant sur X avec le curseur sur la connexion que vous souhaitez interrompre.
- Accédez à la connexion que vous souhaitez interrompre à l'aide des touches WASD.
- Couper la connexion avec X
Insérer un bloc à partir de la boîte à outils
- Appuyez sur la touche T pour ouvrir la boîte à outils.
- Utilisez les touches W et S pour parcourir les catégories.
- Appuyez sur la touche D pour accéder aux blocs dans le volet.
- Parcourez les blocs à l'aide des touches W et S.
- Appuyez sur la touche Entrée pour insérer un bloc depuis le volet.
Expérimentation
Nous pensons que les utilisateurs peuvent être intéressés par quatre principaux domaines d'expérimentation:
- Mappages de touches: quelles touches doivent être mappées à quelles actions.
- Text for screen readers/Logging/Warnings (Texte pour les lecteurs d'écran/Journalisation/Avertissements) : indique comment un lecteur d'écran doit lire les positions des curseurs, ainsi que les erreurs ou avertissements.
- Navigation dans l'espace de travail: façon dont un utilisateur navigue dans les différents blocs, champs, entrées et connexions de l'espace de travail.
- Apparence du curseur: apparence du curseur et du repère.
Pour en savoir plus sur l'utilisation de ces API, consultez l'atelier de programmation Navigation au clavier Blockly.
Si vous souhaitez tester d'autres domaines dans lesquels nous pourrions vous aider, veuillez remplir ce formulaire.
Questions fréquentes
Q: Pourquoi n'avez-vous pas utilisé les touches fléchées pour la navigation au clavier ?
A: Les lecteurs d'écran utilisent généralement les touches fléchées. Nous ne voulions pas interférer avec cela et avons donc choisi d'utiliser les touches WASD.
Toutefois, nous sommes conscients que chacun a des besoins différents. C'est pourquoi nous vous recommandons vivement de créer un moyen simple de modifier les mappages de touches.
Q: Cela semble assez compliqué. Pourquoi avons-nous besoin de différentes couches ?
A: Lorsque nous avons réfléchi à la navigation au clavier, nous avions besoin d'un moyen structuré de nous déplacer entre les différents blocs, connexions, champs, entrées et coordonnées de l'espace de travail.
En interne, nous le représentons avec une arborescence syntaxique abstraite (AST). L'implémentation par défaut du curseur ne s'éloigne pas beaucoup de ce modèle.Il s'agit d'une intention délibérée afin de permettre aux développeurs de mieux comprendre l'architecture sous-jacente. Il existe d'autres curseurs qui pourraient être plus faciles à comprendre pour un utilisateur final.
Limites
La navigation vers des composants non bloquants (par exemple, une corbeille, des boutons de zoom et des boutons de fenêtre pop-up) n'est pas encore possible. Pour en savoir plus sur les limites, consultez la liste des bugs de navigation au clavier ouverts.