7. díl - Visual Studio - Snippety

C# .NET Visual Studio Visual Studio - Snippety

Snippety

Jednou ze zásadních funkcí Visual Studia, která výrazně zjednodušuje psaní opakujícího se zdrojového kódu, jsou snippety. Opět si otevřeme soubor regex.cs a kurzor přesuneme za začátek bloku třídy program a vytvoříme za ním nový řádek.

Vložení snippetu

Snippet lze vložit kliknutím pravého tlačítka myši přes možnost Insert Snippet.

Otevře se seznam složek obsahující snippety. Vyberme složku C# a snippet s názvem prop. Dvakrát na něj poklepejme.

Do zdrojového kódu se vloží definice vlastnosti v C# s 2 zvýrazněnými částmi (datovým typem a názvem vlastnosti).

Obě části lze přepisovat a přesouvat se mezi nimi dá tabulátorem. Jedná se o velmi rychlý způsob, jak napsat vlastnost v C#. Výhoda snippetů je že nemusíte psát omáčku okolo, jako je slovo public a oblast get a set v závorkách.

Vkládání snippetů z nabídky je docela krkolomné a proto existuje ještě jedna možnost, jak je vložit, a to tak, že do kódu ručně napíšeme jejich název a stiskneme tabulátor (v předchozích verzích Visual Studia se musel tabulátor zmáčknout 2×). Vyzkoušejme si to.

Napišme for a stiskněme tabulátor. Automaticky se doplní blok cyklu for s označenými volbami pro název proměnné a koncovou podmínku.

Všimnout si můžeme, že snippet není moc dobře odsazen - například odsazení složených závorek není podle našich představ (i když je máme vybrané v nastavení). Později, až budeme vytvářet snippety, se dozvíme, proč to mu tak je.. Teď se smiřme s tím, že odsazení budeme muset spravit ručně.

Tvorba vlastního snippetu

Velkou výhodou je možnost vytvořit si svoje vlastní snippety.

Reprezentace snippetu

Snippet je reprezentován jako XML soubor, který definuje, jak bude snippet vypadat, kde jsou oblasti k zadávání hodnot, atd…

Existující snippety

Na úvod se můžeme podívat, jak vypadají existující snippety. V nabídce tools si otevřeme, Code snippet manager.

Otevře se správce snippetů, kde jsou všechny načtené snippety.

Snippety jsou řazeny podle programovacího jazyka a výchozí je (podle abecedy) CSS, přepněme si jazyk tedy na C#. Asi tušíte, že se to dělá select-boxem Language.

Tuto strukturu, kterou vidíme, jsme již viděli, když jsme vkládali snippet do kódu. Vyberme tedy opět Visual C# a třeba cyklus for.

V pravé části okna uvidíme informace, jako je popisek snippetu, jeho zkratku, jaké typy snippet podporuje a autora snippetu. Nahoře je pak políčko s cestou k snippetu. Zkopírujme si cestu se složkou k snippetům a otevřeme ji v průzkumníkovi Windows.

Vidíme, že všechny snippety jsou v této složce pojmenovány klasicky podle svého názvu a mají příponu *.snippet. Otevřeme si snippet for. Snippet se otevře ve Visual Studiu (pokud máte přenastavené asociace souboru, tak si jej otevřete ve Visual Studiu) a uvidíme jeho strukturu XML.

Kořenovým elemenetem je element CodeSnippets (pozor na množné číslo). V tomto elementu se pak nachází elementy (v případě souboru for.snippet jen jeden) CodeSnippet. CodeSnippet má nějakou hlavičku a nějaké tělo. V hlavičce jsou definovány informace o snippetu a v jeho tělu je pak deklarace a samotný snippet.

Prakticky: tvorba vlastního snippetu

Jako nejjednodušší příklad si vytvoříme snippet, který vloží meta hlavičky s informacemi, aby webové prohlížeče načítanou stránku neukládali do cache. Snippet se tedy bude používat v jazyce HTML.

V nabídce file vyberme New > File a vyhledejme si XML soubor.

Potvrďme Open.

Vytvořme kořenový element CodeSnippets a jako jmenný prostor mu nastavme

http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet

V tomto okamžiku Visual Studio ví, jaké elementy můžeme tvořit, a okamžitě nám podtrhne koncovou značku s varováním, že element CodeSnippets není kompletní. Varování vidíme v okně Error List.

Poznámka: pokud XML nerozumíte, nemusíte to moc řešit. Jmenné prostory prakticky označují, k jakému formátu se bude dokument validovat. Nastavují se jako parametr xmlns a platí k elementu, kde jsou nastaveny a potomkům tohoto elementu. Náš kód zatím vypadá následovně.

<?xml version="1.0" encoding="utf-8"?>
<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">

</CodeSnippets>

Vložme si nový element CodeSnippet. IntelliSense již napovídá.

Teď nám Visual Studio označí element CodeSnippet se 2 varováními. Jednak musíme specifikovat parametr Format a druhak musí mít náš CodeSnippet hlavičku. Doplňme tedy parametr Format na hodnotu 1.0.0. Aktuální podporované snippety mají právě tuto verzi, pokud bychom zvolili jinou verzi a Visual Studio této verzi nebude rozumět, snippet nebude načtený (nebude fungovat). Již nám svítí jen jedno varování a to že snippet musí mít hlavičku. IntelliSense již napovídá vhodné elementy, jedná se o element Header. Poslední věc, která se mu nebude líbit, je, že nám ve snippetu chybí element Snippet, který definuje samotný kód snippetu. Pořadí hlavičky a Snippetu nesmíte zaměnit, jinak se nebude jednat o validní Snippet a Visual Studio vám ho podtrhne s varováním. Zdrojový kód snippetu vypadá následovně:

<?xml version="1.0" encoding="utf-8"?>
<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
<CodeSnippet Format="1.0.0">
        <Header>

        </Header>
        <Snippet>

        </Snippet>
</CodeSnippet>
</CodeSnippets>

Hlavička snippetu

IntelliSense již napovídá. Takže ihned (aniž bychom bloudili v dokumentaci) víme, jaké hodnoty musíme (měli bychom) vyplnit.

Půjdeme tedy od shora.

Autor

Elemet autor obsahuje jméno nebo instituci autora. Uveďme tedy svoje jméno.

<Author>Michal Žůrek</Author>
Description

Popisek, který výstižně označí, k čemu snippet slouží. V našem případě se jedná o zabránění cáchování.

<Description>Disable cache by meta tags in head element</Description>
HelpUrl

HelpUrl označeju adresu, která se otevře při vyvolání nápovědy (F1). Využijem odkazu třeba

http://stackoverflow.com/…1133/2229538

<HelpUrl>http://stackoverflow.com/a/1341133/2229538</HelpUrl>
KeyWords

Keywords označuje klíčová slova. Zadávají se v podelementech KeyWord. Použijeme třeba klíčová slova web browsers, cache, force, disable

<Keywords>
        <Keyword>web browsers</Keyword>
        <Keyword>cache</Keyword>
        <Keyword>force</Keyword>
        <Keyword>disable</Keyword>
</Keywords>
Shortcut

Označuje, pod jakou zkratkou budeme snippet vyvolávat. Měl by být krátký, protože kdyby byl dlouhý, začínal by postrádat smysl a ideálně by měl být snadno zapamatovatelný.

Vzpomeňme si na snippet prop, který označoval Property.

<Shortcut>discach</Shortcut>
SnippetTypes

Typy snippetů můžeme použít 2 (existují 3, ale ten 3 z nějakého důvodu podle dokumentace nesmíme používat). Existuje SurroundsWith a Expansion. SurroundWith vkládá snippet okolo vybrané oblasti a Expansion ke kurzoru. Nám bude stačit Expansion. Třetí typ Refactoring slouží v C# Refactoringu a nás nebude zajímat, protože jej stejně nemůžeme ve vlastních snippetech využít (a ani by to nemělo smysl).

Typ se udává v elementu SnippetType:

<SnippetTypes>
        <SnippetType>Expansion</SnippetType>
</SnippetTypes>
Title

Je samotný titulek snippetu. Jedná se o název v správci snippetů a v nabídce výběru snippetu.

<Title>Disable browser cache</Title>

Podle programátorských zásad si seřaďte elementy podle důležitosti od shora dolů (přesouvat řádky nahoru a dolů již umíte, doufám, že nebudete vyjímat a vkládat :) ) a pak přejděme k samotnému Snippetu.

Obsah snippetu

Obsah snippetu se udává v elementu Code. Code vyžaduje parametr Language, který specifikuje, o jaký programovací jazyk se jedná. Obsah kódu se udává v sekci CDATA.

<Code Language="html">
<![CDATA[
        ]]>
</Code>

V sekci CDATA budeme mít naše meta hlavičky, které najdeme v odkazu pro nápovědu.

Celý element Code bude vypadat následovně:

<Code Language="html">
<![CDATA[<meta http-equiv="cache-control" content="max-age=0" />
        <meta http-equiv="cache-control" content="no-cache" />
        <meta http-equiv="expires" content="0" />
        <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
        <meta http-equiv="pragma" content="no-cache" />]]>
</Code>

To je pro náš nejjednodušší snippet vše, uložme jej s příponou *.snippet (File > Save).

Instalace snippetů

To že jsme snippet vytvořili je sice pěkné, ale Visual Studio ještě nevím, že jej chceme použít. Otevřeme proto znova správce snippetů.

Přidání celé složky

Visual studio umí načítat snippety ze složky. Dělá se to tlačítkem Add… a následným vybráním složky.

Import snippetu

Snippety lze importovat i jednotlivě pomocí tlačítka Import… a následným vybráním snippetu.

Snippety lze načítat i ze sítě. Hodí se to zejména ve firmách, kdy zaměstnanci mezi sebou mohou snippety sdílet.

Snippet si naimportujte nebo nechte načítat složku. Pak vytvořme novou webovou stránku HTML (Fie > New > File > HTML page) a zkusme si vložit snippet. Uvidíte, že zdrojový kód se vloží.

To je pro dnešek vše, příště si vytvoříme složitější snippety.


 

Stáhnout

Staženo 18x (623 B)
Aplikace je včetně zdrojových kódů v jazyce C#

 

  Aktivity (1)

Článek pro vás napsal Michal Žůrek (misaz)
Avatar
Autor se věnuje tvorbě aplikací pro počítače, mobilní telefony, mikroprocesory a tvorbě webových stránek a webových aplikací. Nejraději programuje ve Visual Basicu a TypeScript. Ovládá HTML, CSS, JavaScript, TypeScript, C# a Visual Basic.

Jak se ti líbí článek?
Celkem (14 hlasů) :
4.928574.928574.928574.928574.92857


 


Miniatura
Všechny články v sekci
Visual Studio

 

 

Komentáře

Avatar
knebl.r_konf
Člen
Avatar
knebl.r_konf:

Snippet pro for odsadí závorky správně. Nevložil jsi ho do metody, proto se odsadil špatně

 
Odpovědět  +4 20.5.2015 9:38
Avatar
Luboš
Člen
Avatar
Luboš:

Chtěl jsem si upravit snippet cw v C# tak, aby se mi zobrazovali i uvozovky(Conso­le.WriteLine("");), ale nefunguje mi to.

 
Odpovědět 9.6.2015 13:52
Avatar
Odpovídá na Luboš
Michal Žůrek (misaz):

a co ti nefunguje. Prostě otevřeš soubor cw.snippet a doplníš si tam ". Jediný zádrhel je, že protože soubor cw je v složce Program Files, tak si ten editor pro úpravu musíš spustit jako správce.

Odpovědět 9.6.2015 15:42
Nesnáším {}, proto se jim vyhýbám.
Avatar
Luboš
Člen
Avatar
Odpovídá na Michal Žůrek (misaz)
Luboš:

Už mi to jde(metoda pokus-omyl vyšla) :) Díky za radu Michale.

 
Odpovědět 10.6.2015 15:43
Avatar
Odpovídá na Luboš
Michal Žůrek (misaz):

možná ještě detail, že se sem tam musí restartovat Visual Studio aby si je načetl. I když se mi někdy stává, že si všímá změn a reloadne si je za běhu. Možná je to v každé verzi jinak vyřešené.

Odpovědět 10.6.2015 18:49
Nesnáším {}, proto se jim vyhýbám.
Avatar
Martin Kupec
Člen
Avatar
Martin Kupec:

Dobrý seriál, i člověku, který má zkušenosti z jiných IDE to pomůže v základní orientaci ve VS a hlavně ušetřit čas.
Určitě by neškodilo před publikováním vrazit texty alespoň do Wordu, pravopisné chyby, které se nacházejí asi ve všech dílech, by se daly lehce odstranit a celkovou úroveň série by to ještě zvýšilo.

 
Odpovědět 22.10.2015 18:20
Avatar
Odpovědět 27. ledna 10:44
Nikdy neříkej nahlas, že to nejde. Vždycky se totiž najde blbec, který to neví a udělá to...
Avatar
Odpovědět 27. ledna 17:32
Nesnáším {}, proto se jim vyhýbám.
Avatar
Xan95
Člen
Avatar
Xan95:

Bude nějaký díl o Task Listu? O tokenech TODO, HACK atd. Jsem dost zapomínavý člověk a pokud např. něco odložím, tak mi TODO hodně pomáhá

 
Odpovědět 27. května 20:27
Avatar
Odpovědět 27. května 21:26
Nesnáším {}, proto se jim vyhýbám.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 10.