Geçen yayınımda Wicket projemize nasıl Wicket kontrolünü devre dışı bırakarak JavaScript ve CSS desteği eklenebileceğine deyinmiştim. Bu yayınımda ise, Wicket kütüphanesinin sağladığı JavaScript ve CSS desteği ekleme yeteneklerinden bahsedeceğim.
Wicket projelerinde, genellikle sayfa sınıflarının türediği bir veya birden fazla taban sayfa sınıfları mevcuttur. Bu taban sayfa sınıflarının en önemli özelliklerinden biri ise, JavaScript ve CSS eklentilerinin alt (türemiş) sınıflara aktarabilmesi özelliğidir. Bu yayınımda, bu özellikten yararlanacağım.
<!DOCTYPE html> <html xmlns:wicket="http://wicket.apache.org"> <head> <meta charset="UTF-8"> <meta name="description" content="Base Page of Wicket Pages!" /> </head> <body> <header wicket:id="headerpanel" /> <section class="content_container"> <wicket:child/> </section> <footer wicket:id="footerpanel" /> </body> </html>
Yukarıdaki taban sayfa (BasePage) sınıfının Wicket HTML sayfasını görebiliriz. Otomatik olarak oluşturulan ve CSS ekleyen kısmı kaldırdım çünkü artık CSS (ve JavaScript) eklemeyi Java tarafında halledeceğiz.
package com.myapp.wicket;
import org.apache.wicket.markup.html.CSSPackageResource;
import org.apache.wicket.markup.html.JavascriptPackageResource;
import org.apache.wicket.markup.html.WebPage;
public abstract class BasePage extends WebPage {
public BasePage() {
loadCSS();
loadJavascript();
add(new HeaderPanel("headerpanel", "Welcome To Wicket"));
add(new FooterPanel("footerpanel", "Powered by Wicket and the NetBeans Wicket Plugin"));
}
private void loadCSS() {
add(CSSPackageResource.getHeaderContribution(BasePage.class,
"css/style.css"));
//...
}
private void loadJavascript() {
add(c.getHeaderContribution(BasePage.class,
"js/script.js"));
//...
}
}
Yukarıda taban sayfa (BasePage) sınıfı görülmektedir. Aynı herhangi bir Wicket bileşeni (Label, Panel, Form vb.) ekler gibi, CSSPackageResource.getHeaderContribution metodu yardımıyla, CSS dosyası (örnek olarak css klasörü altındaki style.css) sayfaya eklenebilir.
Aynı yöntem JavaScript için de geçerlidir. Bu sefer JavascriptPackageResource. getHeaderContribution metodu yardımıyla, JavaScript dosyası sayfaya eklenebilir.
Bu aşamadan sonra BasePage sınıfından türeyen tüm sayfa sınıfları CSS ve JavaScript eklentisinden etkileneceklerdir.
NOT: Wicket sayfası sınıfı BasePage sınıfından türetildiği zaman, HTML tarafında, CSS ve JavaScript desteğinin kalıtılması isteniyorsa etkilenecek (türeyen) kısımlar wicket:extend bloğu arasına yazılmalıdır. Örnek olarak:
Aynı yöntem JavaScript için de geçerlidir. Bu sefer JavascriptPackageResource. getHeaderContribution metodu yardımıyla, JavaScript dosyası sayfaya eklenebilir.
Bu aşamadan sonra BasePage sınıfından türeyen tüm sayfa sınıfları CSS ve JavaScript eklentisinden etkileneceklerdir.
NOT: Wicket sayfası sınıfı BasePage sınıfından türetildiği zaman, HTML tarafında, CSS ve JavaScript desteğinin kalıtılması isteniyorsa etkilenecek (türeyen) kısımlar wicket:extend bloğu arasına yazılmalıdır. Örnek olarak:
<!DOCTYPE html> <html xmlns:wicket="http://wicket.apache.org"> <head> <meta charset="UTF-8"> <wicket:head> <title>Inherited Page</title> </wicket:head> </head> <body> <wicket:extend> </wicket:extend> </body> </html>
Hiç yorum yok:
Yorum Gönder