Tipy pro programování ve Visual Studio Code s odečítačem na Windows

Adam Samec

Pro softwarové vývojáře v systému Windows je obecně k dispozici nepřeberné množství vývojových prostředí nebo pokročilých textových editorů. Jen hrstka jich je ale natolik přístupná, aby s nimi mohli naplno počítat i programátoři, kteří využívají odečítač obrazovky. Abych vám usnadnil hledání a osvojení toho pravého řešení, sepsal jsem tento článek, který jedno takové řešení dále přibližuje, konkrétně půjde o aplikaci Visual Studio Code. Text navazuje na článek, který se věnuje Visual Studio Code z obecného hlediska jako pokročilému textovému editoru, v němž jsem již představil jeho podstatné funkce a popsal, v čem je pro nás jako editor výjimečný.

Poznámky

Některé zde uvedené klávesové zkratky používají zápis ve tvaru například „Control + K, C“, což znamená, že nejprve je třeba stisknout klávesy Control + K, pak uvolnit klávesu K a poté Se stále podrženou klávesou Control stisknout klávesu C.

Okno pro vyhledávání a vyvolávání příkazů

Visual Studio Code disponuje velmi šikovnou funkcí vyhledávání všech dostupných příkazů přes klávesovou zkratku Control + shift + P nebo F1, která přesune fokus do editačního pole, kam můžete zadat jen část jména hledaného příkazu a šipkou dolů procházet jejich vyfiltrovaný seznam. Klávesou Enter stisknutou na vybraném příkazu je možné jej vyvolat. U každého příkazu je rovněž uvedena klávesová zkratka, pokud nějakou daný příkaz má. Tento seznam tedy může dobře posloužit i jako nástroj pro učení se klávesových zkratek.

Rychlý pohyb ve zdrojovém kódu

To, co činí z Visual Studio Code výjimečné vývojové prostředí, je krom jiného velmi dobře přístupná podpora příkazů pro pohyb v kódu, které fungují v mnoha programovacích jazycích.

• Pro rychlé vyhledání a přeskočení na definici požadovaného symbolu, tedy pro skok na definici hledané proměnné, funkce, třídy atd., slouží klávesová zkratka Control + Shift + O, jež vyvolá okno, ve kterém můžete klávesovou šipkou dolů nebo nahoru vybrat hledaný symbol, přičemž nabízený seznam symbolů lze vyfiltrovat vepsáním části jejich názvu a Enterem na vybraný symbol v kódu přeskočit.
• Jestliže kurzor stojí na nějakém symbolu, tak je možné rychle přeskočit Na jeho definici zkratkou F12.
• Pro zobrazení seznamu všech výskytů symbolu, na němž stojí kurzor, slouží zkratka Shift + F12,přičemž prohledávány jsou výskyty napříč všemi soubory právě otevřené složky či projektu. Zde je opět možné klávesovou šipkou dolů nebo nahoru vybrat požadovaný výskyt a Enterem na něj přeskočit.
• Pro přesun na následující nebo předchozí výskyt chyby nebo varování napříč otevřenými soubory slouží zkratka F8, respektive Shift + F8.
• Pro přesun na následující nebo předchozí změnu v aktuálním souboru oproti výchozímu stavu ve verzovacím systému Git slouží zkratka Alt + F5, respektive Alt + Shift + F5.

Rychlý pohyb a orientace v rámci bloků kódu

Jestliže programový kód obsahuje množství zanořených bloků kódu, které typicky začínají a končí složenou závorkou v jazycích jako JavaScript nebo C#, popřípadě počátečním a koncovým tagem ve značkovacích jazycích jako HTML, tak bývá obtížné se ve struktuře kódu pomocí odečítače zorientovat. Velmi vítaným pomocníkem pak můžou být následující příkazy:

• Skákání mezi počáteční a koncovou složenou závorkou přes příkaz nazvaný „Go to Bracket“ s klávesovou zkratkou Control + Shift + apostrof.
• Skákání mezi počátečním a koncovým tagem ve značkovacím jazyce pomocí příkazu nazvaného „Emmet: Go to Matching Pair,“ bez klávesové zkratky.

Další šikovné zkratky

Nastavení vlastních klávesových zkratek

Visual Studio Code umožňuje snadno nastavit vlastní klávesovou zkratku pro libovolný příkaz, který naleznete v dříve zmíněném okně pro vyhledávání a vyvolávání příkazů. K nastavení klávesových zkratek se dostanete, když v aplikačním menu zvolíte File > Preferences > Keyboard shortcuts, a poté se tabulátorem přesunete na vámi hledanou zkratku v seznamu všech zkratek, popřípadě před přesunem na seznam zkratek můžete vepsat část názvu hledané zkratky a seznam zkratek tak vyfiltrovat. Po najetí na požadovanou zkratku stiskněte Enter, poté klávesy, které chcete přiřadit, a následně opět Enter.

Doporučení na přidání vlastních klávesových zkratek

V níže uvedené tabulce naleznete doporučení na přidání vlastních klávesových zkratek, které vám usnadní práci při řešení konfliktů během slučování příchozí a lokální varianty souborů ve verzovacím systému Git.

Usnadnění si psaní kódu pomocí jeho automatického rozšiřování zkratkami

Visual Studio Code podporuje rozšiřování kódu (code expansion) pomocí vestavěné obohacené podpory syntaxe Emmet. To znamená, že nemusíte psát celé složité konstrukty značkovacího nebo programovacího jazyka, jako celé elementy jazyka HTML, celé podmínky či cykly jazyka Javascript. Stačí napsat jistou zkratku, která v případě zkratek pro HTML vychází z CSS selektorů,  a tu automaticky rozšířit na výsledný konstrukt. Postup je následující.

Rozšiřování HTML kódu

Napište například zkratku „ul>li*3“ (bez uvozovek) a stiskněte tabulátor. Zapsaná zkratka se poté automaticky rozšíří na následující kód:

<ul>
<li></li>
<li></li>
<li></li>
</ul>

Rozšiřování programovacího kódu

Napište například zkratku „if“ (bez uvozovek), pak šipkou dolů vyberte položku „if“ a stiskněte Enter. Zapsaná zkratka se poté automaticky rozšíří na následující kód:

if (condition) {

}

Další příklady syntaxe Emmet

Další příklady syntaxe Emmet naleznete na této oficiální dokumentaci.

Zabalování a rozbalování bloků kódu

Pro zabalování a rozbalování aktuálního bloku kódu, tedy bloku kódu, na kterém stojí kurzor, se používají klávesové zkratky Control + Shift + levá hranatá závorka, respektive Control + Shift + pravá hranatá závorka (jedná se o klávesy, kde se levá nebo pravá hranatá závorka vyskytují na anglické klávesnici). S odečítačem JAWS je potřeba před použitím těchto zkratek jejich klávesy propustit stisknutím JAWSKey + klávesa s číslem 3.

Pro rekurzivní zabalování a rozbalování aktuálního bloku kódu slouží zkratky Control + K, Control + levá hranatá závorka, respektive Control + K, Control + pravá hranatá závorka.

Všechny bloky kódu v aktuálním souboru lze zabalit zkratkou Control + K, Control + klávesa s číslem 0 . Všechny bloky rozbalíte přes Control + K, Control + J.

Další zkratky pro zabalování a rozbalování (folding) naleznete zde. Vězte ale, že odečítač zabalené bloky kódu bohužel nijak neohlašuje, takže se jeví, jakoby řádky mezi začátkem a koncem zabaleného bloku kódu chyběly.

Další zdroje informací

• Visual Studio Code tips and Tricks.
• Accessibility in Visual Studio Code.

s