GUI-programmering
GUI-programmering krever litt andre programmeringsteknikker enn når en bruker konsollet til input og output. En må bl.a. kjenne til hvordan en rigger opp vinduer med paneler, knapper, lister, tekstfelt osv. og selv om dette ikke er vanskelig, så er det en del å lære. Men først og fremst blir kontrollflyten gjennom programmet annerledes, fordi hva som skjer i større grad styres av hva brukeren gjør.
Les en (litt knapp) introduksjon til JavaFX-programmering her: JavaFX. Les litt om enkel JavaFX-grafikk her: Enkel 2d-grafikk med JavaFX
Bruk av JavaFX Scene Builder og FXML
Når en app kjøres, så går den typisk gjennom to faser:
Fase 1
Først så rigges GUI-et opp, med vinduer og paneler med interaktive elementer og grafikk. Innholdet kan lages på to måter: enten ved å skrive kode som lager hver del (veldig knotete), eller ved å lage en FXML-fil som beskriver innholdet. FXML ligner på mange måte på HTML, som brukes for å lage web-sider, og en kan lage FXML-filer på to måter:
- En kan tegne skjermbildet med JavaFX Scene Builder, som leser og skriver FXML-formatet. Da slipper en å tenke på at FXML er tekst basert på XML og kan fokusere på interaktive elementer og grafisk innhold.
Her er en YouTube-video om Scene Builder: https://www.youtube.com/watch?v=rHcnsEoSK_c - En kan bruke e(fx)clipse-tillegget til Eclipse og skrive det som kode i en tekst-editor. Dette er i grunnen nokså greit, spesielt siden Eclipse sin FXML-editor har mange nyttige redigeringsfunksjoner og i tillegg har et Preview panel, som gjør at vi kan se hvordan skjermbildet for FXML-koden vil bli seende ut.
Les litt om enkel grafikk med FXML her: Enkel bevegelig grafikk med FXML.
Det går an å blande teknikkene også. En fin måte å gjøre det på er å starte med Scene Builder, for å bli kjent med alle mulighetene som JavaFX og FXML har, og så jobbe videre med FXML-koden i Eclipse.
Her er noen oppgaver som kan gjøre for å bli kjent med Scene Builder og FXML: FXML-oppgaver
En god start på å lære seg å lage FXML, både med en tekst-editor og med JavaFX Scene Builder er å tegne skjermbildet til Hangman, inkludert strekmannen som skal dukke opp etterhvert som en skriver inn feil. F.eks. kan en ha et tekstfelt for å skrive inn bokstaver, en tekst som viser bokstavene i ordet en holder på å gjette og en meldingstekst.
Fase 2
Når fase 1, rigging av GUI-et, er ferdig, så ligger programmet og venter på at brukeren gjør noe, f.eks. velger noe i en meny, klikker på en knapp, beveger muspekeren over grafikk eller skriver på tastaturet. For at programmet skal kunne reagere på det brukeren gjør, så må FXML-en kobles sammen med Java-koden.
Vi har også laget et lite eksempel som du kan se på her: FXML-programmeringseksempel. Så kan du prøve på programmeringsoppgaver som bygger videre på FXML-oppgavene: FXML-programmeringsoppgaver
Les mer om programmering med FXML her: FXML-filer og Java-kontroller-logikk.