h3. Predhovor

Jednou zo silných čŕt jazyka Ruby je jeho univerzálnosť. Môžete ho použiť pri tvorbe počítačovej hry, zložitej webovej aplikácie, programu pre robota alebo textového procesora. Nech programujeme čokoľvek, stále používame základné štruktúry Ruby ako napríklad if, while, loop alebo each.

Je ale zrejmé, že na písanie rôznych druhov programov treba mať k dispozícii rôzne prostriedky. Keď programujete internetový server, budete používať úplne iné funkcie, než keď programujete hru. A práve na to slúžia pri programovaní knižnice. Knižnice obsahujú funkcie z jednotlivých oblastí a programátor môže použiť tie, ktoré potrebuje.

Čo sa programovania grafických aplikácii a hier, z knižníc, ktoré sú open-source, sa najväčšej popularite teší knižnica *SDL*. Je veľmi multiplatformová, takže programy, čo sú v nej vytvorené, fungujú aj na počítačoch, o akých ste v živote nepočuli.

Väčšina knižníc, vrátane SDL, sa normálne dá použiť iba v C, C++ a podobných jazykoch. Našťastie existujú tzv. "bindingy", ktoré dokážu funkcie z SDL preniesť do iného jazyka. Tu budeme používať binding, ktorý sa volá *RUDL*. Ten nie len prenáša tie funkcie, ale dáva ich aj do dobre navrhnutých tried a skrášľuje ich použitie.

p(advanced). Väčšina programov v SDL používa aj rôzne dodatkové knižnice, ako SDL_image alebo SDL_mixer. Napríklad SDL_mixer pracuje s hudbou a zvukmi. Keď nejaký program hudbu vôbec nevyužíva, jednoducho tú knižnicu nepoužije. V SDL samotnej je len to najnutnejšie minimum, nech programy nie sú zbytočne veľké. Funkcie v RUDL pochádzajú z rôznych dodatkových knižníc, ale RUDL ich spája dohromady tak, nech na to programátor nemusí myslieť.

Než prejdeme ku prvému „Hello World“ programu, ešte zostáva jedna drobnosť. Programy v Ruby, ktoré nič nevypisujú, ale miesto toho povedzme zobrazujú grafické okno, sa dávajú do súborov s príponou <code>.rbw</code>, nie <code>.rb</code>. A odporúčam dávať si programy a úlohy z každej lekcie do samostatného adresára, inak v tom čoskoro nastáva chaos.

h3. "Hello, World!"

Tu je samotný zdrojový kód:

<code>
require "RUDL"
include RUDL
include Constant

def keypress
  loop do
    event = EventQueue.wait
    exit if event.is_a? QuitEvent
    break if event.is_a? KeyDownEvent
  end
end

$screen = DisplaySurface.new([640,480], DOUBLEBUF|FULLSCREEN, 16)

$screen.set_caption "Hello, world!"

$screen.fill [255,255,255]
$screen.print([100,100], "Hello, world!", [0,0,0])

$screen.flip
keypress
</code>

Tento Ruby program spustíte ako každý iný (v Linuxe príkazom <code>ruby môjprogram.rbw</code>, vo Windowse dvojkliknutím na ikonu súboru). Netreba zadávať žiadne parametre o tom, že sa RUDL používa.

Poďme sa na jednotlivé riadky teraz pozrieť trochu podrobnejšie.

<code>
require "RUDL"
</code>

Tento riadok načíta celú RUDL, pripraví ju na použitie a obstará všetko okolo toho.

<code>
include RUDL
include Constant
</code>

Toto zariadi, nech netreba vždy pred každým menom triedy písať <code>RUDL::</code> (napríklad miesto <code>RUDL::DisplaySurface</code> stačí <code>DisplaySurface</code>) a pred každou konštantou <code>Constant::</code> (resp. <code>RUDL::Constant::</code>).

p(advanced). Princíp je podobný ako '<code>using namespace</code>' v C++. Namespace (teda v Ruby je to modul) <code>Constant</code> je vnútri modulu <code>RUDL</code>.

<code>
def keypress
  loop do
    event = EventQueue.wait
    exit if event.is_a? QuitEvent
    break if event.is_a? KeyDownEvent
  end
end
</code>

Táto funkcia počká na stlačenie nejakého klávesu. Jej vysvetlenie bude musieť počkať, lebo treba vedieť nejaké veci o tzv. udalostiach v SDL.

<code>
$screen = DisplaySurface.new([640,480], DOUBLEBUF|FULLSCREEN, 16)
</code>

A ideme otvoriť nové okno. Funkcia <code>DisplaySurface.new</code> chce tri parametre: veľkosť, nastavenia a farebnú hĺbku. Výsledné nové okno uložím do globálnej premennej <code>$screen</code>.

p(advanced). Farebná hĺbka určuje, koľko farieb naraz môže program nakresliť. Keď je to 8, v jednom okamihu môže byť nakreslených 256 rôznych farieb. Keď je to 16, bude ich až 65536. Farebná hĺbka 24 je tá, ktorú používa operačný systém a normálne aplikácie -- vo svojich čo i len trochu serióznych programoch by ste mali používať tú. Ešte existuje farebná hĺbka 32, ktorá podporuje ešte aj priesvitnosť.

p(advanced). Nastavenia sa zadávajú ako bitmask, čo znamená, že ich spája |, a že 0 znamená žiadne nastavenia. Zoznam užitočných nastavení je v dodatkoch.

Ak nezadáte žiadnu farebnú hĺbku (tretí parameter úplne vynecháte), automaticky sa zvolí nejaká dobrá.

<code>DisplaySurface</code> by sa dalo doslova preložiť ako "zobrazovacia plocha". Je to vlastne plocha, na ktorú keď niečo nakreslím, tak sa to zobrazí. (Slovo "plocha" v SDL v podstate znamená "bitmapa" alebo "obrázok".)

<code>
$screen.set_caption "Hello, world!"
</code>

Tento riadok nastaví, čo sa zobrazuje v titulku okna. Pri oknách na celej obrazovke to nie je také užitočné, ale môže sa to hodiť pri Alt+Tab apod.

<code>
$screen.fill [255,255,255]
</code>

<code>fill</code> vyfarbí celú plochu jednou farbou. V RUDL sa farby zadávajú ako normálne trojprvkové polia <code>[r,g,b]</code>. Dá sa použiť aj hexadecimálny zápis (<code>0xFFFFFF</code>).

<code>
$screen.print([100,100], "Hello, world!", [0,0,0])
</code>

<code>print</code> na dané miesto napíše daný nápis danou farbou. Miesta sa píšu ako dvojprvkové polia <code>[x,y]</code>. Obdĺžniky sa píšu podobne - <code>[x,y,šírka,výška]</code>. (V zadanom mieste bude ľavý horný roh textu.)

p(advanced). <code>print</code> je veľmi jednoduchá a základná funkcia určená pre jednoduché aplikácie. Keď napríklad treba použiť iné písmo, ako to štandardné systémové, už treba použiť pokročilejšie metódy, ktorým sa budeme venovať neskôr.

<code>
$screen.flip
</code>

Kým na ploche pracujem a kreslím jednotlivé veci, RUDL čaká a neukazuje to v okne. To preto, že by omylom mohla ukázať nedokončenú scénu, kde ešte nie sú všetky veci, a potom to vyzerá, ako keby blikali. Tento riadok hovorí, že už som hotový a môže to, čo som dal do <code>$screen</code>, zobraziť na monitore. Táto finta sa volá double-buffering.

<code>
keypress
</code>

Zavolám tú funkciu, čo som si definoval vyššie, nech sa program hneď nezavrie, ale užívateľ si môže pozrieť výsledok.

*Úloha č. 1:* Napíšte, pochopte, spustite.

*Úloha č. 2:* Skúste miesto <code>DOUBLEBUF|FULLSCREEN</code> dať iba <code>DOUBLEBUF</code>. Čo sa zmenilo? Vyskúšajte farebné hĺbky 8, 24 a 32, a rozlíšenia 320x200, 800x600 a 1024x768. Kedy to funguje a kedy nie?

*Úloha č. 3:* Čo sa stane, ak (na celej obrazovke) použijete netradičné rozlíšenie, napr. 500x500? Skúste si najprv tipnúť.

*Úloha č. 4:* Skúste zmeniť farby v programe. Upravte program tak, aby vypisoval červený text na žltom pozadí.

h3. Presúvanie

Keď pochopíte prvú verziu, skúsme teraz urobiť jednu významnú zmenu. Keďže "Hello, World!" je veľmi významná správa celému svetu, chcel by som, aby bola v strede obrazovky, kde ju najlepšie vidno.

Najjednoduchšie by bolo urobiť v programe túto úpravu:

<code>
$screen.print([$screen.w/2,$screen.h/2], "Hello, world!", [0,0,0])
</code>

(<code>w</code> a <code>h</code> sú šírka a výška.)

Problém s touto verziou je ten, že text sa neumiestni celkom do stredu - <code>print</code> totiž do zadaného miesta dá ľavý horný roh textu, takže ľavý horný roh bude v strede obrazovky. Hlavne je problematická x-ová os, pri tej y-ovej to až tak nevidno.

Vyrieši sa to tým, že si vyrátam polovicu šírky textu, a odčítam ju od <code>$screen.w/2</code>, takže polka textu bude v ľavej polovici okna a druhá polka bude vpravo.

Písmo, ktoré používa <code>print</code>, je také, že každý znak je veľký 8x8 pixelov, a správa "Hello, world!" má 13 znakov, takže jej šírka na obrazovke bude 104 pixelov.

<code>
$screen.print([($screen.w/2)-52,$screen.h/2], "Hello, world!", [0,0,0])
</code>

p(advanced). Keby bolo treba text často meniť, takéto počítanie dopredu nemusí byť vždy ono. Dá sa to elegantnejšie vyriešiť pomocou funkcie <code>String#length</code>:

<code>
message = "Hello, world!"
$screen.print([($screen.w/2)-(message.length*8/2),$screen.h/2], message, [0,0,0])
</code>

*Úloha č. 5:* Napíšte, pochopte, spustite.

*Úloha č. 6:* Napíste upravenú verziu, kde sa bude správa vypisovať úplne hore. Napíšte upravenú verziu, kde sa bude správa vypisovať úplne dole.

*Špeciálna úloha:* Upravte program tak, aby na čiernom pozadí vypísal žltý text v modrom rámčeku.

h3. Dodatky

h4. Zoznam nastavení pre <code>DisplaySurface.new</code>

<code>SWSURFACE</code> a <code>HWSURFACE</code> určujú, či sa má táto plocha vytvoriť v normálnej (softvérovej) pamäti, alebo v pamäti grafickej karty (hardvérovej). Kreslenie z hardvérovej do hardvérovej pamäti by malo byť rýchlejšie ako zo softvérovej do softvérovej, ale prenos medzi hardvérovou a softvérovou je dosť pomalý. Vo väčšine prípadov sa s takýmito vecami netreba babrať.

<code>RESIZABLE</code> vytvorí okno, ktorého veľkosť sa dá meniť. Tomu, ako to rozumne používať, sa budeme venovať neskôr.

SDL má vstavaný double-buffering, <code>DOUBLEBUF</code> ho zapne.

<code>FULLSCREEN</code> vyrobí okno na celú obrazovku.

<code>NOFRAME</code> zariadi, nech to okno nemá rámček.

<code>OPENGL</code> zapne v SDL podporu OpenGL.