Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
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í.

Kreslíme mišmaš

Nelíbí-li se vám slovo "mišmaš" v nadpisu lekce, dosaďte si třeba "změť". Ve slovníku ho možná nenajdete, ale zřejmě nejlépe vystihuje to, co teď budeme tvořit. Vyzkoušíme si základní grafické příkazy pro kreslení.

Vytvořte nový program s názvem Grafika. Petříka nebudeme v našem programu potřebovat, proto ho můžete zneviditelnit. Základem programu bude cyklus podmíněné opakování příkazů s přerušením klávesou Esc. Přidejte ho za vypnutí viditelnosti Petříka a vložte do něj příkaz čekání.

Dalším, velmi důležitým, úkonem je zprůhlednění políček ve vrstvě předmětů. Vyvolejte editaci předmětu prázdné políčko. V okénku volby barev vyberte barvu vlevo nahoře (našedle fialová). Je to průhledná barva, která zajistí zprůhlednění políčka s předmětem. V nástrojích pro kreslení vyberte vyplněný obdélník a překreslete celou plochu předmětu průhlednou barvou.

Když teď program spustíte, neuvidíte nic jiného než černou plochu. Vidíte grafickou vrstvu, která se stane základem našich dalších programů. V budoucnu budeme používat předměty i grafiku současně. Po vyzkoušení prvního grafického příkazu si můžete zkusit vkreslit něco do předmětu prázdného políčka. Uvidíte vykreslovanou grafiku a přes ni síť obrázků prázdných políček.

V okně Základních prvků si nalistujte skupinu grafika, podskupinu kreslení. Najdete v ní příkazy pro kreslení grafických prvků. Vezměte příkaz bod a vložte ho do hlavní smyčky programu. Příkaz obsahuje další čtyři prvky, sloužící k zadání parametrů vykreslovaného bodu.

První parametr, barva pera, určuje barvu bodu. Barva je číslo, které můžeme uchovávat v číselné proměnné. Jeho hodnota nás zatím nezajímá, protože na určování barvy můžeme používat speciální funkce. U nově vytvořeného příkazu prvek barva pera obsahuje prvek barva. Je to konstanta barvy, předávající příkazu zvolenou barvu (barva je číslo). Novou barvu vybereme dvojitým kliknutím levým tlačítkem myši na prvek konstanty barvy. Objeví se okno volby barev, vybraná barva je označena vyvýšením políčka. Kliknutím na některou z barev vybereme jinou barvu. Uvidíme ji také v ikonce prvku konstanty barvy. Pokud byste teď program spustili, uvidíte opět černou plochu, ale v levém dolním rohu malou tečku.

V našem programu budeme chtít vykreslovat body s náhodnou barvou. Vyhodíme proto pryč konstantu barvy a na její místo dosadíme prvek sloučení barevných složek do barvy (ze skupiny grafika). Prvek obsahuje další tři prvky, červená složka (0 až 1), zelená složka (0 až 1) a modrá složka (0 až 1). Prvky určují úroveň jednotlivých barevných složek ve výsledné barvě. Čím víc se hodnota složky blíží číslu 1, tím je složka světlejší. Například žlutá barva vznikne zadáním hodnot 1, 1, 0. Náhodnou barvu vytvoříme tak, že do jednotlivých složek umístíme prvky náhodné číslo (0 <= x < 1) (rozsah náhodného čísla je také 0 až 1).

Kromě barevných složek je zde ještě čtvrtá složka, alfa složka (0=průhlednost až 1=barva). Její použití je hlavně ve 3D grafice. U 2D grafiky ji používáme pouze ve speciálních případech, kdy je třeba kreslit grafiku pomocí průhledné nebo stínové barvy (čili nemá význam průhledného kreslení tak jak by se možná dalo čekat). Proto ji necháváme nenastavenu, tím se použije implicitní hodnota 1.

Dalším parametrem příkazu pro kreslení bodu je prvek tloušťka pera. Je to číselná hodnota udávající, kolik grafických bodů bude kreslený bod široký. Velikost bodu budeme generovat náhodně, proto sem vložíme náhodné číslo s parametrem 9, čímž zajistíme náhodné body o velikosti 1 až 9 grafických bodů (nulou se nemusíme zabývat, příkaz pro kreslení bodu použije hodnotu 1).

Poslední dva prvky příkazu, horizontální souřadnice bodu X a vertikální souřadnice bodu Y, určují místo, kam se bod vykreslí. Na obrázku níže vidíte určování grafických souřadnic. Ničím se neliší od číslování políček, jak jsme ho poznali v předešlých kapitolách. Základní jednotkou souřadného systému Petra je jednotkový krok. Délka jednotkového kroku odpovídá šířce políčka (nesouvisí tedy s délkou kroku sprajtu Petříka), počátek souřadnic je vlevo dole. Políčko má rozměr 32 grafických bodů. Díky vyjádření souřadnic desetinným číslem můžeme udávat souřadnice políček, grafiky i sprajtů jednotně, bez nutnosti vzájemných převodů.

Souřadnice k vykreslení bodu určíme náhodně, jak to již známe z dřívějších lekcí, pomocí náhodného čísla s parametrem šířky popřípadě výšky plochy. Výsledný příkaz pro náhodné nakreslení bodu bude vypadat takto:

Program spusťte. Na ploše se začnou náhodně objevovat barevné puntíky různých velikostí. Vykreslování není příliš rychlé. Po každém bodu program ve smyčce chvíli čeká (55 ms), rychlost vykreslování je proto pouze 18 bodů za sekundu.

Teď je vhodná chvíle pozastavit se u časování programu. Jak jsme si již dříve řekli, příkaz čekání má, kromě vlastní funkce čekání, také funkci spolupráce s ostatními programy (a také s jádrem systému Windows). Znalejší uživatel si může systémovým programem Sledování systému ověřit, že program Grafika zatěžuje počítač minimálně, a navíc je rychlost chodu programu nezávislá na rychlosti počítače. Pro upřesnění - příkaz čekání ve skutečnosti neznamená opravdovou prodlevu o zadané délce, ale synchronizaci na vnitřní hodiny počítače. Proto nezávisí rychlost programu na tom, jak rychle se provedou příkazy mezi dvěma příkazy čekání.

Doplňte na zkoušku do příkazu čekání hodnotu 0. Po spuštění můžete pozorovat, že program teď chrlí velké množství bodů. Program již nečeká na časový krok, ale jede maximální rychlostí. Přitom po každém průchodu smyčkou ještě zajistí zobrazení plochy okna na displeji. To je další funkce příkazu čekání - zajištění zobrazování. Program totiž neví, ve které chvíli byly dokončeny všechny grafické operace a kdy je tedy vhodné okno zobrazit na displeji. Pokud by okno zobrazoval sám, mohl by ho zobrazit ve chvíli, kdy je vykresleno pozadí hry, ale ještě ne postavy ve hře. To by se projevilo problikáváním pozadí pod postavami. Proto probíhá zobrazování na obrazovku ve chvíli čekání, kdy jsou zřejmě již všechny grafické operace dokončeny.

Časování s hodnotou 0 je vhodné používat v situacích, kdy je buď potřeba vyšší výkon programu, nebo je časování po 0.05 sekundách příliš hrubé. Časování s 0 zajišťuje plynulé překreslování okna, maximální rychlost programu a ještě dostatečnou spolupráci se systémem Windows. Rychlost chodu programu teď již závisí na rychlosti počítače. Systémovým programem Sledování systému bychom zjistili, že program spotřebovává téměř celý výkon počítače a to i ve zdánlivě klidovém stavu.

Při další zkoušce časování programu můžete zkusit příkaz časování úplně zablokovat tlačítkem Vypnout. Když teď program spustíte, uvidíte namísto teček barevný šum. V této chvíli již program pracuje skutečně na plný výkon bez jakýchkoliv prodlev. Možná si všimnete, že namísto plynulého barevného šumu je obraz dost trhavý. Program totiž zajišťuje alespoň minimální překreslování okna na displej. Není-li po dobu asi 0.2 sekundy použit příkaz čekání, překreslí okno sám.

Vraťme se zpět ke grafickým příkazům. Přidejte do hlavní smyčky programu obdobně i další grafické příkazy - čára, obdélník, vyplněný obdélník, kružnice, kruh, koule, trojúhelník - a zkuste jejich náhodné vykreslování. Pro kružnici, kruh a kouli použijte náhodný poloměr 2. Výplň vynechejte, zde by nebyla moc smysluplná.

Pozastavíme se u příkazu výpis textu. Příkaz má více parametrů, než jste možná zvyklí, ale nemusíte se jich bát. Parametry, které vás nezajímají nebo které neznáte, nechejte prostě nenastavené, použijí se jejich implicitní hodnoty. Význam parametrů text k výpisu, barva pera, horizontální souřadnice X textu a vertikální souřadnice Y textu je zřejmě poměrně jasný.

Novým prvkem je úhel orientace textu. Je to úhel, o který je text otočen kolem levého dolního rohu. Úhel se udává v radiánech, stejně jako všechny ostatní úhly v Petrovi. Můžeme využít konstanty směru známé z nastavování směru Petříka a Lucky. Bez zadání směru je použit směr 0 (vodorovně zleva doprava).

Prvek výška znaků určuje výšku znaků textu. Je udán v jednotkových krocích. Bez zadání výšky bude výška znaků 0.5 (polovina výšky políčka).

Prvek relativní šířka znaků (1 = běžná) představuje poměrné číslo udávající, kolikrát jsou znaky širší než jejich běžná šířka. Hodnota 1 nastavuje běžnou šířku znaků. Větší číslo než 1 nastaví znaky širší, při menším čísle budou použity znaky užší. Zvláštní hodnotou je číslo 0. Číslo 0 nastaví doporučenou šířku použitého typu znaků. Přibližně tato šířka odpovídá běžné šířce, ale mírně se může lišit. Bez zadání šířky znaků je použita hodnota 0, tedy doporučená šířka znaků.

Prvky tučný text, kurzíva, podtržení a přeškrtnutí jsou logické přepínače a zapínají zvláštní efekty písma. Bez zadání hodnoty jsou všechny přepínače vypnuté. Přepínač patičky zapíná patičky u znaků. Bez zadání je vypnutý. Přepínač psací stroj zapíná znaky s pevnou roztečí a pevnou šířkou. Při vypnutém přepínači mají znaky proměnlivou šířku (I je užší než M). Bez zadání je přepínač vypnutý.

Standardně se v případě vypnutí přepínače patiček i psacího stroje použije písmo Arial. Po zapnutí patiček se použije písmo Times New Roman. Je-li naopak zapnut přepínač psacího stroje, použije se písmo Courier New. Jsou-li zapnuty oba přepínače, patičky i psací stroj, použije se jako zvláštní varianta uživatelský font. Je to font, jehož jméno je definovatelné pomocí prvku uživatelské písmo. V Lite verzi Petra nelze uživatelské písmo měnit a použije se implicitní font Impact.

Celý příkaz pro náhodný výpis textu vidíte na následujícím obrázku. Příkaz je dost dlouhý, proto je obrázek rozdělen na dvě části. Po vytvoření příkazu program zkuste. Pokud si chcete program pozastavit, můžete k tomu použít klávesu Pause. Takto lze pozastavovat všechny programy v Petrovi. Pokračování je možné stiskem jakékoliv klávesy.

Jednou z nejsilnějších stránek grafiky jsou jistě obrázky. Pomocí obrázků můžete zajistit vše, na co nestačí základní vybavení Petra. Vytvoříte pohyblivé postavičky, okno s animovanými tlačítky, pohyblivé pozadí hry a samozřejmě fotografie.

Příkazy a funkce pro práci s obrázky najdete ve skupině grafika, podskupina obrázky. Základním příkazem je příkaz vykreslení obrázku. Kromě samozřejmých parametrů, jako je obrázek k vykreslení a souřadnice obrázku, má příkaz ještě další parametry, umožňující vykreslit pouze určitou část obrázku.

V našem zkušebním prográmku budeme náhodně vykreslovat nějaký obrázek. Můžete použít třeba obrázek chobotnice z minulé lekce. Příkaz pro náhodné vykreslení obrázku vidíte na předešlém obrázku. Abychom si užili náhodnosti, použijeme kromě náhodné pozice také náhodnou změnu velikosti obrázku a náhodné otočení. Je však třeba upozornit, že obzvláště otáčení obrázku může být časově značně náročná operace, což se může projevit u velkých obrázků nebo pokud se zapne zjemnění hran. Výšku obrázku při změně velikosti není třeba zadávat, bude automaticky úměrná nové šířce.


 

Stáhnout

Stažením následujícího souboru souhlasíš s licenčními podmínkami

Staženo 230x (137.38 kB)
Aplikace je včetně zdrojových kódů v jazyce Petr Lite (jsou obsaženy v EXE souboru, který lze v programu přímo otevřít)

 

Všechny články v sekci
2D grafika
Článek pro vás napsal Panda38
Avatar
Uživatelské hodnocení:
1 hlasů
Programátor C++, WinAPI, ASM.
Aktivity