Ebben a cikkben a JavaFX-hez tartozó FXML kerül bemutatásra. Ennek segítségével az alkalmazás logikától elkülönítve hozhatunk létre különböző felhasználói felületeket, valamint objektum gráfokat.
Miről is van szó?
Az FXML egy scriptelhető, XML alapú nyelv, melynek segítségével Java objektum gráfok konstruálhatók. Ez egy alternatívát biztosít egy JavaFX program felhasználói felületének létrehozására, ugyanis a nyelv hierarchikus struktúrája megegyezik a JavaFX színtérgráf struktúrájával. Ennek segítségével az alkalmazás logikától elkülönítve hozhatjuk létre a grafikus felhasználói felületet.
Az FXML előnyei
- Nem kell fordítani, a változtatások egyből láthatóak.
- CSS itt is működik.
- A tartalom helyhez (locale) köthető, azaz könnyen többnyelvűvé tehetjük az alkalmazásunkat (pl: en_US, hu_HU). Java kódban ezt csak úgy tehetnénk meg, ha minden elemhez meghívnánk a megfelelő setText() metódust. A támogatott nyelvek megtalálhatók az Oracle oldalán.
- Használhatunk script nyelveket.
- A SceneBuilder alkalmazás használható a felület tervezéséhez, megvalósításához.
Projekt létrehozása
Netbeansben tegyük a következőket:
- File menü, ezen belül New Project… választása.
- A JavaFX kategórián belül válasszuk a JavaFX FXML Application-t, aztán Next.
- A fájlokat nevezzük el valahogy. Például: TestApp, és Gui. Opcionálisan a csomagnév is módosítható alul, például: hu.TestApp.
- A Finish megnyomása a hu csomagon belül az alábbi három fájl fogja létrehozni:
- TestApp.java – ez a szokásos java kódot tartalmazza, semmi extra.
- Gui.fxml – ez a fájl határozza meg a grafikus felhasználói felületet.
- GuiController.java – ez lesz felelős a felületen kiváltott események kezeléséért.
A TestApp.java (főosztály) start metódusában az alábbi kódrészlet a fontos:
1
2 Parent root = FXMLLoader.load(getClass().getResource("Gui.fxml"));
Scene scene = new Scene(root);
A getClass().getResource() futásidőben határozza meg az objektum osztályát, majd az osztály csomagjának szintjén keresi a Gui.fxml erőforrást. Ennek eredménye egy URL lesz, melyet az FXMLLoader osztály statikus load() metódusa fog megnyitni.
A nyelv fontosabb építőelemei
Az alábbiakban a nyelv fontosabb részei kerülnek bemutatásra. A nagyobb egységek, mint például az elemek, attribútumok, vezérlők, eseménykezelés és scriptelés későbbi cikkek témái lesznek. Itt csak az alapok kerülnek bemutatásra. A hivatalos referenciában egyébként minden megtalálható.
Az első sor
Itt mindig az xml dokumentum karakterkódolását kell megadnunk. Ezt nem is kell tovább ragozni, azért itt a kód:
1 <?xml version="1.0" encoding="UTF-8"?>
Import
Hasonlóan a Javahoz, az osztályokat használhatjuk a csomagnevükkel együtt, vagy beimportálhatjuk őket. Ezt kétféleképpen is megtehetjük. Az első verzió, hogy egy konkrét osztályt húzunk be. Erre példa:
1 <?import javafx.scene.layout.AnchorPane?>
A másik lehetőség, hogy a csomag összes elemét beimportáljuk.
1 <?import javafx.scene.control.*?>
A root elem
Mielőtt még elkezdenénk építeni az objektum gráfunkat, szükségünk van egy gyökér elemre. Ha a felhasználói felületet tervezzük, akkor a javafx.scene.layout csomagban találhatók a megfelelő konténer-elemek. Lényegében a root lesz a legfelső szintű konténer ami, mindent tartalmazni fog. Itt két fontos attribútumot is meg kell határoznunk:
- xmlns:fx – Ennek megléte kötelező! Feladata, hogy meghatározza az fx névteret.
- fx:controller – Ez egy opcionálisan megadható attribútum, melyre akkor van szükségünk, ha az eseménykezelést a kontroller osztályra szeretnénk bízni. Ekkor ki kell majd építeni a kapcsolatot az egyes elemek és az egyes események között.
1
2
3
4
5 <AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="hu.GuiController">
<children>
<!-- elemek itt -->
</children>
</AnchorPane>
Továbbiak
A nyelv további részét képezik azok az elemek, attribútumok, vezérlők, amelyekből felépíthető és beállítható a felhasználói felület kinézete és funkcionalitása. Későbbi cikkekben ezekről mind lesz szó részletesen. Egyelőre elég ha annyit tudunk, hogy minden felületelem megtalálható a javafx csomagokban, melyeket tetszőlegesen felhasználhatunk az importálás után. Ezeknek megadhatók különböző attribútumok, valamint tulajdonságok. Itt egy példa, hogy mégis hogyan képzeljük el ezt:
1
2
3 <Button layoutX="126" layoutY="90" text="Click Me!" onAction="#handleButtonAction" fx:id="button" />
<Label layoutX="126" layoutY="120" minHeight="16" minWidth="69" fx:id="label" />
<Label layoutX="126" layoutY="60" minHeight="16" minWidth="69" text="hello"/>
Hasznos linkek
- JavaFX referencia
- FXML referencia
- Összefoglaló az FXML-ről pdf-ben.
- Egy tutorial az Oracle jóvoltából.
- Ezen a blogon rengeteg hasznos infót és tutorialt találhatunk Java, illetve JavaFX témákban.






