Hierarchie tříd ve WPF (1) Object 1 Brushes CommonDialog Colors FileDialog Fonts OpenFileDialog MessageBox SaveFileDialog PrintDialog DispatcherObject MarkupExtension Application ArrayExtension Style BindingBase DependencyObject Binding DependencyProperty RelativeSource RoutedEvent StaticExtension EventManager TypeExtension 1 01/01/2019

Hierarchie tříd ve WPF (2) DependencyObject Freezeable TriggerBase Visual Animatable Trigger Vieport3DVisual Brush DataTrigger UIElement Drawing EventTrigger FrameworkElement Geometry MultiTrigger PathSegment TimeLine 01/01/2019

Hierarchie tříd ve WPF (3) FrameworkElement 2 Control ItemsControl ContentControl HeaderedItemsControl Label MenuItem ListBoxItem ToolBar ButtonBase MenuBase Button Menu ToggleButton Selector CheckBox ComboBox RadioButton ListBox ToolTip TabControl Window StatusBar RangeBase TextBoxBase ScrollBar TextBox 1 2 ProgressBar RichTextBox 01/01/2019

Hierarchie tříd ve WPF (4) 1 FrameworkElement Shape Panel Image TextBlock Ellipse Canvas Line DockPanel Path Grid Polygon StackPanel Polyline WrapPanel Rectangle 01/01/2019

Hierarchie tříd ve WPF (5) Třída DispatcherObject: WPF používá model STA – Single Thread Affi-nity  celé uživatelské rozhraní je vlastněno jed-ním výpočetním vláknem není bezpečné manipulovat s uživatelským roz-hraním z jiného výpočetního vlákna třída DispatcherObject reprezentuje objekt, který je spojen s tzv. dispatcherem, který koordi-nuje příchozí zprávy (např. zprávy klavesnice, myši apod.) dispatcher implementuje frontu zajišťující, že se úkoly vykonávají po sobě v rámci jednoho hlav-ního výpočetního vlákna 01/01/2019

Hierarchie tříd ve WPF (6) Třída MarkupExtension: základní třída pro implementaci značkovacích rozšíření jazyka XAML, které jsou podporovány .NET Frameworkem Třída DependencyObject: základní třída pro objekty, které mohou podporo-vat tzv. závislé vlastnosti (dependency properties) definuje metody GetValue a SetValue umož-ňující čtení a zápis hodnot závislých vlastností Třída Freezeable: třída, z níž jsou odvozeny objekty, které mohou být „zmrazeny“ do stavu pouze pro čtení 01/01/2019

Hierarchie tříd ve WPF (7) zmrazené objekty mohou být následně bezpečně sdíleny mezi výpočetními vlákny zmrazený objekt nemůže být uveden zpátky do „nezmrazeného“ stavu, je zapotřebí vytvořit jeho nezmrazenou kopii (klon) Třída Visual: bázová třída pro objekty, které mají svoji vizuální reprezentaci Třída UIElement: třída, na jejímž základě jsou vytvářeny objekty podporující např. směrované události (routed events), spolupráci s rozvržením (layout), zpra-cování vstupu, příjem vstupního zaměření (focus) 01/01/2019

Hierarchie tříd ve WPF (8) Třída FrameworkElement: třída přidávající podporu pro styly, datové vazby (data binding), zdroje (resources) a mechanismy pro prvky jako jsou např. kontextová menu nebo „bublinové“ nápovědy Třída Control: základní třída pro běžné ovládací prvky (tlačítka, listboxy, menu apod.) Třída Shape: třída pro práci s geometrickými útvary, které lze použít podobně jako tradiční ovládací prvky Třída Panel: třída pro prvky, které mohou obsahovat a řídit uspořádání dceřiných objektů (např. rozvržení) 01/01/2019

XAML (1) XAML – Extensible Application Markup Language Poznámka: XAML je vyslovován jako [zæməl] Deklarativní značkovací jazyk založený na jazyku XML Mezi jeho úkoly patří: zjednodušení tvorby uživatelského rozhraní lepší oddělení uživatelského rozhraní od aplikační logiky Dovoluje lepší rozdělení práce mezi návrháře designu a programátora 01/01/2019

XAML (2) Při práci s jazykem XAML platí: každý element v XAML je mapovaný na instanci třídy v .NET Frameworku: jméno elementu přesně odpovídá názvu třídy např. element <Button> dává pokyn k vytvoření ob-jektu na základě třídy Button elementy mohou být do sebe vnořovány vlastnosti objektu mohou být nastaveny pomocí atributů (u složitějších vlastností bývá nutné použít vnořené značky) v době překladu je zápis v XAML konvertován do jazyka BAML (Binary Application Markup Lan-guage), který je připojen k výslednému programu 01/01/2019

XAML (3) Při vytvoření nového projektu ve WPF Visual Studio generuje následující XAML dokument: <Window x:Class = ”WpfApplication1.MainWindow” xmlns = ”http://schemas.microsoft.com/ winfx/2006/xaml/presentation” xmlns:x = ”http://schemas.microsoft.com/ winfx/2006/xaml” Title = ”MainWindow” Height= ”350” Width = ”525”> <Grid> </Grid> </Window> 01/01/2019

XAML (4) Obsahuje dva elementy: Window: hlavní okno aplikace s titulkem MainWindow, výškou 350 DIP a šířkou 525 DIP Grid: rozvržení (layout) sloužící pro umisťování ovládacích prvků může být nahrazen jiným typem rozvržení (např. Stack-Panel, WrapPanel, DockPanel, Canvas) Atributy xmlns slouží k deklaraci jmenných prostorů: 01/01/2019

XAML (5) http://schemas.microsoft.com/ winfx/2006/xaml/presentation: hlavní jmenný prostor WPF zahrnuje všechny třídy WPF včetně ovládacích prvků sloužících k vytváření uživatelských rozhraní deklarován bez prefixu  jedná se o implicitní jmenný prostor pro celý dokument pokud není specifikováno jinak, pracuje se s tímto jmenným prostorem http://schemas.microsoft.com/winfx/2006/xaml: jmenný prostor, který podporuje konstrukce jazyka XAML 01/01/2019

XAML (6) Atribut Class: je umístěn ve jmenném prostoru XAML mapován na prefix x může být použit umístěním symbolu x a symbolu : před název elementu (atributu) Atribut Class: je umístěn ve jmenném prostoru XAML propojuje částečné třídy mezi XAML a kódem na pozadí dává pokyn k vygenerování třídy se jménem MainWindow (definované ve jmenném prostoru WpfApplication1), která je odvozena od třídy pojmenované XAML elementem (Window) tato třída zapouzdřuje chování hlavního okna aplikace 01/01/2019

XAML (7) Pro zpřístupnění ovládacích prvků z kódu na pozadí je zapotřebí v jejich elementech uvést atribut Name (x:Name): např.: <Button Name = ”btnTlacitko” … /> poznámka: zápis x:Name je zapotřebí použít v případě, že odpoví-dající třída nedefinuje svou vlastní vlastnost Name 01/01/2019

XAML (8) Content property: vlastnost, která přijímá hodnotu (je nastavena) na základě obsahu elementu definována atributem [ContentProperty] (nebo [ContentPropertyAttribute]) za-pisovaným před definicí třídy odvozené třídy (potomci) tuto vlastnost dědí příklad: [ContentPropertyAttribute(”Content”)] public class ContentControl : Control, IAddChild 01/01/2019

Vlastnosti a události v XAML (1) Jednoduché vlastnosti (simple properties): zapisovány pomocí odpovídajícího atributu např.: <Button Name = ”btnTlacitko” Content = ”Tlačítko” Width = ”100” Height=”30” /> nebo (vlastnost Content je pro třídu Button definována jako content property) <Button Name = ”btnTlacitko” Width = ”100” Height = ”30”> Tlačítko </Button> 01/01/2019

Vlastnosti a události v XAML (2) Složené vlastnosti (complex properties): vlastnosti (typu třída), obsahující další vlastnosti zapisovány přidáním dceřiných elementů se jmé-nem ve tvaru JmTypu.JmVlastnosti dceřiný element nemůže obsahovat vlastní atributy příklad 1: <Grid> <Grid.RowDefinitions> <RowDefinition Height = ”100”/> <RowDefinition Height = ”*”/> <RowDefinition Height = ”100”/> </Grid.RowDefinitions> </Grid> 01/01/2019

Vlastnosti a události v XAML (3) příklad 2: (tlačítko obsahující zelený čtverec s červeným okrajem) <Button Name = ”btnCtverec”> <Button.Content> <Rectangle Height = ”40” Width = ”40” Fill = ”Green” Stroke = ”Red” /> </Button.Content> </Button> lze vynechat 01/01/2019

Vlastnosti a události v XAML (4) Značkovací rozšíření (markup extensions): používána např. při: nastavení vlastnosti podle již existujícího objektu dynamickém navázání vlastnosti na vlastnost jiného objektu lze zapsat: ve formě atributů (uzavřených mezi symboly {}) ve tvaru {MarkupExtensionClass Argumenty} pomocí vnořených značek např.: <Button … Foreground = ”{x:Static SystemColors.WindowBrush}” /> 01/01/2019

Vlastnosti a události v XAML (5) poznámka: x:Static označuje třídu StaticExtension ve jmenném prostoru XAML slovo Extension je obecně možné vynechat nebo: <Button … > <Button.Foreground> <x:Static Member = ”SystemColors.WindowBrush”> </x:Static> </Button.Foreground> </Button> 01/01/2019

Vlastnosti a události v XAML (6) Přidružené vlastnosti (attached properties): definovány v jiné třídě, než je třída ovládacího prvku, jehož nastavení je prováděno obvykle používány při práci s rozvržením zapisovány ve tvaru JmTypu.JmVlastnosti jsou převáděny na volání metod např.: <Button Name = ”btnTlacitko” Content = ”Tlačítko” Grid.Row = ”1” Grid.Column = ”2” /> 01/01/2019

Vlastnosti a události v XAML (7) Události (events): zapisovány pomocí atributů podobně jako jedno-duché vlastnosti zápis se provádí ve tvaru: událost = ObslužnáMetoda např.: <Button Name = ”btnTlacitko” Content = ”Tlačítko” Grid.Row = ”1” Grid.Column = ”2” Click = ”btnTlacito_Click” /> předpokládá, že v kódu na pozadí existuje metoda btnTlacito_Click 01/01/2019

Vlastnosti a události v XAML (8) Poznámka: nastavení vlastností a událostí u ovládacího prvku může být zapsáno v libovolném pořadí překladač provádí přiřazení jejich hodnot vždy v následujícím pořadí: vlastnost Name (okamžitě po vytvoření objektu) události (přiřazení obslužných metod) zbývající vlastnosti (přiřazení hodnot) tento mechanismus zabezpečuje, že mohou být vyvolány a obslouženy události vzniklé jako reakce na nastavení vlastnosti 01/01/2019

Konvertory typů (1) Třídy odvozené z třídy TypeConverter Automaticky uplatňovány v okamžiku, kdy v jazyku XAML je pomocí řetězce nastavová-na vlastnost jiného typu než string nebo object Příklad: <Button Content = ”OK” Background = ”White”/> Vlastnost Background je nastavována na hodnotu typu string, přičemž je typu Brush 01/01/2019

Konvertory typů (2) WPF poskytuje celou řadu konvertorů pro růz-né datové typy (např. Brush, Color, Point apod.) a umožňuje i definici konvertorů vlast-ních Bez existence konvertoru pro typ Brush by bylo nutné psát: <Button Content = ”OK”> <Button.Background> <SolidColorBrush Color = ”White”/> </Button.Background> </Button> 01/01/2019

Konvertory typů (3) Výše uvedený zápis spoléhá na typový konver-tor pro typ Color Bez něj by bylo nutné psát: <Button Content = ”OK”> <Button.Background> <SolidColorBrush> <SolidColorBrush.Color> <Color A = ”255” R = ”255” G = ”255” B = ”255”/> </SolidColorBrush.Color> </SolidColorBrush> </Button.Background> </Button> 01/01/2019

Konvertory typů (4) V případě uvedeného zápisu je nutné opět využít typový konvertor, tentokrát pro převod řetězcových hodnot na hodnoty typu byte (pro vlastnosti A, R, G, B) 01/01/2019

Layout (1) Layout (rozvržení, rozložení) – speciální ov-ládací prvky (kontejnery), do kterých je mož-né vkládat další dceřiné ovládací prvky Umožňují relativní umisťování ovládacích prvků (elementů): zvyšuje schopnost adaptovat se na změny velikos-ti okna (displeje) Ovládací prvky mnohdy nemají explicitně na-stavenu velikost: jejich velikost se přizpůsobuje jejich obsahu velikost je možné omezit nastavením maximální, resp. minimální velikosti 01/01/2019

Layout (2) Ovládací prvky nejsou většinou umisťovány na konkrétní pozici zadanou souřadnicemi v okně: jsou uspořádávány rozvržením v závislosti na velikosti, pořadí a informacích specifických pro dané rozvržení přidání dodatečného místa mezi ovládací prvky se realizuje nastavením okrajů (vlastnost Margin) Rozvržení mohou být do sebe vnořována: jako primární rozvržení se většinou používá Grid, který může obsahovat další rozvržení pro organizaci menších skupin ovládacích prvků 01/01/2019

Layout (3) Zpracování rozvržení probíhá ve dvou fázích: měření (measure): kontejner v cyklu prochází své dceřiné elementy a zjiš-ťuje jejich preferovanou velikost není-li možné respektovat preferovanou velikost (kon-tejner není dostatečně velký), dochází o oříznutí dceři-ného elementu uspořádání (arrange): fáze, ve které jsou dceřiné elementy umístěny na ur-čenou (vypočítanou) pozici Všechna rozvržení ve WPF jsou odvozena od třídy Panel  poskytují např. vlastnosti: 01/01/2019

Layout (4) Background: štětec použitý pro vykreslení pozadí není-li nastavena, pak rozvržení nereaguje na události myši Children: kolekce položek, jež jsou v panelu uloženy každá položka může obsahovat další položky Jednotlivá rozvržení ve WPF jsou implemen-tována pomocí tříd (Grid, StackPanel, WrapPanel, DockPanel , Uniform-Grid a Canvas) definovaných ve jmenném prostoru System.Windows.Controls 01/01/2019

Grid (1) Nejčastěji používaný typ rozvržení Nabízen jako implicitní rozvržení při vygene-rování nového projektu v MS Visual Studiu Mřížka podobná tabulce v HTML Vnitřním prvkům se nastavuje pomocí přidru-žených vlastností řádek (Grid.Row) a slou-pec, do kterého patří (Grid.Column) Není-li u prvku nastavení řádku, resp. sloupce provedeno, pak se implicitně nastaví na 0 Většinou v jednom poli bývá jeden prvek 01/01/2019

Grid (2) Jestliže prvky nemají explicitně nastavenou velikost, pak jsou roztaženy přes celou buňku Definice řádků, resp. sloupců se provádí po-mocí vlastností: RowDefinitions: představuje kolekci řádků jednotlivé řádky jsou definovány na základě třídy (jako elementy) RowDefinition ColumnDefinitions: představuje kolekci sloupců jednotlivé sloupce jsou definovány na základě třídy (jako elementy) ColumnDefinition 01/01/2019

Grid (3) Poznámka: při nastavení výšky řádku i šířky sloupce lze po-užít symbol ”*” vyjadřující, že řádek (sloupec) se bude proporcionálně zvětšovat (zmenšovat) Grid také umožňuje, aby ovládací prvek byl roztažen přes více řádků (sloupců) tabulky Tohoto lze dosáhnout použitím přidružených vlastností: Grid.RowSpan: specifikuje, přes kolik řádků se má prvek zobrazit Grid.ColumnSpan: specifikuje, přes kolik sloupců se má prvek zobrazit 01/01/2019

StackPanel Jednotlivé ovládací prvky umisťuje jeden za druhým (horizontálně nebo vertikálně) Horizontální, resp. vertikální umisťování je dáno hodnotou vlastnosti Orientation Není-li specifikováno jinak (pomocí vlastnos-tí Margin, Width, Height, Horizon-talAlignment, VerticalAlignment), jsou ovládací prvky roztaženy přes celou: šířku: Orientation = ”Vertical” výšku: Orientation = ”Horizontal” 01/01/2019

WrapPanel Pracuje „podobně“ jako rozvržení StackPanel Ovládací prvky jsou umísťovány: vedle sebe na řádek za sebou do sloupce Směr umisťování je dán opět hodnotou vlast-nosti Orientation Pokud se některý prvek na řádek (do sloupce) nevejde, pak dojde k zalomení a prvek je zobrazen na dalším řádku (v dalším sloupci) 01/01/2019

DockPanel Umožňuje připoutání prvku k jedné ze čtyř stran Strana, ke které bude ovládací prvek připou-tán se nastavuje pomocí připojené vlastnosti DockPanel.Dock Poznámky: při použití DockPanelu závisí na pořadí, ve kte-rém jsou jednotlivé prvky připoutávány (vede to k různému uspořádání) je možné, aby k jedné straně bylo připoutáno více prvků 01/01/2019

Canvas Dovoluje umístění prvku na absolutní pozici Používán většinou jako vykreslovací plátno Pozici v Canvasu lze zadat pomocí přidruž. vlastností Canvas.Left a Canvas.Top nebo Canvas.Right a Canvas.Bottom Lze také využít vlastnost ClipToBounds, která umožňuje ořezávání elementů na hranici Canvasu Pro nastavení pořadí překrývajících se elemen-tů se používá přidružená vlastnost Canvas.ZIndex 01/01/2019