Update gui.md

gui.md

@@ -91,27 +91,44 @@ Bruk eksempelapplikasjonen for å se hvordan dette gjøres i praksis.
 ```python
 knapp = Button(root, text="Søk", command=vis_tekst)  
 ```
+
 * Tekstfelter (Entry). Et teksfelt opprettes gjerne med to linjer kode; en for å lage en StringVar som holder på innholdet og en for å lage tekstfeltet. Også her angir vi hvilket vindu det skal være i, i tillegg til hvilken StringVar som skal brukes:
 ```python
 tekst = StringVar()  # Definerer en tekstvariabel for tekstfeltet 
 tekstfelt = Entry(root, textvariable=tekst)
 ```
 
-* Ledetekst (Label) En Label inneholder vanligvis en ledetekst og brukes gjerne foran et tekstfelt (Entry). En *Label* kan imidlertid ogsp inneholde et bilde (dette gjøres i eksempelapplikasjonen)
-* Menyer. En meny (Menu) kan inneholde flere meny-elementer med en kommando for hvert element.
-* Lister (Listbox)
-* Nedrekksmeny (OptionMenu)
+* Ledetekst (Label) En Label inneholder vanligvis en ledetekst og brukes gjerne foran et tekstfelt (Entry). En *Label* kan imidlertid også inneholde et bilde (dette gjøres i eksempelapplikasjonen). Her er et eksempel med ledeteksten "Søk: ":
+```python
+ledetekst = Label(root, text="Søk: ")
+```
 
+* Menyer. En meny (Menu) kan inneholde flere meny-elementer med en kommando (command) for hvert element som peker på hvilken funksjon som skal kjøres når elementet velges. Se i *person_main.py* i eksempelprogrammet for å se hvordan vi lager disse.
+* Lister (Listbox). Lister er litt mer kompliserte da vi gjerne trenger en *scrollbar*. Vi oppretter en *Scrollbar* og en *Listbox* hver for seg og knytter dem sammen. I tillegg må vi legge til elementene i lista en og en. Bruk eksempelapplikasjonen som utgangspunkt for å bruke disse da det er litt komplisert.
+```python
+scrollbar = Scrollbar(root, orient=VERTICAL)
+listbox = Listbox(root, yscrollcommand=scrollbar.set)
+scrollbar.config(command=listbox.yview)
+listbox.bind('<Double-Button-1>', change_food)
+
+elements = [["egg","bacon","pølser"]]
+for element in elements:
+    listbox.insert(END, element[1])
+```
+
+* Nedrekksmeny (OptionMenu). En nedtrekksmeny trenger en StringVar for å holde på *valgt* verdi og en liste som angir hvilke valg som er mulige. Ofte vil det være aktuelt å hente denne listen fra en database.
 ```python
 chosen = StringVar()
 chosen.set("egg")
-options = ["egg","bunny","chicken"]
+options = ["egg","bacon","pølser"]
 nedtrekksmeny = OptionMenu(root, chosen, *options)  # Merk stjerna foran listevariabelen
 ```
 
 # Grid
 
-Widget'ene vi lager må *plasseres* i et vindu. Dette kan gjøres på flere måter, men vi skal bruke et rutenett. Hvis dere kan bruke `table`i html vil dere kjenne igjen prinsippet. Et element får en plassering med *column* og *row*, og så spesifiserer vi eventuelt hvor mange kolonner (*columnspan*) og hvor mange rader (*rowspan*) elementet skal spenne over. I tillegg kan vi legge til *luft* mellom elementene med *padx* og *pady*.
+I eksempelkoden i forrige avsnitt mangler det noe. Vi har ikke *plassert* widget'ene i vinduet. Vi trenger derfor en kodelinje til per widget.
+
+Vi kan plassere dem på flere måter, men vi skal bruke en metode, nemlig et rutenett. Hvis dere kan bruke `table`i html vil dere kjenne igjen prinsippet. Et element får en plassering med *column* og *row*, og så spesifiserer vi eventuelt hvor mange kolonner (*columnspan*) og hvor mange rader (*rowspan*) elementet skal spenne over. I tillegg kan vi legge til *luft* mellom elementene med *padx* og *pady*.
 
 I følgende eksempel plasserer vi en ledetekst og et tekstfelt i hver sin rute, og en knapp i raden under som spenner over **to** kolonner
 
@@ -164,7 +181,6 @@ Applikasjonen ligger på GitHub: [https://github.com/nilstes/simple-python-gui-a
 
 Dere kan kjøre applikasjonen ved å ha *person_main.py* fremme i Thonny og så trykke på start-knappen. Men før dere kjører må dere gjøre følgende:
 * Opprette databasen fra [https://mysql.stud.iie.ntnu.no](https://mysql.stud.iie.ntnu.no). SQL-skriptet for dette ligger på GitHub-siden. Databasetabellen er en utvidelse av den vi brukte i forrige leksjon så dere må sannsynligvis slette den gamle tabellen først. Dette gjør dere med SQL-skriptet:
-
 ```sql
   DROP TABLE person;
 ```