Java Teknolojileri ve Programcıları Derneği | İstanbul JUG

Blogdaki ilk yazimdan herkese Merhaba...

Makalemizde Jsf 2.0 ile custom component`lerin nasil olusturuldugu orneklerle beraber uygulamali olarak paylasmaya calisacam. Jsf `in 2.0`dan onceki surumlerinde de custom component olusturabiliyorduk ancak JSF2 ve facelets ile birlikte bu konu cok daha rahat bi sekilde hazirlanabiliyor. Bi sonraki yazimda, jsf2 ile gelen ozelliklerinden ve jsf2 ile eski surumlerin karsilastirilmasindan bahsedecem.

Simdi konumuza donersek, custom componentleri hangi durumlarda olusturuz, neden bole biseye ihtiyac duyariz derseniz, jsf`nin kendi componentlerinin yeterli olmadigi durumlarda, uygulamalarimiz icin kendi componentlerimizi olustururuz mesala bi ornek vermek gerekirse, h:datatable componentinde h:selectOneRadio componenti kullandigimizda cogumuz karsilasmisizdir, birden fazla satir secilebiliyor, ama radio butonlarin ozellikleri grub halinde calismalari ve o grub icinde yanliz birtane secilebilir olmalaridir. Ancak jsf componentinde birden fazla satir secebiliyoruz ve buda bizim hic istemedigimiz bir sonuc ortaya koyuyor, iste tam burada custom componentler yardimimiza kosuyor, ve biz kendi radio buton componentimizi istedigimiz sekilde olusturabiliyoruz. Bu sorunu 3.parti framevorklar kullanarak cozebiliyoruz ancak, onlarda sayfaya fazla bisekilde javascript-ajax atiyorlar. Bizim kendi olusturdugumuzu componentde ise hic bisekilde javascritpte yada ajax`a ihtiyacimiz olmayacak, Konuyu uzatmadan isterseniz hemen, nasil kendi componentlerimizi olusturabiliriz onan bakalim.

Ben uygulamarimda,

 NetBeans 6.8 - glassfishv3 - j2ee 6 - jsf 2.0 ve facelets kullandim.

Simdi componentimizi olusturmaya baslayalim.

Bize gerekli olan classlar, SingleRowSelect, SingleRowSelectRenderer, RadioGroup, RadioGroupRenderer,

Simdi bu classlar ne isimize yarayacak,

SingleRowSelect classi bizim componentimizin propertylerinin olacagi class, bi nevi hangi attributelerinin olacagini burada gosteriyoruz, biz burada butun attributeleri tek tek olusturmakdansa var olanin uzerine bize gereken attributeleri ekleyelim, bunun icinde yanliz groupId attributemiz olsa bizim icin yeterli olacak. Classin icersi asagidaki gibi..

package net.aslan.faces.radiobutton;

import javax.faces.component.FacesComponent;

@FacesComponent(value = SingleRowSelect.COMPONENT_TYPE)
public class SingleRowSelect extends javax.faces.component.UIInput {

    public static final String COMPONENT_FAMILY = "net.aslan.faces.component";
    public static final String COMPONENT_TYPE = "net.aslan.faces.component.radiobutton.SingleRowSelect";
    public static final String RENDERER_TYPE = "net.aslan.faces.component.radiobutton.SingleRowSelectRenderer";

    public SingleRowSelect() {
        super();
        setRendererType(RENDERER_TYPE);
    }

    @Override
    public String getFamily() {
        return COMPONENT_FAMILY;
    }

    public void setGroupId(String groupId) {
        getStateHelper().put("groupId", groupId);
    }

    public String getGroupId() {
        return (String) getStateHelper().get("groupId");
    }
}

Yukarida dikkat edecek olursak, classimizi UInput`dan extends ettik, cunku ayni seyleri tekrardan yazmakdansa bize gerekli olani var olani kullanarak onun uzerine eklemek daha rahat ve kolay olacaktir. UInput classinin icerisini incelemek bize cok fayada saglayacaktir.

Simdi yukaridaki classdaki kodlarin neler yaptigindan biraz bahsedecek olursak,

@FacesComponent, bu ozellikle jsf2 ile birlikte gelen annotationlar ile classin neyapacaginin neturden bi class olduguna karar veriyoruz,

ve classimizi component olarak gosteriyoruz, value` degeri ise componentin bir butun olarak calisacagindan Component_Family belirtiyoruz,

 public static final String COMPONENT_FAMILY = "net.aslan.faces.component";
public static final String COMPONENT_TYPE = "net.aslan.faces.component.radiobutton.SingleRowSelect";

kodlarimiz UInput classinin icindede var oldugunda biz bu propertyleri ovveride ediyoruz ve kendi component type`mizi ve family`ini gosteriyoruz, biz ovveride etmeseydik kendisi tanyacakti ama biz ona izin vermiyoruz (UIInput classinin icini incelemenizi tavsiye ederim.)

 public SingleRowSelect() {
        super();
        setRendererType(RENDERER_TYPE);
    }

burada ise yapilandiricimizda renderer olacagi classimi set ediyoruz, eger biz set etmesek kendi renderer classini kullanacaktir.

ve son olarak

  public void setGroupId(String groupId) {
        getStateHelper().put("groupId", groupId);
    }

    public String getGroupId() {
        return (String) getStateHelper().get("groupId");
    }

bizim icin gerekli olan attribute`i olusturuyoruz ve stateHelper ekliyoruz, stateHelper Map seklinde calisiyor, setGroupId`de map`a ekliyoruz ve istegimiz zaman getGroupId`de oldugu gibi cagirabiliyoru, StateHelper`i ilerki makalelerde UIInput incelerken gorecegiz.

Bundan sonra bizim icin gerekli olan ve en onemli kisimlardan birisi renderer clasimizi olusturmak. Yani componentimizin nasil davranacagini bu class yardimiyla belirtecegiz..

import java.io.IOException;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.context.ResponseWriter;
import javax.faces.render.FacesRenderer;

@FacesRenderer(componentFamily = SingleRowSelect.COMPONENT_FAMILY, rendererType = SingleRowSelect.RENDERER_TYPE)
public class SingleRowSelectRenderer extends javax.faces.render.Renderer {

    @Override
    public void encodeEnd(FacesContext context, UIComponent component) throws IOException {
        SingleRowSelect radio = (SingleRowSelect) component;
        String clientId = component.getClientId();
        String groupId = radio.getGroupId();
        Object selectedItems = null;
        RadioButtonGroup group = null;

        if (groupId != null) {
            group = (RadioButtonGroup) findComponent(radio, groupId);
            if (group != null) {
                selectedItems = group.getValue();
            } else {
            }
        }

        ResponseWriter writer = context.getResponseWriter();
        writer.startElement("input", component);
        writer.writeAttribute("type", "radio", null);
        writer.writeAttribute("id", clientId, null);

        if (group != null) {
            writer.writeAttribute("name", group.getClientId(), null);
        } else {
            writer.writeAttribute("name", clientId, null);
        }
        writer.writeAttribute("value", radio.getValue(), "value");

        if (selectedItems != null) {
            System.out.println("type is:" + radio.getValue().getClass().getName() + " / value:" + radio.getValue());
        }
        writer.endElement("input");
    }

    private UIComponent findComponent(UIComponent comp, String componentId) {
        UIComponent parent = comp;
        UIComponent found = null;
        int i = 1;
        while (parent != null) {
            found = parent.findComponent(componentId);
            if (found != null) {
                return found;
            }
            parent = parent.getParent();
        }
        return null;
    }
}