Przegląd interfejsu użytkownika rozszerzenia VEX VS Code

W tym artykule znajdziesz przegląd interfejsu użytkownika (UI) rozszerzenia VEX dla programu Visual Studio Code. Rozszerzenie obsługuje rozwój projektów C++ i Python na platformach VEX IQ (2. generacja), EXP i V5.

Układ interfejsu użytkownika rozszerzenia VEX VS Code

Interfejs użytkownika rozszerzenia VEX Visual Studio Code jest podzielony na pięć głównych obszarów: pasek aktywności, pasek boczny, edytor, panel terminala i pasek narzędzi.

Zrzut ekranu przedstawiający kompletny układ interfejsu użytkownika VEX VS Code. Pasek aktywności i pasek boczny znajdują się po lewej stronie ekranu, pasek narzędzi i terminal u dołu ekranu, a edytor zajmuje resztę ekranu.

Pasek aktywności

Pasek aktywności zawiera szereg ikon, które umożliwiają przełączanie się między widokami i dostarczają dodatkowych wskaźników zależnych od kontekstu, pomocnych w rozwoju projektu VEX.

Pasek aktywności programu VS Code z zainstalowanym rozszerzeniem VEX Robotics. Na pasku aktywności znajdują się ikony umożliwiające szybkie wykonywanie przydatnych czynności, takich jak wyszukiwanie, zarządzanie rozszerzeniami, kontrola wersji i wiele innych.

Do tworzenia projektów VEX w programie VS Code najczęściej używane są następujące ikony:

  • Ikona widoku eksploratora. Ikona widoku eksploratora - Po kliknięciu na pasku bocznym otwiera się Widok eksploratora.
  • Ikona widoku rozszerzeń. Ikona widoku rozszerzeń - Po kliknięciu na pasku bocznym otwiera się Widok rozszerzeń.
  • Ikona widoku VEX. Ikona widoku VEX - Po kliknięciu na pasku bocznym otwiera się widok VEX .

Pasek boczny

Pasek boczny zawiera różne widoki, które umożliwiają korzystanie ze zintegrowanych narzędzi programu VS Code. Typowe widoki paska bocznego używane do wykonywania zadań w ramach rozwoju projektu VEX to: Widok rozszerzenia, Widok VEXi Widok eksploratora.

Widok rozszerzenia

Widok rozszerzenia służy do instalowania i zarządzania rozszerzeniami w programie VS Code. Aby tworzyć oprogramowanie na platformach VEX IQ (2. generacja), EXP i V5, musimy zainstalować rozszerzenie VEX, rozszerzenie C/C++ i rozszerzenie Python.

Instrukcje krok po kroku dotyczące instalacji rozszerzeń VEX, C/C++i Python w programie VS Code można znaleźć w tym artykule.

Widok rozszerzeń VS Code wyświetlający listę zainstalowanych rozszerzeń. Każde rozszerzenie ma menu ustawień, które można tutaj otworzyć, a także pasek wyszukiwania umożliwiający znajdowanie i pobieranie nowych rozszerzeń.


Widok VEX

VEX View umożliwia nam rozwijanie projektów dla VEX IQ (2. generacja), EXP i V5 w VS Code. Widok VEX zawiera trzy kategorie: DZIAŁANIA PROJEKTU, INFORMACJE O URZĄDZENIU VEX, i INFORMACJE ZWROTNE VEX.

Widok VS Code VEX przedstawiający opcje tworzenia i importowania projektów powyżej, menu Informacje o urządzeniu VEX poniżej oraz menu opinii na dole.

Sekcja Działania projektu w widoku rozszerzenia VEX. W tej sekcji znajdują się dwa przyciski: Nowy projekt i Importuj projekt.

  • INFORMACJE O URZĄDZENIU VEX
    Kategoria INFORMACJE O URZĄDZENIU VEX zapewnia nam przegląd podłączonego urządzenia VEX - VEX Brain lub VEX Controller.

    VEX Device Info section of the VEX Extension View is shown, with a list of all connected devices and specific info about each one. In this example, an EXP Brain and its downloaded programs are shown.


    Kategoria ta wskazuje typ podłączonego urządzenia VEX i wyświetla informacje o systemie Brain, porcie szeregowym, pobranym programie i urządzeniach podłączonych do inteligentnych portów VEX Brain. Umożliwia wykonanie zrzutu ekranu mózgu VEX, przeglądanie dziennika zdarzeń mózgu VEX, ustawienie nazwy mózgu i numeru zespołu oraz usunięcie programu użytkownika z mózgu VEX.

    Gdy VEX Brain jest podłączony do komputera, kategoria INFORMACJE O URZĄDZENIU VEX pokazuje, czy kontroler VEX jest podłączony do VEX Brain i umożliwia nam aktualizację VEXos dla VEX Brain, jeśli wersja VEXos VEX Brain jest nieaktualna.

    Gdy kontroler VEX jest podłączony do komputera, kategoria INFORMACJE O URZĄDZENIU VEX pokazuje, czy VEX Brain jest podłączony do kontrolera VEX i umożliwia nam aktualizację VEXos dla kontrolera VEX, jeśli wersja VEXos kontrolera VEX jest nieaktualna.

    Aby uzyskać pełny opis informacji o urządzeniu i sposobie korzystania z funkcji w INFORMACJE O URZĄDZENIU VEX, zapoznaj się z tym artykułem.
  • VEX FEEDBACK
    Możemy przesłać opinię do VEX, wpisując wiadomość w polu tekstowym pod VEX FEEDBACK i klikając przycisk WYŚLIJ
    Przydatne informacje na temat korzystania z VEX FEEDBACK w programie VS Code można znaleźć tym artykule.

Sekcja opinii VEX w widoku rozszerzenia VEX. W tej sekcji znajduje się formularz z opcjami przesyłania opinii do VEX.

Widok eksploratora

Widok Eksploratora służy do przeglądania, otwierania i zarządzania plikami i folderami projektu VEX w programie VS Code.

Widok Eksploratora VS Code umożliwiający użytkownikowi nawigację po folderach i plikach w projekcie VEX. Pliki mają pokazane ikony i typy plików. W tym przykładzie wybrano plik Pythona, a jego tytuł brzmi main.py.

Redaktor

Edytor jest głównym obszarem edycji plików w programie VS Code. Rozszerzenie VEX VS Code włącza funkcję Intellisense/Linting dla języków C/C++ i Python w obszarze edytora, co ułatwia nam rozwijanie programu.

Edytor VS Code z plikiem Pythona otwartym jako część projektu VEX. Tutaj można pisać i edytować kod w językach Python lub C/C++, aby tworzyć programy robotyki VEX po podłączeniu do VEX Brain.

W obszarze Edytora możemy uzyskać dostęp do przydatnych informacji o konkretnej funkcji, najeżdżając kursorem myszy na tekst funkcji lub korzystając z funkcji VEX Command Help aby uzyskać dostęp do dokumentacji tej funkcji zawartej w interfejsie API (Application Programming Interface) języków C++ i Python.

Szczegółowe instrukcje dotyczące korzystania z pomocy polecenia VEX w programie VS Code można znaleźć tym artykule.

Panel terminala

Rozszerzenie VEX VS Code udostępnia dwa terminale po uruchomieniu: Terminal dziennika i Terminal interaktywny. 

  • Terminal dziennika — Terminal dziennika wyświetla dane wyjściowe kompilacji, błędy kompilacji i wyniki pobierania.

Terminal dziennika VS Code VEX jest otwarty i domyślnie wyświetla pusty stan z wydrukowanym tylko jednym komunikatem: Log.

  • Terminal interaktywny Terminal interaktywny ma dwie funkcje: wyświetlanie
    drukowania i wysyłanie surowych naciśnięć klawiszy do programu użytkownika.

    VS Code VEX Interactive Terminal is opened and shows messages that detail the VEX Brain connection status.



    Uwaga: Aby móc korzystać z terminala interaktywnego, mózg lub kontroler musi być podłączony do komputera, na którym działa rozszerzenie VEX VS Code.
    Uwaga: Dane wyjściowe terminala interaktywnego są domyślnie czyszczone po skompilowaniu i pobraniu programu użytkownika.

Pasek narzędzi

Pasek narzędzi zawiera szereg ikon, które umożliwiają szybką interakcję z projektami rozszerzeń VEX VS Code, VEX Brains i VEX Controllers.

Pasek narzędzi VS Code z ikonami rozszerzeń VEX, które umożliwiają szybką interakcję z podłączonymi urządzeniami i projektami VEX. Funkcje VEX obejmują selektor urządzeń, selektor gniazd, ikonę kompilacji & do pobrania, ikonę odtwarzania, ikonę zatrzymywania, selektor projektów i selektor plików Python.

Uwaga: Pasek narzędzi jest aktywny tylko wtedy, gdy w programie VS Code otwarty jest prawidłowy projekt VEX. 

Uwaga: Prawidłowy projekt VEX to projekt utworzony lub zaimportowany przez rozszerzenie. Projekty VEXcode lub VEXcode Pro otwarte w edytorze nie będą uznawane za prawidłowe projekty VEX i konieczne będzie ich zaimportowanie.

Na pasku narzędzi znajdują się następujące ikony:

  • Ikona selektora urządzeń jest wyświetlana na pasku narzędzi VS Code. Wybór urządzenia - Wybór urządzenia wyświetla ikonę podłączonego urządzenia VEX (ikona mózgu Device Picker icon is highlighted on the VS Code toolbar. In this example it shows a Brain icon. lub ikona kontrolera Device Picker icon is highlighted on the VS Code toolbar. In this example it shows a Controller icon.)
    Uwaga: Jeśli kontroler jest podłączony do komputera, ale nie ma połączenia radiowego z mózgiem, obok ikony kontrolera nie będzie wyświetlana nazwa mózgu.
  • Ikona selektora gniazd. Ikona selektora gniazd - Ikona selektora gniazd umożliwia wybranie gniazda, na którym rozszerzenie VEX pobierze lub odtworzy program użytkownika W tym celu należy kliknąć na nie i wybrać jedno z ośmiu dostępnych gniazd w module VEX Brain z listy wyboru.
  • Ikona kompilacji i pobierania. Kompilacja & Ikona pobierania - Jeśli podłączone jest urządzenie VEX, na pasku narzędzi pojawi się ikona pobierania. Po kliknięciu projekt zostanie skompilowany i, jeśli zakończy się powodzeniem, zostanie pobrany na podłączone urządzenie VEX.
  • Ikona odtwarzania. Ikona Odtwórz - Po kliknięciu Ikona Odtwórz uruchamia pobrany program użytkownika w wybranym slocie w mózgu VEX.
  • Ikona Stop. Ikona Zatrzymaj - Po kliknięciu Ikona Zatrzymaj zatrzymuje działanie programu użytkownika w VEX Brain.
  • Selektor projektów jest wyświetlany na pasku narzędzi VS Code. W tym przykładzie jest to v5NewProject. Selektor projektu - Selektor projektu wyświetla nazwę wybranego projektu. Ikona selektora projektów umożliwia przełączanie się między projektami VEX, gdy w obszarze roboczym znajduje się ich wiele W tym celu należy kliknąć ikonę i wybrać projekt z listy wyboru.
  • Ikona selektora plików Pythona jest wyświetlana na pasku narzędzi VS Code. W tym przykładzie jest to main.py. Selektor plików Pythona (tylko Python) - Po wybraniu projektu VEX Python na pasku narzędzi pojawi się Selektor plików Pythona. Selektor plików Pythona wyświetla nazwę wybranego pliku Pythona. Obecnie Python dla VEX obsługuje tylko pobieranie pojedynczych plików.

Przydatne informacje o korzystaniu z funkcji paska narzędzi w programie VS Code w tym artykule.

Ustawienia użytkownika VEX

Ustawienia użytkownika VEX umożliwiają konfigurację rozszerzenia VEX zgodnie z naszymi własnymi wymaganiami. Ustawienia użytkownika to ustawienia globalne stosowane do każdego projektu rozszerzenia VEX VS Code. Dostęp do Ustawień użytkownika VEX można uzyskać, klikając ikonę Ustawienia w programie VS Code i wybierając odpowiednie pozycje w menu.

Ustawienia użytkownika programu VS Code otwierają kategorię VEX, w której można dostosować zachowanie rozszerzenia VEX Robotics.

Ustawienia użytkownika VEX służące do konfiguracji rozszerzenia VEX VS Code to:

  • Ścieżka łańcucha narzędzi CPP – Ustawia ścieżkę dla łańcucha narzędzi CPP.
  • Włącz terminal użytkownika– włącza lub wyłącza rozszerzenie, aby otwierać i wyświetlać dane z portu użytkownika.
  • wpisów dziennika – Ustawia liczbę wpisów dziennika do przesłania z VEX Brain.
  • Typ kompilacji projektu — Ustawia sposób, w jaki rozszerzenie będzie kompilować projekt C++.
  • Strona główna projektu — Ustawia domyślną lokalizację nowych projektów.
  • Uruchom po pobraniu – Ustawia, czy program użytkownika ma zostać uruchomiony po pobraniu do VEX Brain.
  • System DFU Auto Recover - Ustawia, czy mózg powinien automatycznie się regenerować po wykryciu mózgu IQ (2. generacji) lub EXP w trybie DFU.
  • Websocket Server Enable – włącza lub wyłącza rozszerzenie w celu uruchomienia serwera Websocket.
  • Adres hosta serwera Websocket — Ustawia adres hosta serwera Websocket.
  • Port serwera Websocket – ustawia numer portu serwera Websocket

Przydatne informacje na temat dostępu do Ustawień użytkownika VEX i ich konfiguracji w tym artykule.

For more information, help, and tips, check out the many resources at VEX Professional Development Plus

Last Updated: