Harjoitustyö, vaihe 2¶
Jatketaan oman harjoitustyön tekemistä luomalla harjoitustyön käyttöliittymälle interaktiivinen prototyyppi. Prototyypin ei vielä tarvitse sisältää varsinaista toiminnallisuutta, mutta se antaa kuvan siitä, miltä sovellus tulee näyttämään. Lisäksi se antaa käsityksen siitä, miten käyttäjä voi olla vuorovaikutuksessa sovelluksen kanssa.
Näkymien luominen¶
Luo jokainen harjoitustyösi näkymä SceneBuilderissa.
Lisää fx:id jokaiseen sellaiseen komponenttiin, johon todennäköisesti haluat myöhemmin viitata koodissa. Älä unohda mahdollisia ohje- tai varoitustekstejä. Aluksi ne voivat sisältää placeholder-tekstin.
Tapahtumankäsittelijät¶
Lisää tapahtumankäsittelijät jokaiseen komponenttiin, joihin haluat myöhemmin lisätä toiminnallisuutta, kuten siirtymisiä muihin näkymiin, olioiden lisäämistä, poistamista, jne. Tyypillisesti tällaiset komponentit ovat painikkeita, alasvetovalikoita tai vastaavia.
Tapahtumankäsittelijöille voi luoda pohjat myös SceneBuilderissa. Klikkaa
Code-kohtaa ja anna "On Action"-kohtaan tapahtumankäsittelijän nimi, esimerkiksi
handleLoginButton.
Komponenttien ja tapahtumankäsittelijöiden nimeäminen¶
Fx:id-tunnisteen loppuun on tapana on lisätä komponentin tyyppi. Tämä auttaa koodin kirjoittamisessa, kun voit kirjoittaa vain button ja IDE osaa ehdottaa oikeaa komponenttia.
| Komponentti | Lyhenne / Pääte | Esimerkki (fx:id) |
|---|---|---|
| Button | btn tai Button | tallennaBtn, peruutaButton |
| TextField | txt tai Field | emailField, statusTxt |
| Label | lbl tai Label | ilmoitusLabel, virheLbl |
| ComboBox | combo | maaCombo |
| TableView | table | kayttajaTable, tehtavaTable |
| CheckBox | cb tai check | suodatusCheck |
Tapahtumankäsittelijöiden kohdalla on tapana käyttää handle- tai
kasittele-etuliitettä. Esimerkiksi kasitteleUusiOstostapahtuma voisi olla
tapahtumankäsittelijä, joka liittyy uusiOstostapahtumaButton-painikkeeseen.
Kontrolleriluokkien nimeäminen¶
Näkymille kannattaa jo SceneBuilderissa antaa kontrolleriluokka, vaikka niitä ei
olisikaan vielä olemassa. Nimi syötetään kohtaan Controller › Controller class. Nimi tulee valita niin, että se on sama
kuin näkymän nimi, perään lisättynä "Controller"-sana. Esimerkiksi
SyotaTehtava.fxml-näkymälle sopisi SyotaTehtavaController-kontrolleriluokka.
Tärkeää
Kontrolleriluokan nimi tulee antaa nimi kokonaisuudessaan pakkauksen kanssa,
esimerkiksi fi.jyu.ohj2.anlakane.todo.SyotaTehtavaController. Jos annat
pelkän luokan nimen, kuten SyotaTehtavaController, IDE ei löydä luokkaa.
Tee jokainen näkymä mahdollisimman valmiiksi SceneBuilderissa.
Jos näkymä sisältää dynaamisesti lisättäviä komponentteja (vrt. Todo-sovelluksen tehtävät), ei näitä luonnollisesti lisätä SceneBuilderissa, mutta niille kannattaa varata tilaa ja fx:id-tunniste, jotta niihin on helppo viitata koodissa.
Lisää jokaiselle interaktiiviselle komponentille fx:id-tunniste.
Lisää jokaiselle interaktiiviselle komponentille tapahtumankäsittelijä, joka liittyy kyseiseen komponenttiin.
Kontrolleri-luokkien luominen¶
Luo jokaiselle näkymälle oma kontrolleri-luokka. Vinkki: Saat SceneBuilderista
kontrolleriluokan pohjan, jonka voit copy-pasteta projektiisi. Klikkaa View › Show Sample Controller Skeleton. Täydennä siihen
tarvittavat tyypit ?-merkkien kohdalle.
Tee jokaiselle näkymälle kontrolleri-luokat. Jokaisen käsittelijän pitää tehdä jotakin, esimerkiksi tulostaa teksti konsoliin. Tässä kohdassa ei vielä pysty kokeilemaan muiden kuin päänäkymän kontrollerin toimintaa. Käännösvirheitä ei saa kuitenkaan tulla.
Siirtyminen näkymästä toiseen¶
Näkymien välillä pitää pystyä siirtymään. Kirjoita tapahtumankäsittelijöihin tarvittava koodi, jotta voit siirtyä näkymästä toiseen. Myös kaikkien muiden vuorovaikutteisten elementtien, kuten painikkeiden, pitää tehdä jotain, esimerkiksi tulostaa konsoliin. Näin saat hyvän pohjan, johon voit myöhemmin lisätä toiminnallisuutta.
Toteuta siirtymät näkymien välillä. Esimerkiksi päänäkymästä pitää pystyä siirtymään syöttö- tai muokkausnäkymään ja takaisin. Takaisin päin pitää päästä siirtymään muutenkin kuin sulkemalla ikkuna.
Näyttäminen ohjaajalle¶
Kuten osassa 9, suosittelemme tässäkin vaiheessa näyttämään harjoitustyön vaiheen ohjaajalle.
Näytä vaihe ohjaajalle.
Voit merkitä tästä tehtävästä pisteen vain silloin kun näytät ohjaajalle työsi keskeneräisessä tilassa -- ei enää siinä vaiheessa kun olet palauttamassa valmista työtä.