Jsf2 custom component programming series part 2

Source: Internet
Author: User

 

Part 2 noncomposite component with independent Renderer

<Verse>

Generally, a UI component contains two parts: behavior and Renderer. It is best to implement the two parts separately. The uicomponent class is used to implement behavior, such as event processing and attribute binding through El. Specifically implement an Renderer class to take charge of encoding and decoding. Encoding refers to the generation of Markup languages that can be displayed on the client, such as HTML. decoding is used to convert requests sent from the client (usually in a markup language style) to Java variables.

Before proceeding to the next more comprehensive UI component programming, let's look at some basic concepts. In the previous example, htmlhelloworld inherits the uicomponentbase class and needs to implement the getfamily method. The string returned by this method is used to indicate the type of UI component. For example, uiinput belongs to javax. faces. and uicommand belongs to javax. faces. command. in the faces-config.xml, We will pair uicomponent with Renderer, such as the configuration in primefaces:

<Render-kit>

<Renderer>

<Component-family> javax. Faces. Output </component-family>

<Renderer-type> javax. Faces. Head </Renderer-type>

<Renderer-class> org. primefaces. renderkit. headrenderer </Renderer-class>

</Renderer>

</Render-kit>

 

With this pairing relationship, we can easily specify which type of uicomponent to use and which Renderer. As a custom UI component, we can use any string to mark the family of its uicomponent class, if there is no Renderer (that means no need to configure render-kit in the faces-config.xml ), you can simply return NULL. The first part of the example is to do this.

Now we are developing a helloworld2 tag, which is the same as the previous function, but an Renderer is used for rendering. The first is the code of uicomponent htmlhelloworld2.java:

Package com. freebird. component;

 

Import javax. Faces. component. uicomponentbase;

Import javax. Faces. Context. responsewriter;

Import java. Io. ioexception;

Import javax. Faces. Context. facescontext;

Import java. util. date;

 

Public class htmlhelloworld2 extends uicomponentbase {

 

@ Override

Public String getfamily (){

Return "helloworld2 ";

}

 

}

 

Note that getfamily returns the "helloworld2" string, which will be used later. Then implement the Renderer class htmlhelloworld2renderer. Java:

Package com. freebird. Renderer;

 

Import javax. Faces. Render. Renderer;

Import javax. Faces. Context. responsewriter;

Import java. Io. ioexception;

Import javax. Faces. component. uicomponent;

Import javax. Faces. Context. facescontext;

Import java. util. date;

 

/**

* Describe class htmlhelloworld2renderer here.

*

*

* Created: Tue Dec 28 10:46:08 2010

*

* @ Author <a href = "mailto: chenshu @ csdesktop"> chenshu </a>

* @ Version 1.0

*/

Public class htmlhelloworld2renderer extends Renderer {

 

@ Override

Public void encodebegin (facescontext context, uicomponent) throws ioexception {

 

}

 

@ Override

Public void encodechildren (facescontext context, uicomponent) throws ioexception {

 

}

 

@ Override

Public void encodeend (facescontext context, uicomponent) throws ioexception {

// String clientid = component. getclientid (context );

// Char Sep = uinamingcontainer. getseparatorchar (context );

Responsewriter writer = context. getresponsewriter ();

Writer. startelement ("Div", component );

Writer. writeattribute ("style", "color: Red", null );

Writer. writetext ("helloworld! Today is: "+ new java. util. Date (), null );

Writer. endelement ("Div ");

}

}

 

Now add the configuration information to the helloworld. taglib. xml file:

<Tag>

<Tag-Name> helloworld2 </Tag-Name>

<Component>

<Component-type> htmlhelloworld2 </component-type>

<Renderer-type> htmlhelloworld2renderer </Renderer-type>

</Component>

</Tag>

Finally add configuration information to the faces-config.xml file:

<Component>

<Component-type> htmlhelloworld2 </component-type>

<Component-class> com. freebird. component. htmlhelloworld2 </component-class>

</Component>

<Render-kit>

<Renderer>

<Component-family> helloworld2 </component-family>

<Renderer-type> htmlhelloworld2renderer </Renderer-type>

<Renderer-class> com. freebird. Renderer. htmlhelloworld2renderer </Renderer-class>

</Renderer>

</Render-kit>

 

Compile and package it. You can use it.

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.