Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

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.

KomponenttiLyhenne / PääteEsimerkki (fx:id)
Buttonbtn tai ButtontallennaBtn, peruutaButton
TextFieldtxt tai FieldemailField, statusTxt
Labellbl tai LabelilmoitusLabel, virheLbl
ComboBoxcombomaaCombo
TableViewtablekayttajaTable, tehtavaTable
CheckBoxcb tai checksuodatusCheck

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.

Tehtävä 10.1: Näkymät SceneBuilderissa. 1 p.

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.

Tee tehtävä TIMissä

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.

Tehtävä 10.2: Kontrollerit. 1 p.

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.

Tee tehtävä TIMissä

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.

Tehtävä 10.3: Siirtyminen näkymästä toiseen. 1 p.

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.

Tee tehtävä TIMissä

Näyttäminen ohjaajalle

Kuten osassa 9, suosittelemme tässäkin vaiheessa näyttämään harjoitustyön vaiheen ohjaajalle.

Bonus: Tehtävä 10.4: Vaiheen näyttäminen ohjaajalle. 1 p.

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ä.

Tee tehtävä TIMissä