IT rekvalifikace s garancí práce. Seniorní programátoři vydělávají až 160 000 Kč/měsíc a rekvalifikace je prvním krokem. Zjisti, jak na to!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

21. diel - Grafika v Xamarin.Forms - Lokálne obrázky

V minulej lekcii, Aplikácie na počasie v Xamarin.Forms - Spracovanie upraveného , sme dokončili Xamarin.Forms aplikáciu pre predpoveď počasia.

V dnešnej lekcii si popíšeme rozdiely vektorovej a rastrovej grafiky. Predovšetkým si však ukážeme, ako sa v Xamarin.Forms pracuje s lokálnymi rastrovými obrázkami.

Vektorová vs. rastrová grafika

Veľmi laicky môžeme povedať, že vektorový obrázok si môžeme zväčšiť ako chceme a nikdy sa nám nerozmaže alebo nerozpixeluje. To je veľmi lákavé, pretože takýto obrázok je plne responzívne a stále 100% ostrý, navyše zaberá veľmi málo pamäte a naše aplikácie potom vyzerá na všetkých zariadeniach rovnako pekne. Niet divu, že napr. SVG ikony sú dnes na webe veľmi populárne. A aj my budeme vektorové ikony vo svojich aplikáciách preferovať.

Vektorový obrázok

Vektorový obrázok v sebe obsahuje matematický zápis súradníc bodov (vrcholov) a ich spojníc (hrán), ktorý vytvára požadovaný obrazec (napr. Trojuholník, kruh, štvorec ...). Kombinovaním a prelínaním týchto obrazcov sa potom vytvárajú obrazce zložitejšie. Ďalej sa vo vektorových obrázkoch špecifikujú informácie ako hrúbka čiary, farba výplne atď. Z toho vyplýva, že s akýmkoľvek zväčšením či zmenšením obrazce sa mení len pomer vzdialeností medzi vrcholmi.

Rasterizácia

A ako sa krivky vykreslí? To, čo potom vidíme na obrazovke, sa musí samozrejme znova "rasterizovat", čiže vykresliť na 2D ploche nášho monitora:

Ako sami vidíte, vykreslenie vektorového obrázku na obrazovku vytvára pri malom počte pixelov "schody" čiže aliasing. Xamarin.Forms za nás však uplatňuje pokročilejšie algoritmy, tzv. Anti-aliasing, aby boli jednotlivé krivky obrázka vyhladené.

Rastrový obrázok

Naopak bitová mapa,


 

...koniec náhľadu článku...
Pokračuj ďalej

Vedomosti v hodnote stoviek tisíc získaš za pár korún

Minul si až sem a to je super! Veríme, že ti prvé lekcie ukázali niečo nového a užitočného.
Chceš v kurze pokračovať? Prejdi do prémiové sekcie.

Kúpiť tento kurz

Kúpiť všetky aktuálne dostupné lekcie s funkciou odovzdávanie úloh a certifikátom iba za 1 200 kreditov
Aktuálny stav konta 0 kreditov
Kúpou tohoto balíčku získaš prístup ku všetkým 38 článkom (26 lekcií, 7 testov, 5 praktických cvičení) tohoto kurzu.

Obsah článku spadá pod licenciu Premium, kúpou článku súhlasíš so zmluvnými podmienkami.

Čo od nás v ďalších lekciách dostaneš?
  • Neobmedzený a trvalý prístup k jednotlivým lekciím.
  • Kvalitné znalosti v oblasti IT.
  • Zručnosti, ktoré ti pomôžu získať vysnívanú a dobre platenú prácu.

Popis článku

Požadovaný článok má nasledujúci obsah:

V Xamarin tutoriálu si popíšeme rozdiely medzi vektorovou a rastrovou grafikou. Zameriame sa na pridávanie lokálnych rastrových obrázkov do aplikácie.

Kredity získaš, keď podporíš našu sieť. To môžeš urobiť buď zaslaním symbolickej sumy na podporu prevádzky alebo pridaním obsahu na sieť.

Článok pre vás napísal Radek Vymětalík
Avatar
...
Aktivity