Artikel ini memberikan gambaran umum tentang UI (Antarmuka Pengguna) Ekstensi VEX Visual Studio Code. Ekstensi ini mendukung pengembangan proyek C++ dan Python untuk platform VEX IQ Generasi ke-2, EXP, dan V5.

Tata Letak UI Ekstensi VEX VS Code

Antarmuka Pengguna Ekstensi Kode Visual Studio VEX dibagi menjadi lima area utama: Bilah Aktivitas, Bilah Samping, Editor, Panel Terminal, dan Bilah Alat.

 

Tangkapan layar yang menunjukkan tata letak UI VEX VS Code secara lengkap. Activity Bar dan Side Bar berada di sisi kiri layar, Toolbar dan Terminal berada di sisi bawah layar, dan editor mengisi sisa layar.

Bilah Aktivitas

Bilah Aktivitas menampilkan serangkaian ikon yang memungkinkan kita beralih di antara tampilan dan memberi kita indikator khusus konteks tambahan untuk pengembangan proyek VEX.

 

Bilah Aktivitas VS Code dengan Ekstensi VEX Robotics terpasang. Activity Bar memiliki ikon yang menyediakan tindakan cepat yang berguna, seperti pencarian, pengelolaan ekstensi, kontrol versi, dan banyak lagi.

Ikon umum yang digunakan untuk mengembangkan proyek VEX di VS Code adalah:

  • Ikon Tampilan Penjelajah. Ikon Tampilan Penjelajah - Bila diklik, Tampilan Penjelajah terbuka di Bilah Samping.
  • Ikon Tampilan Ekstensi. Ikon Tampilan Ekstensi - Bila diklik, Tampilan Ekstensi terbuka di Bilah Samping.
  • Ikon Tampilan VEX. Ikon Tampilan VEX - Bila diklik, Tampilan VEX terbuka di Bilah Samping.

Bilah Samping

Bilah Samping berisi tampilan berbeda yang memungkinkan kita menggunakan alat terintegrasi dalam VS Code. Tampilan Bilah Samping umum yang digunakan untuk melakukan tugas pengembangan proyek VEX adalah Tampilan Ekstensi, Tampilan VEX, dan Tampilan Penjelajah.

Tampilan Ekstensi

Tampilan Ekstensi digunakan untuk memasang dan mengelola ekstensi di VS Code. Untuk mengembangkan perangkat lunak pada platform VEX IQ Generasi ke-2, EXP, dan V5, kita perlu menginstal Ekstensi VEX, Ekstensi C/C++, dan Ekstensi Python.

Untuk petunjuk langkah demi langkah tentang cara menginstal Ekstensi VEX, Ekstensi C/C++, dan Ekstensi Python di VS Code, silakan periksa artikel ini.

 

Tampilan Ekstensi VS Code yang menampilkan daftar ekstensi yang terpasang. Setiap ekstensi memiliki menu pengaturan yang dapat dibuka di sini, dan terdapat bilah pencarian untuk menemukan dan mengunduh ekstensi baru.


Tampilan VEX

VEX View memungkinkan kita mengembangkan proyek untuk VEX IQ Generasi ke-2, EXP, dan V5 di VS Code. Ada tiga kategori yang disertakan dalam Tampilan VEX: TINDAKAN PROYEK, INFO PERANGKAT VEX, dan UMPAN BALIK VEX.

 

Tampilan VEX VS Code yang menampilkan opsi untuk membuat dan mengimpor proyek di bagian atas, menu Info Perangkat VEX di bagian bawah, dan menu umpan balik di bagian paling bawah.

Bagian Tindakan Proyek pada Tampilan Ekstensi VEX. Bagian ini memiliki dua tombol bertuliskan Proyek Baru dan Impor Proyek.

  • INFORMASI PERANGKAT VEX
    Kategori INFORMASI PERANGKAT VEX memberi kita gambaran umum tentang perangkat VEX yang terhubung - VEX Brain atau VEX Controller.

    Bagian Info Perangkat VEX pada Tampilan Ekstensi VEX ditampilkan, dengan daftar semua perangkat yang terhubung dan informasi spesifik tentang masing-masing perangkat. Pada contoh ini, ditampilkan sebuah V5 Brain beserta program-program yang telah diunduh.


    Kategori ini menunjukkan jenis Perangkat VEX yang terhubung dan menampilkan informasi sistem Brain, port serial, program yang diunduh, dan perangkat yang terhubung ke port pintar VEX Brain. Memungkinkan kita untuk screenshot VEX Brain Screen, melihat VEX Brain Event Log, menggunakan V5 Battery Medic, mengatur nama otak dan nomor tim, dan menghapus program pengguna dari VEX Brain

    Ketika VEX Brain terhubung ke komputer, kategori VEX DEVICE INFO menunjukkan jika VEX Controller terhubung ke VEX Brain dan memungkinkan kita untuk memperbarui VEXos untuk VEX Brain jika versi VEXos VEX Brain sudah kedaluwarsa.

    Ketika VEX Controller terhubung ke komputer, kategori VEX DEVICE INFO menunjukkan jika VEX Brain terhubung ke VEX Controller dan memungkinkan kita untuk memperbarui VEXos untuk VEX Controller jika versi VEXos VEX Controller sudah kedaluwarsa.

    Untuk deskripsi lengkap mengenai informasi perangkat dan cara menggunakan fitur pada INFO PERANGKAT VEX, silakan periksa artikel ini.

  • UMPAN BALIK VEX
    Kita dapat mengirimkan umpan balik ke VEX dengan mengetik pesan di Kotak Teks di bawah UMPAN BALIK VEX dan mengklik tombol KIRIM
    Untuk informasi bermanfaat tentang penggunaan VEX FEEDBACK di VS Code, silakan lihat artikel ini.
     

Bagian Umpan Balik VEX pada Tampilan Ekstensi VEX. Bagian ini memiliki formulir dengan pilihan untuk mengirimkan masukan kepada VEX.

Tampilan Penjelajah

Tampilan Explorer digunakan untuk menelusuri, membuka, dan mengelola file dan folder proyek VEX di VS Code.

 

Tampilan Explorer VS Code yang memungkinkan pengguna untuk menavigasi folder dan file dalam proyek VEX mereka. File-file tersebut memiliki ikon dan tipe file yang sesuai, dalam contoh ini sebuah file Python dipilih dan judulnya bertuliskan VEXcode Project.py.

Editor

Editor adalah area utama untuk mengedit berkas di VS Code. Ekstensi VEX VS Code mengaktifkan Intellisense/Linting untuk C/C++ dan Python di area Editor untuk membantu kita saat mengembangkan program.

 

Editor VS Code dengan file Python yang dibuka sebagai bagian dari proyek VEX. Kode Python atau C/C++ dapat ditulis dan diedit di sini untuk membuat program robotika VEX saat terhubung ke VEX Brain.

Di area Editor, kita dapat mengakses informasi bermanfaat tentang fungsi tertentu dengan mengarahkan mouse ke teks fungsi tersebut atau dengan menggunakan VEX Command Help untuk mengakses dokumentasi untuk fungsi ini yang disertakan dalam API (Antarmuka Pemrograman Aplikasi) C++ dan Python.

Untuk petunjuk terperinci tentang penggunaan VEX Command Help di VS Code, silakan lihat artikel ini.

Panel Terminal

Ekstensi VEX VS Code menyediakan dua terminal saat memulai, Terminal Log dan Terminal Interaktif. 

  • Terminal Log - Terminal Log menampilkan keluaran build, kesalahan build, dan hasil unduhan.
     

Terminal Log VEX VS Code terbuka dan menampilkan keadaan kosong default dengan hanya satu pesan yang tercetak bertuliskan Log.

  • Terminal Interaktif - Terminal Interaktif memiliki dua fungsi - menampilkan log cetak dan mengirimkan input keyboard mentah kembali ke program pengguna.

    VS Code VEX Interactive Terminal dibuka dan menampilkan pesan yang merinci status koneksi VEX Brain.



    Catatan: Untuk menggunakan terminal interaktif, Brain atau Controller harus terhubung ke komputer yang menjalankan Ekstensi VEX VS Code.
    Catatan: Output terminal interaktif dihapus secara default setelah membangun dan mengunduh program pengguna.

Bilah Alat

Toolbar menampilkan serangkaian ikon yang menyediakan cara cepat untuk berinteraksi dengan proyek ekstensi VEX VS Code, VEX Brains, dan VEX Controllers.

 

Toolbar VS Code dengan ikon Ekstensi VEX yang dapat digunakan untuk berinteraksi dengan cepat dengan perangkat dan proyek VEX yang terhubung. Fitur-fitur VEX meliputi Pemilih Perangkat, Pemilih Slot, ikon Unduh Build & , ikon Putar, ikon Berhenti, Pemilih Proyek, dan Pemilih File Python.

Catatan: Toolbar hanya aktif ketika proyek VEX yang valid dibuka di VS Code. 

Catatan: Proyek VEX yang valid adalah proyek yang dibuat atau diimpor oleh ekstensi. Proyek VEXcode atau VEXcode Pro yang dibuka di editor tidak akan dianggap sebagai Proyek VEX yang valid dan perlu diimpor.

Ikon-ikon yang ditampilkan pada Toolbar meliputi:

  • Ikon Pemilih Perangkat ditampilkan pada toolbar VS Code. Pemilih Perangkat - Pemilih Perangkat menampilkan Ikon Perangkat VEX yang terhubung (Ikon Otak Device Picker icon is highlighted on the VS Code toolbar. In this example it shows a Brain icon. atau Ikon Pengontrol Device Picker icon is highlighted on the VS Code toolbar. In this example it shows a Controller icon.)
    Catatan: Jika pengontrol terhubung ke komputer, tetapi tidak memiliki tautan radio ke otak, nama otak tidak akan ditampilkan di sebelah Ikon Pengontrol.
  • Ikon Pemilih Slot.Ikon Pemilih Slot - Ikon Pemilih Slot memungkinkan kita untuk memilih Slot mana yang akan diunduh atau dimainkan oleh Ekstensi VEX untuk program pengguna dengan mengkliknya dan memilih salah satu dari delapan Slot yang tersedia di VEX Brain dari daftar pilihan.
  • Ikon Buat dan Unduh.  Build & Ikon Unduh - Jika Perangkat VEX terhubung, Ikon Unduh akan muncul di Toolbar. Ketika diklik, proyek akan dibangun dan jika berhasil, akan diunduh ke Perangkat VEX yang terhubung.
  • Ikon putar. Ikon Putar - Saat diklik, Ikon Putar menjalankan program pengguna yang diunduh di Slot yang dipilih pada VEX Brain.
  • Ikon berhenti. Ikon Berhenti - Saat diklik, Ikon Berhenti menghentikan eksekusi program pengguna pada VEX Brain.
  • Pemilih Proyek ditampilkan pada toolbar VS Code. Dalam contoh ini tertulis v5NewProject.  Pemilih Proyek - Pemilih Proyek menampilkan nama proyek yang dipilih. Ikon Pemilih Proyek memungkinkan kita beralih di antara proyek VEX saat ada beberapa proyek di dalam ruang kerja dengan mengkliknya dan memilih proyek dari daftar pilihan.
  • Ikon Pemilih File Python ditampilkan pada toolbar VS Code. Dalam contoh ini, tertulis main.py.  Pemilih Berkas Python (Khusus Python) - Saat proyek VEX Python dipilih, Pemilih Berkas Python akan muncul di Toolbar. Pemilih Berkas Python menampilkan nama berkas Python yang dipilih. Saat ini, Python untuk VEX hanya mendukung pengunduhan berkas tunggal.

Untuk informasi bermanfaat tentang cara menggunakan fitur Toolbar di VS Code, silakan periksa artikel ini.

Pengaturan Pengguna VEX

Pengaturan Pengguna VEX memungkinkan kita mengonfigurasi Ekstensi VEX sesuai dengan kebutuhan kita sendiri. Pengaturan Pengguna adalah pengaturan global yang diterapkan ke setiap proyek ekstensi VEX VS Code. Kita dapat mengakses Pengaturan Pengguna VEX dengan mengklik Ikon Pengaturan di VS Code dan memilih item yang sesuai di menu.

 

Pengaturan Pengguna VS Code dibuka pada kategori VEX tempat perilaku Ekstensi Robotika VEX dapat disesuaikan.

Pengaturan Pengguna VEX untuk mengonfigurasi Ekstensi VEX VS Code adalah:

  • Saluran Pengontrol (Hanya Pengontrol V5) - Mengatur Saluran Radio Pengontrol V5 ke Unduh atau Pit. Pengaturan ini hanya berlaku untuk tautan radio VEXnet.
  • Jalur Rantai Alat Cpp - Mengatur Jalur untuk Rantai Alat CPP.
  • Aktifkan Terminal Pengguna- Mengaktifkan atau menonaktifkan ekstensi untuk membuka dan menampilkan data dari port pengguna.
  • Entri Log - Mengatur jumlah entri log yang akan diunggah dari VEX Brain.
  • Jenis Bangun Proyek - Mengatur bagaimana ekstensi akan membangun proyek C++.
  • Proyek Beranda - Menetapkan lokasi default untuk proyek baru.
  • Jalankan Setelah Pengunduhan - Mengatur apakah program pengguna harus dijalankan setelah diunduh ke VEX Brain.
  • Pemulihan Otomatis DFU Sistem - Mengatur apakah Otak harus memulihkan secara otomatis ketika IQ2 atau EXP terdeteksi dalam mode DFU.
  • Aktifkan Server Websocket - Mengaktifkan atau menonaktifkan ekstensi untuk memulai Server Websocket.
  • Alamat Host Server Websocket - Mengatur Alamat Host Server Websocket.
  • Port Server Websocket - Mengatur Nomor Port Server Websocket

Untuk informasi bermanfaat tentang cara mengakses dan mengatur Pengaturan Pengguna VEX, lihat artikel ini.

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

Last Updated: