Bewerkingsmodus en uitvoeringsmodus

Het valt je misschien op dat Visual Studio twee "gezichten" heeft. Een bewerkingsmodus en een uitvoeringsmodus.

De bewerkingsmodus gebruiken we het meest. Daar kun je schermen maken, knoppen programmeren en C# (spreek uit: siesjarp) code tikken. Visual Studio start op in deze modus. In deze modus kunnen we het programma opstarten met "Start".
Nadat je op "Start" drukt verspringen alle icoontjes naar de uitvoeringsmodus. Het woord "Start" is niet meer zichtbaar. Soms blijft je C# sourcecode nog staan, soms niet. Je ziet dat Visual Studio je programma opstart en grafieken tekent van je processor- en geheugengebruik. Visual Studio voert in deze modus je programma uit. Klik op het stop-blokje (bovenin de toolbar van Visual Studio) om te stoppen met het uitvoeren en terug te gaan naar de bewerkingsmodus.
Deze "Start" knop kan je best vaak gebruiken om zelf te controleren (=testen) of werkt wat je hebt gemaakt. Zelfs al heb je nog geen code geschreven dan kan je het 1e scherm hiermee al testen.

We gaan eerst in de bewerkingsmodus kijken naar de schermen en bijbehorende code en deze vervolgens zelf uitbreiden.

Programmeren van C# sourcecode

Aan de rechterzijde van het scherm in de Solution Explorer tref je alle bestanden aan die onderdeel zijn van het programma. De voornaamste (voor vandaag) zijn de schermindelingen en bestanden met de broncode.

Als voorbeeld laten we hier onder zien hoe je een nieuw project "Floorplan" aanmaakt. Doorloop onderstaande stappen. Na afloop kun je op de groene pijl klikken om het programma te draaien. het programma doet nog niet veel, maar je hebt nu even kunnen oefenen met de omgeving van Visual Studio.

Opstarten van Visual Studio en aanmaken van het "Floorplan" project

Start Visual Studio op en vanuit het startscherm maak een nieuw project aan genaamd "Floorplan". Ga hiervoor naar het "File" menu en kies "New" --> "Project".

New Project.png

Kies dan voor een "Windows Forms" type project omdat we een eenvoudige Windows applicatie gaan maken. Het kan zijn dat jouw Visual Studio er iets anders uitziet (bijv. de volgorde van het type project), dit kan per pc verschillen. Mocht je de optie niet vinden, vraag het vooral aan de docent. Onderstaand een voorbeeld van hoe dit er uit zou kunnen zien.

Type Project.png

BELANGRIJK: let goed op dat Windows Forms App (.NET Framework) staat geselecteerd!

Onder in dit scherm kan je de naam van de applicatie (="Floorplan") intypen en kan je kiezen waar je dit project op de harde schijf neer zet.

Als je dit gedaan hebt dan zie je Visual Studio met alvast een leeg scherm op je canvas (zie het plaatje hieronder). Voordat je daadwerkelijk gaat programmeren of veranderingen aan gaat brengen is het handig om eerst die dingen die je gebruikt van een juiste naam te voorzien. Als je dit later gaat doen dan kan Visual Studio in de war raken of, erger nog, jijzelf ;-).

Zorg er dus voor dat het scherm een juiste naam krijgt (zie solution explorer, klik met je rechtermuisknop op "Form1.cs" en kies "Rename") en een juiste titel (zie properties window en dan de "Text" property) voor boven in de titelbalk van het scherm. Hier 2 voorbeelden van hoe je dit kan doen (tip: let op het properties window waar de waarde wordt ingegeven en de solution explorer waar je namen van bestanden kan veranderen).

Verander titel.png

Verander naam.png

Zorg er nu voor dat op het hoofdscherm van de applicatie de Paaspop festival achtergrond komt te staan zoals op het voorbeeld hieronder getoond. Zoals eerder gezegd mag je ook een eigen Paaspop festival plattegrond als achtergrond gebruiken. Zorg er wel voor dat de achtergrond afbeelding schermvullend is.

Tip:
Kijk in het properties window voor de juiste eigenschappen om dit te kunnen doen. Als je de afbeelding niet kan vinden dan zou je in deze cursus kunnen kijken en de afbeelding simpelweg kunnen "jatten".

Tip2:
Als je de juiste eigenschap hebt gevonden waar je de afbeelding in geplaatst hebt dan kan je daar vlakbij ook de eigenschap vinden om de afbeelding te krijgen zoals in onderstaande afbeelding.

Je kunt de afbeelding van de plattegrond die hier onder staat gebruiken (rechtermuisklik, Opslaan als):