TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Vítáme vás u prvního článku, který odstartuje, dovolujeme si tvrdit, první seriál o Microsoft Expression Blend na českém Internetu. V dnešním díle probereme, co to Blend je, a ukážeme si základní práci s ním.
Co je Blend a k čemu se používá
Možná jste zaregistrovali Chrastyho články o adresáři ve WPF nebo o malování. Příklady jsme dělali ve Visual Studiu 2008, ale hlavní „tahák“ WPF a Silverlightu je bohaté uživatelské rozhraní. Možná vás napadla otázka „Kam se podělo?“. Vždyť Visual Studio poskytuje minimální možnosti upravení formuláře (resp. okna, podle názvosloví WPF), nedej bože kdybychom chtěli udělat nějakou animaci. A tady přichází ke slovu aplikace Blend od Microsoftu.
Blend není nic jiného než XAML WYSIWYG (What You See Is What You Get – „Co vidíš, to dostaneš“) editor. Umožňuje snadno vytvářet barevné přechody, animace, upravovat stávající kontroly, prostě vše, co vás může okolo návrhu GUI aplikace vůbec napadnout. Samozřejmě obsahuje i přímý editor XAML kódu, jen C# (nebo VB.NET) kód musíte upravovat externě, třeba ve Visual Studiu. Spoustu Silverlight ukázek vytvořených v Blendu naleznete na Community webu Expression produktů, případně i na hlavním webu Silverlightu.
V době psaní článku existují tři verze Blendu, jedna je prodávaná jako součást balíku Microsoft Expression (build 1083), druhá se jmenuje Blend 2, do prodeje vyšla jako součást Expression Studio 2, a třetí je Preview verze z června 2008 (Blend 2.5 June 2008 Preview). Třetí jmenovaná vám bude legálně fungovat i bez jakéhokoliv sériového čísla do ledna 2009, i to je jeden z důvodů, proč nás bude seriálem provázet tato verze. Důvod číslo dva je i podpora Silverlight 2 beta 2, ke kterému se určitě v budoucnu dostaneme. Sám používám tuto verzi už od chvíle, co se objevila na Internetu, je naprosto stabilní a není nijak omezená ve funkčnosti. Než se podíváme na samotný Blend, ještě zmíním, že celá aplikace je udělaná pomocí WPF (Windows Presentation Foundation).
Blend 2.5 June 2008 Preview stáhneme ze stránek Microsoft, pro instalaci budete potřebovat .NET Framework 3.5.
První spuštění
Po prvním spuštění Blendu na vás vykoukne okno podobné tomu na obrázku, jen na záložce Projects nebudete mít historii otevřených projektů.
Dovolím si malou odbočku: na záložce Help naleznete odkaz na stránku s online tutoriály, kde můžete najít výborné video tutoriály na Blend, ale i na ostatní aplikace z balíku Expression. Za zmínku stojí i záložka Samples, pod kterou se ukrývá několik ukázkových WPF aplikací jako třeba piáno, nebo fotoalbum.
Na záložce Projects klikneme na New Project…, otevře se nám nové okno, kde máme možnost výběru z několika možností, WPF Application (.exe), WPF Control Library, Silverlight 1 Site, Silverlight 2 Application. Vybereme WPF Application (.exe), zadáme jméno aplikace, vybereme umístění, dále určíme, v kterém jazyce budeme náš program dělat. Na výběr máme C# a Visual Basic. Já použiju můj velmi oblíbený C#. Jako poslední zvolíme verzi .NET Frameworku.
Po kliknutí na tlačítko OK se před námi zobrazí okno s naším projektem.
Pracovní plochu Blendu můžeme rozdělit na čtyři části.
- Panel nástrojů
- Interakce (Spouštěče (Triggers), Seznam prvků a časových os (Object and Timeline))
- Samotný designér aplikace
- Pravý panel, který se dělí na 3 záložky
- Projects ("Solution Explorer", Správce dat (Data))
- Properties
- Resources
Nástrojový panel
V této poslední části úvodního dílu seriálu si popíšeme nástrojový panel.
Selection (Výběr)
Tenhle nástroj budeme používat asi nejvíce, název mluví sám za sebe. Krom výběru použijeme tento nástroj pro posun prvků na správnou pozici, změnu jejich velikosti, rotaci a zakulacení rohů obdélníkovitých těles.
Direct Selection (Přímý výběr)
Tento nástroj oceníme v případě, kdy pracujeme s vektory (což je v Blendu většina času). Pomocí přímého výběru se dá snadno a rychle upravit jakýkoli obrazec.
Pan (Posun)
Slouží k posouváním celým oknem v momentech, kdy máme přiblíženou určitou část našeho formuláře. Za zmínku stojí, že pokud 2× poklepeme na tento nástroj, formulář se vrátí zpátky na střed obrazovky.
Zoom (Lupa)
K tomu to nástroji není potřeba psát žádná další komentář. Upozorním vás jen na to, že pokud na tento nástroj 2× poklepeme, přiblížení se vrátí na výchozí hodnotu.
Camera Orbit (Posun kamery)
Pro pohyb kamerou při vytváření 3D aplikací.
Eyedropper (Kapátko)
Myslím, že tuto funkce není potřeba popisovat, ale pro jistotu – slouží pro získání určité barvy, u které neznáme RGB kód. Zajímavé a velmi užitečné ale je, že náhled barvy funguje v reálném čase a i mimo pracovní okno Blendu!
Paint Bucket (Plechovka)
Slouží k vyplnění dané oblasti námi zvolenou barvou.
Brush Transform (Přechod)
Tento nástroj slouží k úpravě přechodů.
Malý trik
Po letmém seznámení se základními nástroji, se zbylými nástroji Vás budu seznamovat postupně, si ukážeme jeden trik. Tímto malým trikem určitě potěším majitele ne zrovna velkých monitorů s malým rozlišením. Těmto lidem jistě v Blendu nezbývá moc veliká plocha pro samotnou práci. Pomocí stisku klávesy F4 nebo TAB schováte jak pravý, tak levý panel a pro práci Vám zůstane luxusně veliká plocha.
Závěr
Jsme rádi, pokud čtete tyto řádky a neunudili jsme vás malou dávkou nezábavných informací. V příštím díle vytvoříme takové malé „Hello world“ ve WPF, ale již teď vás mohu ujistit, že se máte na co těšit.
