Visual Basic/Uw eerste programma
Basisinstellingen aanpassen
[bewerken]We beginnen met een nieuw project. Als je Visual Studio nog open hebt, kies je in het menu File -> Close Solution. Je krijgt een waarschuwing met de vraag of je de wijzigingen wilt opslaan. Klik op No. Anders start je gewoon Visual Studio. Je bent in beide gevallen nu op het startscherm van Visual Studio.
Start een nieuw project en geef dat een naam: dubbelklik onderaan achter Name: op WindowsApplication1 en typ VB01Hallo1. Zorg ervoor dat bovenin Windows Forms Application is geselecterd en klik vervolgens op OK. Je krijgt nu een leeg project te zien. Je bent nu klaar om een programma te schrijven, maar voordat je begint moet je eerst wat basisinstellingen aanpassen.
Klik in het menu op TOOLS -> Options... Er verschijnt een venster met allerlei opties. Klik op het driehoekje vóór Projects and Solutions en vervolgens op VB Defaults. Zorg ervoor dat Option Explicit: en Option Strict: beide op On staan. Deze twee opties zorgen ervoor dat je alle variabelen expliciet moet declareren en dat bepaalde soorten conversies die kunnen leiden tot gegevensverlies expliciet moeten worden aangegeven. Als deze twee opties aan staan, kun je minder fouten maken in je programma.
Je kunt ook de directory opgeven waar je projecten bewaard worden, bijvoorbeeld H:\VBprojecten. Voor ieder project wordt binnen H:\VBprojecten een aparte subdirectory aangemaakt met de naam van de solution. Zo kun je gemakkelijk alle solutions gescheiden van elkaar op één plaats bewaren.
Klik in hetzelfde venster op General (twee regels boven VB Defaults). Rechtsboven zie je de optie Projects locations. Hier staat de standaarddirectory vermeld die Visual Studio gebruikt om projecten te openen en op te slaan. Klik op de knop met drie puntjes achter de naam. Je krijgt een bestandsvenster te zien. Navigeer naar de driveletter die je wilt gebruiken (bijvoorbeeld H:) en selecteer de juiste directory. Als de directory nog niet bestaat, kun je hem hier aanmaken. Klik op Map selecteren. De naam van de directory wordt nu ingevuld onder Project location:. Hier worden dus al je projecten opgeslagen.
Sluit nu het optievenster.
Een formulier met een label
[bewerken]In het middenvenster (de Designer) zie je het formulier Form1. Op de rand van het formulier zie je drie witte vierkantjes. Hiermee kun je de grootte van het formulier aanpassen. Probeer het uit en maak het formulier ongeveer tweemaal zo groot. Het formulier kun je niet verplaatsen, het blijft altijd linksboven in het Design-venster staan.
Visual Studio gebruikt voor de plaats van het formulier op het scherm een default positie. Het is natuurlijk mooier om het formulier na de start van het programma midden op het scherm te zien. Dat doe je als volgt: zoek bij Properties rechtsonder naar StartPosition. Klik de tekst daarachter (Windows Default Location). Er verschijnt een driehoekje achter de tekst. Als je daarop klikt, krijg je alle mogelijkheden te zien. Selecteer CenterScreen. Als je het programma start, staat je formulier nu midden op het scherm gecentreerd.
Nu gaan we het beroemde Hallo Wereld!-programma maken met behulp van een label. Zoek in de Toolbox links Label op (onder Common Controls, alfabetisch gesorteerd). Als de cursor op Label staat, druk je de linker muisknop in waarna je deze ingedrukt houdt. Verplaats de muis naar het midden van het formulier en laat de muisknop los. Er verschijnt een gestippelde rechthoek met daarin de tekst Label1. De label heet Label1 en de tekst van het label is ook Label1. Dit is de standaard naamgeving van Visual Studio. Een volgende label krijgt de naam en tekst Label2 enz.
Omdat ieder component een duidelijk naam moet hebben, passen we de naam aan. De naam van iedere component kun je bijvoorbeeld standaard laten beginnen met een drieletterige afkorting van het soort component, gevolgd door de eigenlijke naam, die begint met een hoofdletter. Als de naam bestaat uit twee of meer woorden, worden die woorden aan elkaar geschreven met de eerste letter van ieder woord als hoofdletter. Dit moemt men Camel Casing. We willen de label Hallo noemen, dus de naam wordt lblHallo.
Zoek bij de Properties rechtsonder de optie (Name) (bijna bovenaan). Je ziet als naam Label1 staan. Dubbelklik op Label1, type lblHallo en druk Enter. Je ziet dat de naam onder de gele balk Properties nu is gewijzigd in lblHallo.
Als volgende passen we de tekst aan. Scroll binnen Properties naar beneden tot de optie Text. Dubbelklik op Label1 daarachter en type Hallo Wereld! en druk Enter. Je ziet dat de tekst op het formulier is aangepast in Hallo Wereld!.
Voordat we verder gaan, moet het project worden opgeslagen. Selecteer in het menu File -> Save All. Het project wordt nu opgeslagen in (in mijn geval) H:\VBprojecten\VB01Hallo1. Je kunt in de verkenner naar deze subdirectory gaan. Je ziet het solutionbestand (dat eindigt op .sln') en een subdirectory met de overige bestanden van het project.
We zijn nu klaar om het programma uit te voeren. Kies in het menu DEBUG -> Start Debugging of druk F5. Het programma wordt gecompileerd. Als er fouten zijn (wat in deze situatie vrijwel onmogelijk is), verschijnen foutboodschappen in het venster Error List. Als er geen fouten zijn, wordt het programma gestart. Even later verschijnt het formulier met in het midden de tekst Hallo Wereld!. Proficiat. Je eerste programma werkt.
Sluit het programma door op het kruis linksboven te klikken.
Kijk nu onderaan het scherm naar het venster Output. Selecteer zo nodig het tabblad Error List. Onder de gele balk zie je de tekst Show output from:. Selecteer hierachter Build. Je krijgt nu de meldingen van de compiler te zien. Als alles goed is gegaan, staat op de onderste regel Build: 1 succeeded.
Selecteer achter Show output from: nu Debug. Je krijgt nu de meldingen van de debugger te zien. De laatste regel laat zien dat het programma goed is afgesloten (... exited with code 0 (0x0).). Wat de debugger is, wordt in een apart hoofdstuk uitgelegd.
Een formulier met een tekstvak
[bewerken]Sluit de solution met File -> Close Solution. Maak nu een nieuwe project aan met File -> New Project... en noem dit project VB01Hallo2 (mocht je nog niet weten hoe dit moet, kijk dan even hierboven).
Maak het formulier een stuk groter.
Wijzig van het formulier (Name) in frmHallo2, Text in Hallo Wereld! en StartPosition in CenterScreen.
We gaan nu in plaats van een label een textbox op het formulier plaatsen. Versleep in de Toolbox een TextBox naar het midden van het formulier. Wijzig (Name) in tbxHallo en Text in Hallo Wereld!. Omdat je de tekst in de textbox kunt wijzigen, moet je deze optie uitschakelen. Klik achter de property ReadOnly op False en wijzig deze in True.
In het vervolg worden deze aanpassingen van de properties in een tabel aangegeven zoals hieronder:
| Object | Eigenschap | Waarde |
|---|---|---|
| Form | Name | frmHallo2 |
| Text | Hallo Wereld! | |
| StartPosition | CenterScreen | |
| TextBox | Name | tbxHallo |
| Text | Hallo Wereld! | |
| ReadOnly | True |
Sla het project op en start het met F5. Je krijgt nu het programma te zien met een tekstbox die de tekst Hallo Wereld! laat zien. Sluit het programma.
Een textbox heeft twee doelen:
- het invoeren van tekst door de gebruiker; de optie ReadOnly is dan False, zodat de gebruiker tekst kan invoeren
- het tonen van tekst door het programma; de optie ReadOnly is dan True, zodat de gebruiker de tekst niet kan wijzigen
Een formulier met een knop en een tekstvak
[bewerken]Nu gaan we formulier maken met een knop en een tekstvak. Het tekstvak is ReadOnly en bevat in eerste instantie geen tekst.
Als de gebruiker op de knop klikt, verschijnt de tekst Hallo Wereld! in het tekstvak.
Dit is het eerste programma waarin je echt gaat programmeren, dus let op dat je geen fouten maakt!
Omdat dit programma een uitbreiding is van het project VB01Hallo2, passen we dit aan. Als je project VB01Hallo2 nog open hebt, kunnen we zo verder. In het andere geval moet je het project eerst openen. Dit kun je door op de startpagina van Visual Basic onder Recent op VB01Hallo2 te klikken.
Sleep vanuit de Toolbox een Button naar het formulier en plaats dat onder het tekstvak. Wijzig de properties als volgt:
| Object | Eigenschap | Waarde |
|---|---|---|
| TextBox | Text | leeg (dubbelklik en druk Delete) |
| Button | Name | btnHallo |
| Text | Klik mij |
Nu gaan we echt programmeren. Dubbelklik op de knop. Er verschijnt een nieuw venster met het tabblad Form1.vb met de volgende tekst:
Public Class frmHallo
Private Sub btnHallo_Click(sender As Object, e As EventArgs) Handles btnHallo.Click
End Sub
End Class
De eerste regel geeft aan dat dit een klasse is binnen het formulier frmHallo.
De tweede regel geeft aan dat het een subroutine is die alleen gebruikt kan worden binnen dit formulier (Private). De subroutine heet btnHallo_Click (standaardnaam gegeven door Visual Studio). De tekst tussen haakjes geeft aan dat als parameters van de subroutine worden doorgegeven de naam van de aanroepende subroutine of procedure en een zogenaamd event handler. Dit wordt later nog besproken. De tekst Handles btnHallo.Click geeft aan dat deze subroutine wordt aangeroepen als op de knop btnHallo wordt geklikt.
De derde regel (End Sub) geeft het einde van de subroutine aan.
De vierde regel (End Class) geeft het einde van de klasse aan.
Plaats de cursor tussen op de regel tussen Private en End Sub, en typ de volgende tekst:
tbxHallo.Text = "Hallo Wereld!"
Als je de tekst intypt, verschijnt daaronder informatie van IntelliSense, die voorstellen doet over wat je allemaal kunt intypen. Zodra je een dubbel aanhalingsteken intypt, verschijnt automatisch het aanhalingsteken sluiten, zodat je dat niet zelf hoeft in te typen (en dus ook niet kunt vergeten).
Druk nu F5 om het programma uit te voeren. Het programma start en je ziet een knop met de tekst "Klik mij". Als je op de knop klikt, verschijnt in het tekstvak erboven de tekst Hallo Wereld!. Proficiat, je hebt je eerste programma geschreven. Je kunt nog meerdere keren op de knop klikken. Hoewel er niets verandert, wordt steeds opnieuw de tekst Hallo Wereld! in het tekstvak geplaatst.
Sluit het programma af.
Wat heb je nu gedaan? Eigenlijk hetzelfde als in het vorige voorbeeld: de property Text van het tekstvak tbxHallo voorzien van een andere tekst, namelijk Hallo Wereld!. De computerinstructie die je hebt getypt betekent eigenlijk: verander van component tbxHallo (het tekstvak in je programma) de property Text in Hallo Wereld!. Op deze manier kun je in een programma gemakkelijk de properties van componenten wijzigen.
Wat te doen bij een fout in het programma
[bewerken]We gaan nu een fout in het programma maken. Wijzig in je programma de tekst tbxHallo.txt in tbtHallo2.txt. Je ziet nu vooraan de regel een geel bakje verschijnen en de tekst tbxHallo2 krijgt daaronder een blauw slingerlijntje (soms moet je de cursor een regel omlaag en omhoog bewegen om het lijntje te zien). Dit geeft aan dat je een fout hebt gemaakt. Als je dit ziet, kun je de fout corrigeren. Maar druk nu toch maar eens op F5. Je krijgt een foutbericht met de tekst There were build errors. Would you like to continue and run the last successful build?. Klik No.
In de Error List zie je de boodschap 'tbxHallo2' is not declared. It may be inaccessible due to its protection level'. Dubbelklik op deze regel. Visual Studio springt automatisch naar de plaatst van de fout. In een groot programma kan dat een andere plaats zijn dan waar je aan het werken bent. Onder de fout verschijnt een venster met mogelijke oplossingen. Omdat de juiste oplossing er niet bij staat, druk je op Esc. Pas de fout aan door de 2 achter tbxHallo weg te halen.
Sla het project op met FILE -> Save All.
Naamgeving componenten
[bewerken]Als je de naam van iedere component laat beginnen met drie letters die het soort component aangeven, is dit later gemakkelijk als je later het programma nog eens doorleest of wijzigt. De volgende afkortingen kunnen worden gebruikt. De eerste mogelijkheid, Pointer is geen component, maar wordt gebruikt om een component te deselecteren, zodat je de cursor kunt gebruiken om iets aan te wijzen of aan te klikken.
Kleine opmerking: door in de Toolbox bovenin op All Windows Forms te klikken, krijg je een overzicht van alle componenten op een rij, dus niet gegroepeerd. Door er opnieuw op te klikken, krijg je weer het overzicht per categorie.
Onderstaande afkorting plaats je dus vóór de naam van het component in het programma.
bgw BackgroundWorker bin BindingNavigator bis BindingSource btn Button cbx CheckBox clb CheckListBox cdl ColorDialog cob ComboBox cms ContextMenuStrip dgv DataGridView das dataSet dtp DateTimePicker die DirectoryEntry dis DirectorySearcher dud DomainUpDown erp Error Provider evl EventLog fsw FileSystemWatcher flp FlowLayoutPanel fbd FolderBrowserDialog fod FontDialog grb GroupBox hep HelpProvider hsb HScrollBar iml ImageList lbl Label lil LinkLabel lib ListBox liv ListView mtb MaskedTextBox mst MenuStrip msq MessageQueue moc MonthCalender not Notification nud NumericUpDown ofd OpenFileDialog psd PageSetupDialog pan Panel pec PerformanceCounter pib PictureBox prd PrintDialog pdo PrintDocument ppc PrintPreviewControl pro Process prb ProgressBar prg PropertyGrid rab RadioButton rtb RichTextBox sfd SaveFileDialog sep SerialPort sec ServiceController spc SplitContainer spl Splitter sts StatusStrip tbc TabControl tlp TableLayoutPanel txb TextBox tim Timer tls ToolStrip tsc ToolStripContainer tot ToolTip trb TrackBar trv TreeView vsb VScrollBar wbr WebBrowser
Je bent misschien geschrokken van de lange rij, maar dat is niet nodig. Veel componenten zul je zelden of nooit gebruiken. En als een bepaald component maar één keer voorkomt in je programma, hoef je de naam niet aan te passen omdat een verwisseling met een component met een andere naam (alleen te zien aan het volgnummer) toch niet mogelijk is.
Nog een opmerking over de naamgeving:
- Namen van componenten bestaan uit drie kleine letters gevolgd door een naam die begint met een hoofdletter. Als een naam bestaat uit meerdere woorden, worden deze aan elkaar geschreven en begint ieder woord met een hoofdletter, b.v. tbxEersteWaarde. Dit heet Camel Case.
- Namen van o.a. klassen worden geschreven in Pascal Case. Hierbij wordt geen drieletterig voorvoegsel gebruikt en begint ook het eerste woord met een hoofdletter, bijv. Werknemer.
- Namen van constanten worden volledig in hoofdletters geschreven, zodat direct te zien is dat het een constante is, bijv. BTWPERC.