Hoofdstuk 8: Visual Basic

8.2: Tien sommen

Op deze pagina gaan we een programma maken, waarmee er tien keer een sommetje verschijnt.
Het antwoord moet worden ingetypt, en de computer zegt dan of het goed of fout is.
Na afloop wordt er vermeld hoeveel antwoorden er goed waren.

Het scherm moet er na het eerste sommetje zó uit zien:

8.2.1 Labels enz. namen geven. Textlabels naast elkaar.

Als je met dit programma wilt beginnen dan klik je op Bestand, en dan op New Project.

Een programma wordt hier een Project genoemd, dat meestal uit een aantal bestanden bestaat (als je het maakt), want elk formulier wordt in een apart bestand bewaard.
Bij de eerste programma's zullen we steeds maar één formulier gebruiken, maar als je verder komt dan zul je merken dat er voor een groot programma een heleboel verschillende formulieren nodig zijn.

Maak eerst het bovenste label, en zorg dat het opschrift (=Caption) "Vul in, druk dan op enter" wordt, en de achtergrondkleur geel.

Dan zie je in het midden een veld waar een optelsom in komt.
Ik heb daar niet één tekstveld van gemaakt, maar vijf verschillende, die tegen elkaar aan liggen, zodat het net lijkt alsof het er één is.

Maak eerst het linker tekstveld.
Zorg er voor dat er nog geen tekst in staat.
Zorg dat "enabled" op "false" staat, want het is niet de bedoeling dat er in dit tekstveld getypt kan worden.

De computer geeft aan dit tekstveld automatisch als naam "Text1", maar die kun je veranderen.
We willen dit tekstveld eigenlijk wel de naam "Getal1" geven, maar het is de gewoonte om de naam van een tekstveld altijd met de letters txt te laten beginnen, zodat je later nog aan de naam kunt zien dat het een tekstveld is.
Daarom maken we er txtGetal1 van.

Dat doe je als volgt: klik in het propertiesvenster op Name, en typ er achter: txtGetal1

Maak nu een tekstveldje naast het eerste, er vlak tegen aan.
Zorg er voor dat er een " + " in staat, en dat "enabled" op "false" staat.

Dan maken we nog een tekstveld er naast.
Zorg er voor dat er geen tekst in staat en dat "enabled" op "false" staat. Zorg er voor dat dit tekstvenster als naam "txtGetal2" krijgt.

Maak dan nog een tekstveldje naast het vorige, er weer vlak tegen aan. Zorg er voor dat er een " = " in staat, en dat "enabled" op "false" staat.

En dan maken we nog een vijfde tekstveld er naast.
Zorg er voor dat er geen tekst in staat. Nu moet "enabled" op "true" staan, want het is de bedoeling dat in dit venstertje de uitkomst van de som wordt ingetypt.
Zorg er voor dat dit tekstvenster als naam "txtUitkomst" krijgt.

Maak onder deze tekstvensters een label, en zorg dat het opschrift "Goed zo !" wordt, en de achtergrondkleur rood.
Zorg er voor dat je de naam van dit label verandert in lblGoedzo; zoals je ziet zorgen we er voor dat de beginletters lbl worden !

Vervolgens moet er nog een "Button" worden getekend, naast het "Goedzo"-label.
En het opschrift daarvan moet "verder !" zijn.
Zorg er voor dat de naam van deze knop (of button) "cmdVerder" wordt.
(we zetten de letter b van (Command)Button voor het woord Verder)

Het is de bedoeling dat, als er op deze knop wordt geklikt , de volgende som verschijnt.

8.2.2. Een plaatje toevoegen.

We willen er voor zorgen dat onder de labels enz. nog een foto van de school staat.
Dat is heel gemakkelijk.

Je klikt in de gereedschappenbalk op het plaatje rechtsboven, dat wordt Picture genoemd; (verder naar beneden heb je nog een plaatje dat Image wordt genoemd, daarover straks) , en dan teken je met de muis een rechthoek in het formulier, waar de foto moet komen.

Dan ga je naar het propertiesvenster.
Bovenaan staat: Picture1 Picture. En verder naar beneden in het propertiesvenster staat ergens Picture. Daar klik je op. Dan klik je op de drie puntjes die er achter staan.
Dan verschijnt er een venster waarin je aan kunt geven waar het bestand met het plaatje staat en dan moet je nog op de naam van het plaatje klikken (hier: SCHOOL.JPG) en dan klik je op "Openen", en klaar is kees.

Het is natuurlijk de vraag of het plaatje precies in de getekende rechthoek past.
Eventueel kun je de rechthoek voor het plaatje groter of kleiner maken. Ook kun je in de gereedschappenbalk in plaats van Picture voor Image kiezen (verder naar beneden in de toolbox)
Dat werkt net zo als het object Picture, maar er is één belangrijk verschil:
In het Properties-venster van Image staat Stretch, en als je dat op true zet, dan wordt een plaatje (als je dat daarna uitkiest) automatisch vergroot of verkleind zodat het precies in het image-venster past.

Je kunt ook in het programma aangeven welk plaatje er in moet staan, m.b.v. de opdracht Picture1.picture="SCHOOL.JPG".
Op die manier kun je er bijv. voor zorgen dat er zo nu en dan een andere foto in de rechthoek staat, als je bijv. ergens op klikt.

Natuurlijk moeten die fotobestanden wel op de schijf staan, en in de map waarin het project ook staat (of je moet het pad erbij opgeven).

8.2.3. Objecten onzichtbaar maken.

Als je het programma start moet er eigenlijk direkt een sommetje staan.
En er moet nog niet "Goed zo !" onder staan, dat mag pas als het sommetje goed is gemaakt.
En er mag ook nog geen "Verder !" onder staan, dat moet ook pas gebeuren als het sommetje is gemaakt.

Klik eerst maar eens op een lege plek in het formulier. En ga dan naar het properties-venster.
Dan kun je aangeven hoe het totale formulier er uit moet zien.

Je kunt bijv. een andere achtergrondkleur nemen.
Je kunt ook het opschrift veranderen: klik op Caption, en vul als opschrift in: SOMMEN
Je ziet direkt in de titelbalk van het formulier ook "SOMMEN" verschijnen.

Dubbelklik nu op een lege plek in het formulier.
Dan krijg je een venster, waarin je programmaregels kunt intypen die slaan op het formulier.
Klik op het venstertje rechtsboven. Dan kun je kiezen uit CLICK, DOUBLECLICK, LOAD, enz.
Klik op LOAD.
Dan kun je aangeven wat er moet gebeuren als het formulier geladen wordt, en dat is direkt als het programma start.

zorg er voor dat er het volgende staat (de eerste en de laatste regel staan er al)

Private Sub Form_Load( )

lblGoedzo.visible = false
cmdVerder.visible = false

End Sub

Dat heeft tot gevolg dat het label met "Goed zo !" onzichtbaar is in het begin en dat de knop met "Verder !" onzichtbaar is in het begin.

8.2.4. Random-getallen.

Als het programma start moet er direkt een sommetje op het scherm verschijnen.
De opdrachten daarvoor moeten dus ook in de subroutine (of procedure) Form_Load( ) worden gezet. En wel onder de opdrachten lblGoedzo.visible = false en cmdVerder.visible = false.

Door de opdracht g1 = Rnd wordt er een willekeurig getal tussen 0 en 1 in de geheugenplaats g1 gezet.

Rnd * 90 levert een willekeurig getal tussen 0 en 90 op
Int (Rnd * 90) zorgt er voor dat het (naar beneden) op gehelen wordt afgerond.
g1 = Int (Rnd * 90) + 10 levert een getal tussen 10 en 100 op.

Om er voor te zorgen dat dat getal in de eerste tekstbox wordt gezet moet je de volgende opdracht geven:
txtGetal1.Text = Str(g1) (want we hadden aan het eerste tekstveld de naam "txtGetal1" gegeven.)

De variabele g1 moet ook worden "gedeclareerd", en de opdracht daarvoor is:
Dim g1 as integer
En die opdracht moet bovenaan in de procedure staan.
Ook in het derde tekstveld moet een willekeurig getal komen, dat geven we aan met g2.
Verder geven we het aantal sommetjes, dat geweest is, met "aantal" aan.
(Waarom niet gewoon aantal maar met de letter g en _ er voor, daarover straks)
Maar die variabele declareren we niet in deze procedure. Waarom niet, daarover straks.

In totaal ziet de procedure, die direkt bij het starten moet worden uitgevoerd, er als volgt uit:


Private Sub Form_Load( ) 
    dim g1, g2 As Integer 
    lblGoedzo.visible = false
    cmdVerder.visible = false
    Randomize
    g1 = Int (Rnd * 90) + 10
    txtGetal1.Text = Str(g1) 
    g2 = Int (Rnd * 90) + 10
    txtGetal2.Text = Str(g2) 
    aantal=1
End Sub

8.2.5 Het antwoord controleren.

Wat moet er gebeuren als het antwoord is ingetypt ?
Dan moet er o.a. gecontroleerd worden of het antwoord goed is.
Daar moet programma-code voor worden ingevoerd, op de volgende manier:

Dubbelklik op het tekstvenster, waarin het antwoord getypt moet worden.
(klik eerst het programmavenster voor Form_Load weg).
Rechtsboven verschijnt dan automatisch Change in het venstertje, en in het programmavenster verschijnt automatisch

Private Sub txtUitkomst_Change()

End Sub

Maar dat moeten we niet hebben, kies rechtsboven in dat venster Keypress uit.

Dan kun je intypen wat er moet gebeuren als er in dat venster op een bepaalde toets is gedrukt.

We gaan er van uit dat, nadat het antwoord is ingetypt, er op de entertoets wordt gedrukt, en die heeft ASC-code 13.
In die procedure moet dan het volgende staan :


Private Sub txtUitkomst_KeyPress(KeyAscii As Integer)
  dim g1,g2,u As Integer
  If KeyAscii = 13 Then
   g1 = Val(txtGetal1.Text)
   g2 = Val(txtGetal2.Text)
   u = Val(txtUitkomst.Text)
   lblGoedzo.Visible = True
   cmdVerder.Visible = True
   txtUitkomst.Enabled = False
   If u = g1 + g2 Then
     aantalgoed = aantalgoed + 1
     lblGoedzo.Caption = "Goed zo !"
     Else
     lblGoedzo.Caption="Nee, het juiste"+Chr(13)+"antwoord is "+Str(g1+g2)
   End If
  End If
End Sub

Wat betekent dit allemaal ?

Er wordt gekeken welk getal in de tekstbox txtGetal1 staat, en dat getal wordt in g1 gezet.
Het getal in textbox txtGetal2 wordt in g2 gezet, en het getal in textbox txtUitkomst wordt in u gezet.

Deze variabelen moeten eerst weer worden gedeclareerd.
Elke procedure wordt eigenlijk als een apart programma opgevat, en de variabelen moeten in elke procedure opnieuw worden gedeclareerd.
Behalve bij "globale variabelen", daarover straks meer.

Het tweede label (met "goed zo!") mag nu verschijnen, maar er mag natuurlijk alleen "goed zo!" op staan als het ingetypte antwoord goed was, en als het anwoord verkeerd was moet het opschrift worden: "Nee, het juiste antwoord is ...

Dus als u (dat is het ingetypte antwoord) gelijk is aan g1+g2 (dat is het antwoord dat de computer berekent, en dat is natuurlijk goed), dan moet de variabele waarin het aantal goede antwoorden bewaard wordt met één verhoogd worden (aantalgoed = aantalgoed + 1), en het opschrift van het lblGoedzo-label moet worden "Goed zo!";
de opdracht daarvoor is: lblGoedzo.Caption="Goed zo!"

Dat opschrift kun je dus ook in het programma vastleggen, en zo kun je er voor zorgen dat dat opschrift zo nu en dan verandert.

Als het antwoord verkeerd was, dan staat er als opdracht voor het opschrift van het label:
lblGoedzo.Caption= "Nee, het juiste" + Chr(13) + "antwoord is " + Str(g1 + g2)

De code van de entertoets is 13, dus Chr(13) stelt eigenlijkhet indrukken van de entertoets voor.
Als je dat tussen twee zinnetjes zet met plussen er tussen dan heeft dat tot gevolg dat het tweede zinnetje een regel lager komt dan het eerste zinnetje.

Zinnen of woorden aan elkaar plakken doe je met behulp van de +
("abc" + "defg" levert "abcdefg" op)

Het einde van een IF-THEN opdracht moet altijd worden afgesloten met END IF
(behalve als de hele opdracht op één regel past, dan is het niet nodig)

8.2.6. Globale variabelen declareren.

In de procedure van de vorige paragraaf komt de variabele aantalgoed voor.
Die is niet aan het begin van die procedure gedeclareerd.
Daar is een reden voor.
Zodra een procedure is uitgevoerd worden de geheugenplaatsen, die in die procedure zijn gedeclareerd, opgeruimd. Ze zijn gewoon weg.

Daarom moet de variabele aantalgoed ergens anders worden gedeclareerd.

Dubbelklik op een wit leeg gedeelte van het formulier.

Dan verschijnt het programmavenster voor het formulier.
Klik dan op het pijltje achter Form. En kies dan de bovenste mogelijkheid uit: General. Klik daar op.
Rechtsboven staat dan "declarations" als het goed is.
In dat programmagedeelte typ je in:
Dim aantalgoed, aantal As Integer

De variabelen aantal en aantalgoed zijn dan zogenaamde "globale" variabelen, die in elke procedure gebruikt mogen worden, zonder dat ze daar weer apart gedeclareerd hoeven te worden. Ze houden hun waarde vast.
De variabele aantal wordt gebruikt voor het aantal sommetjes, dat al geweest is.

8.2.7. Wat moet er gebeuren als er op de knop cmdVerder geklikt wordt.

Als er op de knop cmdVerder wordt geklikt moet er een nieuw sommetje komen, tenminste als het aantal sommetjes dat geweest is, minder dan tien is.
Daarom begint het met: If aantal < 10 Then
De regels die daarna komen kun je wel kopieren uit Private Sub txtUitkomst_KeyPress
Er komt dan:

Private Sub cmdVerder_Click()
Dim g1,g2,u As Integer
If aantal < 10 Then
    aantal = aantal + 1
    lblGoedzo.Visible = False
    cmdVerder.Visible = False
    g1 = Int(Rnd * 90) + 10
    g2 = Int(Rnd * 90) + 10
    txtGetal1.Text = Str(g1)
    txtGetal2.Text = Str(g2)
    txtUitkomst.Text = ""
    txtUitkomst.Enabled = True
Else
    lblGoedzo.Caption = "Je had er "+Str(aantalgoed) + " goed." + Chr(13) + 
                        "Tot de volgende keer !"
    cmdVerder.Visible = False
End If
End Sub

Als het aantal sommetjes al 10 was, dan is het afgelopen.
Dan krijgt het lblGoedzo-label een ander opschrift: er wordt getoond hoeveel er goed waren.
En de verder-knop wordt onzichtbaar gemaakt, zodat daar niet meer op geklikt kan worden.
Dus dan is het echt afgelopen.

8.2.8. Het programma bewaren.

Als je het programma wilt bewaren dan klik je op bestand.
En dan moet je twee dingen opslaan: het formulier en het project.
Klik dus op "File save as", dan wordt het formulier opgeslagen, en op "Project save as", dan wordt het project opgeslagen.
Wil je er een exe-file van maken, klik dan op "Make exe-file"
Dan kun je het programma laten lopen zonder dat je Visual Basic eerst op moet starten.

8.2.9. Afspraken over naamgeving.

De naam van een textbox laten we beginnen met de letters txt En daarna komt de "echte" naam met een hoofdletter.
Zo worden voor alle besturingselementen bepaalde beginletters (prefix genoemd) gebruikt. Welke dat zijn zie je in onderstaande tabel.

besturingselement	prefix
label	lbl
(command)button	cmd
textbox	txt
image	img
picture	pic
formulier	frm
listbox	lst
menu	mnu

8.2.10. Opgaven

Opgaven.
Maak nu opgave 2 van de oefenopgaven van hoofdstuk 8