41
Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník D29. Programátorské prostredie Lazarus. Pascal. IDE Lazarus. Časti IDE Lazarus. Čo je to Pascal a Lazarus Programovací jazyk PASCAL navrhol v roku 1970 Nikolaus Wirth, profesor technickej univerzity vo švajčiarskom Zürichu ako jednoduchý a efektívny jazyk pre systematickú výuku programovania. (Jazyk má meno po známom francúzskom matematikovi a filozofovi BLAISE PASCALOVI - 1623 až 1662, ktorý zostrojil pascalínu - mechanický kalkulátor pre výpočty svojho otca, ktorý pracoval ako daňový odborník.) V roku 1995 vzniká programátorské prostredie Delphi, ktoré je založené na jazyku Object Pascal. Jeho prínosom je charakteristika označovaná ako RAD (Rapid Aapplication Development – rýchly vývoj aplikácií), ktorá umožňuje aplikáciu poskladať z malých hotových častí – komponentov. Lazarus je programátorské prostredie veľmi podobné Delphi, založené na jazyku Free Pascal. Programátorské prostredie (IDE – integrated development environment) je softvérový balík, umožňujúci programátorovi programy: navrhovať, písať, upravovať, vyvíjať, kompilovať, testovať a ladiť. Moderné programovacie prostredia sú založené na vizuálnom princípe. Všetko sa dá poskladať z nejakých predpripravených komponentov a programátor potom „iba“ doprogramuje správanie týchto komponentov v rôznych situáciách. Ako vyzerá programátorské prostredie Lazarus Moderné programovacie prostredia sú založené na vizuálnom princípe. Všetko sa dá poskladať z nejakých predpripravených komponentov a programátor potom „iba“ doprogramuje správanie týchto komponentov v rôznych situáciách. Podobne funguje aj Lazarus. Jeho celé prostredie sa skladá z viacerých častí: 1

Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

  • Upload
    lamdiep

  • View
    227

  • Download
    3

Embed Size (px)

Citation preview

Page 1: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

D29. Programátorské prostredie Lazarus.

Pascal. IDE Lazarus. Časti IDE Lazarus.

Čo je to Pascal a Lazarus Programovací jazyk PASCAL navrhol v roku 1970 Nikolaus Wirth, profesor technickej univerzity vo švajčiarskom Zürichu ako jednoduchý a efektívny jazyk pre systematickú výuku programovania. (Jazyk má meno po známom francúzskom matematikovi a filozofovi BLAISE PASCALOVI - 1623 až 1662, ktorý zostrojil pascalínu - mechanický kalkulátor pre výpočty svojho otca, ktorý pracoval ako daňový odborník.)V roku 1995 vzniká programátorské prostredie Delphi, ktoré je založené na jazyku Object Pascal. Jeho prínosom je charakteristika označovaná ako RAD (Rapid Aapplication Development – rýchly vývoj aplikácií), ktorá umožňuje aplikáciu poskladať z malých hotových častí – komponentov.Lazarus je programátorské prostredie veľmi podobné Delphi, založené na jazyku Free Pascal.

Programátorské prostredie (IDE – integrated development environment) je softvérový balík, umožňujúci programátorovi programy: navrhovať, písať, upravovať, vyvíjať, kompilovať, testovať a ladiť.Moderné programovacie prostredia sú založené na vizuálnom princípe. Všetko sa dá poskladať z nejakých predpripravených komponentov a programátor potom „iba“ doprogramuje správanie týchto komponentov v rôznych situáciách.

Ako vyzerá programátorské prostredie Lazarus Moderné programovacie prostredia sú založené na vizuálnom princípe. Všetko sa dá poskladať z nejakých predpripravených komponentov a programátor potom „iba“ doprogramuje správanie týchto komponentov v rôznych situáciách. Podobne funguje aj Lazarus. Jeho celé prostredie sa skladá z viacerých častí:

1

Hlavnáponuka

Ovládací panel

Zdrojový text programu

Formulár vzhľadu budúceho programu

Správy o preklade a chybách v programe

Paleta komponentov

Editovacie okno

Inšpektor objektov

Page 2: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

ovládací panel: napr. tlačidlá Nová jednotka, Uložiť, Nový formulár, Spustiť, a pod. editovacie okno (editor kódu), v ktorom popisujeme správanie programu v rôznych situáciách

(vo FreePascale) formulár: vizualizácia nášho budúceho programu, t.j. okno - tu budeme vkladať a upravovať

rôzne, väčšinou vizuálne komponenty paleta komponentov: ponuka predpripravených "súčiastok", ktoré môžeme vkladať do nášho

okna, napr. tlačidlá, grafické a textové plochy, editovacie okienka, posúvače a pod. inšpektor objektov: špeciálne okienko, v ktorom môžeme upravovať parametre komponentov

vo formulári prostredie obsahuje ešte aj ďalšie časti - s niektorými sa zoznámime neskôr

tlačidlo Spustiť – slúži na spustenie pripraveného projektu - F9F12 – tlačidlo na prepínanie medzi návrhom formulára a editovacím oknom

Príprava na prvý program - aplikáciu, ako ju spúšťame a zastavujeme

Skôr ako do detailov pochopíme princípy tvorby nového programu (aplikácie, projektu) v Lazaruse, bude dobre si zautomatizovať nejaký jednoduchý postup, ktorý nám na začiatku pomôže vyvarovať sa niektorých začiatočníckych chýb.

1. naštartujeme Lazarus 2. v menu Projekt zvolíme Nový projekt ... a potom Aplikácia 3. Lazarus je teraz už pripravený na to, aby sme mohli začať tvoriť náš nový program - editovacie

okno obsahuje len zopár základných predpísaných konštrukcií a formulár je prázdny 4. v tomto momente (práve pred samotným začiatkom tvorby programu) je dobre si zvyknúť

takýto zatiaľ "prázdny" program uložiť - takže, z ponuky Projekt vyberieme Uložiť ako a o zvolíme priečinok, do ktorého budeme projekt ukladať - každý projekt ukladáme do

nového priečinku (ak ho nemáme pripravený, tak ho teraz vytvoríme 01_prvy)o každý projekt sa na disku skladá z viacerých súborov a tieto by mali byť spolu v jednom

priečinku a nemali by sa prekrývať s inými projektmi o pri ukladaní projektu sa Lazarus pýta na uloženie dvoch súborov:

project1.lpi - to je projektový súbor, ktorý sa vytvára automaticky a obsahuje dôležité informácie o celkovej štruktúre nášho projektu Unit1.pas - to je samotný program aj s formulárom Tieto dva súbory nebudeme zatiaľ premenovávať, ale dôležité je, aby boli spolu v rovnakom priečinku. Program sa potom pýta: Premenovať súbor? Zatlačíme tlačidlo: Premenovať na malé písmená.

5. teraz už predpokladáme, že máme projekt úspešne uložený a môžeme ho spustiť: o hoci sme ešte nič neprogramovali, Lazarus nám s novou aplikáciou všetko pripravil tak,

aby sme už mali funkčné jedno windows okno

o stlačíme kláves F9 (alebo tlačidlo Spustiť na ovládacom paneli so zeleným trojuholníkom) a ak je program bez chýb, tak sa spustí: objavilo sa prázdne šedé okno s titulovým modrým pásom, s textom Form1 a s malými systémovými tlačidlami na minimalizovanie, maximalizovanie a ukončenie aplikácie

o spustený program môžeme na pracovnej ploche windows posúvať, meniť mu veľkosť, prípadne sa prepnúť do inej bežiacej aplikácie, napr. prostredie Lazarus (to že naša

2

Page 3: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

aplikácia práve beží, vidíme v Lazarus, napr. tak, že tlačidlo so zeleným trojuholníkom je zablokované - zašedené)

o bežiaci program ukončíme Zavrieť (v pravom hornom rohu) alebo zastaviť tlačidlom Zastaviť na ovládacom paneli

o po zastavení nášho bežiaceho prvého programu, ho môžeme teraz začať naozaj programovať - ale budeme na to potrebovať nejaké komponenty

Zistite, čo už viete:1. Čo je Pascal a čo Lazarus?2. Čo je to IDE a na čo sa používa?3. Vymenujte základné časti prostredia Lazarus.4. Čo umožňuje editovacie okno a na čo slúži formulár?5. Ako spolu súvisia paleta komponentov a inšpektor objektov?6. Na čo slúži súbor Unit1.pas a súbor projekt1.lpi?

Domáca úloha:

Nainštalujte si program Lazarus. 

K štúdiu:Blaho A. a kol.: Programovanie v Delphi, SPN Bratislava 2006 Skalka J. a kol.: Informatika na maturity a prijímacie skúšky, Enigma Nitra 2007

Možno trochu pomôže: http://pascal.input.sk/index.php/Start http://sulo.stary-gympel.sk/lazarus-co-je/ http://wiki.lazarus.freepascal.org/Lazarus_Tutorial/sk http://slavino.sk/component/keywords/lazarus

3

Page 4: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

D30. Základné komponenty . Prvý program.

Komponenty: tlačidlo, jednoduchý text. Udalosti.

Ukladanie komponentu tlačidlo do formulára

otvoríme si program z minulej hodiny: Naštartujeme Lazarus/ Súbor/Otvoriť...nájdeme priečinok 01_prvy a v ňom klikneme na project1.lpi

okno s formulárom chceme vidieť - ak je skryté, stlačíme kláves F12, aby sa dostalo navrch z palety komponentov klikneme na komponent, ktorý budeme chcieť položiť do formulára -

keďže paleta má viac záložiek s menami, napr. Standard, Additional, System a pod. - niekedy musíme najprv zvoliť správnu skupinu a až potom kliknúť na komponent

takže začíname komponentom tlačidlo - jeho názov je TButton a nachádza sa v štandardnej záložke palety - v palete má tvar malého tlačidla s textom OK - kliknite na tento komponent

kliknite niekde do formulára - objaví sa tu tlačidlo s popisom Button1 o toto tlačidlo môžete presunúť na ľubovoľnú pozíciu, prípadne mu zmeniť veľkosť

ťahaním za čierne štvorčeky o veľmi jednoducho zmeníme aj popis na tlačidle: všimnite si, že keď je naše nové tlačidlo

označené (má okolo seba čierne štvorčeky), v Inšpektore objektov sú nejaké informácie, ktoré sa týkajú práve tohto tlačidla. Inšpektor sa skladá z dvoch stĺpcov: ľavý obsahuje meno nejakého nastavenia (napr. Caption označuje popis na tlačidle) a v príslušnom pravom je momentálna hodnota (teraz je tam Button1) - informácie v pravom stĺpci môžeme meniť a tým sa bude meniť vzhľad tlačidla a niekedy aj jeho správanie

o zmeňte v Inšpektore nastavenie Caption na text, napr. Tlačidlo - zároveň sa zmenil popis na tlačidle

vytvorte na formulári viac tlačidiel rôznych rozmerov, zmeňte im popisy a vyskúšajte, ako sa správajú, keď takúto aplikáciu spustíme (F9)

ak potrebujete nejaké tlačidlo z formulára odstrániť, stačí aby bolo označené (kliknite naň) a stlačte kláves Del

4

tlačidlo

Page 5: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Priradenie akcií ku tlačidlám

Program s tlačidlami je už zaujímavejší, ako čisté okno, ale tlačidlá zatiaľ nerobia žiadne akcie. Každé tlačidlo môže mať priradenú nejakú akciu, ktorá sa spustí, keď naň počas behu programu klikneme - spustí sa zakaždým, keď naň klikneme. Priradenie akcie sa robí nasledovne:

na dané tlačidlo vo formulári dvojklikneme (nech to bolo tlačidlo Button1) objaví sa editovacie okno, v ktorom sú automaticky pripísané tieto riadky:

procedure TForm1.Button1Click(Sender: TObject);begin

end;

pre nás je dôležité si všimnúť slovo Button1Click - toto označuje, že to čo naprogramujeme medzi slová begin a end sa spustí vždy, keď sa klikne na tlačidlo Button1

Pre otestovanie tlačidiel sa naučíme jednoduchý príkaz na zmenu popisu na tlačidle:

procedure TForm1.Button1Click(Sender: TObject);begin Button1.Caption := 'zmena'; end;

dvoj-znak priradenia (dvojbodka a znak rovná sa) := znak ukončenia príkazu (bodkočiarka) ;znakový reťazec (postupnosť znakov uzavretá v apostrofoch) ´zmena ´

Program spustíme (F9) a keď naňho teraz klikneme myšou, jeho popis sa zmení na slovo zmena. Ak máme v programe viac tlačidiel, každému môžeme naprogramovať inú akciu - dvojkliknutím sa predpripraví časť programu, do ktorej dopíšeme nové akcie. Ďalším jednoduchým príkazom je volanie štandardnej procedúry Close - spôsobí zatvorenie našej aplikácie a teda koniec programu, napr.

procedure TForm1.Button2Click(Sender: TObject);begin Close;end;

POZOR! ak chceme akciu na tlačidle zrušiť, nikdy nezmažeme celú konštrukciu, ale len príkazy medzi begin a end - najbližšie uloženie projektu (napr. Ctrl+S), takéto zbytočné konštrukcie korektne odstráni.

Ukladanie komponentu jednoduchý text do formulára

vytvorme si novú aplikáciu a uložme ju do priečinku 02_druhý podobným spôsobom, ako sme vložili komponent tlačidlo, vložíme do formulára komponent

(súčiastku) jednoduchý text (TLabel zo záložky Standard), ktorý môžeme použiť na výpis jednoduchých textov či oznamov vo formulári

5

Page 6: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

zmeňme v inšpektore objektov tento text na Ako sa máš? – rovnako ako pri tlačidlách meníme nastavenie Caption

v Inšpektore Objektov zmeníme ešte aj písmo, aby bol text čitateľnejší - meníme nastavenie Font

pod tento text vložíme dve tlačidlá a zmeníme im texty na slová Dobre a Zle na koniec pod tlačidlá pridáme ešte jeden text (Label2), zmeníme mu písmo aj text na ...

procedure TForm1.Button1Click(Sender: TObject);begin Label2.Caption:= 'Mám z teba radosť! ';end; procedure TForm1.Button2Click(Sender: TObject);begin Label2.Caption:= 'Chúďa moje! ';end;

Textový reťazec (string), je text uzavretý do apostrofov. Apostrof napíšeme stlačením ľavého ALT a vyťukaním číslic 39 Dokončovanie identifikátorov: napíšeme niekoľko prvých písmen a potom stlačíme Ctrl+Medzerník a v zozname, ktorý sa objaví, si nájdeme to, čo práve potrebujeme.

Zistite, čo už viete:1. Stlačením ktorého klávesu sa zobrazí formulár ak nie je momentálne viditeľný?2. Zmenou ktorej vlastnosti v Inšpektore Objektov zmeníme text na tlačidle?3. Medzi aké kľúčové slová Pascalu píšeme vlastný program?4. Ako vyzerá v Pascale priraďovací znak?5. Aký znak v Pascale sa používa na ukončenie príkazu?6. Čo je v Pascale znakový reťazec?7. Aké klávesy použijeme na dokončievanie identifikátorov?8. Ako spustíme program v Lazaruse?

Domáca úloha DÚ 02/1:

Upravte posledný program tak, aby v ňom bolo viac možností na odpoveď, t. j. pridajte ďalšie tlačidlá aj s príslušnými akciami. Napríklad na otázku Ako sa dnes cítiš? By mohli byť odpovede na tlačidlách Výborne, Som unavený, Cítim sa chorý, Normálne, ... Ku každej odpovedi pripravte reakciu počítača, napr. To ma teší, Neuč sa už toľko, Choď k doktorovi, Ja tiež, ...

6

Jednoduchý text

Page 7: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

D32. Grafická plocha (Image).

Grafická plocha. Zmazanie plochy. Obdĺžnik. Pero. Štetec.

Komponent grafická plocha (Image) - je taký obdĺžnik vo formulári, do ktorého môžeme rôznymi nástrojmi kresliť. Obsah grafickej plochy môžeme jednoducho uložiť na disk, resp. do nej prečítať nejaký obrázok zo súboru.

Začneme položením komponentu TImage do formulára. Nájdeme ho v palete komponentov v záložke Additional (malý farebný obrázok). Komponent položme do plochy kliknutím (dostáva rozmer približne 100x100) a môžeme ho zväčšiť ťahaním za čierne štvorčeky, rovnako ako tlačidlá. Image Všimnite si, že tlačidlá sú vždy nad grafickou plochou - môžeme ich posunúť niekde ku okraju, aby nám nezavadzali pri kreslení.

Grafickú plochu teda už máme. Kresliť do nej budeme najčastejšie ako akcie pri zatlačení nejakých tlačidiel - teda napr. do procedúry Button1Click budeme zapisovať grafické príkazy medzi begin a end. Skôr ako začneme kresliť, vysvetlime si základné pojmy:

naša grafická plocha má meno Image1 (podobne ako tlačidlo Button1 a aj formulár Form1) každá grafická plocha má svoje plátno a kreslíme práve do tohto plátna (podobné plátno,

ako je v obrazoch) - plátnu sa povie Canvas, na plátno kreslíme pomocou pera - Pen alebo vyfarbujeme nejaké plochy pomocou štetca

Brush, pero aj štetec majú svoje farby - Color, pero má aj svoju hrúbku - Width, príkazy, ktoré pohybujú a kreslia perom väčšinou vyžadujú zadávanie súradníc: súradná

sústava je ale vo Windows trochu inak natočená, ako ju poznáme z matematiky - ľavý horný roh má súradnice (0,0) - teda je to počiatok; x-ová súradnica ide zľava doprava na hornom okraji plochy a y-ová súradnica ide zhora nadol pri ľavom okraji plochy; niekedy majú zmysel aj záporné súradnice, ale tieto popisujú body mimo plochu.

Príklad 1:

Ak začneme kresliť do grafickej plochy, zobrazí s čiernym pozadím. Toto sa nám väčšinou nebude hodiť, preto sa zmažte grafickú plochu už pri štarte programu.

Riešenie:Nebudeme ale programovať udalosť pre 1. tlačidlo Button1Click alebo pre iné tlačidlá, ale špeciálnu inicializačnú udalosť, ktorá automaticky vznikne pri štarte programu: FormCreate.

7

Page 8: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Lazarus nám pripraví spracovanie udalosti v tejto procedúre, keď dvojklikneme do formulára mimo tlačidiel aj grafickej plochy. Vytvorila sa nám prázdna procedúra FormCreate a dopíšeme do nej jeden riadok:

procedure TForm1.FormCreate(Sender: TObject);begin Image1.Canvas.FillRect(Image1.ClientRect);end;

V tomto prípade príkaz FillRect zmaže celú plochu bielou farbou. Neskôr uvidíme aj iné použitie.

Príklad 2:

Vytvorte program, ktorý nakreslí po stlačení tlačidla obdĺžnik do grafickej plochy obdĺžnik so stranami 200, 100 na pozíciu [100, 50].

Obdĺžnik kreslíme tak, že zadáme dva protiľahlé vrcholy, pričom strany sú rovnobežné s osami. Vysvetlime si príkaz na nakreslenie obdĺžnika:

Riešenie:procedure TForm1.Button1Click(Sender: TObject);begin Image1.Canvas.Rectangle(100, 50, 300, 150); end;

Vidíme, že príkaz sa skladá z viacerých slov oddelených bodkami - poradie týchto slov a samozrejme aj presný zápis je veľmi dôležitý a vyjadruje toto: ideme pracovať s grafickou plochou Image1 - budeme kresliť na jej plátno Canvas - konkrétne použijeme nástroj obdĺžnik - Rectangle. Štyri čísla v zátvorkách vyjadrujú súradnice nejakých dvoch protiľahlých vrcholov - prvé dve sú x-ová a y-ová súradnice prvého vrcholu a druhé dve opäť x-ová a y-ová súradnice druhého vrcholu. Treba si zapamätať, že tieto súradnice musia byť vždy celé čísla - ak je niektorá z nich mimo veľkosť grafickej plochy, tak zrejme aj nejaká časť obdĺžnika bude mimo plochy. Po spustení programu (F9) sa vo formulári sa objaví

Program ukončime, aby sme mohli sledovať ďalšie pokusy.

Príklad 3:

Nakreslite ešte jeden obdĺžnik a to tak, aby sa oba navzájom prekrývali a potom ich vyfarbite rôznymi farbami. Zmeňte aj farby a hrúbky ich orámovania.

procedure TForm1.Button1Click(Sender: TObject);begin Image1.Canvas.Rectangle(100, 50, 300, 150); Image1.Canvas.Rectangle(40, 100, 240, 200);end;

Po spustení vidíme, že druhý obdĺžnik je vyplnený bielou farbou, lebo cez neho nie je vidieť ten prvý - povedzme si teda, ako je to s farbami: pri štarte programu má pero vždy čiernu farbu a

8

Page 9: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

hrúbku 1, štetec, ktorý vypĺňa vnútro obdĺžnika má pri štarte bielu farbu. Toto všetko sa dá zmeniť špeciálnymi priraďovacími príkazmi (už sme ho použili pri zmene popisu tlačidla Button1.Caption := 'xxx';) - najprv ich ukážeme a potom vysvetlíme:

procedure TForm1.Button1Click(Sender: TObject);begin Image1.Canvas.Pen.Color := clRed; Image1.Canvas.Brush.Color := clBlue; Image1.Canvas.Rectangle(100, 50, 300, 150); Image1.Canvas.Pen.Width := 5; Image1.Canvas.Brush.Color := clYellow; Image1.Canvas.Rectangle(40, 100, 240, 200);end;

Vidíme, že prvý obdĺžnik má tenký červený obvod a je vyplnený modrou farbou, druhý obdĺžnik má hrubý červený obvod a je vyfarbený žltou farbou. Farby a hrúbky meníme priraďovacími príkazmi, napr.

Image1.Canvas.Pen.Color := clRed;

Znamená, že v grafickej ploche Image1, na jeho plátne Canvas, zmeníme pre pero Pen jeho farbu Color na červenú clRed. Úplne rovnako je to s farbou štetca a aj hrúbkou pera. Nasledovný program nakreslí vedľa seba 3 rôzne veľké štvorce:

procedure TForm1.Button1Click(Sender: TObject);begin Image1.Canvas.Pen.Width := 5; Image1.Canvas.Rectangle(100, 200, 150, 150); Image1.Canvas.Rectangle(150, 200, 250, 100); Image1.Canvas.Rectangle(250, 200, 400, 50);end;

Všimnite si, že hrúbku sme nastavili len raz a odvtedy platí pre všetky kresby. Je jasné, že pomocou Rectangle kreslíme aj štvorce. Niekedy sa musíme so súradnicami "trochu pohrať", aby sme dostali útvary podľa našich predstáv - tu sú štvorce nakreslené tesne vedľa seba a ich spodná strana leží na jednej priamke. Často sa nám bude hodiť zmazanie grafickej plochy aj po zatlačení tlačidla:

procedure TForm1.Button2Click(Sender: TObject);begin Image1.Canvas.Brush.Color := clWhite; Image1.Canvas.FillRect(Image1.ClientRect);end;

V prvom riadku nastavujeme bielu farbu štetca, lebo príkaz FillRect zmaže celú plochu práve farbou štetca. Ak budeme potrebovať zmazať plochu inou farbou, tak zmeníme to práve tu.

Namiesto FillRect môžeme použiť aj známy príkaz Rectangle - vtedy sa okrem zmazania grafickej ploche nastaví aj rámik. Dávame pozor na to, že farba a hrúbka pera by mohla byť zmenená a preto ju tu pre istotu nastavíme: procedure TForm1.Button2Click(Sender: TObject);begin

9

Page 10: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Image1.Canvas.Brush.Color := clWhite; Image1.Canvas.Pen.Color := clWhite; Image1.Canvas.Pen.Width := 1; Image1.Canvas.Rectangle(Image1.ClientRect);end;

Zhrnutie grafických príkazov 1

Zhrnieme všetky grafické príkazy, s ktorými sme sa už zoznámili, resp. ich doplníme o niekoľko ďalších základných. Vo všetkých príkazoch predpokladáme, že začínajú napr. Image1.Canvas. Ak chcete o niektorých nastaveniach alebo príkazoch vedieť viac, pozrite sa do Helpu. Nastavenie pera a štetca: Pen.Color := clRed;         // ďalšie farby sú, napr. clBlack, clGreen, clBlue,

clYellow, clWhite ... Pen.Width := 3;             // hrúbka pera od 1 vyššie Pen.Style := psSolid;       // typ čiary - rôzne bodkované a čiarkované čiary, napr.

psDash, psDot, ... Brush.Color := clWhite;     // farba výplne Brush.Style := bsSolid;     // štýl výplne, užitočný je bsClear - žiadna výplň, ďalšie sú

napr. bsVertical, bsHorizontal, ...

Kreslenie útvarov: Rectangle(x1, y1, x2, y2);  // obdĺžnik - teda aj štvorec

Zmazanie plochy: FillRect(obdĺžnik);         // obdĺžnik zmaže farbou štetca

Úlohy:Vytvorte projekt, ktorý nakreslí veľký červený kríž takto:

a. Najprv sa nakreslí veľký červený obdĺžnik na stred plochy – ako vodorovné ramená kríža

b. Potom sa nakreslí obdĺžnik cez stred plochy – zvislé ramená kríža

(ďalšie tlačidlá môžu nakresliť: niekoľko sústredných štvorcov; slovenský dvojkríž; pyramídu zo 4 rôzne veľkých podlhovastých kvádrov položených na seba; štvorcovú hlavu robota: 2oči, nos a ústa, ...)

Otázky:9. Akým slovom je označená grafická plocha a akým jej plátno? 10. Akým nástrojom kreslíme a akým vyfarbujeme plochy? 11. Popíšte príkaz na nakreslenie obdĺžnika. 12. Akým príkazom zmažeme grafickú plochu resp. nastavíme biele plátno?

10

Page 11: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Domáca úloha DU 03/1:

V programe vytvorte 9 tlačidiel: Tri tlačidlá, ktoré menia farbu pera na červenú, modrú

a zelenú Ďalšie tri tlačidlá, ktoré menia farbu štetca(výplne) na

žltú, bielu a šedú Jedno tlačidlo, ktoré nakreslí obdĺžnik s hrúbkou pera

10, pričom sa použijú nastavenia farieb a výplne pomocou 6 tlačidiel

Jedno tlačidlo, ktoré nakreslí štvorec s hrúbkou pera 10, pričom sa použijú nastavenia farieb a výplne pomocou 6 tlačidiel

Tlačidlo na zmazanie grafickej plochy Jednoduché texty (farba pera, farba štetca)

11

Page 12: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

D33. Ďalšie grafické príkazy.

Elipsy a kruhy. Čiary. Náhodnosť. Komentáre.

Do grafickej plochy môžeme vykresľovať objekty:Rectangle (x1,y1, x2, y2) – obdĺžnik, štvorecEllipse (x1,y1, x2, y2) – elipsu, kruhLineTo (x, y) – čiaraTieto objekty majú farbu výplne a okraja – Brush.Color a Pen.Color. Pre okraj môžeme nastaviť hrúbku - Pen.Width. Najprv nastavíme farbu okraja a výplne a potom definujeme objekt, ktorý sa má nakresliť.

Kreslenie elíps

Grafický príkaz Ellipse (x1,y1, x2, y2) nakreslí elipsu, ale s dobre nastavenými parametrami vie nakresliť aj kružnicu. Má štyri parametre podobne ako Rectangle a tieto majú rovnaký význam ako Rectangle:Image1.Canvas.Rectangle(30, 50, 300, 200);Image1.Canvas.Ellipse(30, 50, 300, 200);Tieto príkazy vykreslia vpísanú elipsu do obdĺžnika. Bude to vyzerať takto:

Príklad 1.

Vytvorte program, ktorý po stlačení tlačidla slniečko nakreslí modrý obláčik (elipsa) a žlté slniečko (kruh).

Riešenie:Pre pomoc so súradnicami si načrtneme polohu oblaku ako elipsy a slniečka ako kruhu. Pomocou nám bude obrázok:

12

Page 13: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Výsledný program vyzerá nasledovne:Po spustení programu, pri vytvorení formulára nastavíme biele pozadie plátna grafickej plochy.

procedure TForm1.FormCreate(Sender: TObject);begin Image1.Canvas.FillRect(Image1.ClientRect);end;

procedure TForm1.Button1Click(Sender: TObject);begin Image1.Canvas.Pen.Color:= clYellow; Image1.Canvas.Brush.Color:= clYellow; Image1.Canvas.Ellipse(100,40,270,190 ); Image1.Canvas.Pen.Color:= clBlue; Image1.Canvas.Brush.Color:= clBlue; Image1.Canvas.Ellipse(100,40,270,150 );end;

Kreslenie čiar

Príkaz Image1.Canvas.MoveTo presunie neviditeľné grafické pero do zadaného bodu. Príkaz Image1.Canvas.LineTo nakreslí s grafickým perom čiaru nastavenou farbou a hrúbkou.MoveTo nastaví začiatok úsečky, LineTo jej koniec.

Príklad 2. Vytvorte program, ktorý: po stlačení tlačidla úsečka nakreslí úsečku, ktorej začiatok je v bode (100, 50) a koniec v bode

(200, 80) po stlačení tlačidla čiary bude kresliť náhodne dlhé čiary z ľavého dolného bodu obrazovky

rôznymi smermi.

Riešenie:Do formulára vložíme tlačidlo1 s popisom úsečka. Chceme, aby sa po stlačení tlačidla nakreslila na plátno grafickej plochy úsečka, ktorej začiatok je v bode (100, 50) a koniec v bode (200, 80).

Úsečku nakreslíme na plátno grafickej plochy pomocou dvojice príkazov:

procedure TForm1.Button2Click(Sender: TObject);begin Image1.Canvas.MoveTo(100, 50); Image1.Canvas.LineTo(200, 80);end;

Príkaz Image1.Canvas.MoveTo presunie neviditeľné grafické pero do zadaného bodu. Príkaz Image1.Canvas.LineTo nakreslí s grafickým perom čiaru nastavenou farbou a hrúbkou.MoveTo nastaví začiatok úsečky, LineTo jej koniec.

Náhodné čísla: Random znamená náhodný. V zátvorke je parameter N – celé kladné číslo.Funkcia Random (N) vygeneruje jedno náhodné číslo spomedzi čísel od 0 po N-1. Random (400) vygeneruje niektoré číslo spomedzi čísel od 0 po 399

13

Page 14: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Random (301) vygeneruje niektoré číslo spomedzi čísel od 0 po 300 5 + Random (31) vygeneruje niektoré číslo spomedzi čísel od 5 po 35 2 + 2*Random (6) vygeneruje niektoré číslo spomedzi čísel {2, 4, 6, 8, 10, 12}

Upravme grafickú plochu tak, aby mala veľkosť približne 500x400. Do formulára vložíme tlačidlo s popisom čiary. Chceme, aby sa po každom stlačení tlačidla čiary nakreslila na plátno grafickej plochy úsečka, ktorej začiatok je v bode (0, 400) a koniec v náhodnom bode na plátne. Po spustení programu tlačidlo čiary stlačíme viackrát alebo môžeme stláčať Enter. Dostaneme hore uvedený obrázok.

procedure TForm1.Button3Click(Sender: TObject);begin Image1.Canvas.MoveTo(0, 400); Image1.Canvas.LineTo(Random(500), Random(400));end;

Úplne iný obrázok dostaneme, keď vyhodíme riadok s príkazom MoveTo. Tento riadok môžeme buď vyhodiť, alebo urobiť z neho komentár. Na začiatok riadka pridáme dve lomky a text za týmito dvoma znakmi sa ďalej už ignoruje. Komentáre sa najčastejšie používajú na písanie poznámok do textu programu.

procedure TForm1.Button2Click(Sender: TObject);begin //Image1.Canvas.MoveTo(0, 400); Image1.Canvas.LineTo(Random(500), Random(400));end;

Zhrnutie príkazov:

Kreslenie objektov Rectangle (x1,y1, x2, y2) // obdĺžnik, štvorec Ellipse (x1,y1, x2, y2) // elipsu, kruh

Kreslenie čiar: MoveTo(x, y);       // presunie pero bez kreslenia čiar LineTo(x, y);       // od momentálnej pozície pera kreslí úsečku do bodu (x, y)

Náhodnosť Random (N) //vygeneruje jedno náhodné číslo spomedzi čísel od 0 po N-1.

Úlohy:1. Do jedného projektu naprogramujte tlačidlá pre kreslenie rôznofarebných písmen: A, E, H, F. 2. Nakreslite semafor!3. Nakreslite strom: hnedý hrubý kmeň a nad ním elipsa zelenej farby. 4. Nakreslite snehuliaka s telom z dvoch guli, pridajte mu hrniec na hlavu a 2 oči.

14

Page 15: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Otázky:13. Popíšte príkaz na nakreslenie elipsy (kruhu). 14. Akým príkazom sa presúva pero zo zadaného bodu bez kreslenia čiar?15. Akým príkazom sa nakreslí čiara?16. Na čo sa používa funkcia Random?17. Aké čísla sa vygenerujú príkazom 1 + random(10)?18. Aké čísla sa vygenerujú príkazom random(21)- 10?19. Ako vygenerujete čísla od 20 po 30? 20. Ako vygenerujete čísla od -5 po +5?21. Ako vygenerujeme jedno číslo z intervalu {5, 10, 15, 20, 25, 30}?22. Na čo sa používajú v programe komentáre?

Domáca úloha:DÚ33 Vytvorte program s grafickou plochou v ktorom kliknutím na tlačidlo Iniciálky nakreslí vašou obľúbenou farbou iniciálky vášho mena.

15

Page 16: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

D34. Text v grafickej ploche. Farby.

Text v grafickej ploche. Náhodné farby.

Na písanie textov do grafickej plochy slúži príkaz TextOut ( x, y, 'text'. Má tri parametre: prvé dva sú súradnice umiestnenia, kde chceme text vypísať, a tretí je samotný vypisovaný text. Text sa vypisuje akoby v bielom obdĺžniku.Prvé dva parametre v príkaze výpisu musia byť celé čísla. Tretí, posledný parameter musí byť text, presnejšie, textový reťazec. V zápisoch v programe odlíšime textové reťazce od čísel alebo príkazov tým, že znaky textového reťazca napíšeme medzi apostrofy (Alt+39).

Čísla a texty sú pre počítač rozdielne typy údajov. S každým vykonávame iné úkony, inak s nimi manipulujeme. Preto napríklad v príkaze výpisu nemôžeme na mieste textového parametra napísať číslo:

nesprávne: Image1.Canvas.TextOut(0, 0, 123) ... 123 je číslo správne: Image1.Canvas.TextOut(0, 0, '123') ...'123' je reťazec

Príklad 1.Do formulára vložte tlačidlo s popisom text. Chceme, aby sa po stlačení tlačidla vypísal na plátno grafickej plochy, na pozíciu (20, 150) text:

Programujeme v Lazaruse. Nech sa text vypíše typom písma Comic Sans, červenej farby a

veľkosťou 36. Potom modifikujte program tak, aby po stlačení tlačidla sa tento

text vypísal náhodnou farbou na náhodné miesto grafickej plochy.

Riešenie:

procedure TForm1.Button3Click(Sender: TObject);begin Image1.Canvas.TextOut(20, 150, 'Programujeme v Lazaruse');end;

Pre vypisovaný text môžeme zmeniť hrúbku pera, font, veľkosť, farbu a podobne.

procedure TForm1.Button3Click(Sender: TObject);begin Image1.Canvas.Font.Name:= 'Comic Sans '; Image1.Canvas.Font.Height:= 36; Image1.Canvas.Font.Color:= clRed; Image1.Canvas.TextOut(20, 150, 'Programujeme v Lazaruse');end;

Funkciu Random - generátor náhodných čísel môžeme použiť aj pre nastavenie náhodnej farby pera. Vtedy musíme ako parameter tejto funkcie poslať hodnotu Random(256*256*256).

Môžeme predpokladať, že všetky farby v počítači sú namiešané z troch základných farieb: červenej, zelenej a modrej (tzv. modelRGB). Farba závisí od toho, koľko je v nej zastúpená každá z týchto troch farieb. Zastúpenie jednotlivej farby vyjadrujeme číslom od 0 do 255 (zmestí sa do jedného bajtu), napr. žltá farba vznikne, ak namiešame 255 červenej, 255 zelenej a 0 modrej. Ak budeme

16

Page 17: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

zastúpenie každej farby trochu meniť, napr. 250 červenej, 240 zelenej a hoci 100 modrej, stále to bude žltá, ale iného odtieňa. Na skladanie farieb máme k dispozícii funkciu RGBToColor, ktorej zadáme tri čísla od 0 do 255 a ona vytvorí príslušnú farbu, napr. známe preddefinované farby majú takéto vyjadrenie:

clBlack RGBToColor(0,0,0) clRed RGBToColor(255,0,0)clMaroon RGBToColor(128,0,0) clLime RGBToColor(0,255,0)clGreen RGBToColor(0,128,0) clYellow RGBToColor(255,255,0)clOlive RGBToColor(128,128,0) clBlue RGBToColor(0,0,255)clNavy RGBToColor(0,0,128) clFuchsia RGBToColor(255,0,255)clPurple RGBToColor(128,0,128) clAqua RGBToColor(0,255,255)clTeal RGBToColor(0,128,128) clLtGray RGBToColor(192,192,192)clGray RGBToColor(128,128,128) clDkGray RGBToColor(128,128,128)clSilver RGBToColor(192,192,192) clWhite RGBToColor(255,255,255)

Náhodnú farbu teda môžeme namiešať napr. aj takto

RGBToColor(Random(256), Random(256), Random(256)); // to je to isté ako Random(256*256*256);RGBToColor(Random(256), 0, Random(256));RGBToColor(150+Random(106), 0, 200);

Vyskúšajte si namiešať vlastné farby na predchádzajúcich príkladoch.

procedure TForm1.Button1Click(Sender: TObject);begin Image1.Canvas.Font.Height:= 26; Image1.Canvas.Font.Name:= 'Comic Sans '; Image1.Canvas.Font.Color:= Random(256*256*256); Image1.Canvas.Brush.Style:= bsClear; Image1.Canvas.TextOut(Random (400),Random (300), 'Programujeme v Lazaruse' );end;

Tlačidlo zmaž musí zrušiť priesvitnosť pre Brush.Style, pretože priesvitné pozadie sa nedá vybieliť:

procedure TForm1.Button5Click(Sender: TObject);begin //zmaž Image1.Canvas.Brush.Style:=bsSolid; Image1.Canvas.FillRect(Image1.ClientRect);end;

Zhrnutie grafických príkazov

Písanie textov do grafickej plochy: TextOut(x, y, 'text');      // text v apostrofoch vypíše od súradnice (x, y) -

písmo sa dá nastaviť pomocou Font Font.Height := 20;          // veľkosť písma Font.Name := 'Arial';       // meno fontu Font.Color := clRed;        // farba písma

17

Page 18: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Úlohy:

1. Vytvorte program, ktorý vypíše do grafickej plochy tieňovaný text

Ak nejaký text napíšeme najprv svetlo šedou farbou (clLtGray) a potom čiernou ale trochu ho posunieme o niekoľko bodov, napr. smerom nadol a vľavo, získame dojem tieňa. Vyskúšajme tento efekt s nejakým väčším zaujímavým písmom (napr. Broadway).

Podstatné pri tomto programe je nastaviť farebnú výplň obdĺžnika, do ktorého sa vypisuje text – teda Brush.Style na bsClear, štandardne je nastavené Brush.Style na bsSolid.

Otázky:23. Popíšte parametre príkazu na vypísanie textu do grafickej plochy.24. Akými príkazmi zmeníme typ, veľkosť a farbu textu v grafickej ploche?25. Akú funkciu použijeme, keď chceme vygenerovať náhodnú farbu?26. Akú funkciu použijeme, keď chceme vytvoriť farbu z modelu RGB?27. Napíšte príkaz, ktorým sa bude generovať len jedno farba v odtieňoch zelenej.28. Akým spôsobom nastavíme priesvitnú výplň obdĺžnika, v ktorom sa vypisuje text do grafickej

plochy a ako to vrátime späť?

Domáca úloha:DÚ 34: Vytvorte program s grafickou plochou v ktorom: Stlačenie tlačidla Meno vypíše na čiernu grafickú plochu, na náhodnú pozíciu vaše meno

veľkými písmenami. Text bude mať náhodnú farbu len v odtieňoch červenej a náhodnú veľkosť od 20 po 35;

Každé kliknutie na tlačidlo Elipsa nakreslí na bielu grafickú plochu, náhodnú elipsu, v ktorej X je náhodné číslo medzi 0 a 400 a Y je náhodné číslo medzi 0 a 300. Orámovanie a výplň každej elipsy je náhodnej farby. Hrúbka orámovania je buď 2, 4 alebo 6.

18

Page 19: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

T05. Premenné. Celočíselné premenné.

Premenné. Deklarácia premenných. Konštanta.

PremennáAby sme mohli riešiť všeobecné úlohy, tak budeme používať namiesto konkrétnych hodnôt

premenné.

Premennou v programovaní rozumieme pomenované miesto v pamäti počítača:

do premennej, čiže do pamäťového miesta, môžeme údaje zapísať, posledná zapísaná hodnota sa v premennej uchová, pamätá sa, zapamätanú hodnotu môžeme neskôr využiť, prečítať, zistiť.

Premenná je označená identifikátorom (menom), ktorý môže byť slovo bez medzier, ktoré môže obsahovať aj číslice (nie na začiatku), aj znak _ (podčiarovník). Nemôže obsahovať znaky ako ? / # a podobne, znaky s diakritikou, názov nesmie byť totožný s rezervovaným (kľúčovým) slovom – príkazom jazyka Pascal, názov nesmie začínať číslicou. Používajme mnemotechnické identifikátory.

Deklarácia premennej je zápis, v ktorom prezradíme meno premennej = ako premennú pomenujeme, ako sa bude volať typ premennej = aké hodnoty z akej množiny bude nadobúdať

Kľúčové slovo var (skratka zo slova variable = premenná) znamená začiatok deklarácie premenných. Premenné deklarujeme pred slovom begin!

var a,i,strana : integer; celočíselné premenné text,g : string; reťazec sucet: real; reálne premenné

begin {telo programu}end.

V jazyku Pascal môžeme používať veľa premenných. Rôzne typy údajov môžeme chápať ako rôzne množiny. Tie majú v  jazyku Pascal (Lazarus) svoje pomenovanie:

celé číslo je typu (je z množiny) Integer (0, +, 100, -59. ...) desatinné číslo: Real (0.5, 100.8, ...) textový reťazec: String (‘Lazarus‘,‘Ako sa máš?‘,‘2012‘, ...) farba: TColor (clRed, clBlack, ...)

aj obrázky a tlačidlá sú pre počítač údaje obrázok: TImage tlačidlo: TButton

Každú premennú charakterizuje:

a) množina prípustných hodnôt, ktoré môže uchovávať a

19

Page 20: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

b) množina operácií, ktoré sa s ňou môžu vykonávať.

Týmto dvom vlastnostiam sa súhrnne hovorí dátový typ.

Premenná, ktorá má priradený svoj dátový typ, nadobúda vždy iba hodnoty tohto dátového typu a žiadneho iného a môžu sa s ňou vykonávať iba určité prípustné operácie. Tomu hovoríme, že premenná je daného typu.

Konštanta

Konštantou v programovaní rozumieme pomenované miesto v pamäti počítača:

hodnota ktorého sa počas behu programe nemení.

Čo sa týka mena (identifikátora) konštanty, platí to isté, čo pre premennú.Kľúčové slovo const znamená začiatok deklarácie konštánt. Konštanty deklarujeme pred slovom begin!const velkost = 30; farba = clBlue; x=30;begin {telo programu}end.

Celočíselná premenná Integer

Tabuľka celočíselných dátových typov:Identifikátor typu Rozsah hodnôt premennej Veľkosťbyte 0..255 1 Bword 0..65535 2 Binteger -2147483647..2147483647 4 B

Prípustné operácie nad celočíselnými dátovými typmi:+ (súčet)- (rozdiel)* (súčin)DIV (celočíselné delenie)MOD (zvyšok po celočíselnom delení, napr. x MOD y)<, <=, =, >, >=, <> (relačné operácie)

IntToStr (x:integer) vráti reťazecStrToInt (x:string) z reťazca spraví celé číslo

Príklad 1:Napíšte program, ktorý trojciferné číslo (zadané v konštante) rozdelí na cifry a urobí ich súčet. Ten nech vypíše do grafickej plochy.

20

Page 21: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Riešenie:1. Rozbor problému: Vstupy: cislo = 736, premenné: cifra1, cifra2, cifra3 – celé čísla výstup: sucetpožiadavky: vypísať súčet cifier do grafickej plochy – textový reťazec!2. Návrh riešenia:Cifry získame z čísla pomocou celočíselného delenia: využijeme operácie div a mod.Div nám dá celé číslo po delení, mod nám dá zvyšok po celočíselnom delení.736 div 10 = 73 736 mod 10 = 6736 div 100 = 7 736 mod 100 = 36Ďalšie príklady:14 div 7 = 2 14 mod 7 = 0 14 div 5 = 2 14 mod 5 = 4Keď získame cifry, potom ich sčítame. Keďže TextOut vypisuje len reťazce, musíme výsledok sčítania – premennú sucet typu Integer prekonvertovať na premennú typu reťazec String. Urobíme to príkzom IntToStr(sucet). Konverzná funkcia IntToStr prevedie celé číslo na text a ten dokážeme vypísať do grafickej plochy.

procedure TForm1.Button1Click(Sender: TObject);const cislo = 736;var cifra1, cifra2, cifra3, sucet: Integer;begin cifra1 := cislo div 100; cifra2 := (cislo div 10) mod 10; cifra3 := cislo mod 10; sucet := cifra1 + cifra2 + cifra3; Image1.Canvas.FillRect(Image1.ClientRect); Image1.Canvas.Font.Name:= 'Comic Sans '; Image1.Canvas.Font.Height:= 36; Image1.Canvas.Font.Color:= clBlue; Image1.Canvas.TextOut(100, 20, IntToStr(sucet));end;

Trasovacia tabuľka (v každom stĺpci je momentálna hodnota príslušnej premennej):

cifra1 cifra2 cifra3 sucetbegin ? ? ? ? cifra1 := cislo div 100; 7 cifra2 := (cislo div 10) mod 10; 3 cifra3 := cislo mod 10; 6 sucet := cifra1 + cifra2 + cifra3; 16end; neex. neex. neex. neex.

Otáznikom značíme zatiaľ nedefinovaný obsah premennej. V poslednom riadku vidíme, že end spôsobí zrušenie všetkých deklarovaných premenných a hoci procedúra aj niečo spočítala (suma), ak by sme tento výsledok nikde neuchovali alebo nevypísali, už sa ho nedozvieme – je zrušený.

21

Page 22: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Príklad 2:Napíšte program, ktorý bude na náhodnú pozíciu na grafickej ploche kresliť štvorce so stranou 100.

Riešenie:

Použijeme náhodný generátor - funkciu Random, ktorá zakaždým vráti nejakú inú (možno aj tú istú) hodnotu:

procedure TForm1.Button2Click(Sender: TObject);const strana= 100;var X, Y: Integer;begin X := Random(500); Y := Random(400); Image1.Canvas.Pen.Width := 5; Image1.Canvas.Rectangle(X, Y, X+strana, Y+strana);end;

Modifikujte úlohu tak, - aby štvorce boli vyfarbené len v odtieňoch jednej zo základných farieb RGB.- aby štvorce mali náhodnú veľkosť od 30 po 80.

Úlohy:2. Vytvorte program, ktorý bude vykresľovať kruhy náhodnej farby a na náhodných miestach

grafickej plochy.3. Vytvorte program, ktorý nakreslí obdĺžnik so stranami a a b, pričom jeho ľavý horný vrchol má

súradnice [x, y]. Najprv zadeklarujte 4 premenné, potom do nich na začiatku procedúry priradíte nejaké 4 hodnoty a nakoniec nakreslíte požadovaný obdĺžnik.

4. V programe budú dve premenné x a y – súradnice bodu v ploche. Program nakreslí vozík ako červený vyplnený obdĺžnik so stranami 100 a 40, pričom na spodnej strane tohto vozíka budú dve modré kružnice s polomerom 20. Ľavý horný vrchol obdĺžnika má súradnice [x, y]. Program otestujte tak, že ho niekoľkokrát spustite s rôznymi hodnotami v premenných x a y. Vozík by mal vyzerať približne ako na obrázku.

22

Page 23: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Otázky:29. Vysvetlite pojem premenná a identifikátor.30. Vysvetlite pojem deklarácie premennej.31. Akým kľúčovým slovom deklarujeme premenné?32. Čo nesmieme použiť v identifikátore premennej?33. Akým kľúčovým slovom sa deklaruje konštanta?34. Vymenujte tri typy premenných a uveďte ich pomenovanie.35. Koľko bajtov zaberá v pamäti počítača premenná typu Integer?36. Akými príkazmi zmeníme celé číslo na reťazec a naopak reťazec na celé číslo?37. Aký operátor sa používa na celočíselné delenie?38. Aký operátor sa používa, keď chceme získať zvyšok po celočíselnom delení?39. Čo je to trasovacia tabuľka?40. Aké výsledky dostaneme? 18 mod 3, 18 div 3, 2 div 2, 2 mod 2.

Domáca úloha:

Dú 35. Zadané dvojciferné číslo (v konštante číslo napr. 73) rozoberte na cifry (premenné c1 a c2) a potom z nich zložte prevrátené číslo (najprv druhá cifra, potom prvá). Pôvodné číslo (73) aj prevrátené číslo (37) vypíšte.

D36. Zadávanie vstupu

Editovacie políčko. Spájanie textových reťazcov.

Príklad 1.

23

Page 24: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

a) Deklarujte tri celočíselné premenné r, x, y. Nakreslite kružnicu polomerom r=80 na pozíciu x=100, y=100 (ľavý horný roh).

b) Nakreslite kružnicu so stredom [x, y] a polomerom r.Vložíme ďalšie tlačidlo (kružnica_stred). Použijeme tri celočíselné premenné: x, y, r

procedure

TForm1.Button1Click(Sender: TObject); var x, y,r: Integer;begin x:= 100; y:= 100; r:= 80; Image1.Canvas.Ellipse(x, y, x+2*r, y+2*r);end;

procedure TForm1.Button2Click(Sender: TObject); var x, y, r: Integer;begin x:= 100; y:= 100; r:= 80; Image1.Canvas.Ellipse(x-r, y-r, x+r, y+r);end;

Editovacie políčko (editovací, vstupný riadok)

Na vkladanie jednoriadkového textu používame komponent Editovacie políčko (TEdit). Pomocou neho zadávame vstupné údaje programu.

24

Page 25: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Editovacie políčko funguje ako veľmi jednoduchý textový editor.1. Vložme jedno editovacie políčko do formulára.2. Ak program spustime, môžeme do editovacieho políčka písať krátke texty.

Vidíme, že po spustení programu už je v políčku napísaný text (Edit1). Ten môžeme zmeniť:1. Vo formulári označíme editovacie políčko (klikneme naň).2. V inšpektore objektov nájdeme vlastnosť Text3. Zmeníme text vo vlastnosti Text na prázdne alebo napíšeme nejaký text.Text, ktorý napísal používateľ do editovacieho políčka, zistíme z vlastnosti Text. Tánadobúda hodnotu typu string (textový reťazec), ktorú môžeme v programejednoducho zistiť a vypísať.

Príklad 2. Modifikujme príklad 1, ktorý nakreslí kružnicu so stredom [x, y] a polomerom r. tak, aby sme polomer kruhu načítali z editovacieho políčka. Potom meňte hodnou polomera kružnice v editovacom políčku od 100 po 10.

procedure TForm1.Button2Click(Sender: TObject); var x, y, r: Integer;begin x:= 150; y:= 150;// r:= 80; zrušíme; polomer načítame z editovacieho políčka r:= StrToInt(Edit1.Text); Image1.Canvas.Ellipse(x-r, y-r, x+r, y+r);end;

StrToInt mení textový reťazec na celé číslo.

Príklad 3.Vložte ďalšie editovacie políčko a tlačidlo (vypíš text), na ktoré ak klikneme, vypíše sa text z editovacieho políčka.

procedure TForm1.Button3Click(Sender: TObject);begin Image1.Canvas.Font.Height:= 40; Image1.Canvas.TextOut(50, 50, 'Toto je text: ' + Edit2.Text);end;

Textové reťazce spájame pomocou znamienka +.

Príklad 4.Vložte ďalšie tlačidlo. Po kliknutí naň vykreslite na obrazovku kruhy náhodnej farby, pričom obvod aj výplň má rovnakej farby. Polomer kruhu má náhodnú veľkosť od 1 do 50. Na grafickej ploche musia byť len úplné kruhy (žiaden nesmie byť seknutý).

Riešenie:

25

Page 26: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Najprv musíme zistiť, v akých hraniciach môžeme generovať náhodné čísla. Potrebujeme zistiť rozmer Image1. Použijeme príkazy:na zistenie šírky grafickej plochy využijeme Image1. Width, na zistenie výšky grafickej plochy využijeme Image1.Height.procedure TForm1.Button4Click(Sender: TObject); var X, Y, R: Integer;begin Image1.Canvas.Pen.Color := Random(256*256*256); Image1.Canvas.Brush.Color := Image1.Canvas.Pen.Color; R := Random(50)+1; X := R + Random(Image1.Width-2*R; Y := R + Random(Image1.Height-2*R); Image1.Canvas.Ellipse(X-R, Y-R, X+R, Y+R);end;

Úlohy:1. Program z editovacieho políčka zistí veľkosť textu a pomocou príkazu TexOut vypíše text

Lazarus tejto veľkosti. Zvoľte písmo Ariel.2. Do formulára vložte dva komponenty Edit1 a Edit2. Pomocou týchto dvoch vstupov zadajte dve

čísla: šírka a výška. Program potom nakreslí obdĺžnik so stranami šírka a výška, ktorého stred má súradnice [150, 120] a vypíše obsah obdĺžnika.

3. Vytvorte aplikáciu, ktorá načíta dve celé čísla a vypíše ich podiel a zvyšok po delení, ale v matematickom tvare, napr. 7 : 3 = 2 zv. 1.

4. Napíšte program, ktorý bude generovať príklady malej násobilky a vypisovať ich do grafickej plochy aj s výsledkom. Napr.: 3 * 4 = 12. Činitele budú generované náhodne.

Otázky:41. Na čo sa používa komponent editovacie políčko?42. Aký dátový typ má hodnota v editovacom políčku?43. Akými príkazmi zmeníme celé číslo na reťazec a naopak reťazec na celé číslo?44. Akým znakom spájame textové reťazce?45. Ako zistíme šírku a výšku grafickej plochy?

Domáca úloha:DÚ/36: Napíšte program, ktorý načíta vaše meno, rok vášho narodenia a predstaví vás. Napíšte skupinu príkazov, ktoré zabezpečia, že ak do editovacieho políčka zadáte svoje meno a vek, tak sa po stlačení tlačidla do grafickej plochy vypíše váš vek a meno. Dobrý deň.

26

Page 27: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Volám sa xxx Narodil som sa v roku xxxx. Upravte program tak, že pridáte ešte jeden riadok s textom: Mám xx rokov.

D37. Opakovanie. Riešenie príkladov

Otázky:1. Definujte pojem problém a algoritmus? 2. Ktoré vlastnosti sú pre algoritmus povinné a ktoré vhodné?3. Popíšte vlastnosti algoritmu elementárnosť a determinovanosť.4. Popíšte vlastnosti algoritmu rezultatívnosť a konečnosť.5. Popíšte vlastnosti algoritmu hromadnosť a efektívnosť.

27

Page 28: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

6. Akými spôsobmi môžeme zapísať algoritmus?7. Vymenujte a stručne popíšte etapy tvorby programu?8. Aký je rozdiel medzi chybou syntaktickou a logickou?9. K čomu slúži vývojový diagram?10. Vymenujte a nakreslite základné značky vývojového diagramu.11. Čo rozumiete pod pojmom program a príkazy programu?12. Čo je premenná a čo konštanta v programe a aký je medzi nimi rozdiel?13. Čo rozumiete pod pojmom výraz a čo je identifikátor?14. Vymenujte a popíšte činnosti, ktoré sú pre počítač elementárne.15. Popíšte spôsoby zápisu algoritmov a uveďte pomocou akých základných algoritmických

konštrukcií môžeme zapísať ľubovoľný výpočtový proces.16. Čo je Pascal a čo Lazarus?17. Čo je to IDE a na čo sa používa?18. Vymenujte základné časti prostredia Lazarus.19. Čo umožňuje editovacie okno a na čo slúži formulár?20. Ako spolu súvisia paleta komponentov a inšpektor objektov?21. Na čo slúži súbor Unit1.pas a súbor projekt1.lpi?22. Stlačením ktorého klávesu sa zobrazí formulár ak nie je momentálne viditeľný?23. Zmenou ktorej vlastnosti v Inšpektore Objektov zmeníme text na tlačidle?24. Medzi aké kľúčové slová Pascalu píšeme vlastný program?25. Ako vyzerá v Pascale priraďovací znak?26. Aký znak v Pascale sa používa na ukončenie príkazu?27. Čo je v Pascale znakový reťazec?28. Aké klávesy použijeme na dokončievanie identifikátorov?29. Ako spustíme program v Lazaruse?30. Aký je všeobecný tvar priraďovacieho príkazu pre zmenu atribútov? 31. Aký príkaz je pre nastavenie farby komponentu? 32. Aké sú dva spôsoby definovania farieb v Lazaruse? 33. Akými atribútmi môžeme zmeniť veľkosť a farbu jednoduchého textu (Label)?34. Čo je to grafická plocha?35. Akým slovom je označená grafická plocha a akým jej plátno? 36. Akým nástrojom kreslíme a akým vyfarbujeme plochy? 37. Popíšte príkaz na nakreslenie obdĺžnika (štvorca). 38. Akým príkazom zmažeme grafickú plochu resp. nastavíme biele plátno?39. Popíšte príkaz na nakreslenie elipsy (kruhu). 40. Akým príkazom sa presúva pero zo zadaného bodu bez kreslenia čiar?41. Akým príkazom sa nakreslí čiara?42. Na čo sa používa funkcia Random?43. Aké čísla sa vygenerujú príkazom 1 + random(10)?44. Aké čísla sa vygenerujú príkazom random(21)- 10?45. Ako vygenerujete čísla od 20 po 30? 46. Ako vygenerujete čísla od -5 po +5?47. Ako vygenerujeme jedno číslo z intervalu {5, 10, 15, 20, 25, 30}?48. Na čo sa používajú v programe komentáre, akým znakom sa označujú?49. Popíšte parametre príkazu na vypísanie textu do grafickej plochy.50. Akými príkazmi zmeníme typ, veľkosť a farbu textu v grafickej ploche?51. Akú funkciu použijeme, keď chceme vygenerovať náhodnú farbu?52. Akú funkciu použijeme, keď chceme vytvoriť farbu z modelu RGB?53. Napíšte príkaz, ktorým sa bude generovať len jedna farba v odtieňoch zelenej.

28

Page 29: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

54. Akým spôsobom nastavíme priesvitnú výplň obdĺžnika, v ktorom sa vypisuje text do grafickej plochy a ako to vrátime späť?

55. Vysvetlite pojem premenná a identifikátor.56. Vysvetlite pojem deklarácie premennej.57. Akým kľúčovým slovom deklarujeme premenné?58. Čo nesmieme použiť v identifikátore premennej?59. Akým kľúčovým slovom sa deklaruje konštanta?60. Vymenujte tri typy premenných a uveďte ich pomenovanie.61. Koľko bajtov zaberá v pamäti počítača premenná typu Integer?62. Akými príkazmi zmeníme celé číslo na reťazec a naopak reťazec na celé číslo?63. Aký operátor sa používa na celočíselné delenie?64. Aký operátor sa používa, keď chceme získať zvyšok po celočíselnom delení?65. Čo je to trasovacia tabuľka?66. Aké výsledky dostaneme? 18 mod 3, 18 div 3, 2 div 2, 2 mod 2.67. Na čo sa používa komponent editovacie políčko?68. Aký dátový typ má hodnota v editovacom políčku?69. Akými príkazmi zmeníme celé číslo na reťazec a naopak reťazec na celé číslo?70. Akým znakom spájame textové reťazce?71. Ako zistíme šírku a výšku grafickej plochy?

Príklady:Vytvorte aplikáciu podľa nasledujúcich pokynov:c) Do editovacieho políčka zadajte stranu kocky v cm a tlačidlom objem vypíšte jej objem v cm3

(ako jednoduchý text).

d) Vytvorte kalkulačku, ktorá dokáže sčítať, odčítať a vynásobiť dvojici čísel. Čísla načítajte z editovacích políčok, tlačidlom kalkulačka sa vypíšu jednoduché texty s výsledkami (súčet, rozdiel súčin).

e) Do editovacieho políčka načítajte dvojciferné číslo. Program nech do grafickej plochy vypíše po stlační tlačidla číslo toto číslo tak, že desiatky vypíše modrou a jednotky červenou farbou.

f) Po stlačení tlačidla tri štvorce nech sa vedľa seba nakreslia tri štvorce tak, aby každý nasledujúci mal stranu raz takú veľkú ako predchádzajúci a ich spodná hrana ležala na jednej priamke. Do editovacieho políčka načítajte stranu najmenšieho štvorca.

29

Page 30: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

Riešenie:

procedure TForm1.Button1Click(Sender: TObject);var a, V:integer; //objembegin a:= StrToInt(Edit1.Text); V:= a*a*a; Label2.Caption:= IntToStr(V) + 'cm3';end;

procedure TForm1.Button2Click(Sender: TObject);var a, b, vysledok:integer; //kalkulačkabegin a:= StrToInt(Edit2.Text); b:= StrToInt(Edit3.Text); Label5.Caption:= IntToStr(a + b); Label6.Caption:= IntToStr(a - b); Label7.Caption:= IntToStr(a * b);end;

procedure TForm1.Button3Click(Sender: TObject); var a, p, z:integer; //dvojciferné číslobegin

30

Page 31: Web viewword. 0..65535. 2 B. integer-2147483647..2147483647. 4 B. Prípustné operácie nad celočíselnými dátovými typmi: + (súčet) - (rozdiel) * (súčin) DIV

Postupy. Riešenie problémov. Algoritmické myslenie. 2. ročník

a:= StrToInt(Edit4.Text); p:= a div 10; z:= a mod 10; Image1.Canvas.Font.Color:= clRed; Image1.Canvas.Font.Height:=50; Image1.Canvas.Brush.Color:= clWhite; Image1.Canvas.TextOut(40, 20, IntToStr(z)); Image1.Canvas.Font.Color:= clBlue; Image1.Canvas.TextOut(10, 20, IntToStr(p));end;

procedure TForm1.Button4Click(Sender: TObject);var s, x, y: integer; // tri štvorcebegin s:= StrToInt(Edit5.Text); x:= 10; y:= 200; Image1.Canvas.Pen.Width:= 3; Image1.Canvas.Brush.Color:= Random(256*256*256); Image1.Canvas.Rectangle(x, y, x+ s, y-s); Image1.Canvas.Rectangle(x+s, y, x+ 3*s, y-2*s); Image1.Canvas.Rectangle(x+3*s, y, x+ 6*s, y-3*s);end;

procedure TForm1.Button6Click(Sender: TObject);begin //zmaž Image1.Canvas.Brush.Color:= clWhite; Image1.Canvas.FillRect(Image1.ClientRect);end;

procedure TForm1.FormCreate(Sender: TObject);begin Image1.Canvas.FillRect(Image1.ClientRect);end;

31