JSF Marquee Component | Java Example | FlexiGrid using Servlet + JSON |

JSF Marquee Component.

leave a comment »

I was looking around at JavaRanch and somone posted question on JSF marquee component. I don’t think it comes along with jsf jar so I thought to write a component since its easy and maybe it help to a basic understanding of JSF custom component!!

P.S: I created this component around Feb 2007 and was using JSF 1.0 for the development.  Maybe some of the classes are deprecated if you are using the latest version but I guess this will work without any errors. If you experience any problems , feel free to comment at the bottom of the page and I will try my best to help you.

Requirements :

Basic Java Knowledge, Eclipse, Apache Tomcat

For developing a custom component in JSF all we need to have is

1. Component class.
2. Tag class.
3. Renederer ( optional ) . I am not using the Renderer for this component
4. Define a TLD file for the component tags.
5. Register the component in faces-config.


I am using Eclipse 3.3.1

eclipse version

On your Eclipse . go to File->New -> Other.. ->

on the next window give , project name as JSFMarquee, click next and select Java Server Faces 1.1 from the next window , select server

create package in your “src”  , right click src -> New -> package

give the package name as com.jsf.component.marquee

Now its time to create  the Component classes

Marquee.java

package com.jsf.component.marquee;

import java.io.IOException;

import javax.faces.component.UIComponentBase;
import javax.faces.context.FacesContext;
import javax.faces.context.ResponseWriter;

public class Marquee extends UIComponentBase {

private String value;

public String getValue() {
return value;
}

public void setValue(String value) {
this.value = value;
}

public String getFamily() {
// TODO Auto-generated method stub
return null;
}

public void encodeBegin(FacesContext context) throws IOException {
ResponseWriter writer = context.getResponseWriter();
writer.startElement(“marquee”, this);
writer.write(getValue());
writer.endElement(“marquee”);
}

}

MarqueeTag.java

package com.jsf.component.marquee;

import javax.faces.component.UIComponent;
import javax.faces.webapp.UIComponentTag;

public class MarqueeTag extends UIComponentTag {

private String marquee;

public String getMarquee() {
return marquee;
}

public void setMarquee(String marquee) {
this.marquee = marquee;
}

public String getComponentType() {
// TODO Auto-generated method stub
return “com.component.marqueecomp”;
}

public String getRendererType() {
// TODO Auto-generated method stub
return null;
}

protected void setProperties(UIComponent component) {
super.setProperties(component);
Marquee marqComp = (Marquee) component;
if (marquee != null) {
marqComp.setValue(marquee);
}
}

}

This is how my faces-config.xml looks like  ( JSFMarquee\WebContent\WEB-INF\faces-config.xml )

<?xml version=”1.0″ encoding=”UTF-8″?>

<!DOCTYPE faces-config PUBLIC
“-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN”
http://java.sun.com/dtd/web-facesconfig_1_1.dtd”&gt;

<faces-config>
<component>
<component-type>com.component.marqueecomp</component-type>
<component-class>com.jsf.component.marquee.Marquee</component-class>
<property>
<property-name>value</property-name>
<property-class>java.lang.String</property-class>
</property>
</component>

</faces-config>

remember , im using JSF 1.1 so my dtd file maybe different from yours if you are using latest version. Don’t worry about it if  its not same..

Create file marquee.tld and save it under JSFMarquee\WebContent\WEB-INF\

This is the content of tld file

<!DOCTYPE taglib
PUBLIC “-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.2//EN”
http://java.sun.com/j2ee/dtds/web-jsptaglibrary_1_2.dtd”&gt;

<taglib>
<tlib-version>1.0</tlib-version>
<jsp-version>1.2</jsp-version>
<short-name>marquee</short-name>

<uri>/jsf-marquee</uri>
<tag>
<name>marquee</name>
<tag-class>com.jsf.component.marquee.MarqueeTag</tag-class>
<body-content>empty</body-content>
<attribute>
<name>marquee</name>
<required>true</required>
<rtexprvalue>false</rtexprvalue>
</attribute>
</tag>
</taglib>


create a jsp file and save it under webcontent

MarqueeTest.jsp

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<%@taglib uri=”http://java.sun.com/jsf/html&#8221; prefix=”h”%>
<%@taglib uri=”http://java.sun.com/jsf/core&#8221; prefix=”f”%>
<%@taglib uri=”/jsf-marquee” prefix=”mycomp”%>

<html>
<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″ />
<title>Insert title here</title>
<f:view>
<mycomp:marquee marquee=”hello World”/>
</f:view>
</head>
<body>
</body>
</html>

Now its time to run the application and see how the component looks like

Download and install tomcat . Add tomcat as a server to your Eclipse. I hope you already have Tomcat installed.To add Tomcat to Eclipse,  go to Window -> Show View -> Servers

in the server tab, right click and add server. select tomcat 6.0 or which ever version you have installed.

now  right click on MarqueeTest.jsp and select “Run as” -> “Run on Server” and select tomcat from the servers listing.. I was getting “faces Servlet  not found error and to resolve it easily i created “lib” folder in WebContent/WEB-INF and copied jars in there.. here is my screenshot :=]  ( click on the pic to get an enlarged view )

For valuebinding example , click here

Advertisements

Written by speedrace703

November 27, 2009 at 3:11 am

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: