Logické zdroje (1) Logické zdroje (resources) dovolují definovat hodnoty, které mohou být následně v jazyku XAML nebo v kódu na pozadí využity na růz-ných místech Definice zdroje se provádí pomocí vlastnosti Resources (obvykle na úrovni okna nebo rozložení) Vlastnost Resources definuje slovník zdro-jů (resources dictionary): seznam, který umožňuje vyhledávat položky na základě jejich klíče vyžaduje, aby každá položka měla klíč 07/08/2018

Logické zdroje (2) Zdroje definované vlastností Resources jsou dostupné ve všech vnořených elementech Při vyhledávání (zpřístupnění) zdroje se postu-puje směrem nahoru v logickém stromu Pomocí zdrojů lze definovat např.: objekty (LinearGradientBrush, Label , Thickness apod.) hodnoty (string, int apod.) Každý zdroj musí mít jedinečnou hodnotu atri-butu x:Key, pomocí níž je možné jej identifi-kovat 07/08/2018

Logické zdroje (3) Příklad: <Window.Resources> <DropShadowEffect x:Key = ”bmeButton” ShadowDepth = ”10”/> </Window.Resources> Takto definovaný zdroj může být přiřazen atri-butu (vlastnosti) jako statický zdroj pomocí StaticResource Příklad: <Button Content = ”Tlačítko” Margin = ”20” Effect = ”{StaticResource bmeButton}”/> 07/08/2018

Logické zdroje (4) Pro definici hodnot datových typů, jakou jsou např. string, int, double apod., je nutné přidat atribut se jmenným prostorem, v němž jsou tyto typy definovány: xmlns:sys=”clr-namespace: System;assembly=mscorlib” Poznámky: má-li zdroj pracovat jako dynamický, pak pro jeho přiřazení je nutné použít DynamicResource zpřístupnění zdroje z kódu na pozadí lze provést pomocí volání metody TryFindResource nebo FindResource (vrací hodnotu typu object) 07/08/2018

Styly (1) Styly ve WPF představují speciální typ zdroje Jsou definovány uvnitř Resources Jedná se o seskupení hodnot vlastností, které se váží na konkrétní třídu Umožňují aplikovat jednu definici vzhledu na více elementů prostřednictvím odkazu na zdroj Definice stylu se provádí pomocí elementu <Style>, v němž je atributem TargetType specifikována třída, na kterou bude moci být styl aplikován 07/08/2018

Styly (2) Vlastnosti a jim odpovídající hodnoty jsou specifikovány pomocí elementu <Setter>, který obsahuje atributy Property a Value Příklad: <Window.Resources> <Style x:Key = ”btnStyle” TargetType = ”Button”> <Setter Property = ”Background” Value = ”Orange”/> <Setter Property = "FontStyle" Value = ”Italic”/> </Style> </Window.Resources> 07/08/2018

Styly (3) Přiřazení stylu k ovládacímu prvku se provádí nastavením jeho vlastnosti Style na hodnotu odkazující se na příslušný zdroj Příklad: <Button Name = ”btnTlačítko1” Style = ”{StaticResource btnStyle}”> Tlačítko 1 </Button> <Button Name = ”btnTlačítko2” Style = ”{StaticResource btnStyle}”> Tlačítko 2 </Button> 07/08/2018

Styly (4) Styly podporují dědičnost: existující styl je možné pozměnit (doplnit) v defi-nici nového stylu pomocí atributu BasedOn Styl je také možné definovat jako nepojmeno-vaný (bez uvedení klíče) Nepojmenovaný styl se automaticky uplatní na všechny ovládací prvky specifikované atribu-tem TargetType, které se nachází v logic-kém podstromu popsané za definicí zdroje 07/08/2018

Spouště (1) Spouště (triggers) umožňují změnit hodnotu vlastnosti nebo provést nějakou operaci v zá-vislosti na hodnotě vlastnosti, dat nebo vzniku události Provádí změnu hodnoty vlastnosti na základě splnění určitých podmínek Dovolují dynamicky měnit vzhled ovládacího prvku bez nutnosti vytvářet prvek nový Obvykle jsou definovány na úrovni stylu dce-řiným elementem <Style.Triggers>, v němž jsou jako vnořené elementy definová-ny jednotlivé spouště 07/08/2018

Spouště (2) WPF rozlišuje tři druhy spouští: property trigger: umožňuje, aby změna hodnoty jedné vlastnosti způso-bila změnu hodnoty vlastnosti jiné definován elementem <Trigger> spoušť se aktivuje jestliže specifikovaná vlastnost (pomocí atributu Property) nabude zadané hodnoty (hodnota se zadává atributem Value) v okamžiku, kdy pomine stav, který spoušť aktivoval, dochází k navrácení do původního stavu např. pomocí vlastnosti IsMouseOver je možné změ-nit vzhled tlačítka po dobu, kdy se nad ním nachází kur-zor myši 07/08/2018

Spouště (3) data trigger: event trigger: provede operaci jestliže navázaná data (pomocí data binding) jsou rovna určité hodnotě definován elementem <DataTrigger> datová vazba se definuje atributem Binding hodnota, proti níž se provádí test se definuje atributem Value v okamžiku, kdy pomine stav, který spoušť aktivoval, dochází opět k navrácení do původního stavu event trigger: umožňuje realizovat operaci v okamžiku, kdy nastane událost (typu RoutedEvent) 07/08/2018

Spouště (4) definovány pomocí elementu <EventTrigger> událost aktivující spoušť se specifikuje atributem RoutedEvent používány souvislosti s animacemi, tzn. vyvolávají scé-náře animací obsahují vlastnost Actions, představující kolekci tzv. akcí (TriggerAction) po té, kdy skončí stav, který spoušť aktivoval, již nedo-chází k návratu do stavu původního  bývá nutné de-finovat další spoušť umožňující návrat k výchozímu stavu 07/08/2018

Spouště (5) Spouště lze kombinovat pomocí logického součtu (or) a logického součinu (and): pro implementaci logického součtu je zapotřebí definovat více spouští, které pomocí elementu <Setter> nastavují stejnou vlastnost logický součin se realizuje pomocí elementu <MultiTrigger> (<MultiDataTrigger>) podmínky v logickém součinu se definují elemen-tem <Condition>, který je vnořený do dceřiné-ho elementu <MultiTrigger.Conditions> (<MultiDataTrigger.Conditions> ) 07/08/2018

Práce s grafikou (1) Práce s 2D grafikou je ve WPF zprostředková-na pomocí abstraktní třídy Shape Na základě třídy Shape (jako její potomci) jsou definovány třídy umožňující práci se zá-kladními geometrickými útvary: Line Rectangle Ellipse Polygon Polyline Path 07/08/2018

Práce s grafikou (2) Třída Shape je (nepřímo) odvozena od třídy UIElement, což umožňuje, aby objekty vytvořené na základě jejich potomků mohly: být umísťovány do rozložení a do většiny ovláda-cích prvků (metodou Add vlastnosti Children) reagovat na události Třída Shape definuje vlastnosti, které ovliv-ňují, jak se daný útvar zobrazí, např.: Stroke: specifikuje štětec pro výplň čáry, kterou je obrazec vy-kreslován (typu Brush) není-li specifikována, pak se žádný obrazec nevykreslí 07/08/2018

Práce s grafikou (3) StrokeThickness: StrokeDashArray: Fill: Stretch: udává tloušťky čáry pro vykreslování StrokeDashArray: nastavuje (pomocí kolekce hodnot typu double) styl (přerušování) čáry Fill: definuje štětec použitý pro výplň obrazce (typu Brush) Stretch: specifikuje, jak se obrazec chová při změně hodnot jeho vlastností Height a Width lze nastavit na jednu z hodnot Fill, None, Uniform, UniformToFill 07/08/2018

Práce s grafikou (4) Pro vykreslování složitějších obrazců lze po-užít třídu Path Třída Path vykresluje obrazec popsaný ob-jekty, jež jsou vytvořeny na základě potomků abstraktní třídy Geometry: nejprve je nutné vytvořit požadovaný objekt vytvořený objekt se následně přiřadí do vlastnosti Data objektu třídy Path Mezi potomky třídy Geometry patří např. LineGeometry: úsečka zadaná souřadnicemi počátečního a koncového bodu 07/08/2018

Práce s grafikou (5) RectangleGeometry: EllipseGeometry: obdélník (čtverec) specifikovaný šířkou a výškou může mít zakulacené rohy EllipseGeometry: elipsa definovaná souřadnicemi středu a velikostí svých poloos GeometryGroup: slučuje dohromady více objektů (provádí jejich kompo-zici) CombinedGeometry: realizuje kompozici dvou objektů a na jejich plochy aplikuje booleovskou operaci (Union, Intersect, Exclude a Xor) 07/08/2018

Práce s grafikou (6) PathGeometry: geometrie složená z jednoho nebo více objektů typu PathFigure, jež se jako kolekce přiřadí do vlastnosti Figures každý objekt PathFigure reprezentuje obrazec a je složený z jednoho nebo více segmentů vytvořených na základě potomků abstraktní třídy PathSegment: počáteční bod PathFigure je dán vlastností StartPoint každý objekt potomka třídy PathSegment představuje propojenou část obrazce jednotlivé segmenty se přiřazují jako kolekce do vlastnosti Segments (objektu PathFigure) mezi potomky třídy PathSegment patří např. třídy LineSegment, BezierSegment, ArcSegment, PolylineSegment 07/08/2018

Práce s grafikou (7) PathGeometry PathFigure Figures Segments LineSgment StartPoint ArcSgment LineSgment PathFigure Segments BezierSgment StartPoint LineSgment 07/08/2018

Práce s grafikou (8) Při vykreslování obrazců lze aplikovat trans-formace implementované potomky abstraktní třídy Transform, např.: RotateTransform: otočení po směru hodinových ručiček ScaleTransform: změna měřítka (zvětšení / zmenšení) SkewTransform: sešikmení TranslateTramform: posunutí 07/08/2018

Práce s grafikou (9) Pro zjednodušení definice obrazců (vlastnosti Figures) lze také využít tzv. Path Markup Syntax (mini-language) Path Markup Syntax: umožňuje vlastnost Figures popsat jedním ře-tězcem je tvořena posloupností jednopísmenných příkazů každý příkaz je následován posloupností numeric-kých hodnot, jejichž význam je dán příkazem v kódu na pozadí je možné ji použít jako parametr statické metody Parse třídy Geometry 07/08/2018

Práce s grafikou (10) Mezi příkazy Path Markup Syntax patří např.: M: přesun kreslícího pera na zadaný bod L: vykreslení linky (posloupnosti linek) z aktuální pozice pera do koncového bodu (koncových bodů) A: vykreslení eliptického oblouku o zadaných parametrech C, Q, S, T: vykreslení Bezierovy křivky (kubické, kvadratické, hladké kubické a hladké kvadratické) Z: uzavře křivku (linkou propojí koncový a počáteční bod) 07/08/2018

Práce s grafikou (11) Pro práci s 2D grafikou lze také využít potom-ky abstraktní třídy Drawing: GeometryDrawing: kombinuje vykreslování prostřednictvím potomků třídy Geometry s použitím štětce (Brush) a kreslícího pera (Pen) ImageDrawing: vykresluje obrázek v obdélníkové oblasti definované strukturou Rect VideoDrawing: kombinuje MediaPlayer a ohraničující obdélník Rect DrawingGroup: kolekce potomků třídy Drawing 07/08/2018

Práce s grafikou (12) GlyphRunDrawing: reprezentuje objekt GlyphRun (nízkoúrovňová třída pro práci s textem) společně se štětcem (Brush) pro jeho popředí Třída Drawing není odvozena od třídy UIElement  její potomci nemají sami o sobě schopnost se zobrazovat Pro zobrazení je zapotřebí použít jeden z ná-sledujících objektů: DrawingImage: odvozen od ImageSource, tj. může být použitý uvnitř prvku Image (pomocí vlastnosti Source) vykreslovaný obsah se nastaví vlastností Drawing 07/08/2018

Práce s grafikou (13) Třída Drawing: DrawingBrush: DrawingVisual: odvozen od Brush a může být aplikován např. jako hodnota vlastnosti Foreground, Background nebo BorderBrush DrawingVisual: vizuální objekt používaný pro zobrazování vektorové grafiky Třída Drawing: je odvozena od třídy Animatable podporuje např. animace, datové vazby nebo odka-zy na zdroje 07/08/2018