...
Bruk av JavaFX Scene Builder og FXML
I en GUI-applikasjon går programmet 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.
...
Fase 1 kan gjøres Innholdet kan lages på to måter: enten ved å gjøre det i programmetskrive kode som lager hver del (veldig knotete), eller ved å lage en FXML-fil som beskriver innholdet i GUI-et. FXML ligner på mange måte på HTML, som brukes for å lage web-sider, og en kan lage den 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.En kan tegne skjermbildet med JavaFX Scene Builder og lagre det som FXML. Da slipper en å tenke på at FXML er tekst basert på XML-formatet og kan fokusere på interaktive elementer og innhold en trenger.
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
Oppgave: 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 avhenger av hvilken teknikk du brukte i fase 1. Vi kommer til å basere oss på FXML-teknikken, siden den er grei for den typen programmer vi fokuserer på, og teknikken er nokså lik den som brukes på Android.Les mer om programmere med FXML her: FXML-filer og Java-kontroller-logikk.
...