WPF 10 – Image, Rectangle a Border

V desiatom diely série o Windows Presentation Foundation sa pozrieme na ďalšie tri často používané prvky. Jedná sa o Image, Rectangle a Border.

Úvod

Na prvý pohľad sa môže zdať, že sa jedná o prvky, ktoré spolu vôbec nesúvisia, no túto trojicu som nevybral náhodou.

Image

Image

Ako prvý sa pozrieme na Image, čiže na obrázok. Je to jednoduchý a bežne používaný spôsob, ako do vášho programu vložiť klasický obrázok uložený na disku.

Jeho najdôležitejšou vlastnosťou pre vás bude Source, v ktorej sa nachádza adresa umiestnenia obrázku. To môže byť ako relatívna cesta v projekte, tak abstraktná cesta na disku alebo online URL.

<Image Source="C:\EP10.png"/>
<Image Source="EP10.png"/>
<Image Source="https://akoprogramovat.sk/wp-content/uploads/2015/09/EP10.png"/>

V jazyku C# potom musíte použiť triedy BitmapImage a Uri.

image.Source = new BitmapImage(new Uri("EP10.png", UriKind.Relative));
image.Source = new BitmapImage(new Uri(@"C:\EP10.png", UriKind.Absolute));
image.Source = new BitmapImage(new Uri(@"https://akoprogramovat.sk/wp-content/uploads/2015/09/EP10.png"));

Ďalšou z vlastností je Stretch. Tá vyberá spôsob roztiahnutia obrázku. Jedná sa buď o None, čiže žiadne roztiahnutie, Uniform – obrázok si zachová pôvodný tvar, ale nevyplní tak celý prvok, Fill – obrázok vyplní celý prvok, no nezachová svoj tvar a UniformToFill – obrázok sa roztiahne, aby vyplnil celý prvok a zároveň si zachová tvar, tým však niektoré časti nebudú viditeľné.

Zaujímavý je ešte StretchDirection, ktorý vyberá smer, ktorým sa bude rozťahovať.

Border

Border

Border, čiže okraj, je prvok, do ktorého môžete umiestniť iný prvok a pridať mu okrajovú čiaru. Podľa môjho názoru to nieje najideálnejšie riešenie, z akým mohlo WPF prísť, no dá sa na to zvyknúť. Tento prvok má pár výhod a aj pár nevýhod. Výhodou je, že je možné okraj zaobliť a rôzne tvarovať. Zároveň môže mať každá strana inak širokú čiaru. Nevýhoda je však, že obsah si nezachová tvar okraja.

Appearance kategórií vlastností môžete nájsť dve vlastnosti súvisiace z okrajom. Jedná sa o BorderThickness, ktorá udáva šírku jednotlivých okrajov a CornerRadius, ktorý tieto okraje zaobľuje. Farba čiary sa nastavuje v kategórií Brush ako BorderBrush.

K okrajom sa vrátime, ale teraz si ešte ukážme posledný, tretí prvok.

Rectangle

Rectangle

Rectangle je najčastejšie používaný dizajnový vektorový prvok WPF. Jedná sa o jednoduchý obdĺžnik (alebo štvorec), ktorý môžete použiť veľmi podobne ako Border.

Jeho základné vlastnosti sú RadiusX a RadiusY, ktoré slúžia na ovplyvnenie uhlu zaoblenia a tiež StrokeThickness, ktorý určuje šírku čiar. Farba čiar sa nastavuje vlastnosťou Stroke v kategórií Brush. V rozšírených vlastnostiach potom nájdete množstvo ďalších úprav.

Zaujímavé je, že narozdiel od okraja sa do obdĺžnika nedá vložiť žiadny obsah. To znamená, že ho nemôžete použiť ako okraj.

Na záver vám ešte musím povedať, že kopírovanie tvaru Borderu je možné a pozrieme sa naňho v ďalšom diely. Spolu s tým sa pozrieme aj na jednu podvlastnosť Gridu. Týmto sa s vami lúčim, dúfam že sa vám článok páčil a dodávam vám obrázok zaobleného obsahu okraja.

Image Inside Border

Pridajte Komentár

Vaša e-mailová adresa nebude zverejnená. Vyžadované polia sú označené *


The reCAPTCHA verification period has expired. Please reload the page.

Návrat hore