blend for visual studio 2015
Post on 13-Apr-2017
35 Views
Preview:
TRANSCRIPT
BLEND FOR VISUAL STUDIO 2015
Jiří DanihelkaMsFest 2015
Agenda
• K čemu nástroj Blend slouží• Vývoj verzí Blendu• Návrh GUI v Blendu• Integrace s Visual Studiem• Debugování GUI
K ČEMU NÁSTROJ BLEND SLOUŽÍ
Company Logo
K čemu Blend slouží
• Visuální vývojové prostředí pro XAML• XAML je jazyk pro popis vzhledu
uživatelského rozhraní (GUI)
• Blend umožňoje částečně rozdělit práci na vývoji aplikace mezi:– návrháře – Blend a XAML– programátora – Visual Studio a C#
Analogie s HTML
• Webový návrhář napšíe– HTML kód stránky (XAML Controls)– CSS soubory se syly (XAML Styles and Templates)
• Programátor napíše– JavaScriptový kód (C# code behind)– serverový kód (C# model layer)
• Rozdělení nefunguje na 100%
Podporované druhy aplikací• Univerzální Windows 10 aplikace (UWP)
– Windows 10– Windows 10 Mobile
• Windows 8.1 aplikace• Windows Phone 8.1 aplikace• webový Silverlight• Windows Presentation Foundation (WPF)
• Není podporováno– Windows Phone 8.1 Silverlight
Podporované jazyky
• XAML + C#• XAML + Visual Basic• XAML + C++ (C++/CX)– pouze UWP, Windows 8.1 a Windows Phone 8.1– nepodporuje Silverlight a WPF
• Není podporováno ve verzi 2015– HTML + JavaScript (WinJS/WWA)
JavaScript a Blend
• Podpora JavaScriptu byla ve verzích– Blend for Visual Studio 2012– Blend for Visual Studio 2013
• Blend se v té době nerozvíjel o nové funkce– část funkcí přešla do Visual Studia– část funkcí byla zrušena
• Ve verzi 2015 se zrušené funkce vrací zpět
JavaScript aplikace ve Windows• Jedna z možností vývoje pro Windows 8
– moderní aplikace (dříve Metro)
• Původní myšlenka:– jazyk HTML umí velké množství programátorů– vývoj HTML je levnější než XAML
• Realita:– WinJS/WWA není to samé co webové stránky– mnoho rozšíření převzatých z jazyka XAML– horší výkon aplikací– špatně dostupné výukové materiály
• Nyní odklon od silné podpory JavaScriptu
VÝVOJ VERZÍ BLENDU
Company Logo
Vývoj verzí Blendu
• Nejprve součást balíku Expression Studio
Vývoj verzí Blendu
• Následně součást Windows Phone 7 SDK
Vývoj verzí Blendu
• Součástí Visual Studia 2012• Blend for Visual Studio
Blend 2015 používá Visual Studio Shell
NÁVRH GUI BLENDU
Company Logo
První otevření v Blendu
• Spuštení přes kontextové menu na souboru– Open in Blend...
První otevření v Blendu
• Můžete se setkat s tímto:
Chyba při otevření• Konstruktory nesmí házet výjimky
– designer volá konstruktor, ale program nespouští– globální proměnné mouhou být neinicializované
• Rovněž není dobré dělat– výpočetně náročné věci v konstruktoru– vytěžování jiných prostředků
• Co s tím?– kontrola inicializace při použití objektů– přesunout kód z konstruktoru do metody Init– testovat na podmínku běhu v designeru
Design Mode if (Windows.ApplicationModel.DesignMode.DesignModeEnabled) { // falešná inicializace pro designer this.ConnectedToDatabase = true; } else { // skutečná inicializace za běhu aplikace this.ConnectedToDatabase = MyDatabase.IsConnected; //hází neošetřenou výjimku, pokud je MyDatabase null };
Data pro visuální design
• Často se data načítají až za běhu aplikace
• Typicky je se využívá rozdělení aplíkace na vrstvy podle modelu MVVM– model načítá data (z databáze, souboru, ...)– view zobrazuje data pomocí XAMLu– viewmodel propojuje model a view
• Databinding – promojení V a VM
Vzor MVVM
Blend 2015 Sample Data
Podpora pro vytváření animací
• Lze posouvat v čase pomocí Timeline
Podpora pro management stavů
• Kombinace vizuální stavů komponent
INTEGRACE S VISUAL STUDIEM
Company Logo
Integrace s Visual Studiem
• konzistentní vzhled• podobné sady příkazů– Visual Studio 2015
– Blend 2015
– Blend 2013
IntelliSense
• editor jako Visual Studio• IntelliSense pro XAML i C#
Editor Blendu 2015
• Výrazné zlepšení– dříve spíše takový Notepad
• Již se nedá přepínat do Visual Studia pro každou editaci
• Není podpora doplňků – např. ReSharper• Lepší synchronizace kódu– automatické načítání změněných souborů
Peek Definition
• Alt + F12
DEBUGOVÁNÍ GUI(ŽIVÁ UKÁZKA)
Company Logo
SHRUNUTÍ
Company Logo
Shrnutí přednášky
• Blend je vizuální vývojové prostředí pro XAML– Univerzální aplikace, Windows Phone, WPF
• S každou verzí je postupně sbližován s VS– původně samostatný SW produkt– nyní součást Visual Studia– přesun funkcí oběma směry
• Některé designovací funkce má navíc– Vyváření animací, vytváření stavů
Další zdroje informací• MVA: Windows 8.1 Design Jump Start
https://mva.microsoft.com/en-us/training-courses/windows-81-ux-design-jump-start-8235
• MVA: Designing Your XAML UI with Blendhttps://mva.microsoft.com/en-us/training-courses/designing-your-xaml-ui-with-blend-jump-start-8260
• Channel 9: New XAML Tools in Visual Studio 2015 https://channel9.msdn.com/Shows/Visual-Studio-Toolbox/New-XAML-Tools-in-Visual-Studio-2015-and-Blend
DOTAZY?
top related