Programmeren in
DELPHI 6
HANDLEIDING DELPHI 6 VOOR BEGINNERS P. Macco, Sint-Maartenscollege Maastricht
Reacties: p.macco@sint-maartenscollege.nl
Les 1 ! Open Delphi 6 We gaan een programma maken dat je – uiteraard – kunt opstarten en door op een knop te klikken kunt afsluiten. Je ziet nu een Form (namelijk Form1) voor je:
Op deze form gaan we een knop ofwel Button plaatsen. Een button kun je vinden op het Tabblad Standard:
! Plaats een knop op Form1 door op de Button-knop te klikken (zie de pijl in de figuur hierboven) en vervolgens ergens op Form1 te klikken (op de plaats waar je de knop wilt hebben, in dit geval rechts onderaan). Form1 moet er dan als volgt uit komen te zien:
Nu staat er een knop op Form1 en we willen dat als er op de knop gedrukt wordt, het programma beeindigd wordt. De knop Button1 kun je zien als een object met bepaalde properties (eigenschappen) en events (gebeurtenissen). De properties en events van een object kun je bekijken in de Object Inspector. Deze staat mits je hem niet verplaatst hebt links in het scherm en ziet er zo uit:
Je ziet: één van de properties van een button is de Caption , dat is de tekst die op de knop staat. Nu is die tekst: ‘Button1’. ! Verander de Caption van Button1 in ‘Afsluiten’ Form1 zou er nu ongeveer als volgt uit moeten zien:
Nu gaan we er voor zorgen dat als er op de knop geklikt wordt (= een event, gebeurtenis), het programma afgesloten wordt. ! Open in de Object Inspector het tabblad Events De Object Inspector zou er nu ongeveer als volgt moeten uitzien:
Met een button kunnen verschillende dingen gebeuren. De gebruiker van je programma kan bijvoorbeeld met de muis over de button heen bewegen. Deze event heet OnMouseMove . Meestal echter gaat het er om dat er op een button geklikt (of gedrukt) wordt. Deze event heet OnClick . ! Dubbelklik in de Object Inspector op het grijze vakje naast ‘OnClick’ Je zult zien dat Form1 nu naar de achtergrond verdwijnt en dat er een venster verschijnt met in de titelbalk ‘Unit1.pas’. Dat ziet er ongeveer zo uit:
Wat je nu ziet is de code die hoort bij Form1. Met behulp van de verticale Scrollbalk kun je deze code rustig bekijken. In deze code staat nu onder andere de volgende tekst: procedure TForm1.Button1Click(Sender: TObject); begin end; In dit stukje tekst (of: code) staan 3 erg belangrijke woorden, nl. procedure , begin en end . Deze 3 woorden zijn voorbeelden van door Delphi gereserveerde woorden . Deze woorden hebben een speciale betekenis, ze worden dan ook vetgedrukt weergegeven. Tussen begin en end komt te staan wat er moet gebeuren als er op Button1 geklikt of gedrukt wordt. We willen dat het programma dan afgesloten wordt. Een programma kun je afsluiten met het volgende commando: Application.Terminate ! Zet dit commando tussen begin en end Je zou nu ongeveer het volgende op je scherm moeten zien:
Je hebt nu een simpel programmaatje gemaakt dat je kunt afsluiten door op Button1 te klikken. Het wordt hoog tijd om dit programma op te slaan! Het opslaan van een programma kun je doen in de menu-balk. ! Bekijk het onderstaande plaatje.
! Ga naar de menu-balk en kies dan: File | Save Project As Nu verschijnt ongeveer het volgende scherm:
Bovenaan wordt, zoals je dat van meer Windows-programma’s gewend bent, gevraagd in welke map je alles wilt gaan opslaan. ! Kies bij ‘Save in’ in welke map je het programma wilt opslaan. In het bovenstaande plaatje zie je als voorbeeld de map ‘mijnmap’. Maak eventueel een eigen map aan op een logische plaats (vraag eventueel aan je docent). De filename ‘Unit1’ laten we staan. Klik op ‘Save’ om Unit1 op te slaan onder de naam ‘Unit1.pas’. Echter, nu heb je nog niet het volledige programma opgeslagen! Een programma dat nog niet omgezet is in een werkbaar programma (ook wel gecompileerd genoemd) bestaat uit meerdere bestanden waarvan de belangrijkste het .dpr – bestand (Delphi Project File) is. Een programma bestaat in ieder geval uit een .dpr – bestand en een of meer .pas – bestanden. Meer uitleg hierover volgt later. Omdat zo’n programma uit meer bestanden bestaat, verschijnt er dan ook automatisch na het opslaan van Unit1.pas nog een venster met als titel ‘Save Project1 As’. Nu gaan we het .dpr – bestand opslaan. Zie hieronder:
Je kunt natuurlijk je programma een naam naar keuze geven, of het door Delphi voorgestelde ‘Project1’ laten staan. Indien je zelf een naam verzint, gebruik dan geen spaties en vreemde tekens! Wij gaan het programma opslaan als ‘Programma1’. ! Sla het programma op als ‘Programma1’, i.p.v. het door Delphi voorgestelde ‘Project1’ Nu is het programma opgeslagen als ‘Programma1.dpr’, indien je het programma compileert wordt het omgezet in Programma1.exe, oftewel een door de computer uitvoerbaar programma. LET OP: het op de juiste manier opslaan van een programma is erg belangrijk. Sla de bestanden van een programma altijd op in 1 map en verdeel het niet over meerdere mappen. Ook is het niet erg verstandig om een programma op te slaan in een map, waarin al een ander programma opgeslagen is.
ONTHOUD HET VOLGENDE: • Als je een programma voor de eerste keer opslaat doe je dat in het menu van Delphi via File | Save Project as, je moet nu twee dingen opslaan: eerst Unit1.pas (de code die hoort bij Form1; je kunt ook een andere naam dan Unit1 gebruiken) en daarna Project1.dpr (het ‘hoofdprogramma’; je kunt ook een andere naam dan Project1 gebruiken) • Indien je iets wijzigt of toevoegt aan je programma dan kun je het beste ineens alles opslaan in het menu van Delphi via File | Save All • Indien je het programma ook nog ergens anders wilt opslaan, bijvoorbeeld op diskette, doe dat dan niet via het menu van Delphi!!! Gebruik dan de Verkenner en kopieer daarin al je bestanden naar de diskette. Als je je programma op de harde schijf netjes in een aparte map hebt opgeslagen, kun je natuurlijk in 1 keer de hele map naar de diskette kopieren, zodat je eventueel ook nog andere programma’s overzichtelijk op de diskette kunt zetten. Tip: als je het programma bijvoorbeeld op diskette wilt opslaan om er thuis met Delphi verder aan te werken en je hebt niet veel ruimte meer op de diskette, sla dan het gecompileerde programma NIET op op je diskette, immers je kunt het programma thuis opnieuw compileren! Een programmaatje is al snel een paar 100 Kb groot en als je ook nog graag plaatjes in je programma gebruikt is je diskette snel vol. Nu we het programma hebben opgeslagen, wordt het natuurlijk tijd om het programma te laten werken, ook wel runnen genoemd. Dat kun je doen door op de toets F9 te drukken (of door op de Afspeelknop te klikken of door in de Menubalk te kiezen voor Run | Run). Als je dat doet dan gaat Delphi je programma compileren, dat wil zeggen: controleren op fouten en dan omzetten naar een programma dat door de computer uitgevoerd kan worden (populair gezegd: omzetten in nullen en enen, er een .exe file van maken). ! Run je programma door op F9 te drukken of op een van de andere manieren die hierboven geschreven zijn. Als je foutmeldingen krijgt probeer je die eerst zelf op te lossen. Lukt dit niet dan vraag je hulp aan je docent. Je krijgt dan als het goed is het volgende te zien:
Als het goed is, dan moet het programma als je op de knop Afsluiten klikt, het programma stoppen. ! Probeer dit uit Nu gaan we ons programma uitbreiden. Het is de bedoeling dat als je op een knop klikt, de tekst van een label op Form1 verandert. Die knop en dat label moeten we nu eerst op Form1 plaatsen. ! Plaats een knop (button) op Form1 net zoals we dat eerder gedaan hebben. Verander de tekst op deze knop (de Caption) in ‘Actie!’ Je moet nu ongeveer het volgende zien:
Nu moeten we nog een label er op plaatsen. Een label kun je vinden op het tabblad Standard, zie de onderstaande figuur:
! Plaats een label ergens midden op Form1 door eerst op de plaats waar de pijl in de bovenstaande figuur naar wijst te klikken en dan op het midden van Form1 Nu moet je ongeveer het volgende zien:
Nu gaan we er voor zorgen, zoals eerder gezegd, dat als er op de Actie!-knop geklikt wordt, dat dan de tekst van Label1 verandert. We willen dat de tekst veranderd wordt in ‘Dit is een test!’. Als er op de Actie!-knop geklikt wordt, dan is dat een event (gebeurtenis). ! Zorg dat de focus staat op de Actie!-button, dat doe je uiteraard door op de Actie-button te klikken. Nu zie je in de Object Inspector de properties en events die horen bij deze button. Ga in de Object Inspector naar het tabblad Events. Dubbelklik nu op het grijze vakje rechts naast ‘OnClick’. Nu wordt een gedeelte van de code van Unit1 zichtbaar. Je ziet nu ongeveer het volgende:
Nu gaan we, net als we eerder voor de Afsluiten-button gedaan hebben, tussen begin en end typen, wat er moet gebeuren als je op Button2 klikt. De tekst van Label1 moet dan ‘Dit is een test’ worden. De tekst van een Label wordt, net als bij een Button, bepaald door zijn Caption. De tekst kun je veranderen door het volgende commando tussen begin en end te plaatsen: Label1.Caption:=’Dit is een test!’ ! Doe dit. ! We gaan proberen of het werkt. Druk op F9 om het programma te runnen. Werkt het? Als het goed is, krijg je als je het programma runt, en dan op de Actie!-button klikt, het volgende te zien:
De lettergrootte van het label is wel erg klein. We gaan het mogelijk maken om, als je op een derde button klikt, de lettergrootte van Label1 verandert. ! Plaats een derde button op Form1, recht boven de Actie!-knop ! Verander de Caption van deze button in ‘Vergroot!’ (in de Object Inspector op het tabblad properties) ! Dubbelklik nu op deze derde button. Nu wordt de code geladen waar komt te staan wat er moet gebeuren. Dat is dus een andere manier dan via de Object Inspector zoals we eerst gedaan hebben! ! Zet in deze code tussen begin en end de volgende code die er voor zorgt dat de lettergrootte van Label1 veranderd wordt in 24 in plaats van de standaardgrootte 8: Label1.Font.Size:=24 ! Run het programma door op F9 te drukken ! Klik op de Vergroot!-knop Als je precies gedaan hebt wat hierboven staat, zul je ongeveer het volgende zien:
Merk op dat als je het programma uitvoert dat je natuurlijk eerst de tekst van Label1 kunt veranderen met de Actie!-knop en dan de tekst kunt vergroten met de Vergroot!-knop, maar dat dat ook andersom kan. Stel, je zou willen dat de gebruiker van het programma alleen maar eerst de tekst kan veranderen door op de Actie!-knop te klikken en dan de tekst kan vergroten door op de Vergroot!-knop en niet andersom. Dat kun je bewerkstelligen door alleen maar bepaalde buttons op een bepaald moment beschikbaar te laten zijn. Of je op een bepaald moment op een button kunt klikken, hangt af van de propertie Enabled van die button. We willen nu, dat als je het programma opstart, dat je dan nog niet op de Vergroot!-button kunt klikken. ! Zorg dat de focus op de Vergroot!-button staat (door er op te klikken) ! Verander in de Object Inspector op het tabblad Properties de propertie Enabled in false . Je ziet: de propertie ‘Enabled’ is true of false, ofwel waar of niet waar. Dat is natuurlijk logisch: je kunt wel (true) of niet (false) op de button klikken. ! Run het programma door op F9 te drukken. Je zou nu het volgende moeten zien:
Je ziet: je kunt niet op de Vergroot!-button klikken (probeer het maar eens). Wel kun je op de Actie!button klikken. ! Klik op de Actie!-button Je ziet dat, zoals je waarschijnlijk al verwachtte, de tekst van Label1 verandert in ‘Dit is een test!’. Maar: je kunt nu nog steeds niet van Label1 de tekstgrootte veranderen, want de Vergroot!-button is niet enabled. We willen nu, dat als er op de Actie!-button geklikt wordt, niet alleen de tekst van Label1 veranderd wordt, maar ook dat de Vergroot!-button enabled wordt. Dat betekent dat we iets moeten gaan toevoegen aan de code van Unit1. ! Sluit het programma af door op Afsluiten te klikken ! Dubbelklik op de Actie!-button (met de F12-toets kun je wisselen tussen Form1 en de bijbehorende Unit1, mocht dat nodig zijn)
Bij iedere Form hoort een Unit (code, tekst). Je kunt tussen een Form en de bijbehorende Unit wisselen met de F12-toets.
Je krijgt nu de volgende code (weer) te zien:
procedure TForm1.Button2Click(Sender: TObject); begin Label1.Caption:='Dit is een test!' end; Aan deze bovenstaande code willen we tussen begin en end een stukje code toevoegen zodat als je op Button2 (de Actie!-button) klikt ook Button3 (de Vergroot!-button) enabled wordt. Dat kun je doen met de volgende code: Button3.Enabled:=true Deze code plaatsen we, om het overzicht te bevorderen, onder de code die aangeeft dat de Caption van Label1 veranderd moet worden in ‘Dit is een test!’. Je zou de code ook erachter kunnen zetten. Je vraagt je misschien af: hoe weet Delphi dan dat er dan 2 commando’s staan en dat het er dus niet 1 is? Nou, in Delphi worden commando’s van elkaar gescheiden door een puntkomma (;). We gaan het benodigde stukje code toevoegen, dat er dan zo uit komt te zien: procedure TForm1.Button2Click(Sender: TObject); begin Label1.Caption:='Dit is een test!'; Button3.Enabled:=true end; ! Doe dit (let op de puntkomma!) Je ziet: nu gebeuren er TWEE dingen als je op Button2 klikt. De 2 commando’s zijn gescheiden door een puntkomma, dat moet OOK als je een volgend commando op een volgende regel zet in plaats van naast elkaar! LET OP: in Delphi worden commando’s van elkaar gescheiden door middel van een ; (puntkomma). Het maakt niet uit of die commando’s achter elkaar staan op 1 regel of telkens op een aparte regel: gebruik steeds de puntkomma. Er zijn ook situaties waar je de puntkomma juist NIET moet gebruiken. Hier komen we later nog op terug.
Merk op : voor het end-statement hoeft GEEN puntkomma te staan (maar het MAG wel).
EINDE VAN LES 1
Les 2 Het programma dat we in Les 1 gemaakt hebben, is wel heel erg eenvoudig. Het programma doet nog niet veel. In deze les gaan we een optel-programma maken: de gebruiker van het programma voert 2 gehele getallen in en drukt vervolgens op een knop waarna het programma de 2 getallen optelt en op het scherm het resultaat laat zien met behulp van een Label. ! Sluit indien je in Delphi nog een programma geopend hebt (bijvoorbeeld dat van Hoofdstuk 1), dit programma af met behulp van het menu van Delphi: File | Close All. Indien je nog iets gewijzigd of toegevoegd hebt aan het programma dat geopend is, waarschuwt Delphi je met de vraag of je de ‘changes’ wilt opslaan. Dat is meestal wel het geval maar dat moet je zelf beoordelen. ! Ga in het menu van Delphi naar: File | New | Application Nu wordt er een nieuw, ‘leeg’ programma geladen waarmee je aan de slag kunt. Allereerst maken we een knop met daarop de tekst ‘Afsluiten’, rechts onderaan op Form1, net zoals in Les 1. Als hierop geklikt wordt, wordt het programma afgesloten. ! Doe dit! (kijk eventueel bij Les 1) Nu gaan we de andere benodigde componenten op Form1 plaatsen, namelijk 2 Edit-vensters (hierin kan de gebruiker van je programma de getallen die opgeteld moeten worden, typen), een Button (optel-knop) en een Label, waar de uitkomst van de optelling van af te lezen is. ! Plaats de genoemde componenten op Form1 zoals je hieronder kunt zien (een Edit kun je op het ‘Standard’-tabblad vinden, rechts naast een Label).
Je ziet dat in een Edit de naam van de Edit staat, hier ‘Edit1’ en ‘Edit2’. Dat is natuurlijk niet mooi. Je kunt de tekst van een Edit veranderen of weghalen in de Object Inspector. Dat gaan we doen. ! Klik op Edit1 (op Form1), in de Object Inspector komen nu de objecteigenschappen van Edit1 te staan. ! Verander de propertie ‘Text’ van Edit1 in de Object Inspector in een lege tekst ! Doe hetzelfde voor Edit2 Op de knop waarmee we het programma de twee ingevoerde getallen laten optellen (Button2) staat nu de tekst ‘Button2’. Dat is natuurlijk niet mooi. ! Verander in de Object Inspector de Caption van Button2 in ‘Tel op!’ De Caption van Label1 is nu ‘Label1’, dit gaan we veranderen in ‘Uitkomst’. ! Verander de Caption van Label1 in de Object Inspector in ‘Uitkomst’ Form1 ziet er nu ongeveer als volgt uit:
Nu is het raamwerk van ons programma klaar. We hebben echter nog nergens zelf code getikt zodat het programma weet wat er moet gebeuren indien de gebruiker van het programma op de optel-knop drukt of klikt. Dat gaan we nu wel doen. ! Klik 1 maal op de Optel-knop (Button2) ! Ga in de Object Inspector naar het tabblad Events, en dan naar de event ‘OnClick’ ! Dubbelklik in het lege vakje naast ‘OnClick’ Er verschijnt nu het volgende:
Tussen Begin en End; gaan we code typen die er voor zorgt dat de 2 getallen die de gebruiker in Edit1 en Edit2 heeft ingevoerd opgeteld worden en dat het resultaat af te lezen is van Label1. ! Plaats tussen de regel ‘procedure TForm1.Button2Click(Sender: TObject);’ en ‘begin’ de volgende regel: var a,b,uitkomst : integer; ! Type tussen begin en end; de volgende code in: a:=StrToInt(Edit1.Text); b:=StrToInt(Edit2.Text); uitkomst:=a+b; Label1.Caption:=IntToStr(uitkomst); De procedure die hoort bij het op de optel-knop klikken ziet er dus als volgt uit:
We gaan het programma eens uitproberen. ! Run het programma door bijvoorbeeld op F9 te drukken ! Voer 2 getallen in en druk op de optel-knop. Laat het programma de juiste uitkomst zien? Leuk als het programma werkt, natuurlijk. Maar wat betekent al die code nu, die je ingetikt hebt bij de procedure Tform1.Button2Click ??? In de procedure TForm1.Button2Click komt alles wat er gebeuren moet indien er op Button2 geklikt wordt, tussen begin en end te staan. a:=StrToInt(Edit1.Text) betekent: a krijgt de waarde die de gebruiker in Edit1 ingetypt heeft Hoe weet de computer dan wat a is? Nou, met de regel: Var a,b,uitkomst : integer ; hebben we de computer laten weten dat a, b en uitkomst VARIABELEN zijn van het type Integer (Integer is Engels voor geheel getal!).
Een ander woord voor variabele is ook wel VERANDERLIJKE, zowel a als b als uitkomst kunnen verschillende waarden aannemen! Variabelen zijn in een programmeertaal erg belangrijk, we zullen ze nog veel gebruiken. Altijd als we variabelen gebruiken moeten we deze in het programma declareren met behulp van var. Ook moeten we altijd aangeven van welk type de variabelen zijn. In dit geval zijn de variabelen a, b en uitkomst van het type Integer. Onthoud: indien je met gehele getallen werkt heb je met het type INTEGER te maken. Er zijn natuurlijk ook veel andere types. Uit de wiskundelessen ken je de gebroken getallen en getallen zoals pi en dergelijke. Deze zijn van het type REAL. Indien een variabele een stukje tekst voorstelt dan hebben we te maken met het type variabele STRING. De tekst die de gebruiker in een Edit intikt, OOK AL TIKT DE GEBRUIKER ZOALS DE BEDOELING IS GETALLEN IN, is van het type STRING. Voordat we het programma de door de gebruiker ingevoerde getallen (= tekst, dus een STRING) laten optellen, moeten we ervoor zorgen dat de STRINGS omgezet worden in INTEGERS. Dat heet conversie en dat kan met het commando StrToInt (= StringToInteger). Dus: a:=StrToInt(Edit1.Text); betekent: a krijgt de van tekst-naar-een-geheel-getal omgezette waarde van de tekst in Edit1. Op dezelfde manier ken je een waarde aan b toe. De expressie uitkomst:=a+b; betekent: de variabele uitkomst krijgt de waarde van a en b samen. De expressie Label1.Caption:=IntToStr(uitkomst); betekent: de Caption van Label1 wordt de van een-geheel-getal-naar-tekst-omgezette waarde van uitkomst. Met het commando IntToStr kun je dus een Integer omzetten in een String. Opdracht 2.1: Sla het optel-programma dat je in deze les gemaakt hebt op als je dat nog niet gedaan hebt en sluit het af met behulp van File | Close All. Start een nieuw programma met behulp van File | New | Application. Maak nu een programma waarmee je 3 getallen van elkaar kunt aftrekken, analoog aan het optelprogramma. Denk er aan, er moeten nu 3 getallen ingevoerd worden, dus een extra variabele is nodig! Opdracht 2.2
Sluit indien je nog een programma geopend hebt in Delphi dit af. Start een nieuw programma. Maak een programma waarbij de gebruiker 4 getallen in kan voeren en daarna door middel van 3 knoppen kan kiezen of deze getallen opgeteld, van elkaar afgetrokken, of vermenigvuldigd moeten worden. Vermenigvuldigen gebeurt met een *.
EINDE VAN LES 2
Les 3 De programma’s die we in Les 1 en Les 2 gezien hebben, zagen er niet erg mooi uit. In deze les gaan we er onder andere naar kijken, hoe we de programma’s er wat mooier uit kunnen laten zien, alvorens we naar andere nieuwe dingen gaan kijken. In Les 2 hebben we een optel-programmaatje gemaakt, dit zag er als volgt uit:
Dit scherm wordt ook wel de GUI = Graphical User Interface genoemd van het programma. Zo’n GUI kun je ontwerpen door objecten op een form te plaatsen, zoals we nu al bij 2 programma’s gedaan hebben. De GUI van het optel-programma ziet er niet mooi uit. Ook is het maar een heel simpel programma. We gaan nu in deze les een ander programma maken met een mooiere GUI en met nieuwe objecten zoals radio buttons, checkboxes enzovoorts. We gaan een programma maken waarmee je (fictief natuurlijk: het is een voorbeeld!) informatie kunt aanvragen bij een rijschool over de verschillende categorieën (motor, personenauto, vrachtwagen enzovoort). Als je op je computerscherm je gegevens hebt ingevuld kun je op een knop klikken waarna je een overzicht krijgt van je verzoek, waarna je weer op een knop kunt klikken om te bevestigen dat je dit verzoek wilt versturen naar de rijschool (er wordt uiteindelijk natuurlijk niet echt een verzoek verstuurd, hoewel het maken van zoiets in Delphi 6 wel degelijk mogelijk is!). ! Start indien je dit nog niet gedaan hebt Delphi 6 op ! Start een nieuwe applicatie met File | New | Application
! Maak een GUI die er als hieronder uitziet.
Hiervoor heb je de volgende componenten nodig: • 7 Labels • 2 Edits • 1 Combobox • 2 Radiobuttons • 6 Checkboxes • 2 Buttons • 6 Images Let op: De plaatjes die gebruikt worden staan in de map ‘Images\les003images’, met de namen ‘cata.bmp’ , ‘catb.bmp’ enzovoorts. Je kunt in een Image een plaatje invoegen door op de Form op de Image te klikken en dan in de Object Inspector naast Picture te klikken op het knopje met de 3 zwarte puntjes:
De grootte van een label (en dergelijke) kun je natuurlijk ook allemaal aanpassen in de Object Inspector, lettergrootte & type enzovoorts kun je aanpassen bij Fonts!
Zorg dat de Style van de Combobox is: csDropDownList (in Object Inspector aanpassen), hierdoor kan de gebruiker zelf niets intypen in de Combobox, maar de keuze alleen wijzigen met het pijltje In de Combobox moet de gebruiker kunnen kiezen uit de jaartallen 1940 t/m 1985, deze jaartallen kun je invoeren door in de Object Inspector naast Items te klikken op het knopje met de 3 zwarte puntjes:
Als je daarop klikt, kun je zoals hieronder de jaartallen invoeren:
Uiteraard doet het programma nog niet veel: er is wel al code door Delphi zelf aangemaakt, maar we moeten natuurlijk ook zelf nog het een en ander aan code intypen. We kunnen wel eens kijken wat het programma tot nu toe WEL al doet, hiervoor starten we zodadelijk het programma. Eerst slaan we het programma natuurlijk op! ! Sla het programma op in een aparte map, noem de unit ‘main’ in plaats van het door Delphi voorgestelde ‘unit1’ en noem het programma (project) ‘Rijschoolhouder’ in plaats van het door Delphi voorgestelde ‘Project1’ ! Run het programma door op F9 te drukken en kijk wat je in het programma WEL al kunt doen Je hebt vast gemerkt dat er natuurlijk niets gebeurt als je op een knop klikt. ! Zorg ervoor, dat wanneer er op de knop Afsluiten geklikt wordt, het programma ook daadwerkelijk afgesloten wordt. Wat er moet gebeuren indien er op de andere knop geklikt wordt (het tonen van een scherm met een overzicht van de ingevoerde gegevens ter bevestiging) bekijken we later. We gaan eerst naar iets
anders kijken: het is niet zo netjes, dat je om als je je achternaam ingevoerd hebt, de TAB-toets of de muis moet gebruiken, om naar het volgende invoervakje (Edit) te gaan. We gaan er nu voor zorgen dat wanneer je na het intypen van je achternaam op de ENTER-toets drukt, de cursor automatisch naar het volgende invoervakje gaat! Dat kan op de volgende manier: ! Klik op de Form op het invoervakje voor de achternaam (Edit1 als je de naam niet gewijzigd hebt) ! Ga in de Object Inspector naar het tabblad Events en dubbelkik daar naast het vakje ‘OnKeyPress’ . Er verschijnt nu de code waar je gaat programmeren wat er gebeurt als er op de ENTER-toets gedrukt wordt, dat moet er ongeveer zo uitzien:
! tik nu in de procedure TForm1.Edit1KeyPress de volgende code tussen begin en end; : if Key=#13 then Edit2.Setfocus Wat je zojuist ingetikt hebt betekent: ALS de ingedrukte toets (key) de ENTER-toets is (#13 is daar de code voor), zet DAN de cursor in Edit2 (ofwel: zet de focus op Edit2) We hebben nu een belangrijke constructie gebruikt van Delphi: de IF … THEN … constructie. Deze constructie zul je nog vaak gaan gebruiken, en zit als volgt in elkaar: IF (aan een bepaalde voorwaarde wordt) THEN (doe iets). De voorwaarde die wij stelden was: de ingedrukte toets moet de ENTER-toets zijn Wat er moest gebeuren was indien aan de voorwaarde voldaan werd, was: zet de focus op Edit2 ! Run het programma door op F9 te drukken en controleer of het werkt! Misschien heb je iets opgemerkt aan het programma, wat nog niet werkt zoals je misschien wel zou willen: indien de gebruiker van je programma op de Enter-toets drukt terwijl de focus op Edit1 staat, dan wordt de focus OOK op Edit2 gezet indien de gebruiker nog geen achternaam heeft ingetypt! Daar gaan we wat aan doen, we gaan ervoor zorgen dat het programma eerst controleert of er iets ingevoerd is in Edit1, alvorens naar Edit2 te springen indien er op de ENTER-toets gedrukt wordt. Daarvoor gaan we de code die we ingetypt hadden: if Key=#13 then Edit2.Setfocus veranderen in:
if (Key=#13) and (Edit1.Text<>’’) then Edit2.Setfocus ! Doe dit. Je ziet: we hebben nu TWEE voorwaarden gesteld alvorens het programma -indien er op een toets gedrukt wordt in Edit1 - naar Edit2 mag springen: - de ingetoetste toets moet de Entertoets zijn - de tekst in Edit1 mag niet leeg zijn Let op: <> betekent: is ongelijk aan ‘’ is een lege String, een String is in Delphi een stukje tekst De 2 voorwaarden moeten tussen haakjes staan en worden verbonden met het woordje AND. Je kunt natuurlijk ook 3 of meer voorwaarden stellen, die je dan kunt koppelen met AND. ! Zorg er op dezelfde manier voor, dat wanneer er in Edit2 op de ENTER-toets gedrukt wordt, de focus op Combobox1 gezet wordt. Dit mag echter alleen wanneer er in Edit2 door de gebruiker tekst ingevoerd is. We gaan het programma NOG beter maken. Heb je opgemerkt dat wanneer je het programma opstart, dat de cursor dan nog niet automatisch in Edit1 staat? Dat zou wel mooier zijn. We kunnen er als volgt voor zorgen dat dit wel gebeurt: ! Zorg dat het object in de Object Inspector Form1 is (je kunt dat doen door ergens op Form1 te klikken, of door in de Object Inspector met het pijltje omlaag voor Form1 te kiezen; misschien staat de Object Inspector al wel gericht op Form1) ! Dubbelklik in de Object Inspector op het tabblad Events op het vakje naast ‘OnShow’ Je moet nu de volgende code te zien krijgen:
Tussen begin en end; komt de code te staan die bepaalt wat er moet gebeuren zodra Form1 ‘geshowd’ wordt. ! Tik tussen begin en end de volgende code: Edit1.SetFocus ! Run het programma. Merk op dat je een programma ook kunt runnen door op de snelknop te klikken die er zo uitziet:
Werkt het? Er is nog iets leuks wat we kunnen toevoegen. Stel dat je wilt dat de gebruiker wat meer informatie krijgt over een bepaalde categorie door met de muis op een plaatje van een categorie te gaan staan. Dat kan, en het is vrij eenvoudig. ! Zorg dat de Object Inspector gericht staat op Image1. ! Ga in het tabblad Properties naar ‘Hint’ ! Vul daar in: ‘Categorie A: Motoren’ ! Ga in het tabblad Properties naar ‘ShowHint’ ! Zet deze op True (pijltje omlaag of dubbelklikken op ‘False’) Met de twee laatste stappen zorg je er voor dat de hint, zoals dat genoemd wordt, ook daadwerkelijk weergegeven wordt. ! Run het programma en kijk wat er gebeurt indien je met de muis op Image1 gaat staan. Werkt het? ! Zorg ervoor dat bij de andere plaatjes de volgende hints komen te staan die weergegeven worden indien de gebruiker met de muis op een plaatje gaat staan: - ‘Categorie B: personenauto’ - ‘Categorie BE: personenauto met aanhangwagen’ - ‘Categorie C: vrachtauto’ - ‘Categorie CE: vrachtauto met aanhangwagen’ - ‘Categorie D: bus’ ! Controleer of de hints werken. Je raadt het al: we gaan het programma nog professioneler maken. We gaan er onder andere voor zorgen dat het programma bij het opstarten automatisch in het midden van het beeldscherm komt te staan. Dat gaat vrij eenvoudig: ! Zorg dat de focus staat op Form1, oftewel zorg dat de Object Inspector daar op gericht is. Verander nu in het tabblad Properties de Propertie ‘poDesigned ’ in ‘poScreenCenter’ ! Run het programma. Verschijnt het mooi in het midden van het scherm? Misschien heb je opgemerkt dat je, als je het programma runt, dat je dit kun maximaliseren met de bekende knop:
.
! Ga dit na en bekijk het resultaat. Het ziet er niet echt mooi uit! Waarschijnlijk kreeg je dit te zien:
Je ziet: doordat de componenten op de Form niet allemaal een stukje naar rechts en omlaag verschuiven terwijl de Form wel groter wordt, ziet het geheel er niet zo mooi uit. We gaan er daarom voor zorgen dat de Form niet meer gemaximaliseerd kan worden. Dat kan als volgt: ! Ga in de Object Inspector op het tabblad Properties naar ‘BorderIcons’ en klik daar op het plusje (+). Je krijgt dan het volgende te zien:
! Verander de ‘subproperty’ biMaximize in false. Nu kan het venster door de gebruiker niet meer gemaximaliseerd worden. ! Probeer uit of het inderdaad goed werkt! Nu is er nog iets wat ons niet helemaal bevalt. De gebruiker van het programma kan met de muis Form1 kleiner of groter maken. ! Run het programma maar eens en probeer dit uit. Dit probleem gaan we verhelpen en wel als volgt:
! Zorg dat de Object Inspector gericht staat op Form1 ! Ga in de Object Inspector op het tabblad Properties naar de propertie ‘BorderStyle’. Deze staat ingesteld op bsSizeable, dat wil zeggen dat de gebruiker de grootte van Form1 kan aanpassen. Dat willen we niet. Verander bsSizeable daarom in ‘bsSingle’. ! Run het programma en controleer of je inderdaad de grootte van de Form niet meer kunt veranderen. Dan gaan we nu kijken hoe we kunnen simuleren dat de gegevens opgestuurd worden naar de rijschool. ! We gaan nu code invoeren die bepaalt wat er gebeurt indien er op Button2 geklikt wordt. Dat is de volgende code:
procedure TForm1.Button2Click(Sender: TObject); begin if (Edit1.Text<>'') and (Edit2.Text<>'') and (Combobox1.Text<>'') and ((RadioButton1.Checked=true) xor (RadioButton2.Checked=true)) and ((Checkbox1.checked=true) or (Checkbox2.Checked=true) or (Checkbox3.Checked=true) or (Checkbox4.Checked=true) or (Checkbox5.Checked=true) or (Checkbox6.Checked=true)) then MessageDlg('De gegevens zijn naar de rijschool verzonden', mtInformation, [mbOK],0) else MessageDlg('Alle gegevens invullen a.u.b.!'+#13+'Gegevens NIET verzonden.', mtInformation, [mbOK],0) end; Voer deze code in en test of het werkt. In bovenstaande code staan nogal wat nieuwe dingen. Deze hoef je nu nog niet allemaal te begrijpen, maar zullen we in volgende lessen behandelen. ! Sla het programma op. Einde van de 3 inleidende lessen in Delphi 6