Ćwiczenie — eksplorowanie interfejsu użytkownika programu Visual Studio Code
Program Visual Studio Code udostępnia narzędzia dla deweloperów, którzy dopiero zaczynają, ale jest również rozszerzalny i wystarczająco zaawansowany dla profesjonalnych deweloperów.
W tym ćwiczeniu otworzysz program Visual Studio Code i ukończysz krótki przewodnik po interfejsie użytkownika.
Otwórz program Visual Studio Code i sprawdź stronę powitalną
Użyj menu Start systemu Windows, aby otworzyć program Visual Studio Code.
Jeśli otworzysz menu Start systemu Windows, program Visual Studio Code powinien zostać wyświetlony jako ostatnio dodana aplikacja. Możesz również przewinąć w dół, aby znaleźć program Visual Studio Code.
Inną opcją jest wpisenie programu Visual Studio Code w polu Windows Search na pasku uruchamiania w dolnej części ekranu.
Zwróć uwagę, że program Visual Studio Code otwiera stronę "Witamy", która zawiera niektóre linki i inne informacje.
Przy pierwszym otwarciu programu Visual Studio Code na stronie powitalnej zostaną wyświetlone przydatne przewodniki, takie jak zawartość Rozpoczynanie pracy z programem VS Code . Możesz zapoznać się z tymi informacjami w dogodnym dla siebie czasie.
Aby zamknąć stronę Powitalną, wybierz przycisk Zamknij (widoczny jako X w interfejsie).
Każda otwarta strona w Edytorze zawiera przycisk Zamknij (X) znajdujący się po prawej stronie tytułu strony. Karta Strona powitalna jest wyświetlana w lewej górnej części okna programu Visual Studio Code poniżej menu głównego. Jeśli umieścisz wskaźnik myszy na X, zostanie wyświetlony wyraz Zamknij .
Zbadaj pasek działań i pasek boczny
Zwróć uwagę, że pasek boczny po prawej stronie paska działania jest zwinięty.
Możesz pamiętać, że pasek działania to pionowa lista ikon po lewej stronie okna programu Visual Studio Code. Zawartość paska bocznego zależy od aktualnie wybranego elementu na pasku działania.
Umieść wskaźnik myszy na pasku Działania, a następnie umieść wskaźnik myszy na każdej z ikon, aby wyświetlić etykiety.
Po umieszczeniu wskaźnika myszy na ikonach zostanie wyświetlona etykieta. Na poniższej ilustracji powinny zostać wyświetlone przyciski Paska działań:
Od góry do dołu ikony paska aktywności to: Eksplorator, Wyszukiwanie, Kontrola źródła, Uruchamianie i debugowanie, Rozszerzenia, Konta i Zarządzanie.
Na pasku Działania wybierz pozycję Eksplorator.
Pasek boczny powinien zostać otwarty i wyświetlić informacje kontekstowe.
Zwróć uwagę, że pasek boczny ma teraz etykietę EXPLORER.
Widok EXPLORER służy do uzyskiwania dostępu do/eksplorowania folderów projektu i plików kodu.
Program Visual Studio Code zapamiętuje historię pracy i otwiera najnowsze pliki projektu po jego otwarciu. Ponieważ po raz pierwszy otwarto program Visual Studio Code, nie jest otwarty żaden folder projektu.
Na pasku działań wybierz pozycję rozszerzenia .
Zwróć uwagę, że pasek boczny ma teraz etykietę EXTENSIONS.
Poświęć chwilę, aby przeanalizować informacje wyświetlane w widoku ROZSZERZENIA.
Rozszerzenia programu Visual Studio Code umożliwiają dodawanie języków kodowania, debugerów i innych narzędzi do środowiska w celu obsługi przepływu pracy programowania. W dalszej części tego modułu zainstalujesz rozszerzenie języka C#.
Na pasku Działania, aby zamknąć pasek boczny ROZSZERZENIA , wybierz pozycję Rozszerzenia.
Zapoznaj się z górnymi opcjami menu
Aby wyświetlić opcje menu Plik, wybierz pozycję Plik.
Zwróć uwagę na opcje Nowe, Otwarte, Zapisz i Zamknij wymienione w menu Plik .
Pośmiń minutę, aby sprawdzić opcje menu Edycja , a następnie każdą z pozostałych elementów menu najwyższego poziomu.
Zwróć uwagę, że kilka menu zawiera opcje interakcji z kodem.
Przykład:
- Menu Edycja zawiera opcje znajdowania, zastępowania i przełączania komentarzy do kodu, a także standardowych operacji wycinania, kopiowania, wklejania, cofania i ponownego przełączania.
- Menu Wybór zawiera opcje wybierania wierszy kodu i manipulowania nimi.
- Menu Uruchom zawiera opcje uruchamiania i debugowania aplikacji.
W menu Terminal wybierz polecenie New Terminal (Nowy terminal).
Pośmiń chwilę na zapoznanie się z zawartością panelu terminalu.
Możesz przełączać się między kartami (PROBLEMY, DANE WYJŚCIOWE, KONSOLA DEBUGOWANIA i TERMINAL) i umieścić wskaźnik myszy nad przyciskami (w prawym górnym rogu), aby wyświetlić etykiety przycisków.
Zwróć uwagę, że panel terminalu zawiera wiersz polecenia.
Panel terminalu może służyć do uruchamiania poleceń interfejsu wiersza polecenia (CLI). Później w tym module będziesz używać poleceń .NET CLI.
W prawym górnym rogu panelu Terminal wybierz pozycję X (Zamknij panel).
W menu Widok wybierz pozycję Paleta poleceń
Paleta poleceń może służyć do znajdowania i uruchamiania różnych przydatnych poleceń. Nie masz teraz czasu (lub potrzeby), aby je szczegółowo zbadać, ale dobrze jest wiedzieć, gdzie znaleźć paletę poleceń.
Na oknie palety poleceń wpisz rozszerzenia
Zwróć uwagę, że lista poleceń jest filtrowana na podstawie wpisu.
Aby zaktualizować filtrowaną listę poleceń, zmień rozszerzenia na pomoc
Z listy opcji poleceń wybierz pozycję Pomoc: interaktywny edytor w placu zabaw.
Dokument Plac zabaw dla edytora, który zostanie otwarty w edytorze, zawiera listę aktywności interaktywnych.
Z listy punktowanej działań interaktywnych wybierz pozycję Formatowanie.
Pośmiń minutę na zapoznanie się z opcjami formatowania.
Podczas działań będziesz używać poleceń formatowania kodu, aby dowiedzieć się więcej na temat programowania w języku C#.
Zamknij dokument "Editor Playground".
To kończy przewodnik po interfejsie użytkownika programu Visual Studio Code. Po rozpoczęciu kodowania materiały szkoleniowe będą nadal wskazywać sposoby, w jakie program Visual Studio Code może zwiększyć produktywność.