The page has been modified since the last reload. Refresh now?

There are {{ $ctrl.pendingUpdatesCount() }} pending paragraph updates.

{"classes": ["linkit"], "rd": "114039", "rl": "no", "rp": "jjgCelf0svvh"}

Containers

Tässä dokumentissa kerrotaan eri Pane-layouteista, joiden päälle voidaan komponentteja laittaa. Käytännössä ohjelman käyttöliittymän tekeminen aloitetaan jostakin pohjana toimivasta Pane-containerista ja sen päälle laitetaan muita Pane-containereita kunnes ikkuna on jaettu niihin osiin, joihin sen halutaan ohjelmassa jakautuvan.

Accordion

Näkymä, jossa on monta TitledPane-komponenttia, joista yksi kerrallaan on auki. Vähän sama käyttötarkoitus kuin TabPanella

AnchorPane

AnchorPane on SceneBuilderillä käytettynä tietyssä mielessä helpoin alusta. Komponentit jäävät juuri siihen kohti, mihin ne pudotetaan. Tämän lisäksi kullekin komponentille voidaan säätää Layout -osassa halutut ankkurit alueen reunojen suhteen. Esimerkiksi jos komponentin ankkuri kiinnitetään oikeaan reunaan, niin komponentti on aina yhtä kaukana oikeasta reunasta vaikka alueen kokoa muutetaan. Jos kiinnitetään vasen ja oikea reuna, niin molemmat ovat aina yhtä kaukana alueen reunoista, eli komponentin koko muuttuu. Samalla tavalla voidaan soveltaa ylä ja alareunaa.

Komponentin ankkurit SceneBuilderissä
Komponentin ankkurit SceneBuilderissä

Tietyssä mielessä AnchorPanen käyttö on periksiantamista. Yleensä paremmin skaalautuva ohjelma saadaan käyttämällä muita alustoja.

BorderPane

BorderPane koostuu viidestä osasta. Tämä on usein hyvä pohja sovellukselle.

  • top - yläosa
  • left - vasen reuna
  • center - alueen keskiosa
  • right - oikea reuna
  • bottom -alareuna

Mikäli alueen kokoa muutetaan, pyrkivät muut osat paitsi keskiosa säilyttämään kokonsa. Keskiosa valtaa kaiken jäljelle jäävän tilan. Kaikkiin osiin ei ole pakko sijoittaa komponentteja. Usein noihin osiin sijoitetaan muita Container-elementtejä ja varsinaiset komponentit tulevat vasta niiden päälle. Huomattakoon ettei kaikkia osia ole pakko käyttää.

Alueen jakaminen viiteen osaan
Alueen jakaminen viiteen osaan

Kuva ei näy.

08 Mar 17

Esimerkki pelkästään koodilla tehtynä:

#

Please to interact with this component

Sama esimerkki FXML tiedoston avulla tehtynä:

#

Please to interact with this component

#

Please to interact with this component

//
            Pane root = (Pane)FXMLLoader.load(
               getClass().getResource("BorderPaneView.fxml"));
            Scene scene = new Scene(root, 300, 300);

BorderPane sopii hyvin myös jos joku komponentti pitää saada vapaan alueen keskelle.
Silloin laitetaan BorderPane ja sen keskiosaan keskitettävä komponentti. Muut BorderPane “ilmansuunnat” voidaan jättää tällöin tyhjiksi.

ButtonBar

ButtonBar on vastaava kuin HBox mutta erityisesti painikkeiden laittamista varten. Painikkeiden järjestys vaihtuu sen mukaan missä käyttöjärjestelmässä ohjelmaa käytetään. Mm. Windowsissa OK on Cancel -painikkeen vasemmalla puolella ja OS X:ssä päinvastoin.

DialogPane

FlowPane

FlowPane rivittää (tai laittaa sarakkeisiin) sen päälle pudotetut komponentit. Mikäli alueen kokoa muutetaan, voivat komponentit siirtyä riviltä toiselle. Erona esimerkiksi TilePaneen on se, että jokainen komponentti voi olla minkä kokoinen tahansa.

GridPane

GridPane tekee ruudukon, johon komponentteja voidaan sijoitella määrämuotoisesti. Usein hyvä pohja silloin kun komponettien halutaan olevan jossakin suunnassa linjassa keskenään.

  • rivin lisääminen: lisää alkio tiettyyn paikkaan: grid.add(label, sarake, rivi);
  • rivin poisto: poista rivillä olevat nodet
    • grid.getChildren().remove(index); // indeksi parent taulussa, ei gridissä
    • grid.getChildren().remove(node); // poistettavan alkion viite
  • kaikkien alkioiden poisto: grid.getChildren().clear();

HBox

HBox sijoittelee sen päälle pudotetut komponetit tai panet vaakasuunnassa. Erona esimerkiksi vaakasuuntaiseen TilePaneen on se, että HBox jakaa alueen tasaisesti koponenttien kesken. Mikäli alue menee liian pieneksi, pienennetään komponentteja, ei ladota uudellen eri riveille kuten TilePanessa.

PopupControl.CSSBridge

Pane

SplitPane

SplitPane jakaa alueen useaan eri osaan, joiden keskinäistä suhdetta käyttäjä voi itse säädellä asetetuissa rajoissa.

StackPane

StackPane asettelee komponentit päällekkäin Z-suunnassa. Käytetään jos halutaan pinota useita komponentteja näyttämään “yhdeltä”. Esimerkiksi kuvan päälle tekstiä.

TabPane

TabPanen avulla voidaan tehdä “sivutettuja” näkymiä. Sopii erinomaisesti esimerkiksi asetusten jakamiseksi eri kokonaisuuksiin.

TextFlow

Alue, joko tavallaan muodostaa yhden tekstin useasta muusta tekstikomponentista. Jokaiselle tekstikomponentille voidaan antaa omia tyylimäärityksiä. FlowPaneen nähden erona että ymmärtääp aremmin tekstiä. Esimerkiksi jonkin tekstikomponentin sisällä oleva \n vaihtaa riviä.

TilePane

Sijoittelee komponentteja tasaisesti niin, että mikäli ikkunan koko muuttuu, ne voivat rivittyä uudelle riville. Oletuksena kaikista komponenteista tulee yhtä suuria.

TitledPane

Käytetään yleensä Accordion-alueen osana.

ToolBar

Alue työkalupalkin tekemiseksi.

VBox

HBox sijoittelee sen päälle pudotetut komponetit tai panet pystysuunnassa.

#

Esimerkki jossa dynaamisesti lisätään kontrolleja

Koodi svn:ssä: dynamic

These are the current permissions for this document; please modify if needed. You can always modify these permissions from the manage page.