Java Server faces to establish an interactive web site

server|web| Interaction | Site in creating interactive network applications, Java server Faces (built as JSF) has many advantages over similar technologies such as Java Server Pages or Apache struts. JSF clearly separates the application logic layer from the user interface presentation layer and enhances the maintenance of network applications, and JSF also provides a framework for developing and reusing network UI components.

Many Web application developers are moving to JSF, but they also find that predefined JSF user interface components are limited by DHTML functionality. Some advanced applications, such as monitoring or business process monitoring, require advanced visual components compatible with the JSF architecture.

It is easy to develop customized components for the network graphical user interface on top of the JSF architecture standards, which can be reused by application programmers. Also, Web Component developers can now provide more complex components, while ensuring that developers can easily enjoy the advantages and benefits of these components. These JSF user interface components must be neatly consolidated and deployed to the JSF runtime architecture and, in the application design process, better integrated into the integrated development environment (IDE) that provides JSF support

In addition to the basic user interface architecture that JSF brings, developers will encounter some drawbacks and obstacles when developing custom components for the first time. In this article, we will describe how to build a graphical JSF component that is very difficult to implement with pure HTML. The characteristic of a graphical JSF component is that it requires not only the generation of DHTML, but also the support of some additional graphics generation and client interaction. We will use an example of a chart component to demonstrate that this Chart component is used to provide graphs and various client browsing and interaction functions. Finally, you will show how to consolidate the chart components into an integrated development environment that supports JSF. Once you understand the design process for this chart component, developers will have a better understanding of how to implement the graphical JSF components, hopefully to help them develop custom JSF graphical components.

What is Java Server Faces?

JSF is a standard server-side architecture for simplifying the construction of the presentation layer of the network application software. Developers can assemble these reusable user interface components to create Web pages, bind these components to the application's data source, and take advantage of server-side event handlers to handle client events. Based on the JSF specification, components made by component developers can be easily consolidated into the JSF runtime architecture, and can be integrated into the JSF-compliant integrated development environment in the application software design process. The JSR 127 specification defines such a JSF architecture and provides a reference implementation for basic user interface components such as input fields and buttons. Most of the JSF components conform to the specification of HTML components and labels in the HTML 2.0 standard. These relatively simple components are sufficient for many Web applications.

However, many applications, such as monitoring or monitoring systems, require more sophisticated data representation and interaction, such as charts, diagrams, and mappings. Because of the limited ability to generate complex graphics directly in HTML, it is not intuitive to design these advanced components. One solution is to have the server-side component transfer the picture to the client, however, which can cause its own problems because the most basic HTML image interactivity is very limited. So, finally, we must use JavaScript to realize the user's data browsing and interactive functions.

Create a simple JSF component

This article describes this section to describe a very simple development step for JSF components that are capable of importing CSS into an HTML Web page. The description and code of this simple component will serve as the basis for the next section to continue to lay the groundwork for the advanced JSF charting component.

Figure 1 shows how to use the component and its results

Figure 1

The advantage of using this component is that you can change the appearance of the entire page by simply changing the component's settings with the JSF action.

A JSF component consists of Java classes and configuration files, and in order to create a custom JSF component, developers need:

1. Write a Java class that extends the JSF base component classes
2. Write a renderer for the default rendering tool
3. Write a Java class to describe the label, which will be used for JSP pages
4. Write a tag library definition file
5. Write a JSF configuration file

Step 1: Develop the Java class for the component

The component class is responsible for managing the properties that represent the state of the component, so we must select the appropriate base class for the component based on the behavior of the component, such as the input component or the output component.

The component described in List A extends the javax.faces.component.UIOutput to show the URL to a style sheet file, or the contents of an inline style sheet.

List A
Import javax.faces.component.*;
public class Csscomponent extends Uioutput {
Private Boolean link;
Public String getfamily () {
Return "faces. Cssfamily ";
}
public Boolean Islink () {
if (link!= null)
return Link.booleanvalue ();
valuebinding vb = getvaluebinding ("link");
if (VB!= null) {
Boolean BVB = (Boolean) vb.getvalue (Facescontext.
Getcurrentinstance ());
if (BVB!= null)
return Bvb.booleanvalue ();
}
return false;
}
public void Setlink (Boolean link) {
This.link = new Boolean (link);
}
Public Object SaveState (Facescontext context) {
Return to new object[] {super.savestate (context), link};
}
public void Restorestate (Facescontext context,
Object stateobj) {
Object[] state = (object[]) stateobj;
Super.restorestate (context, state[0]);
link = (Boolean) state[1];
}
}

The properties of the association in Code specify the type of value: either a URL or an inline style. The component must also be able to store and recover its state by using an object that has been processed by the JSF schema during a request to the server. The JSF schema automatically invokes the SaveState and Restorestate methods, and we can implement both methods in the component to achieve this goal.

[1] [2] Next page