Présentation de l'interface utilisateur de l'extension VEX pour VS Code – Bibliothèque VEX

Cet article présente un aperçu de l'interface utilisateur de l'extension VEX pour Visual Studio Code. L'extension prend en charge le développement de projets C++ et Python pour les plateformes VEX IQ (2e génération), EXP et V5.

Extension VEX pour VS Code - Interface utilisateur

L'interface utilisateur de l'extension VEX pour Visual Studio Code est divisée en cinq zones principales : barre d'activité, barre latérale, éditeur, panneau de terminal et barre d'outils.

Capture d'écran montrant l'interface utilisateur complète de VEX dans VS Code. La barre d'activité et la barre latérale se trouvent sur le côté gauche de l'écran, la barre d'outils et le terminal se trouvent en bas de l'écran, et l'éditeur occupe le reste de l'écran.

Barre d'activité

La barre d'activité comporte une série d'icônes qui nous permettent de basculer entre les vues et nous fournissent des indicateurs contextuels supplémentaires pour le développement du projet VEX.

Barre d'activité VS Code avec l'extension VEX Robotics installée. La barre d'activité comporte des icônes permettant d'accéder rapidement à des actions utiles, comme la recherche, la gestion des extensions, le contrôle de version, et bien plus encore.

Les icônes couramment utilisées pour développer un projet VEX dans VS Code sont :

Icône de vue explorateur - Lorsque vous cliquez dessus, la vue explorateur s'ouvre dans la barre latérale.
Extensions Afficher l'icône - Lorsque vous cliquez dessus, la Extensions Afficher s'ouvre dans la barre latérale.
Icône de vue VEX - Lorsque vous cliquez dessus, la vue VEX s'ouvre dans la barre latérale.

Barre latérale

La barre latérale contient différentes vues qui nous permettent d'utiliser les outils intégrés à VS Code. Les vues de barre latérale courantes utilisées pour effectuer des tâches de développement de projet VEX sont Vue d'extension, Vue VEX, et Vue explorateur.

Vue d'extension

La vue Extension est utilisée pour installer et gérer les extensions dans VS Code. Pour développer des logiciels sur les plateformes VEX IQ (2e génération), EXP et V5, nous devons installer l'extension VEX, l'extension C/C++ et l'extension Python.

Pour obtenir des instructions étape par étape sur la façon d'installer l'extension VEX, l'extension C/C++, et l'extension Python dans VS Code, veuillez consulter cet article.

Vue des extensions VS Code affichant la liste des extensions installées. Chaque extension possède un menu de paramètres qui peut être ouvert ici, et une barre de recherche permet de trouver et de télécharger de nouvelles extensions.

Vue VEX

La vue VEX nous permet de développer des projets pour VEX IQ (2e génération), EXP et V5 dans VS Code. La vue VEX comprend trois catégories : ACTIONS DU PROJET, INFOS SUR L’APPAREIL VEX, et RETOUR D’INFORMATION VEX.

Vue VEX de VS Code affichant en haut les options de création et d'importation de projets, en bas le menu Informations sur le périphérique VEX et en bas un menu de commentaires.

ACTIONS DU PROJET
Les boutons situés sous ACTIONS DU PROJET permettent de créer un nouveau projet VEX ou d'importer un projet VEXcode existant.
Pour des instructions détaillées sur la création d'un projet VEX dans VS Code, veuillez consulter cet article pour V5, cet article pour EXP, et cet article pour IQ (2e génération).

Section Actions du projet de la vue Extension VEX. Cette section comporte deux boutons intitulés « Nouveau projet » et « Importer un projet ».

INFORMATIONS SUR LE PÉRIPHÉRIQUE VEX
La catégorie INFORMATIONS SUR LE PÉRIPHÉRIQUE VEX nous donne un aperçu du périphérique VEX connecté - un VEX Brain ou un contrôleur VEX.

Cette catégorie indique le type de périphérique VEX connecté et affiche les informations du système Brain, du port série, du programme téléchargé et des périphériques connectés aux ports intelligents du VEX Brain. Il nous permet de faire une capture d'écran de l'écran VEX Brain, de consulter le journal des événements VEX Brain, de définir le nom du cerveau et le numéro d'équipe, et d'effacer le programme utilisateur du VEX Brain.

Lorsqu'un VEX Brain est connecté à l'ordinateur, la catégorie INFORMATIONS SUR LE PÉRIPHÉRIQUE VEX indique si un contrôleur VEX est lié au VEX Brain et nous permet de mettre à jour le VEXos du VEX Brain si la version de VEXos du VEX Brain est obsolète.

Lorsqu'un contrôleur VEX est connecté à l'ordinateur, la catégorie INFORMATIONS SUR LE PÉRIPHÉRIQUE VEX indique si un VEX Brain est lié au contrôleur VEX et nous permet de mettre à jour le VEXos du contrôleur VEX si la version du VEXos du contrôleur VEX est obsolète.

Pour une description complète des informations sur l'appareil et de la façon d'utiliser les fonctionnalités sous VEX DEVICE INFO, veuillez consulter cet article.

RETOUR D'INFORMATION VEX
Nous pouvons soumettre des commentaires à VEX en saisissant le message dans la zone de texte sous RETOUR D'INFORMATION VEX et en cliquant sur le bouton ENVOYER
Pour obtenir des informations utiles sur l'utilisation de VEX FEEDBACK dans VS Code, veuillez consulter cet article.

Section « Commentaires VEX » de la vue Extension VEX. Cette section contient un formulaire offrant différentes options pour soumettre des commentaires à VEX.

Vue explorateur

La vue Explorateur est utilisée pour parcourir, ouvrir et gérer les fichiers et dossiers du projet VEX dans VS Code.

Vue Explorateur de VS Code permettant à l'utilisateur de naviguer dans les dossiers et les fichiers de son projet VEX. Les fichiers sont accompagnés d'icônes et de types de fichiers correspondants ; dans cet exemple, un fichier Python est sélectionné et son titre est main.py.

Éditeur

L'éditeur est la zone principale permettant de modifier les fichiers dans VS Code. L'extension VEX pour VS Code active l'IntelliSense/Linting pour C/C++ et Python dans la zone de l'éditeur afin de nous aider lors du développement du programme.

Éditeur VS Code avec un fichier Python ouvert dans le cadre d'un projet VEX. Il est possible d'écrire et de modifier ici du code Python ou C/C++ pour créer des programmes de robotique VEX lorsqu'ils sont connectés à un VEX Brain.

Dans la zone de l'éditeur, nous pouvons accéder à des informations utiles sur une fonction spécifique en survolant le texte de la fonction avec la souris ou en utilisant l'aide de la commande VEX pour accéder à la documentation de cette fonction incluse dans l'API C++ et Python (interface de programmation d'applications).

Pour des instructions détaillées sur l'utilisation de l'aide de la commande VEX dans VS Code, veuillez consulter cet article.

Panneau terminal

L'extension VEX pour VS Code fournit deux terminaux au démarrage : le terminal de journalisation et le terminal interactif.

Terminal de journalisation - Le terminal de journalisation affiche la sortie de la compilation, l'erreur de compilation et les résultats du téléchargement.

Le terminal de journalisation VEX de VS Code s'ouvre et affiche un état vide par défaut avec un seul message imprimé indiquant « Log ».

Terminal interactif - Le terminal interactif possède deux fonctions : l’affichage des journaux d’impression et le renvoi des frappes brutes au clavier à un programme utilisateur.

Remarque : Pour utiliser le terminal interactif, un Brain ou un contrôleur doit être connecté à un ordinateur exécutant l’extension VEX pour VS Code.
Remarque : La sortie du terminal interactif est effacée par défaut après la compilation et le téléchargement d'un programme utilisateur.

barre d'outils

La barre d'outils comporte un ensemble d'icônes qui nous permettent d'interagir rapidement avec les projets d'extension VEX VS Code, VEX Brains et VEX Controllers.

Barre d'outils VS Code avec icônes d'extension VEX permettant d'interagir rapidement avec les périphériques et projets VEX connectés. Les fonctionnalités VEX incluent le sélecteur de périphérique, le sélecteur d'emplacement, l'icône de téléchargement de la version & , l'icône de lecture, l'icône d'arrêt, le sélecteur de projet et le sélecteur de fichiers Python.

Remarque : La barre d’outils n’est active que lorsqu’un projet VEX valide est ouvert dans VS Code.

Remarque : Un projet VEX valide est un projet créé ou importé par l’extension. Les projets VEXcode ou VEXcode Pro ouverts dans l'éditeur ne seront pas considérés comme des projets VEX valides et devront être importés.

Les icônes présentes dans la barre d'outils comprennent :

Sélecteur de périphérique - Le sélecteur de périphérique affiche l'icône du périphérique VEX connecté (une icône de cerveau ou une icône de contrôleur )
Remarque : Si un contrôleur est connecté à l'ordinateur, mais n'a pas de liaison radio avec un cerveau, aucun nom de cerveau ne sera affiché à côté de l'icône de contrôleur.

Icône de sélection d'emplacement - L'icône de sélection d'emplacement nous permet de choisir l'emplacement sur lequel l'extension VEX téléchargera ou exécutera un programme utilisateur en cliquant dessus et en sélectionnant l'un des huit emplacements disponibles sur le VEX Brain dans la liste de sélection.
Icône de téléchargement de la version & - Si un périphérique VEX est connecté, l'icône de téléchargement s'affichera dans la barre d'outils. En cliquant dessus, le projet sera compilé et, en cas de succès, téléchargé sur le périphérique VEX connecté.
Icône de lecture - Lorsqu'on clique dessus, l'icône de lecture exécute le programme utilisateur téléchargé dans l'emplacement sélectionné sur le VEX Brain.
Icône d'arrêt - Lorsqu'on clique sur l'icône d'arrêt, l'icône d'arrêt arrête l'exécution du programme utilisateur sur le VEX Brain.
Sélecteur de projet - Le Sélecteur de projet affiche le nom du projet sélectionné. L'icône de sélection de projet nous permet de basculer entre les projets VEX lorsqu'il en existe plusieurs dans l'espace de travail en cliquant dessus et en sélectionnant un projet dans la liste de sélection.
Sélecteur de fichiers Python (Python uniquement) - Lorsqu'un projet VEX Python est sélectionné, le Sélecteur de fichiers Python apparaîtra dans la barre d'outils. Le sélecteur de fichiers Python le nom du fichier Python sélectionné. Python pour VEX ne prend actuellement en charge que le téléchargement de fichiers uniques.

Pour obtenir des informations utiles sur la façon d'utiliser les fonctionnalités de la barre d'outils dans VS Code, veuillez cet article.

Paramètres utilisateur VEX

Les paramètres utilisateur VEX nous permettent de configurer l'extension VEX selon nos propres exigences. Les paramètres utilisateur sont des paramètres globaux appliqués à chaque projet d'extension VEX VS Code. Nous pouvons accéder aux paramètres utilisateur VEX en cliquant sur l'icône Paramètres dans VS Code et en sélectionnant les éléments correspondants dans les menus.

Les paramètres utilisateur de VS Code s'ouvrent sur la catégorie VEX où le comportement de l'extension VEX Robotics peut être personnalisé.

Les paramètres utilisateur VEX pour configurer l'extension VEX VS Code sont les suivants :

Chemin de la chaîne d'outils CPP - Définit le chemin d'accès à la chaîne d'outils CPP.
Activer le terminal utilisateur- Active ou désactive l'extension pour ouvrir et afficher les données du port utilisateur.
Entrées de journal - Définit le nombre d'entrées de journal à télécharger à partir d'un VEX Brain.
Type de construction de projet - Définit comment l'extension construira un projet C++.
Accueil du projet - Définit l'emplacement par défaut des nouveaux projets.
Exécuter après téléchargement - Indique si le programme utilisateur doit s'exécuter après son téléchargement sur un VEX Brain.
Système DFU Auto Recover - Définit si le cerveau doit se récupérer automatiquement lorsqu'un cerveau IQ (2e génération) ou EXP est détecté en mode DFU.
Activation du serveur Websocket - Active ou désactive l'extension pour démarrer le serveur Websocket.
Adresse hôte du serveur Websocket - Définit l'adresse hôte du serveur Websocket.
Port du serveur WebSocket - Définit le numéro de port du serveur WebSocket

Pour obtenir des informations utiles sur la façon d'accéder aux paramètres utilisateur VEX et de les configurer, cet article.