Maak de podiumlijsten

Uiteindelijk moet voor elk podium een lijst gemaakt worden waarin duidelijk wordt wie er op welk tijdstip gaat optreden. Dit kan je op allerlei manieren doen. De manier die we hier kiezen is om per podium een lijst te maken waarop je dit ziet. Je hebt diverse keuzes om lijsten op een scherm te maken, wij hebben hier gekozen voor een "ListView" omdat deze vorm best makkelijk te gebruiken is, al helemaal als je lijsten met meerdere kolommen hebt. Een voorbeeld van een eindresultaat ziet er als volgt uit:

Je ziet dat hier per podium een ListView is gemaakt. Hiernaast ook per lijst een knop (=Button) erboven (met het plusje) om de inhoud van die lijst te kunnen wijzigen (hint: hiervoor heb je het AddArtist scherm nodig wat je in de vorige opdracht hebt gemaakt). Hier is ook een kleurtje aan de lijsten gegeven om te laten zien bij welk podium ze horen. Dit kan je later ook gebruiken om het "AddArtist" scherm te "kleuren". Handig voor de gebruiker zodat hij iets meer informatie heeft over met welk podium hij/zij mee bezig is.

De ListView heeft heel veel eigenschappen, tweak ze zo dat je 2 kolommen ziet zoals hierboven in het voorbeeld is gedaan. Mocht je iets anders kiezen, zorg er dan voor dat je 2 kolommen zichtbaar kan maken.

Vergeet niet de juiste namen te geven voor alle elementen die je hebt gemaakt. Dit maakt het programmeren ervan een stuk makkelijker.

Voorbeeld van het toevoegen van een ListView:

Dubbelklik op een ListView in de Toolbox, nu verschijnt hij op je Form.
Pas de Naam aan in het Properties Window. Noem deze bijvoorbeeld "lvwApollo" (voor het Apollo podium).
Pas de BackColor Property aan naar "Indian Red".
Pas de Columns Property aan.
- Voeg 2 kolommen toe:
  - Naam: colTime, Text: Time, Breedte 80
  - Naam: colArtist, Text: Artist, Breedte 110
Zet de View Property op "Details".

Probeer het volgende nu zelf uit te zoeken:
Voeg nu voor deze ListView ook een knop toe (=Button) en geef die ook een goede naam en een tekst (een plusje "+"). Zet deze knop en de ListView op een goede plek op het scherm.

Koppel het 2e scherm nu aan een van de lijsten

Nu je het voorbeeld hebt nagemaakt is het tijd om daadwerkelijk te gaan programmeren. Pak een van de knoppen die je bij een van de lijsten hebt gemaakt, bijvoorbeeld de knop bij de "Phoenix" lijst. Als je hierop dubbel klikt kom je automatisch in het code scherm en kan je iets programmeren voor die knop. Als je nog niets geprogrammeerd hebt ziet er dit ongeveer zo uit:

De bedoeling van de code "onder" de knop is dat je het 2e scherm ("AddArtist") gaat openen. Nu staat er nog niets in de lijst maar als er al wel iets in zou staan dan moeten de gegevens die in de "Phoenix" lijst staan natuurlijk ook zichtbaar worden op dit 2e scherm. Je moet dus een manier verzinnen om de gegevens van dit 1e scherm door te geven aan het 2e scherm.

Let er op dat je in een OOP omgeving zit (OOP= Object Oriented Programming) en je dus eerst objecten moet "aanmaken" voordat je er iets mee kan doen. Wil je dus het "frmAddArtist" scherm gaan gebruiken dan zal je eerst iets moeten doen wat lijkt op:

frmAddArtist newArtist = new frmAddArtist();

Hierna kan je de variabele "newArtist" gaan gebruiken om dit scherm te openen. Het is dan ook handig om het 1e scherm "onzichtbaar" te maken zodat de eindgebruiker geen 2 open schermen tegelijk ziet.

Tip:
Voor het onzichtbaar maken kan je de methode ".Hide()" gebruiken. Die methode kan je bij bepaalde objecten - zoals Forms - gebruiken. Handig voor het "frmFloorPlan" scherm. Je moet nu alleen nog weten hoe je dit doet ... kijk eens naar het plaatje hieronder.

Als je d.m.v. de variabele "newArtist" het scherm hebt geopend (in code) dan is het handig om een eigen gemaakte methode van dit AddArtist scherm aan te roepen die het scherm vult met gegevens die in de lijst staan (in dit voorbeeld de lijst van het Phoenix podium).

Tip:
Je kan hiervoor de ListView als Object "doorgeven". Een eigen methode kan parameters hebben waarmee je gegevens door kan geven van de aanroepende code naar de uitvoerende code. Weet je niet wat parameters zijn, zoek dan eens naar "method parameter c#" in Google en lees 1 of meerdere pagina's. Het is ook goed om dan ook eens door te lezen wat methodes zijn en wat je er mee kan.

Kijk eens naar deze code, misschien kan je er iets mee:

Deze code kan je gebruiken voor het maken van een methode (noem die bijv. "OpenAddArtist(object sender)"). Deze methode kan je gebruiken in de code "achter" de knop die bij een lijst zit. Zo hoef je bij elke knop alleen maar die methode aan te roepen. Je kan die methode bijv. zo aanroepen "OpenAddArtist(lvwPhoenix)". Je geeft hiermee de ListView door aan de methode die uiteindelijk het 2e scherm gaat openen.

Handig he?

Let er wel op dat in bovenstaand plaatje een methode is gebruikt op het "frmAddArtist" scherm, die nog niet bestaat, in dit geval de "FillTimeTable" methode. Die "FillTimeTable" methode zal je nog wel moeten maken op het "frmAddArtist" scherm.

Hieronder een voorbeeld van hoe deze FillTimeTable methode er uit zou kunnen zien op het "frmAddArtist" scherm:

Probeer te begrijpen wat hier in deze methode allemaal gebeurt. In het kort gebeurt het volgende:

Bij de declaratie van de methode zie je al dat er een parameter "podiumList" wordt meegegeven. Dit is het ListView object dat je vanuit het "frmFloorPlan" scherm hebt doorgegeven.
Vervolgens wordt er op regel 28 een variabele aangemaakt "textBoxName" van het type string, tekst dus.
Op regel 30 wordt de achtergrondkleur van het "frmAddArtist" scherm gelijk gezet aan de kleur van de ListView die is meegegeven.
Op regel 32 wordt een lokale variabele "podium" gevuld met de meegegeven lijst. Dit doen we omdat we dit willen onthouden. Omdat we die onthouden kunnen we nl. bij het sluiten van het scherm weer de aanroepende lijst "gebruiken".
Op regel 34 t/m 40 wordt door de items uit de meegegeven ListView "gelopen" en worden de waarden uit de lijst 1 voor 1 op het "frmAddArtist" scherm gezet. Probeer te begrijpen wat hier gebeurt en zoek eens in Google op "if statement C#" en op "for loop C#". De informatie die je daar vindt helpt je om te begrijpen hoe deze structuren in C# werken.

LET OP!
Je zal zien dat je een fout krijgt op regel 32. De variabele "podium" bestaat immers nog niet. Die dien je toe te voegen aan de code van het formulier. Ga hiervoor bovenaan de klasse staan (net boven de methode "public frmAddArtist()") en maak eerst een regel vrij met de <Enter> toets. Typ hierna in "private ListView podium;". Hierna zal de fout op regel 32 verdwijnen.

Programmeer nu de andere lijsten

Voor de andere lijsten (andere podia) moet nu natuurlijk hetzelfde gebeuren. Ook bij de knop die bij die lijsten hoort moet het 2e scherm geopend worden en moeten de gegevens van de corresponderende lijst (Phoenix, Stardust, etc.) worden meegegeven. Ook als er nog niets in de lijst staat moet je dit meegeven want je weet - als programmeur - nooit wanneer er wel of niet iets in die lijst staat.

Tip:
Je komt er nu achter dat je eigenlijk meerdere keren hetzelfde aan het doen bent. Alleen de lijst die je gebruikt is anders maar het principe van wat je aan het doen bent is telkens hetzelfde. Probeer een eigen methode te maken (met een of meerdere parameters zoals hierboven gemeld) die dit voor je doet en die je bij elke knop simpelweg aanroept. Op deze manier hoef je maar 1x dit te programmeren. Als er dus een foutje in zit hoef je dit dus ook maar op 1 plek op te lossen.

Een voorbeeld hiervan hebben we al een eerdere keer laten zien: