Bevezetés a Wicket keretrendszerbe

1. Áttekintés

A Wicket egy Java szerveroldali webkomponens-orientált keretrendszer, amelynek célja a webes felületek felépítésének egyszerűsítése az asztali felhasználói felület fejlesztéséből ismert minták bevezetésével.

A Wicket segítségével webes alkalmazás építhető csak Java kód és XHTML-kompatibilis HTML-oldalak felhasználásával. Nincs szükség Javascriptre, sem XML konfigurációs fájlokra.

Réteget biztosít a kérelem-válasz ciklus alatt, védve az alacsony szintű munkától, és lehetővé teszi a fejlesztők számára, hogy az üzleti logikára koncentráljanak.

Ebben a cikkben bemutatjuk az alapokat a HelloWorld Wicket alkalmazás, majd egy komplett példa két beépített komponens használatával, amelyek kommunikálnak egymással.

2. Beállítás

Wicket-projekt futtatásához adjuk hozzá a következő függőségeket:

 org.apache.wicket wicket-core 7.4.0 

Érdemes megnéznie a Wicket legújabb verzióját a Maven Central adattárban, amely az olvasás időpontjában nem egyezhet meg az itt használtakkal.

Most készen állunk az első Wicket alkalmazás elkészítésére.

3. Helló Világ Wicket

Kezdjük azzal, hogy alosztályozzuk a Wicket-t Webalkalmazás osztály, amely minimum megköveteli a Osztály getHomePage () módszer.

A Wicket ezt az osztályt fogja használni az alkalmazás fő belépési pontjaként. A módszeren belül egyszerűen adja vissza a osztály nevű osztály tárgya Helló Világ:

public class HelloWorldApplication kiterjeszti a WebApplication alkalmazást {@Orride public class getHomePage () {return HelloWorld.class; }}

A Wicket előnyben részesíti a konfigurációt. Új weboldal hozzáadásához az alkalmazáshoz két fájl létrehozása szükséges: Java fájl és HTML fájl azonos névvel (de más kiterjesztéssel) ugyanazon könyvtár alatt. További konfigurációra csak akkor van szükség, ha módosítani szeretné az alapértelmezett viselkedést.

A forráskód csomagkönyvtárában először adja hozzá a HelloWorld.java:

public class HelloWorld kiterjeszti a weboldalt {public HelloWorld () {add (new Label ("hello", "Hello World!")); }}

azután HelloWorld.html:

Utolsó lépésként adja hozzá a szűrő definícióját a web.xml:

 wicket.examples org.apache.wicket.protocol.http.WicketFilter applicationClassName com.baeldung.wicket.examples.HelloWorldApplication 

Ez az. Most kódoltuk az első Wicket webalkalmazásunkat.

Futtassa a projektet a háború fájl, (mvn csomag parancssorból), és telepítse egy szervlet-konténerre, például Jetty vagy Tomcat.

Nyissuk meg a // localhost: 8080 / HelloWorld / alkalmazást a böngészőben. Egy üres oldal az üzenettel Helló Világ! jelenik meg.

4. Wicket alkatrészek

A Wicket komponensei olyan triádok, amelyek Java osztályból, a HTML jelölésből és egy modellből állnak. A modellek olyan homlokzat, amelyet a komponensek az adatok eléréséhez használnak.

Ez a struktúra szépen elkülöníti az aggodalmakat, és a komponens leválasztásával az adatközpontú műveletekkel növeli a kód újrafelhasználását.

A következő példa bemutatja, hogyan lehet hozzáadni az Ajax viselkedését egy összetevőhöz. Két oldalból álló oldalból áll: egy legördülő menüből és egy címkéből. Amikor a legördülő menü megváltozik, a címke (és csak a címke) frissül.

A HTML fájl törzse CafeSelector.html minimális lesz, csak két elem, egy legördülő menü és egy címke:

Cím: cím

A Java oldalon hozzuk létre a címkét:

Label addressLabel = új címke ("cím", új PropertyModel (ez.cím, "cím")); addressLabel.setOutputMarkupId (true);

Az első érv a Címke konstruktor illeszkedik a kapu: id a HTML fájlban hozzárendelve. A második érv a komponens modellje, az alapul szolgáló adatok burkolója, amelyet a komponens mutat be.

A setOutputMarkupId A módszer lehetővé teszi a komponens módosítását az Ajaxon keresztül. Most hozzuk létre a legördülő listát, és adjuk hozzá az Ajax viselkedését:

DropDownChoice cafeDropdown = new DropDownChoice ("kávézók", új PropertyModel (ez, "selectedCafe"), cafeNames); cafeDropdown.add (új AjaxFormComponentUpdatingBehavior ("onchange") {@Orride protected void onUpdate (AjaxRequestTarget target) {String name = (String) cafeDropdown.getDefaultModel (). getObject (); cím.setNévcím (cím ()); target.add (addressLabel);}});

Az alkotás hasonló a címkéhez, a kivitelező elfogadja a kiskapu azonosítóját, egy modellt és a kávézók neveinek listáját.

Azután AjaxFormComponentUpdatingBehavior hozzáadódik a onUpdate visszahívási módszer, amely a ajax kérelem kiadása után frissíti a címke modelljét. Végül a címkekomponens a cél a frissítésre.

Végül a címkekomponens a cél a frissítésre.

Amint láthatja, minden Java, egyetlen sor Javascriptre sem volt szükség. A címke megjelenítésének megváltoztatásához egyszerűen módosítottunk egy POJO-t. Az a mechanizmus, amellyel a Java objektum módosítása a weboldal változását eredményezi, a függöny mögött történik, és nem releváns a fejlesztő számára.

A Wicket az AJAX-kompatibilis alkatrészek nagy készletét kínálja a dobozból. Az alkatrészek katalógusa élő példákkal itt érhető el.

5. Következtetés

Ebben a bevezető cikkben a Wicket alapjait ismertettük a Java komponens-alapú webes keretrendszerével.

A Wicket olyan absztrakciós réteget biztosít, amelynek célja a vízvezeték-kód teljes megszüntetése.

Két egyszerű példát vezettünk be, amelyek megtalálhatók a GitHub-on, hogy ízelítőt adhasson arról, hogy néz ki ez a keretrendszer.


$config[zx-auto] not found$config[zx-overlay] not found