Tổng quan về giao diện người dùng của tiện ích mở rộng VEX VS Code – Thư viện VEX

Bài viết này cung cấp tổng quan về UI (Giao diện người dùng) của tiện ích mở rộng VEX Visual Studio Code. Tiện ích mở rộng này hỗ trợ phát triển các dự án C++ và Python cho nền tảng VEX IQ thế hệ thứ 2, EXP và V5.

Giao diện người dùng của tiện ích mở rộng VEX VS Code

Giao diện người dùng của tiện ích mở rộng VEX Visual Studio Code được chia thành năm khu vực chính: Thanh hoạt động, Thanh bên, Trình chỉnh sửa, Bảng điều khiển đầu cuối và Thanh công cụ.

Ảnh chụp màn hình hiển thị bố cục giao diện người dùng hoàn chỉnh của VEX VS Code. Thanh hoạt động và thanh bên nằm ở phía bên trái màn hình, thanh công cụ và cửa sổ dòng lệnh nằm ở phía dưới màn hình, còn trình soạn thảo chiếm phần còn lại của màn hình.

Thanh hoạt động

Thanh hoạt động có một loạt các biểu tượng cho phép chúng ta chuyển đổi giữa các chế độ xem và cung cấp cho chúng ta các chỉ báo ngữ cảnh cụ thể bổ sung để phát triển dự án VEX.

Thanh hoạt động của VS Code với tiện ích mở rộng VEX Robotics đã được cài đặt. Thanh hoạt động có các biểu tượng cung cấp các thao tác nhanh hữu ích, chẳng hạn như tìm kiếm, quản lý tiện ích mở rộng, kiểm soát phiên bản, v.v.

Các biểu tượng phổ biến được sử dụng để phát triển dự án VEX trong VS Code là:

Biểu tượng Chế độ xem Explorer - Khi nhấp vào, Chế độ xem sẽ mở ra trong Thanh bên.
Biểu tượng chế độ xem tiện ích mở rộng - Khi nhấp vào, chế độ xem tiện ích mở mở ra trong Thanh bên.
Biểu tượng VEX View - Khi nhấp vào, VEX View sẽ mở ra trong Thanh bên.

Thanh bên

Thanh bên chứa nhiều chế độ xem khác nhau cho phép chúng ta sử dụng các công cụ tích hợp trong VS Code. Các chế độ xem Thanh bên phổ biến được sử dụng để thực hiện các tác vụ phát triển dự án VEX là Chế độ xem mở rộng, Chế độ xem VEXvà Chế độ xem trình khám phá.

Chế độ xem mở rộng

Chế độ xem tiện ích mở rộng được sử dụng để cài đặt và quản lý các tiện ích mở rộng trong VS Code. Để phát triển phần mềm trên nền tảng VEX IQ thế hệ thứ 2, EXP và V5, chúng ta cần cài đặt tiện ích mở rộng VEX, tiện ích mở rộng C/C++ và tiện ích mở rộng Python.

Để biết hướng dẫn từng bước về cách cài đặt VEX Extension, C/C++ Extensionvà Python Extension trong VS Code, vui lòng xem bài viết này.

VS Code Extension View hiển thị danh sách các tiện ích mở rộng đã được cài đặt. Mỗi tiện ích mở rộng đều có menu cài đặt có thể mở tại đây, và có một thanh tìm kiếm để tìm và tải xuống các tiện ích mở rộng mới.

VEX View

VEX View cho phép chúng ta phát triển các dự án cho VEX IQ thế hệ thứ , EXP và V5 trong VS Code. Có ba danh mục được bao gồm trong VEX View: HÀNH ĐỘNG DỰ ÁN, THÔNG TIN THIẾT BỊ VEX, và PHẢN HỒI VEX.

VS Code VEX View hiển thị các tùy chọn để tạo và nhập dự án ở phía trên, menu Thông tin thiết bị VEX ở phía dưới và menu phản hồi ở phía dưới cùng.

HÀNH ĐỘNG DỰ ÁN
Các nút bên dưới HÀNH ĐỘNG DỰ ÁN được sử dụng để tạo một dự án VEX mới hoặc nhập một dự án VEXcode hiện có.
Để biết hướng dẫn chi tiết về cách tạo dự án VEX trong VS Code, vui lòng xem bài viết này dành cho V5, bài viết này dành cho EXPvà bài viết này dành cho IQ (thứ 2).

Mục Hành động Dự án trong Chế độ xem Mở rộng VEX. Phần này có hai nút ghi là "Dự án mới" và "Nhập dự án".

THÔNG TIN THIẾT BỊ VEX
Mục THÔNG TIN THIẾT BỊ VEX cung cấp cho chúng ta cái nhìn tổng quan về thiết bị VEX được kết nối - một VEX Brain hoặc một VEX Controller.

Danh mục này cho biết loại thiết bị VEX được kết nối và hiển thị thông tin về hệ thống Brain, cổng nối tiếp, chương trình đã tải xuống và các thiết bị được kết nối với các cổng thông minh của VEX Brain. Nó cho phép chúng ta chụp ảnh màn hình VEX Brain Screen, xem Nhật ký sự kiện VEX Brain, sử dụng V5 Battery Medic, đặt tên não và số độivà xóa chương trình người dùng khỏi VEX Brain

Khi VEX Brain được kết nối với máy tính, danh mục THÔNG TIN THIẾT BỊ VEX sẽ hiển thị liệu Bộ điều khiển VEX có được liên kết với VEX Brain hay không và cho phép chúng ta cập nhật VEXos cho VEX Brain nếu phiên bản VEXos của VEX Brain đã lỗi thời.

Khi Bộ điều khiển VEX được kết nối với máy tính, danh mục THÔNG TIN THIẾT BỊ VEX sẽ hiển thị xem Bộ não VEX có được liên kết với Bộ điều khiển VEX hay không và cho phép chúng ta cập nhật VEXos cho Bộ điều khiển VEX nếu phiên bản VEXos của Bộ điều khiển VEX đã lỗi thời.

Để biết mô tả đầy đủ về thông tin thiết bị và cách sử dụng các tính năng trong THÔNG TIN THIẾT BỊ VEX, vui lòng xem bài viết này.

PHẢN HỒI VEX
Chúng ta có thể gửi phản hồi cho VEX bằng cách nhập tin nhắn vào ô văn bản bên dưới PHẢN HỒI VEX và nhấp vào nút GỬI
Để biết thông tin hữu ích về cách sử dụng VEX FEEDBACK trong VS Code, vui lòng xem bài viết này.

Phần Phản hồi VEX trong Chế độ xem Mở rộng VEX. Phần này có một biểu mẫu với các tùy chọn để gửi phản hồi cho VEX.

Chế độ xem Explorer

Explorer View được sử dụng để duyệt, mở và quản lý các tệp và thư mục dự án VEX trong VS Code.

Chế độ xem Explorer của VS Code cho phép người dùng điều hướng qua các thư mục và tệp trong dự án VEX của họ. Các tệp có biểu tượng và loại tệp tương ứng được hiển thị, trong ví dụ này, một tệp Python được chọn và tiêu đề là VEXcode Project.py.

Biên tập viên

Trình soạn thảo là khu vực chính để chỉnh sửa các tệp trong VS Code. Tiện ích mở rộng VEX VS Code cho phép sử dụng Intellisense/Linting cho cả C/C++ và Python trong vùng Trình soạn thảo để hỗ trợ chúng ta trong quá trình phát triển chương trình.

Trình soạn thảo VS Code với một tệp Python được mở như một phần của dự án VEX. Bạn có thể viết và chỉnh sửa mã Python hoặc C/C++ tại đây để tạo ra các chương trình robot VEX khi kết nối với bộ điều khiển VEX Brain.

Trong vùng Trình soạn thảo, chúng ta có thể tiếp cận thông tin hữu ích về một hàm cụ thể bằng cách di chuột qua văn bản của hàm hoặc bằng cách sử dụng VEX Command Help để truy cập tài liệu về hàm này có trong C++ và Python API (Giao diện lập trình ứng dụng).

Để biết hướng dẫn chi tiết về cách sử dụng VEX Command Help trong VS Code, vui lòng xem bài viết này.

Bảng điều khiển đầu cuối

Phần mở rộng VEX VS Code cung cấp hai thiết bị đầu cuối khi khởi động: Thiết bị đầu cuối nhật ký và Thiết bị đầu cuối tương tác.

Log Terminal - Log Terminal hiển thị kết quả xây dựng, lỗi xây dựng và kết quả tải xuống.

Cửa sổ Terminal ghi nhật ký VEX của VS Code được mở và hiển thị trạng thái trống mặc định, chỉ có một thông báo được in ra là "Log".

Thiết bị đầu cuối tương tác - Thiết bị đầu cuối tương tác có hai chức năng - hiển thị nhật ký in và gửi các thao tác gõ phím thô trở lại chương trình người dùng.

Lưu ý: Để sử dụng thiết bị đầu cuối tương tác, cần kết nối Bộ não hoặc Bộ điều khiển với máy tính đang chạy phần mở rộng VEX VS Code.
Lưu ý: Đầu ra của thiết bị đầu cuối tương tác sẽ bị xóa theo mặc định sau khi xây dựng và tải xuống chương trình người dùng.

Thanh công cụ

Thanh công cụ có một loạt các biểu tượng giúp chúng ta tương tác nhanh chóng với các dự án mở rộng VEX VS Code, VEX Brains và VEX Controllers.

Thanh công cụ VS Code với các biểu tượng mở rộng VEX cho phép tương tác nhanh chóng với các thiết bị và dự án VEX được kết nối. Các tính năng của VEX bao gồm Trình chọn thiết bị, Trình chọn khe cắm, biểu tượng Tải xuống bản dựng & , biểu tượng Phát, biểu tượng Dừng, Trình chọn dự án và Trình chọn tệp Python.

Lưu ý: Thanh công cụ chỉ hoạt động khi có một dự án VEX hợp lệ được mở trong VS Code.

Lưu ý: Một dự án VEX hợp lệ là dự án được tiện ích mở rộng tạo hoặc nhập. Các dự án VEXcode hoặc VEXcode Pro được mở trong trình soạn thảo sẽ không được coi là Dự án VEX hợp lệ và cần phải được nhập.

Các biểu tượng có trên Thanh công cụ bao gồm:

Trình chọn thiết bị - Trình chọn thiết bị hiển thị biểu tượng của thiết bị VEX được kết nối (biểu tượng Bộ não hoặc biểu tượng Bộ điều khiển )
Lưu ý: Nếu bộ điều khiển được kết nối với máy tính nhưng không có liên kết vô tuyến với bộ não, tên bộ não sẽ không được hiển thị bên cạnh biểu tượng Bộ điều khiển.

Biểu tượng Chọn Khe - Biểu tượng Chọn Khe cho phép chúng ta chọn Khe mà Tiện ích mở rộng VEX sẽ tải xuống hoặc chạy chương trình người dùng bằng cách nhấp vào đó và chọn một trong tám Khe có sẵn trên Bộ não VEX từ danh sách lựa chọn.
Bản dựng & Biểu tượng Tải xuống - Nếu thiết bị VEX được kết nối, Biểu tượng Tải xuống sẽ hiển thị trên Thanh công cụ. Khi nhấp vào, dự án sẽ được xây dựng và nếu thành công, sẽ được tải xuống Thiết bị VEX được kết nối.
Biểu tượng Chơi - Khi nhấp vào, Biểu tượng Chơi sẽ chạy chương trình người dùng đã tải xuống trong Khe đã chọn trên VEX Brain.
Biểu tượng Dừng - Khi nhấp vào, Biểu tượng Dừng sẽ dừng chương trình người dùng đang chạy trên VEX Brain.
Bộ chọn dự án - Bộ chọn dự án hiển thị tên của dự án đã chọn. Biểu tượng Chọn dự án cho phép chúng ta chuyển đổi giữa các dự án VEX khi có nhiều dự án trong không gian làm việc bằng cách nhấp vào biểu tượng đó và chọn một dự án từ danh sách chọn.
Trình chọn tập tin Python (Chỉ dành cho Python) - Khi một dự án VEX Python được chọn, Trình chọn tập tin Python sẽ xuất hiện trên Thanh công cụ. Bộ chọn tệp Python hiển thị tên của tệp Python đã chọn. Hiện tại Python dành cho VEX chỉ hỗ trợ tải xuống một tệp duy nhất.

Để biết thông tin hữu ích về cách sử dụng các tính năng của Thanh công cụ trong VS Code, vui lòng tham khảo bài viết này

Cài đặt người dùng VEX

Cài đặt người dùng VEX cho phép chúng ta cấu hình Phần mở rộng VEX theo yêu cầu của riêng chúng ta. Cài đặt người dùng là cài đặt chung được áp dụng cho mọi dự án mở rộng VEX VS Code. Chúng ta có thể truy cập Cài đặt người dùng VEX bằng cách nhấp vào Biểu tượng cài đặt trong VS Code và chọn các mục tương ứng trong menu.

Cài đặt người dùng VS Code được mở đến mục VEX, nơi bạn có thể tùy chỉnh hành vi của tiện ích mở rộng VEX Robotics.

Cài đặt người dùng VEX để cấu hình Tiện ích mở rộng VEX VS Code là:

Kênh điều khiển (Chỉ dành cho Bộ điều khiển V5) - Đặt Kênh vô tuyến của Bộ điều khiển V5 thành Tải xuống hoặc Pit. Cài đặt này chỉ áp dụng cho liên kết vô tuyến VEXnet.

Đường dẫn Cpp Toolchain - Đặt Đường dẫn cho CPP Toolchain.
Kích hoạt Thiết bị đầu cuối người dùng- Bật hoặc tắt tiện ích mở rộng để mở và hiển thị dữ liệu từ cổng người dùng.
Mục nhật ký - Đặt số mục nhật ký để tải lên từ VEX Brain.
Loại xây dựng dự án - Thiết lập cách tiện ích mở rộng sẽ xây dựng một dự án C++.
Trang chủ dự án - Đặt vị trí mặc định cho các dự án mới.
Chạy sau khi tải xuống - Thiết lập xem chương trình của người dùng có chạy sau khi được tải xuống VEX Brain hay không.
Tự động khôi phục DFU hệ thống - Thiết lập xem Não có tự động khôi phục khi phát hiện IQ2 hoặc EXP ở chế độ DFU hay không.
Websocket Server Enable - Bật hoặc tắt tiện ích mở rộng để khởi động Websocket Server.
Địa chỉ máy chủ Websocket - Đặt Địa chỉ máy chủ của Máy chủ Websocket.
Cổng máy chủ Websocket - Đặt số cổng máy chủ Websocket

Để biết thông tin hữu ích về cách truy cập và thiết lập Cài đặt người dùng VEX, hãy xem bài viết này.