Sign in Join
Wiki copytemporary

Howdy World (Hello World on steroids)/fi: what changed

Revision 1 to 2. Removed lines have a minus sign; added lines have a plus sign.

OldNewLine
11Tämä Wikisivu on Lazarus ohjelmoinnin perusopastusta. Tässä selitetään ensimmäisiä askeleita miten saada toimiva ohjelmisto ja joitakin hyviä käytäntöjä selitetään myös matkan varrella. Lopputulos on (toivottavasti)kaksitahoinen: lukija ymmärtää peruskäsitteet miten rakentaa ohjelmisto Lazaruksella ja hän saa todellisen palan toimivaa ohjelmistoa, joka voidaan sisällyttää muihin ohjelmiin: laskimen. Laskin on melko helppo toteuttaa ja jokainen ymmärtää sen käsitteitä. Joten sitä ei tarvitse kuvata "liiketaloudellisesti" etukäteen. Laskin on rajoitettu vain kokonaisluku laskelmiin, mutta voidaan helposti laajentaa. Tämä opetusohjelma ei kuvaa Lazaruksen asennusta. Vaan oletetaan, että Lasarus on asennettu ja käyttövalmis (mieluiten viimeinen vakaa versio). Tämä opetusohjelma on enemmän tai vähemmän alustasta riippumaton. Kaikki kuvakaappauksia tehtiin Windows XP PC; joten sininen / punainen / harmahtava väritys.
22
33Suositeltavaa luettavaa ennen tätä: [[Lazarus Tutorial/fi|Kattava Lazaruksen käyttöönotto]].
44
55## Aloitus
66
77On parasta luoda erillinen hakemisto/kansio jokaista uutta projektia varten. Joten ennen kuin tartutaan varsinaisiin "puikkoihin" niin luodaa hakemisto johon tallennetaan tämä laskin projekti (tehdään tämä käyttöjärjestelmän avulla). Tämä hakemisto on juuri kaikille projektiin luoduille tiedostoille.
88
99- Luo uusi hakemisto tälle demo projektille (kutsutaan sitä \$HOME/CalculatorDemo).
1010
1111(*Teksti, joka kuvaa toimia, jotka täytyy suorittaa on merkitty luettelomerkeillä kuten edellinen rivi.*)
1212
1313On siis aika aloittaa uusi Lazarus projekti.
1414
1515- Käynnistä Lazarus.
1616- Valitse valikosta: Projekti / Uusi projekti...
1717- Valintaikkun, joka näytetään valitse siinä: Sovellus ja paina OK (jos kehitysympäristö valittaa tallentamattomia muutoksia, paina ei).
1818
1919Voit varmistaa, että kaikki tiedostot uudessa projektissa päätyvät oikeaan hakemistoon on projekti tallennettava ensin.
2020
2121- Valitse valikosta Tiedosto/Tallenna kaikki.
2222- Valitse hakemisto, joka luotiin aiemmin (\$ HOME / CalculatorDemo).
2323- Anna projektille uusi nimi: CalculatorDemo
2424- Paina tallenna
2525- Kehitysympäristö haluaa tallentaa päälomakkeen samalla kertaa: kirjoita "ufrmMain''. se on lomakkeen ja käännösyksikön nimi.
2626- Kehitysympäristö kysyy että tiedoston tulisi muuttaa pienillä kirjaimilla kirjoitetuksi. Vahvista tämä painamalla näppäintä "Nimeä pienillä kirjaimilla".
2727
2828Teoriassa ohjelma, joka on täten luotu on pala toimivaa ohjelmistoa, joka voidaan suorittaa. Ennen kokoamisen ensimmäistä kertaa, kaksi muutosta suositellaan: osoitetaan uusia paikkoja (hakemistoja) varten kootuille käännösyksiköille ja kohdetiedostolle.
2929
3030- Valitse valikosta: Projekti / Projektikohtaiset asetukset ...
3131- Valitse kääntäjän asetukset / Hakupolut (klikkaa solmun puunäkymää)
3232- Kirjoita teksti *bin\* ennen kohdetiedostonimeä (tai *bin/* esim. unix/linux ympäristössä)
3333- Huomaa myös *lib* etuliite käännöshakemisto kohdassa (älä muuta sitä).
3434- Paina OK
3535
3636Alla oleva kuva näyttää miten tämä on Windows koneella.
3737
38-<figure>
39-<img src="tutcal_project_options.png" title="tutcal_project_options.png" />
40-<figcaption>tutcal_project_options.png</figcaption>
41-</figure>
38+![](/wiki-images/e/eb/Tutcal_project_options.png)
4239
4340Tekemällä näin projektikansio ei täyty tuotoksella, joka syntyy kääntämisessä. Projektikansion tiedostot vaaditaan kun (uudelleen) kootaan ohjelma. Kaikki se mitä on *lib* ja *bin* hakemistoissa voidaan poistaa kun projekti arkistoidaan.
4441
4542Nyt ensimmäisenä testinä projekti voidaan koota ja ajaa.
4643
47-- Paina <span class="kbd">F9</span> (pikanäppäin joka kokooaa, rakentaa ja suorittaa ohjelman)
44+- Paina `F9` (pikanäppäin joka kokooaa, rakentaa ja suorittaa ohjelman)
4845
4946Jos kaikki meni hyvin niin nähdään tyhjä ikkuna. Nyt tiedetään että ollaan luotu vankka perusta johon voidaan alkaa rakentaa ohjelmaa.
5047
5148- Lopeta käynnissä oleva ohjelma klikkaamalla sulje kuvaketta (käyttöjärjestelmä riippuvainen piirre).
5249
5350## Ensimmäinen komponentti
5451
5552Lazaruksessa on [[Component Palette/fi|komponenttipaletti]]:
5653
57-<figure>
58-<img src="tutcal_component_palette.png" title="tutcal_component_palette.png" />
59-<figcaption>tutcal_component_palette.png</figcaption>
60-</figure>
54+![](/wiki-images/d/d4/Tutcal_component_palette.png)
6155
6256Kaikki komponentit, jotka ovat saatavilla rakentaessa käyttöliittymää on ryhmitelty loogisesti välilehtiin. Todellinen välilehtien määrä riippuu asennetuista paketeista. Mutta peruspaletti näyttää suunnilleen samanlaiselta mitä on kuvassa. Ensimmäinen välilehti on [[Standard tab/fi|Standard]], jonka jälkeen [[Additional tab/fi|Additional]], [[Common Controls tab/fi|Common]] jne. Komponentin [[Type/fi|tyypin]] nimi löytyy kun vie hiiren osoittimen komponentin kuvakkeen yläpuolelle jolloin vihjetekstinä näkyy tyypin nimi (tarkemmin sanottuna: näytetään minkä tyyppinen on komponentin [[Class/fi|luokka]]). Selitystä komponenteista löytyy myös mm [[Lazarus Tutorial/fi|Kattava Lazaruksen käyttöönotto]].
6357
6458Ensimmäinen asia, joka tehdään laskinohjelmaan on luoda siihen näyttö, jossa syötetyt numerot ovat tai näytetään. Tähän käytetään [[TEdit]]-komponenttia tai Controls:ia.
6559
6660> **Note:** Joskus visuaalisia komponentteja kutsutaan myös Controls:ksi. "Komponentin (component)" ja "control" erolla ei nyt ole merkitystä.
6761
68-Jos halutaan sijoittaa komponentti lomakkeelle niin se on oltava valittuna. Painamalla <span class="kbd">F12</span>-näppäintä se vaihtaa valituksi vuorotellen lomakkeen tai lähdekoodieditorin.
62+Jos halutaan sijoittaa komponentti lomakkeelle niin se on oltava valittuna. Painamalla `F12`-näppäintä se vaihtaa valituksi vuorotellen lomakkeen tai lähdekoodieditorin.
6963
70-- Paina <span class="kbd">F12</span>- kerran tai kahdesti niin saadaan lomakkeen ikkunan päällimmäiseksi (katso kuva alla).
64+- Paina `F12`- kerran tai kahdesti niin saadaan lomakkeen ikkunan päällimmäiseksi (katso kuva alla).
7165
72-<figure>
73-<img src="tutcal_form_on_top.png" title="tutcal_form_on_top.png" />
74-<figcaption>tutcal_form_on_top.png</figcaption>
75-</figure>
66+![](/wiki-images/e/ed/Tutcal_form_on_top.png)
7667
7768- Valitse Standard välilehti [[Component Palette/fi|komponenttipalettilta]]. Tämä on välilehti, joka on oletusarvoisesti valittuna.
7869- Klikkaa [[TEdit/fi|TEdit]] komponenttia (Vinkki: viemällä kohdistin komponentin kuvakkeen päälle niin saadaan tieto luokan nimestä).
7970- Klikkaa jossain keskellä lomaketta. Tämä asettaa TEdit komponentin lomakkeelle. Sen nimi on sama kuin komponentin tyyppi ilman aloittavaa "T"-kirjainta ja nimen loppuun liitetään (järjestys)numero (esim. Edit1). Jos toinen TEdit komponentti olisi tarkoitus sijoittaa lomakkeelle niin se olisi nimeltään Edit2. Ja niin edelleen. Tämä koskee kaikkia komponentteja.
8071
8172Nyt kun komponentti on sijoitettu lomakkeelle se voidaan räätälöidä tarpeisiimme. Tämä mukauttaminen tapahtuu komponenttimuokkaimessa. Se on ikkuna näytön vasemmalla puolella jossa on TEdit-komponentin ominaisuuksien luettelo jotka ovat muokattavissa.
8273
83-<figure>
84-<img src="tutcal_object_inspector.png" title="tutcal_object_inspector.png" />
85-<figcaption>tutcal_object_inspector.png</figcaption>
86-</figure>
74+![](/wiki-images/5/59/Tutcal_object_inspector.png)
8775
88-[[Property/fi|Ominaisuudet]] määrittävät komponentin ulkoasua ja käyttäytymistä. Ominaisuuksia on helppo vaihtaa: klikkaa jotain niistä, syötä uusi arvo ja paina <span class="kbd">Enter</span>. Vaikutukset komponenttiin ovat heti näkyvissä. Kaikki komponenttimuokkaimessa kerralla näytettävät ominaisuudet kuuluvat yhdelle komponentille. Se komponentti, joka on valittu voidaan tunnistaa pienistä mustista neliöistä lomakkeella. Neliöt ympäröivät komponenttia. Niin tapa muuttaa komponentin ominaisuuksia, on ensin valita se ja sitten tehdä muutoksia komponenttimuokaimella. Jos mitään komponenttia ei ole valittu niin lomakkeen ominaisuudet näkyvät.
76+[[Property/fi|Ominaisuudet]] määrittävät komponentin ulkoasua ja käyttäytymistä. Ominaisuuksia on helppo vaihtaa: klikkaa jotain niistä, syötä uusi arvo ja paina `Enter`. Vaikutukset komponenttiin ovat heti näkyvissä. Kaikki komponenttimuokkaimessa kerralla näytettävät ominaisuudet kuuluvat yhdelle komponentille. Se komponentti, joka on valittu voidaan tunnistaa pienistä mustista neliöistä lomakkeella. Neliöt ympäröivät komponenttia. Niin tapa muuttaa komponentin ominaisuuksia, on ensin valita se ja sitten tehdä muutoksia komponenttimuokaimella. Jos mitään komponenttia ei ole valittu niin lomakkeen ominaisuudet näkyvät.
8977
9078Tee seuraavat muutokset komponentin Edit1 ominaisuuksiin.
9179
9280- Vaihda Name-ominaisuuden tekstiksi *edDisplay*.
9381- Muuta Align-ominaisuus arvoon *alTop* (muuta Align, ei Alignment!).
9482- Muuta Alignment-ominaisuus arvoon *alRightJustify*.
9583- Muuta BorderSpacing.Around arvoon *6*.
9684- Vaihda Text-ominaisuus arvoon *0* (siis numero nolla, ei kirjain o).
9785
9886Nämä ominaisuudet ovat melko itsestään selviä. Varsinkin kun edellä olevia muutoksia tehdään ja niiden vaikutuksia seurataan lomakkeella.
9987
10088Viimeistely koskettaa myös käytettävää kirjaisinta (Font), jota käytetään näyttämään tekstejä kaikissa komponenteissa. Kirjaisin eli fontti voidaan muuttaa kahdessa paikassa: TEdit-tyyppisen edDisplay komponentin Font ominaisuudessa tai lomakkeen Font-ominaisuudessa. Muuttaminen lomakkeen Font-ominaisuudessa on se etu, että "kaikki" asetut komponentit lomakkeella tulee "perimään" tämän fontin. Nyt tehdään tälläinen muutos.
10189
10290- Klikkaa jossain keskellä lomaketta. Tämä peruuttaa edDisplay-komponentin valinnan ja valitsee itse lomakkeen. Lomakkeen ominaisuudet näkyvät nyt komponenttimuokkaimessa.
10391
104-Klikkaa komponenttimuokkaimessa Font-ominaisuutta. Font-rivi on nyt korostettu ja painike kolmella pisteellä <span class="kbd">...</span> näkyy.
92+Klikkaa komponenttimuokkaimessa Font-ominaisuutta. Font-rivi on nyt korostettu ja painike kolmella pisteellä `...` näkyy.
10593
10694- Klikkaa painiketta, jossa on kolme pistettä. Tämä avaa dialogin Fontti.
10795- Valitse kirjaimeksi Verdana, Lihavoitu (Bold), koko 10.
10896- Paina OK.
10997
11098Lomakkeen otsikko ei ole kovin mielekäs. Oletusteksti "Form1" näytetään.
11199
112100- Komponenttimuokaimessa klikkaa Caption-ominaisuutta.
113101- Muuta Caption-ominaisuuden tekstiksi *Calculator Demo*.
114102
115103Kaikkien näiden toimien tuloksena on lomake, joka näyttää (suurinpiirtein) tältä: ![](/wiki-images/e/e0/Tutcal_form_with_tedit.png)
116104
117105Nyt on hyvä aika tallentaa tehty työ.
118106
119-- Valitaan valikosta Tiedosto / Tallenna tai paina näppäinyhdistelmää <span class="kbd">Ctrl</span>+<span class="kbd">S</span>.
107+- Valitaan valikosta Tiedosto / Tallenna tai paina näppäinyhdistelmää `Ctrl`+`S`.
120108
121109Muista tallentaa ja tallentaa usein!
122110
123111## Painikkeet
124112
125113Mitä hyötyä on laskimesta, jos numeroita ei voida syöttää? Niin seuraava askel on lisätä painikkeet numeroille 0..9. Ennen kuin laitetaan numeropainikkeita niin ns säiliö/kontti (container) sijoitetaan lomakkeelle. Säiliö rajaa alueen lomakkeelle johon komponentit voidaan ryhmitellä. Lomake on säiliö. [[TPanel/fi|TPanel]] on toinen säiliö, joka voidaan sijoittaa lomakkeelle. Säiliöihin voidaan sijoittaa sisällä sijaitsevia säiliöitä, mutta siitä lisää jossain toisessa opetusohjelmassa.
126114
127115- Valitse komponenttipaletilta [[TPanel/fi|TPanel]]-komponentti.
128116- Klikkaa lomaketta sijoittaaksi paneelin siihen.
129117
130118Uusi paneeli on nyt näkyvissä lomakkeella oletusleveydellä, korkeudella ja tekstillä. Huomio, että paneelin Caption tekstin fontti periytyy lomakkeelta. Tätä paneelia käytetään ryhmittelemään kaikki painikkeet, joten useita ominaisuuksia, on muutettava.
131119
132120- Poista teksti *Panel1* Panel1:n Caption-ominaisuudesta.
133121- Vaihda Align arvoon *alClient*.
134122- Muuta Borderspacing.Around arvoon *6*.
135123- Muuta lomakkeen Width (eli leveys) arvoon *300* (ensin klikataan Form1 komponenttimuokkaimen puunäkymässä).
136124- Muuta lomakkeen Height (korkeus) arvoon *350*.
137125
138126(Koon kasvattaminen lomakkeella antaa tilaa komponenteille.)
139127
140128Nyt lisätään numeronäppäimet.
141129
142130- Komponenttipaletilta valitaan [[TButton/fi|TButton]]-komponentti.
143131- Klikkaa jossain keskellä lomakketta, tämä sijoittaa painikkeen paneeliin. Tämä näkyy komponenttimuokkaimen puunäkymässä: Button1 on Panel1:n ns *lapsi*. Tämä tarkoittaa käytännössä sitä, että kun Panel1:stä siirretään niin kaikki lapsikomponentit liikkuvat mukana. Ja kun Panel1 poistetaan niin kaikki lapsikomponentit myös poistetaan.
144132- Komponenttimuokkaimessa muuta Caption-tekstiksi *0*.
145133- Muuta Width arvoon *32*.
146134- Muuta Height arvoon *30*.
147135- Muuta Name arvoon *btnDigit0*.
148136
149137Tämä on toistettava myös numeroille 1..9. Nopein tapa tehdä tämä on kopioda 0-näppäintä ja liittämällä sitä.
150138
151139- Klikkaa hiiren oikeata painiketta yllä luodun 0-näppäimen päällä ja valitse kopioi ponnahdusvalikosta.
152140- Klikkaa hiirtä jossain muualla Panel1:n alueella ja valitse Liitä. Toinen painike lisätään paneeliin. Ainoa ero ensimmäiseen painikeeseen on nimi btnDigit1.
153141- Muuta komponenttimuokkaimessa Caption-tekstiksi *1*.
154142- Toista liitä toiminta 8 kertaa jolloin saadaan loput numero painikkeet.
155143- Siirrä painikkeita lomakkeella niin että saadan tulos joka näyttää laskimelta:
156144
157-<figure>
158-<img src="tutcal_calculator_digits.png" title="tutcal_calculator_digits.png" />
159-<figcaption>tutcal_calculator_digits.png</figcaption>
160-</figure>
145+![](/wiki-images/c/cd/Tutcal_calculator_digits.png)
161146
162147Seuraavaksi on neljä painikketta matemaattisia laskuja varten (lisäys, vähennys jne).
163148
164149- Tuo uusi TButton-komponentti paneeliin.
165150- Komponenttimuokkaimessa muuta Caption-tekstiksi *+*.
166151- Muuta Width arvoon *32*.
167152- Muuta Height arvoon *30*.
168153- Muuta Name arvoon *btnFunction*.
169154- Kopio ja liitä näitä painikkeita kolme kertaa ja vaihda Caption-tekstiksi *-*, *** ja */*.
170155- Sijoita painikkeet pystysuoraan, aivan numeronäppäinten viereen.
171156
172157Ja "erikoisnäppäimet":
173158
174159- Kopioi ja liitä *+*-painike.
175160- Muuta Caption arvoon *+/-*.
176161- Muuta Name arvoon *btnPlusMinus*.
177162- Sijoita painike painikkeen *3* alapuolella.
178163- Kopioi ja liitä *+*-painike.
179164- Muuta Caption arvoon *C*.
180165- Muuta Name arvoon *btnClear*.
181166- Sijoita painike painikkeen *+* oikealle puolen.
182167- Kopioi ja liitä *+*-painike.
183168- Muuta Caption arvoon *=*.
184169- Muuta Name arvoon *btnCalculate*.
185170- Sijoita painike painikkeen */* oikealle puolen.
186171
187172Kaikki painikkeet on sijoitettu, muuta lomaketta sopivan tiiviiksi.
188173
189174Sen pitäisi näyttää tältä:
190175
191-<figure>
192-<img src="tutcal_calculator_gui_ready.png" title="tutcal_calculator_gui_ready.png" />
193-<figcaption>tutcal_calculator_gui_ready.png</figcaption>
194-</figure>
176+![](/wiki-images/c/c2/Tutcal_calculator_gui_ready.png)
195177
196178Muista tallentaa ja tallentaa usein!
197179
198180## Tapahtumiin vastaaminen
199181
200182Graafinen sovellus on usein tapahtuma-pohjainen ohjelma. Tämä tarkoittaa sitä, että sovellus ei tee mitään ennen kuin kerromme sitä tekemään jotain. Esimerkiksi syöttämällä dataa näppäimistön kautta, painalluksina jne. Yksi asioista on että laskimen tarvitsee vastata kun hiirellä klikataan numeroita 0..9. Tässä on Lazarus ohjelman kehitysympäristö auttaa. Niin sanotun tapahtumakäsittelijän lisääminen painiketta varten on helppoa.
201183
202-- Varmista, että lomakkeen kaikki painikkeet on näkyvissä (tarvittaessa paina <span class="kbd">F12</span> kerran tai kahdesti).
184+- Varmista, että lomakkeen kaikki painikkeet on näkyvissä (tarvittaessa paina `F12` kerran tai kahdesti).
203185- Tuplaklikkaa *0*-painiketta (jonka Caption on asetettu arvoon 0): Kehitysympäristö luo automaattisesti aliohjelman rungon, joka käsittelee hiiren klikkausta: procedure TForm1.btnDigit0Click (Sender: TObject);
204186- kirjoita seuraava koodi [[Begin/fi|begin]] ja [[End/fi|end]] väliin:
205187
206188``` pascal
207189edDisplay.Text := edDisplay.Text + '0';
208190```
209191
210192Eli edDisplay on TEdit-komponentti. Tapa muuttaa sen sisältöä on muokata sen Text-ominaisuutta. Edellä esitetty [[statement/fi|lause]] lisää numeron "0" muokkausruutuun ja tämä näkyy näytöllä välittömästi.
211193
212194- Tuplaklikkaa *1*-painiketta
213195- kirjoita seuraava koodi `begin` ja `end` väliin:
214196
215197``` pascal
216198edDisplay.Text := edDisplay.Text + '1';
217199```
218200
219201On hyvä idea kääntää koodin ajoittain tarkistaen syntaksivirheet ([[compile-time error/fi|käännösaikainen virhe]]).
220202
221-- Valitse valikosta Suorita/Suorita (tai paina <span class="kbd">F9</span>. Projekti käännetään ja sovellus käynnistyy.
203+- Valitse valikosta Suorita/Suorita (tai paina `F9`. Projekti käännetään ja sovellus käynnistyy.
222204- Klikkaa numeroita 0 ja 1 pari kertaa ja katso mitä tapahtuu ruudulla. Toiset painikkeet eivät tee mitään koska niiden tapahtumakäsittelijöitä ei ole vielä lisätty.
223205- Pysäytä Calculator Demo ohjelma.
224206
225207Tietenkin se on nyt helppo lisätä tapahtuman käsittelijät numeroille 2..9, mutta tämä johtaa paljon tarpeettomaan koodiin. Jokainen tapahtuma käsittelijä on lähes samanlainen, ainoa erona on että numero on erilainen. Tapa poistaa tämä päällekkäisyys on luoda aliohjelma, joka tekee käsittelyn ja lisää muuttuvat tiedot (numerot 0..9) parametrina.
226208
227209- Lähdekoodieditori paikantaa rivit jossa luokka TForm1 on määritelty. Se näyttää tältä:
228210
229211``` pascal
230212
231213{ TForm1 }
232214
233215 TForm1 = class(TForm)
234216 btnDigit0: TButton;
235217 btnDigit1: TButton;
236218 btnDigit2: TButton;
237219 btnDigit3: TButton;
238220 btnDigit4: TButton;
239221 btnDigit5: TButton;
240222 btnDigit6: TButton;
241223 btnDigit7: TButton;
242224 btnDigit8: TButton;
243225 btnDigit9: TButton;
244226 btnFunction: TButton;
245227 btnFunction1: TButton;
246228 btnFunction2: TButton;
247229 btnFunction3: TButton;
248230 btnCalculate: TButton;
249231 btnPlusMinus: TButton;
250232 btnClear: TButton;
251233 edDisplay: TEdit;
252234 Panel1: TPanel;
253235 procedure btnDigit0Click(Sender: TObject);
254236 procedure btnDigit1Click(Sender: TObject);
255237 private
256238 { private declarations }
257239 public
258240 { public declarations }
259241 end;
260242
261243```
262244
263245Huomaa, että edellisessää luokkamäärittelyssä kaikki komponentit ja aliohjelmat on määritelty lisäämällä ne lomakkeen kautta "osoittamalla kohtaa ja klikkaamalla". ***Älä tee mitään (manuaalista) muutoksia sinne!!*** [[IDE/fi|Kehitysympäristö]] ei välttämättä ymmärrä niitä ja menee sekaisin. Paikka lisätä mukautettuja [[Variable/fi|muuttujia]], [[Procedure/fi|aliohjelmia]] ja [[Function/fi|funktioita]] on [[Private/fi|private]] tai [[Public/fi|public]] osio. Pääsääntöisesti kaikki muokatut muuttujat lisätään `private` osioon. Aliohjelmat ja funktiot lisätään usein `private` osioon, paitsi jos muut (luokat, lomakkeet) tarvitsee kutsua näitä aliohjelmia tai funktioita (jonka ei pitäisi tapahtua liian usein).
264246
265247Takaisin numeron näyttö ongelmaan: tarvitaan aliohjelma, joka lisää numeron näytölle, jossa itse numerot voi vaihdella.
266248
267249- Lisää procedure AddDigit lomakkeen private osioon.
268250
269251``` pascal
270252
271253 private
272254 { private declarations }
273255 procedure AddDigit(const pDigit: byte);
274256 public
275257 { public declarations }
276258 end;
277259```
278260
279261Seuraavaksi aliohjelman AddDigit varsinainen koodi olisi syötettävä. Jälleen voidaan hyödyntää kehitysympäristöä:
280262
281263- Sijoita vilkkuva tekstikursori AddDigit riville.
282-- Paina näppäinyhdistelmää <span class="kbd">Ctrl</span>+<span class="kbd">Shift</span>+<span class="kbd">C</span>.
264+- Paina näppäinyhdistelmää `Ctrl`+`Shift`+`C`.
283265
284266Kehitysympäristö luo määritelmän tälle uudelle aliohjelmalle ja asettaa tekstikursorin tyhjän rungon sisälle. Jolloin heti voidaan aloittaa kirjoittaminen.
285267
286268- Lisää seuraava koodi AddDigit aliohjelman runkoon:
287269
288270``` pascal
289271edDisplay.Text := edDisplay.Text + IntToStr(pDigit);
290272```
291273
292274Huomaa että function *IntToStr()* muuttaa numeerisen arvon, numeron, merkkijono arvoksi jotta se voidaan lisätä näytön tekstiin.
293275
294276Nyt käyttää tätä aliohjelmaa kaikissa numeroissa 0..9:
295277
296-- Avaa lomake (tarvittaessa paina <span class="kbd">F12</span> kerran tai kahdesti).
278+- Avaa lomake (tarvittaessa paina `F12` kerran tai kahdesti).
297279- Tuplaklikkaa numeropainiketta 0: tämä avaa lähdekoodieditorissa painikkeen 0 tapahtumakäsittelijä kohtaan.
298280- Korvaa koodin tapahtumakäsittelijä: aliohjelmakutsulla AddDigit (0). Kokonaisuudessaan aliohjelma näyttää tältä:
299281
300282``` pascal
301283procedure TForm1.btnDigit0Click(Sender: TObject);
302284begin
303285 AddDigit(0);
304286end;
305287```
306288
307289- Tee sama numero painike 1:lle:
308290
309291``` pascal
310292procedure TForm1.btnDigit1Click(Sender: TObject);
311293begin
312294 AddDigit(1);
313295end;
314296```
315297
316298Ennen kuin teet tämän sekvenssin kaikkille muille numeropainikkeille, varmista, että tämä todella tekee sen mitä halutaan.
317299
318-- Suorita ohjelma (paina <span class="kbd">F9</span> ).
300+- Suorita ohjelma (paina `F9` ).
319301- Klikkaa numeroita 0 ja 1 pari kertaa ja katso että se todella toimii.
320302- Sulje ohjelma.
321303
322304*Hyvä ohjelmoija on laiska ohjelmoija*
323305
324306Nyt voimme lisätä tapahtuman käsittelijät numeronäppäimille 2..9. Mutta sitten taas meillä on sama ongelma, luodaan paljon tarpeeton koodia: AddDigit (2), AddDigit (3) jne. Mitä jos olisi olemassa tapa kertoa painikkeet toisistaan? Onneksi on.
325307
326308Kaikki komponenteilla on kokonaisluku ominaisuus nimeltään *Tag* (muista: kontrollit on vain erikoinen komponentti, joka perii tämän Tag ominaisuuden). Se on ominaisuus, jolla ei ole varsinaista toimintoa. Se on olemassa, jotta sitä voidaan käyttää tarvittaessa. Mitä jos jokaisen painikkeen numeroarvo olisi tallennettu Tag ominaisuuteen...
327309
328-- Avaa lomake (tarvittaessa paina <span class="kbd">F12</span> kerran tai kahdesti).
310+- Avaa lomake (tarvittaessa paina `F12` kerran tai kahdesti).
329311- Valitse numeron 1 painike (klikkaa sitä kerran).
330312- Siirry komponenttimuokkaimessa Tag ominaisuuteen ja muuta sen arvoksi 1.
331313- Valitse numeron 2 painikke (klikkaa sitä kerran).
332314- Siirry komponenttimuokkaimessa Tag ominaisuuteen ja muuta sen arvoksi 2.
333315- Toista tämä numerojen 3..9 painikkeilla.
334316
335317Nyt kaikkilla numeropainikkeilla on oma ainutlaatuinen Tag arvo. Emme ole muuttaneet numeropainiketta 0 koska Tag arvon oletusarvo on jo 0. Nyt hyödynnetään tämä Tag arvo:
336318
337319- Avaa lomake.
338320- Tuplaklikkaa numeropainiketta 0 (Tämä avaa lähdekoodieditorin numeropainikkeen 0 tapahtumankäsittelijän).
339321- Huomaa, että aliohjelmalla *btnDigit0Click* on parametri *Sender* joka on tyyppiä *TObject*.
340322
341323``` pascal
342324procedure TForm1.btnDigit0Click(Sender: TObject);
343325```
344326
345327Parametri *Sender* on käytännössä viittaus painikkeeseen, jota painettiin. Typecasting avulla voidaan parametria käyttää kuin se olisi TButton.
346328
347329- Muuta koodi näin:
348330
349331``` pascal
350332procedure TForm1.btnDigit0Click(Sender: TObject);
351333begin
352334 AddDigit(TButton(Sender).Tag);
353335end;
354336```
355337
356338Ei näytä siltä että olisi saavutettu paljon, yksi rivi koodia korvaa toisen. Kuitenkin jos lisätään koodi muihin numeroihin (1..9) se näyttää *täsmälleen* samalta. Joten kaikki muut numerot voidaan laittaa käyttämään tätä koodia uudelleen!
357339
358340Katsotaanpa tarkemmin komponenttimuokkaimella.
359341
360342- Valitse lomake.
361343- Valitse numeropainike 0 (btnDigit0).
362344- Komponenttimuokkaimessa valitse tapahtumat välilehti (katso alla).
363345
364-<figure>
365-<img src="tutcal_oi_events.png" title="tutcal_oi_events.png" />
366-<figcaption>tutcal_oi_events.png</figcaption>
367-</figure>
346+![](/wiki-images/1/12/Tutcal_oi_events.png)
368347
369348Komponenttimuokkaimessa voidaan komponentin ominaisuuksien lisäksi muuttaa tapahtumankäsittelijöitä. Komponenttimuokkaimessa voidaan heti nähdä kun numeropainiketta 0 klikataan niin kutsutaan aliohjelmaa *btnDigit0Click* (tämä on *onClick* tapahtumakäsittelijässä).
370349
371350- Lomakkeelle: valitse numeropainike 2. Komponenttimuokkaimessa voidaan nyt nähdä, että ei ole onClick tapahtumakäsittelijää painikkeella 2.
372351- Avaa onClick tapahtuman pudotusvalikko ja valitse *btnDigit0Click*.
373352- Tee tämä sama kaikille muille numeropainikkeille 3..9.
374353
375354Nyt kaikki painikkeet jakaa yksi yhteisen aliohjelman, joka tekee juuri mitä halutaan paitsi numeropainiketta 1. Muistutuksesksi se että numeron 1 painikeeseen luotiin tapahtumankäsittelijä *btnDigit1Click* ja sitä ei todellakaan tarvita enää.
376355
377356- Lomakkeella: valitaan numeron 1 näppäin. Komponenttimuokkaimessa voidaan nyt nähdä, että tapahtumakäsittelijä todellakin on *btnDigit1Click*.
378357- Avaa onclick tapahtuman pudotusvalikko ja valitse *btnDigit0Click*.
379358
380359Nyt kaikki painikkeet jakavat saman tapahtumakäsittelyn ja lisää numeroa näyttöruudussa.
381360
382-- Suorita ohjelma (paina <span class="kbd">F9</span> ).
361+- Suorita ohjelma (paina `F9` ).
383362- Klikkaa kaikkia numeropainikkeita 0..9 muutamia kertoja ja totea että de todellakin toimii.
384363- Sulje ohjelma.
385364
386365Numeropainikkeilla on eräs viimeistely asia vielä tehtävä: tapahtumakäsittelijä *btnDigit1Click* edelleen olemassa, mutta sitä ei käytetä enää joten se olisi poistettava. Turvallisin tapa tehdä tämä (toistaiseksi) on antaa kehitysympäristön käsitellä sitä. Jotta tämä toimisi niin vaihtoehto *Poista automaattisesti tyhjät metodit* olisi oltava käytössä.
387366
388367- Valikossa valitse Työkalut / Asetukset.
389368- Klikkaa Editori / Koodin täydennys ja vihjeet.
390369- Salli (klikkaa) vaihtoehto *Poista automaattisesti tyhjät metodit* päälle (katso kuva alla).
391370- Paina OK.
392371
393-<figure>
394-<img src="tutcal_auto_remove.png" title="tutcal_auto_remove.png" />
395-<figcaption>tutcal_auto_remove.png</figcaption>
396-</figure>
372+![](/wiki-images/4/4c/Tutcal_auto_remove.png)
397373
398374Tästä lähtien kaikki tyhjät metodit poistetaan automaattisesti heti, kun lähdetiedosto tallennetaan.
399375
400376- Paikallista aliohjelma *procedure TForm1.btnDigit1Click(Sender: TObject)*
401377- Poista rivi *AddDigit(1);*
402-- Tallenna tiedosto (paina <span class="kbd">Ctrl</span> + <span class="kbd">s</span> tai valitsemalla valikosta Tiedosto / Tallenna). Nyt tyhjä aliohjelma poistetaan automaattisesti.
378+- Tallenna tiedosto (paina `Ctrl` + `s` tai valitsemalla valikosta Tiedosto / Tallenna). Nyt tyhjä aliohjelma poistetaan automaattisesti.
403379
404380## Hienosäätöä
405381
406382Jotain hyvää : laskin ohjelma kääntyy ja toimii kun klikkaa numeroa 0..9. Mutta se ei käyttäydy juuri niin kuin haluamme: siellä on aina ärsyttävä nolla luvun alussa ja salliiasivan liikaa numeroita.
407383
408384### Poistetaan etunollat
409385
410386Normaalisti kokonaisluku, joka on suurempi (tai pienempi) kuin nolla ei ala nolla numerolla. Joten laskimenkin pitäisi kompensoida tämän. Onneksi tämä on helppo toteuttaa. Muista, että on vain yksi aliohjelma, joka käsittelee numeroiden lisäämisen: AddDigit. Tämä on paikka johon lisätä logiikka joka *tukahduttaa* nämä etunollat.
411387
412388- Paikanna aliohjelma *procedure TForm1.AddDigit(const pDigit: byte)*
413389- Muuta koodi seuraavanlaiseksi:
414390
415391``` pascal
416392procedure TForm1.AddDigit(const pDigit: byte);
417393begin
418394 // Poistaa etunollan lisättäessä numeroa
419395 if edDisplay.Text = '0' then
420396 edDisplay.Text := IntToStr(pDigit)
421397 else
422398 edDisplay.Text := edDisplay.Text + IntToStr(pDigit)
423399end;
424400```
425401
426402### Rajaa numeroiden määrä
427403
428404Tämä demo laskin ei osaa käsitellä numeroita, jotka ovat liian suuria. Joten täytyy rajoittaa numeroiden määrä joita voidaan syöttää. Jälleen looginen paikka tehdä tämä on aliohjelma AddDigit:
429405
430406- Paikanna aliohjelma *procedure TForm1.AddDigit(const pDigit: byte)*
431407- Muuta koodi seuraavanlaiseksi:
432408
433409``` pascal
434410procedure TForm1.AddDigit(const pDigit: byte);
435411begin
436412 // Rajoittaa numeroiden määrän
437413 if length(edDisplay.Text) < 8 then
438414 begin
439415 // Poistaa etunollan lisättäessä numeroa
440416 if edDisplay.Text = '0' then
441417 edDisplay.Text := IntToStr(pDigit)
442418 else
443419 edDisplay.Text := edDisplay.Text + IntToStr(pDigit);
444420 end;
445421end;
446422```
447423
448424## Toiminnot
449425
450426Nyt on aika tarkastella varsinaista toimintaa jota halutaan toteuttaa: lisäämistä, vähentämistä, kertomista ja jakamista. Tapa, jolla käyttäjä aikoo käyttää laskinta menee jotenkin näin:
451427
4524281. Käyttäjä syöttää luvun
4534292. Käyttäjä painaa toimintonäppäintä (esimerkiksi "+")
4544303. Käyttäjä syöttää toisen luvun
4554314. Käyttäjä painaa "="
4564325. Ohjelma vastaa lisäämällä ensimmäisen ja toisen luvun
457433
458434Heti kun käyttäjä painaa "=" -painiketta ohjelma on tiedettävä kolme asiaa:
459435
4604361. Mikä oli toiminto?
4614372. Mikä oli ensimmäinen luku?
4624383. Mikä oli toinen luku?
463439
464440### Mikä oli toiminto?
465441
466442Jotenkin täytyy rekisteröidä, mikä tietyn toiminnan tyyppi valittiin. Ja on tiedettävä, mitkä toiminnat ovat käytettävissä. Yksi tapa toteuttaa tämä on luoda luetteltu tyyppi (tai käyttäjän määrittämä skalaarityyppi), joka sisältää kaikki sallitut toiminnot.
467443
468444- Lähdekoodieditorissa siirrytään paikkaan, jossa lomake on määritelty.
469445- Sen yläpuolella lisätään lueteltun tyypin määritys *TOperationType* kaikille tuetuille toiminnoille (Lähdekoodi täydennetään seuraavanlaiseksi):
470446
471447``` pascal
472448
473449type
474450
475451 { Kaikki tuetut toiminnot laskimessa }
476452 TOperationType = (otNone, otPlus, otMinus, otMultiply, otDivide);
477453
478454 { TForm1 }
479455
480456 TForm1 = class(TForm)
481457```
482458
483459- Tilapäisen toiminnan tallennukseen muuttuja (SelectedOperation)
484460
485461, joka lisätään `private` osaan lomakkeen luokan määrittelyyn.
486462
487463``` pascal
488464
489465 private
490466 { private declarations }
491467 SelectedOperation: TOperationType;
492468 procedure AddDigit(const pDigit: byte);
493469```
494470
495471### Mikä oli ensimmäinen luku?
496472
497473Ensimmäisen luvun tilapäiseen tallennukseen tarvitaan muuttuja.
498474
499475- Lisätään muuttuja (FirstNumber) lomakkeen `private` osioon.
500476
501477``` pascal
502478
503479 private
504480 { private declarations }
505481 SelectedOperation: TOperationType;
506482 FirstNumber: longint;
507483 procedure AddDigit(const pDigit: byte);
508484```
509485
510486### Mikä oli toinen luku?
511487
512488- Lisätään myös muuttuja SecondNumber lomakkeen `private` osioon (samaan missä on FirstNumber) ja tehdään siitä myös [[Longint/fi|longint]] tyyppinen.
513489
514490## Mitähän seuraavaksi?
515491
516492Nyt on aika toteuttaa toimintopainikkeiden toiminnot: lisäys, vähentäminen, kertominen ja jakaminen. Aloitetaan "+" -painikkeella. Vähän niin kuten aikaisemminkin : kun "+" painiketta painetaan niin täytyy tallentaa ensimmäinen luku ja se mikä operaatio on käytössä. Niin, että mitä aiotaan tehdä.
517493
518494- Mene lomakkeelle.
519495- Tuplaklikkaa painiketta "+". Kehitysympäristö luo tapahtumankäsittelijän ja tekstikursori on sijoitettu tyhjälle riville `begin` `end` lohkon sisään.
520496
521497Hetkinen! Ennen kuin lisätään koodia tähän ja tehdään samoin kolmeen muuhun käyttöpainikkeelle, muista mitä aiemmin kerrottiin, kun numeroita 0..9 lisättiin: Ei lisätä päällekkäistä koodia! On kohtuullista olettaa, että koodi kolmessa muussa toimintopainikkeessa on sama kuin "+" painikkeessa, lukuun ottamatta itse operaatiota. Joten siinä säästää jonkin verran työtäkin.
522498
523499- Mene lomakkeen `private` osioon ja lisää uusi aliohjelma: StoreOperation.
524500
525501``` pascal
526502
527503 private
528504 { private declarations }
529505 SelectedOperation: TOperationType;
530506 FirstNumber: longint;
531507 SecondNumber: longint;
532508 procedure AddDigit(const pDigit: byte);
533509 procedure StoreOperation(const pOperation: TOperationType);
534510```
535511
536512- Sijoita vilkkuva tekstikursori äskettäin tehdylle uudelle riville.
537-- Paina <span class="kbd">Ctrl</span>+<span class="kbd">Shift</span> +<span class="kbd">C</span> (Tiedät jo mitä nyt tapahtuu…).
513+- Paina `Ctrl`+`Shift` +`C` (Tiedät jo mitä nyt tapahtuu…).
538514
539515Aliohjelmassa StoreOperation on tehtävä kaksi asiaa: tallentaa toiminto ja tallentaa luku, joka on näytössä, jolloin sitä voidaan käyttää myöhemmin.
540516
541517- Lisää seuraava koodi viimeksi luodulle aliohjelmalle:
542518
543519``` pascal
544520procedure TForm1.StoreOperation(const pOperation: TOperationType);
545521begin
546522 // tallentaa toiminnon
547523 SelectedOperation := pOperation;
548524
549525 // tallentaa luvun
550526 FirstNumber := StrToInt(edDisplay.Text);
551527end;
552528```
553529
554530Ok, takaisin "+" -painikkeeseen:
555531
556532- Mene lomakkeelle.
557533- Tuplaklikkaa painiketta "+".
558534- Lisää seuraava koodi: StoreOperation(otPlus);
559535- Mene lomakkeelle.
560536- Tuplaklikkaa painiketta "-".
561537- Lisää seuraava koodi: StoreOperation(otMinus);
562538- Mene lomakkeelle.
563539- Tuplaklikkaa painiketta "*".
564540- Lisää seuraava koodi: StoreOperation(otMultiply);
565541- Mene lomakkeelle.
566542- Tuplaklikkaa painiketta "/".
567543- Lisää seuraava koodi: StoreOperation(otDivide);
568544
569545Nyt hyvä testata ohjelmaa ja katsoa mitä tapahtuu:
570546
571-- Suorita ohjelma (paina <span class="kbd">F9</span> )
547+- Suorita ohjelma (paina `F9` )
572548- Anna luku (esim. 21267)
573549- Paina '+'-painiketta
574550- Anna seuraava luku (esim. 31170)
575551
576552Mitä tapahtuu kun painaa "+"-painiketta tai jotain muuta toimitopainikketta: näyttö ei tyhjenny. On löydettävä tapa jolla näyttö tyhjentyy, kun toimintopainiketta painetaan. Koska on käytetty aliohjelmia yhdistämään samanlaisia ??toimia, tämä on helppo muutos.
577553
578554- Mene lomakkeen `private` osioon ja lisää uusi muuttuja: doClearDisplay. Tämä [[Boolean/fi|boolean]] muuttujaa kertoo milloin tehdään näytön tyhjennys.
579555
580556``` pascal
581557 private
582558 { private declarations }
583559 SelectedOperation: TOperationType;
584560 FirstNumber: longint;
585561 SecondNumber: longint;
586562 doClearDisplay: boolean;
587563 procedure AddDigit(const pDigit: byte);
588564 procedure StoreOperation(const pOperation: TOperationType);
589565```
590566
591567- Sijoita vilkkuva tekstikursori StoreOperation riville.
592-- Paina <span class="kbd">Ctrl</span>+<span class="kbd">Shift</span>+<span class="kbd">Down</span>: tämä siirtää kohdistimen aliohjelman StoreOperation runkoon.
568+- Paina `Ctrl`+`Shift`+`Down`: tämä siirtää kohdistimen aliohjelman StoreOperation runkoon.
593569- Aliohjelmassa StoreOperation on päivitettävä *doClearDisplay* muuttuja, jotta tiedetään, että näyttö on tyhjennettävä heti kun uusi numero on syötetään. Muuta koodi tälläiseksi:
594570
595571``` pascal
596572procedure TForm1.StoreOperation(const pOperation: TOperationType);
597573begin
598574 // tallentaa toiminnon
599575 SelectedOperation := pOperation;
600576 // tallentaa luvun
601577 FirstNumber := StrToInt(edDisplay.Text);
602578 // Näytön muistiin että täytyy aloittaa uusi luku
603579 doClearDisplay := true;
604580end;
605581```
606582
607583- Ja missä parempi tyhjentää näytön kuin AddDigit aliohjelma? Muuta koodia seuraavanlaiseksi:
608584
609585``` pascal
610586procedure TForm1.AddDigit(const pDigit: byte);
611587begin
612588 // Täytyykö näyttö tyhjentää ensin?
613589 if doClearDisplay then
614590 begin
615591 edDisplay.Text := '0'; // Laitetaan näyttöön nolla
616592 doClearDisplay := false; // Tyhjennys tehty
617593 end;
618594
619595 // Rajoittaa numeroiden määrän
620596 if length(edDisplay.Text) < 8 then
621597 begin
622598 // Poistaa etunollan lisättäessä numeroa
623599 if edDisplay.Text = '0' then
624600 edDisplay.Text := IntToStr(pDigit)
625601 else
626602 edDisplay.Text := edDisplay.Text + IntToStr(pDigit);
627603 end;
628604end;
629605```
630606
631607Nyt hyvä testata ohjelmaa ja katsoa mitä tapahtuu:
632608
633-- Suorita ohjelma (paina <span class="kbd">F9</span> )
609+- Suorita ohjelma (paina `F9` )
634610- Anna luku
635611- Paina toiminnon näppäintä.
636612- Syötä toinen luku.
637613- Lopeta ohjelma.
638614
639615Jo ollaan aika pitkällä: voidaan kirjoittaa numeroita ja valita toiminto. Nyt on aika tehdä todellisia laskelmia.
640616
641617## Tehdään laskutoimitukset
642618
643619Nyt kun on tallennettu luvut ja toiminta, on aika tehdä todellisia laskelmia. Aloitetaan helppolla: yhteenlaskulla.
644620
645621- Mene lomakkeelle.
646622- Tuplaklikkaa painiketta "=" (tapahtumakäsittelijä luodaan).
647623- Täydennä aliohjelma tälläiseksi:
648624
649625``` pascal
650626procedure TForm1.btnCalculateClick(Sender: TObject);
651627var result: longint;
652628begin
653629 case SelectedOperation of
654630 otPlus: begin
655631 // Nouda toinen luku
656632 SecondNumber := StrToInt(edDisplay.Text);
657633 // Laske lasku
658634 result := FirstNumber + SecondNumber;
659635 // Näytettävä tulos
660636 edDisplay.Text := IntToStr(result);
661637 end;
662638 end;
663639end;
664640```
665641
666642Edellä oleva koodi on melko yksinkertainen: jos käyttäjä painaa "+" -painiketta, ensimmäinen ja toinen luku lasketaan yhteen ja tulos tallennetaan Edit-komponenttiin näytölle. On hyvä huomata että koodissa käytetään [[Case/fi|case]] [[Of/fi|of]] valintarakennetta.
667643
668644Nyt on toimiva laskin (joka voi vain lisätä kaksi lukua):
669645
670-- Suorita ohjelma (paina <span class="kbd">F9</span> )
646+- Suorita ohjelma (paina `F9` )
671647- Anna luku
672648- Paina *+*-painiketta.
673649- Syötä toinen luku.
674650- Paina '=' jolloin kahden luvun summa näkyy.
675651- Lopeta ohjelma.
676652
677653Nyt voisi lisätä kolme muuta puuttuvaa toimintoa ( '-', '*' ja '/'). Mutta ei vielä, on parantamisen varaa. Katsotaan seuraava lausetta:
678654
679655``` pascal
680656SecondNumber := StrToInt(edDisplay.Text);
681657```
682658
683659Olemme nähneet tämän tapaisen lauseen ennenkin: Aliohjelma StoreOperation sisältää jotain vastaavaa:
684660
685661``` pascal
686662FirstNumber := StrToInt(edDisplay.Text);
687663```
688664
689665Lukumäärän laskemiseksi käyttäjän kirjoittaman luvun muunto nyt tapahtuu kahdessa eri paikassa. Ei haluta toistaa tätä niin on hyvä idea luoda kokonaan uusi toiminto, joka tekee laskelman.
690666
691667- Lähdekoodieditorissa siirrytään paikkaan, jossa on lomakkeen `private` osio ja lisätään uusi funktio *GetDisplayValue*:
692668
693669``` pascal
694670
695671private
696672 { private declarations }
697673 SelectedOperation: TOperationType;
698674 FirstNumber: longint;
699675 SecondNumber: longint;
700676 doClearDisplay: boolean;
701677 procedure AddDigit(const pDigit: byte);
702678 procedure StoreOperation(const pOperation: TOperationType);
703679 function GetDisplayValue: longint;
704680```
705681
706682- Sijoita vilkkuva tekstikursori äskettäin tehdylle uudelle riville.
707-- Paina <span class="kbd">Ctrl</span>+<span class="kbd">Shift</span>+<span class="kbd">C</span>
683+- Paina `Ctrl`+`Shift`+`C`
708684- Täydennä lähdekoodi seuraavanlaiseksi (eli se poimii arvon, joka on näyttökentässä):
709685
710686``` pascal
711687function TForm1.GetDisplayValue: longint;
712688begin
713689 result := StrToInt(edDisplay.Text);
714690end;
715691```
716692
717693- Paikallista lause (etsi rivi): FirstNumber: = StrToInt (edDisplay.Text);
718694- Muuta se: FirstNumber := GetDisplayValue;
719695
720696Jonkin verran koodin uudelleen kirjoittamista, takaisin laskentaan.
721697
722698- Paikallista lause (etsi rivi): SecondNumber := StrToInt(edDisplay.Text);
723699- Muuta se: SecondNumber := GetDisplayValue;
724700
725701Nyt katso seuraavat lausetta:
726702
727703``` pascal
728704 // Nouda toinen luku
729705 SecondNumber := GetDisplayValue;
730706 // Laske lasku
731707 result := FirstNumber + SecondNumber;
732708```
733709
734710Muuttujaa *SecondNumber* käytetään tallentamaan arvo näyttöruudusta. Kuitenkin se ei ole välttämättä tarpeen. Edellä oleva koodi voidaan yksinkertaistaa:
735711
736712``` pascal
737713 // Laske lasku
738714 result := FirstNumber + GetDisplayValue;
739715```
740716
741717Nyt katsotaan seuraavia lauseita:
742718
743719``` pascal
744720 // Laske lasku
745721 result := FirstNumber + GetDisplayValue;
746722 // Näytettävä tulos
747723 edDisplay.Text := IntToStr(result);
748724```
749725
750726Sama koskee myös *result* muuttujaa. Edellä oleva koodi voidaan yksinkertaistaa:
751727
752728``` pascal
753729 // Näytettävä tulos
754730 edDisplay.Text := IntToStr(FirstNumber + GetDisplayValue);
755731```
756732
757733Nyt voimme lisätä kolme jäljellä olevaa toimintaa.
758734
759735- Mene lomakkeelle.
760736- Tuplaklikkaa painiketta "=" (siirrytään tapahtumakäsittelijään).
761737- Muuta aliohjelma tälläiseksi:
762738
763739``` pascal
764740procedure TForm1.btnCalculateClick(Sender: TObject);
765741begin
766742 case SelectedOperation of
767743 otPlus : edDisplay.Text := IntToStr(FirstNumber + GetDisplayValue);
768744 otMinus : edDisplay.Text := IntToStr(FirstNumber - GetDisplayValue);
769745 otMultiply : edDisplay.Text := IntToStr(FirstNumber * GetDisplayValue);
770746 otDivide : edDisplay.Text := IntToStr(FirstNumber div GetDisplayValue);
771747 end;
772748end;
773749```
774750
775751Nyt on toimiva laskin kaikille neljälle toiminnolle:
776752
777-- Suorita ohjelma (paina <span class="kbd">F9</span> )
753+- Suorita ohjelma (paina `F9` )
778754- Anna luku
779755- Paina toiminnon näppäintä.
780756- Syötä toinen luku.
781757- Paina "=" jolloin tulos näytetään.
782758- Lopeta ohjelma.
783759
784760## Intermezzo
785761
786762Kun kaikki tämä työ on tehty niin nyt on "käyttökelpoinen" laskin. Mutta jotkut asiat eivät ole aivan oikein. Ilmeinen asia on nollalla jakaminen. Ja painikkeet "C" ja "+/-" eivät toimi vielä. Nämä asiat käsitellään seuraavassa osassa.
787763
788764Katsotaanpa ensin lisätä toista aliohjelmaa, vain huvin vuoksi (no, ei enempää tietenkään :-)):
789765
790766- Mene lomakkeen `private` osioon ja lisää uusi aliohjelma: SetDisplayValue.
791767
792768``` pascal
793769
794770 private
795771 { private declarations }
796772 SelectedOperation: TOperationType;
797773 FirstNumber: longint;
798774 SecondNumber: longint;
799775 doClearDisplay: boolean;
800776 procedure AddDigit(const pDigit: byte);
801777 procedure StoreOperation(const pOperation: TOperationType);
802778 function GetDisplayValue: longint;
803779 procedure SetDisplayValue(const pValue: longint);
804780```
805781
806782- Sijoita vilkkuva tekstikursori äskettäin tehdylle uudelle riville.
807-- Paina <span class="kbd">Ctrl</span>+<span class="kbd">Shift</span>+<span class="kbd">C</span>
783+- Paina `Ctrl`+`Shift`+`C`
808784- Täydennä lähdekoodi (joka antaa näytölle uuden arvon) seuraavanlaiseksi:
809785
810786``` pascal
811787procedure TForm1.SetDisplayValue(const pValue: longint);
812788begin
813789 edDisplay.Text := IntToStr(pValue);
814790end;
815791```
816792
817793Edellä oleva koodi pitäisi näyttää aika lailla tutulta. Tutustu aliohjelmaan, joka tekee kaikki laskelmat:
818794
819795``` pascal
820796procedure TForm1.btnCalculateClick(Sender: TObject);
821797begin
822798 case SelectedOperation of
823799 otPlus : edDisplay.Text := IntToStr(FirstNumber + GetDisplayValue);
824800 otMinus : edDisplay.Text := IntToStr(FirstNumber - GetDisplayValue);
825801 otMultiply : edDisplay.Text := IntToStr(FirstNumber * GetDisplayValue);
826802 otDivide : edDisplay.Text := IntToStr(FirstNumber div GetDisplayValue);
827803 end;
828804end;
829805```
830806
831807Tämä aliohjelma voidaan nyt yksinkertaistaa.
832808
833809- Muuta lähdekoodiksi:
834810
835811``` pascal
836812procedure TForm1.btnCalculateClick(Sender: TObject);
837813begin
838814 case SelectedOperation of
839815 otPlus : SetDisplayValue(FirstNumber + GetDisplayValue);
840816 otMinus : SetDisplayValue(FirstNumber - GetDisplayValue);
841817 otMultiply : SetDisplayValue(FirstNumber * GetDisplayValue);
842818 otDivide : SetDisplayValue(FirstNumber div GetDisplayValue);
843819 end;
844820end;
845821```
846822
847823## Selvittämättömiä asioita
848824
849825On pari asiaa, jotka pitää vielä tehdä: toteuttaa kaksi painiketta ja tehdä laskin hieman vankempi.
850826
851827### "+/-"- painike
852828
853829- Mene lomakkeelle.
854830- Tuplaklikkaa painiketta "+/-" (luodaan tapahtumakäsittelijä).
855831- Täydennä aliohjelma seuraavanlaiseksi:
856832
857833``` pascal
858834procedure TForm1.btnPlusMinusClick(Sender: TObject);
859835begin
860836 SetDisplayValue(0 - GetDisplayValue);
861837end;
862838```
863839
864840Katso työn hedelmät! Käytetään uudelleen aliohjelmaa SetDisplayValue ja funktiota GetDisplayValue. Ne toteuttavat vastalukupainikkeen toiminnon.
865841
866842Kokeile ajamalla ohjelma ja paina "+/-" -painiketta.
867843
868844### "C"-painike
869845
870846- Mene lomakkeelle.
871847- Tuplaklikkaa painiketta "C" (luodaan tapahtumakäsittelijä).
872848- Täydennä aliohjelma seuraavanlaiseksi:
873849
874850``` pascal
875851procedure TForm1.btnClearClick(Sender: TObject);
876852begin
877853 SetDisplayValue(0); // Aloittaa alusta
878854 SelectedOperation := otNone; // Toimintoa ei ole vielä valittu
879855 doClearDisplay := false; // Näyttö on nyt nollattu
880856end;
881857```
882858
883859Edellä oleva koodi on melko itsestään selvä: Näyttö tyhjentyy (ensimmäinen rivi). Se "unohtaa" oliko vireillä jotain toimintaa tyhjentämällä SelectedOperation muuttujan. Ja kerrotaan ei tarvitse tyhjentää näyttöä, kun uusia numeroja lisätään, koska se oli jo tyhjentynyt aiemmin.
884860
885861### Nollalla jako
886862
887863Kokeile jotain ihan "päätöntä": aja sovellus ja yrittä jakaa luku 10 luvulla 0. Tällöin sovellus kaatuu. Täytyy varmistaa, ettei tälläistä tapahdu. Se missä tämä tarkistetaan on tietysti paikka, jossa kaikki laskut suoritetaan (TForm1.btnCalculateClick).
888864
889865- Mene lomakkeelle.
890866- Tuplaklikkaa painiketta "=" (Siirrytään tapahtumakäsittelijään).
891867- Päivitä otDivide lause:
892868
893869``` pascal
894870procedure TForm1.btnCalculateClick(Sender: TObject);
895871begin
896872 case SelectedOperation of
897873 otPlus : SetDisplayValue(FirstNumber + GetDisplayValue);
898874 otMinus : SetDisplayValue(FirstNumber - GetDisplayValue);
899875 otMultiply : SetDisplayValue(FirstNumber * GetDisplayValue);
900876 otDivide : if GetDisplayValue <> 0 then
901877 SetDisplayValue(FirstNumber div GetDisplayValue)
902878 else
903879 begin
904880 // Näytä virheviesti käyttäjälle
905881 MessageDlg('On mahdotonta jakaa numerolla nolla(0)!', mtWarning, [mbCancel],0);
906882 // Resetoidaan laskin. Aloitetaan puhtaalta pöydältä
907883 btnClearClick(nil);
908884 end;
909885 end;
910886end;
911887```
912888
913889Huomionarvoisia asioita:
914890
9158911. *MessageDlg* on toiminto, jolla näytetään lyhyt varoitus / virhe / informatiivinen viesti käyttäjälle.Myös *ShowMessage* voidaan myös käyttää. Se on vähän helpompi käyttää, mutta ei voi näyttää varoitus / virhe kuvakkeet.
9168922. *btnClearClick(nil)*: heti kun virhetilanne syntyy niin täytyy nollata laskin. Toiminta on pohjimmiltaan sama kuin painamalla C-painiketta. "C"-painikkeen painamista simuloidaan suoraan kutsumalla sen tapahtumakäsittelijää.
917893
918894### Ylivuodot
919895
920896- Käynnistä laskin
921897- Anna 99999999 ensimmäisenä lukuna(8 numeroa)
922898- Paina painiketta "*"
923899- Anna 99999999 toisena lukuna
924900- Paina painiketta '='
925901
926902Nyt kaksi asiaa olisi voinut tapahtua:
927903
9289041. Sovellus antaa väärän tuloksen (jotain 1674919425).
9299052. Sovellus nostaa virhe.
930906
931907Jos se on ensimmäinen vaihtoehto sitten ylivuoto virheet on poistettu projektista. Ne sallitaan rastittamalla ylivuoto ruutu:
932908
933909- Valitse valikosta Projekti / Projektikohtaiset asetukset...
934910- Valitse puunäkymästä kääntäjän asetukset / Virheenjäljitys.
935911- Rastita *Ylivuoto (-Co)* kohta (katso kuva alla).
936912- Valitse OK.
937913
938-<figure>
939-<img src="tutcal_compiler_overflow.png" title="tutcal_compiler_overflow.png" />
940-<figcaption>tutcal_compiler_overflow.png</figcaption>
941-</figure>
914+![](/wiki-images/3/34/Tutcal_compiler_overflow.png)
942915
943916Nyt kun ajaa ohjelmaa uudelleen niin tapahtuu ylivuotoja.
944917
945918Jos se oli toinen vaihtoehto tämä tarkoittaa, että täytyy lisätä [[Exceptions/fi|poikkeuskäsittelyä]] laskimeen. Poikkeuskäsittelyä käytetään estämään sovelluksen kaatumista kun virheitä esiintyy. Tässä tapauksessa halutaan käsitellä aritmeettinen ylivuoto virhe, joka saattaa esiintyä. Koska kaikki laskelmat tehdään yhdessä paikassa, se on helppo napata ylivuotovirheet kiinni.
946919
947920- Mene lomakkeelle.
948921- Tuplaklikkaa painiketta "=" (Siirrytään tapahtumakäsittelijään).
949922- Päivitä aliohjelma seuraavanlaiseksi:
950923
951924``` pascal
952925procedure TForm1.btnCalculateClick(Sender: TObject);
953926begin
954927 // Napataan mikä tahansa ylivuotovirhe
955928 try
956929 case SelectedOperation of
957930 otPlus : SetDisplayValue(FirstNumber + GetDisplayValue);
958931 otMinus : SetDisplayValue(FirstNumber - GetDisplayValue);
959932 otMultiply : SetDisplayValue(FirstNumber * GetDisplayValue);
960933 otDivide : if GetDisplayValue <> 0 then
961934 SetDisplayValue(FirstNumber div GetDisplayValue)
962935 else
963936 begin
964937 // Näytä virheviesti käyttäjälle
965938 MessageDlg('On mahdotonta jakaa numerolla nolla(0)!', mtWarning, [mbCancel],0);
966939 // Resetoidaan laskin. Aloitetaan puhtaalta pöydältä
967940 btnClearClick(nil);
968941 end
969942 end;
970943 except
971944 on E: EIntOverflow do
972945 begin
973946 // Näytetään virheviesti
974947 MessageDlg('Laskelman tulos oli liian iso laskimen käsiteltäväksi!', mtWarning, [mbCancel], 0);
975948 // Resetoidaan laskin. Aloitetaan puhtaalta pöydältä
976949 btnClearClick(nil);
977950 end
978951 end
979952end;
980953```
981954
982-Huomaa, että vaikka poikkeusten käsittely on paikallaan niin sovellus vielä pysäyttää ajettaessa sitä kehitysympäristöstä käsin. Kuitenkin sovellus ainoastaan keskeytetyy ja on yhä aktiivinen. Paina <span class="kbd">F9</span> jatkaaksesi. Tämä näyttää toisen pop up-ikkunan, debuggeri ilmoitus ikkuna. Paina Jatka. Nyt ohjelman oma poikkeuskäsittely "heittää" odotetun viestin. Jos sovellus ajetaan kehitysympäristön ulkopuolella niin sitten nähtäisiin vain se viesti mikä lisättiin poikkeuskäsittelyyn.
955+Huomaa, että vaikka poikkeusten käsittely on paikallaan niin sovellus vielä pysäyttää ajettaessa sitä kehitysympäristöstä käsin. Kuitenkin sovellus ainoastaan keskeytetyy ja on yhä aktiivinen. Paina `F9` jatkaaksesi. Tämä näyttää toisen pop up-ikkunan, debuggeri ilmoitus ikkuna. Paina Jatka. Nyt ohjelman oma poikkeuskäsittely "heittää" odotetun viestin. Jos sovellus ajetaan kehitysympäristön ulkopuolella niin sitten nähtäisiin vain se viesti mikä lisättiin poikkeuskäsittelyyn.
983956
984957## Hienosäätö
985958
986959Muista, että tietyssä vaiheessa muuttuja nimeltä *SecondNumber* otettiin käyttöön. Jos valitaan Suorita / Kokoa valikosta, sitten rakentamisen jälkeen kääntäjä näyttää viestin "Kääntäjän viestit"-ikkunassa, että tätä tiettyä muuttujaa ei koskaan käytetä. Jos klikkaat kääntäjän viestin tekstiä kehitysympäristö avaa lähdekoodieditorissa kohdan, jossa muuttuja on määritelty.
987960
988961- Klikkaa viesti *Note: Private field "TForm1.SecondNumber" is never used*.
989962- Poista longint muuttuja *SecondNumber*.
990963
991964Heti kun demo Laskin käynnistetään nähdään että numero 0 on valittuna näytössä (katso kuva alla).
992965
993-<figure>
994-<img src="tutcal_calculator_focus.png" title="tutcal_calculator_focus.png" />
995-<figcaption>tutcal_calculator_focus.png</figcaption>
996-</figure>
966+![](/wiki-images/4/46/Tutcal_calculator_focus.png)
997967
998968Tämä on absurdia, koska käyttäjä ei pitäisi voida kirjoittaa mitään kyseiseen kohtaan. Vielä pahempaa, kun hän kirjoittaa jotain siellä, mikä ei ole numero, meidän laskin voisi kaatua! Joten on parempi olla antamatta pääsyä lainkaan tähän. Se pitää korjata.
999969
1000970- Mene lomakkeelle.
1001971- Valitse näytön ohjaus (klikkaa edDisplay).
1002972- Komponenttimuokkaimessa muuta ominaisuus ReadOnly arvoon [[True/fi|true]] (jos Tapahtumat-välilehti on vielä näkyvissä, valitse Ominaisuudet-välilehti ensin jotta päästään muuttamaan ominaisuuksia). Tästä lähtien se on mahdotonta antaa mitään tietoja manuaalisesti.
1003973- Muuta TabStop arvoon [[False/fi|false]]. Nyt on mahdotonta päästä näyttökenttään näppäimistöllä ja näyttö kenttä ei korostettu enää.
1004974
1005975Suorita ohjelma nähdä näiden muutosten jälkeen.
1006976
1007977---
1008978*From the Free Pascal wiki, page "Howdy World (Hello World on steroids)/fi", as it stood on 2019-11-14 after a change by Djzepi, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's [[Licensing]] page. If you have concerns about this material, [message the admin](/wiki-contact).*

Back to history