Creating visual custom tags (VCTs)

A visual custom tag (VCT) is a special kind of JSP custom tag. Visual custom tags let you see an object in the design view of Page Designer in the same way that it would look in a browser.

In the following tasks, you will write and develop a visualizer and include a VCT tag. For additional information on each of these tasks, refer to the list of related tasks at the end of this topic.

  1. Create a plug-in project.

  2. Update the plugin.xml file for a VCT.

  3. Add a VCT to a JSP page.

The example that you will follow in these tasks involves having the current date and time displayed both on the JSP design page in Page Designer as well as on the server. To do this, you will be adding a VCT visualizer to a JSP custom tag. The JSP custom tag will display the current date and time when run on a server. By adding the visualizer to the JSP custom tag, you can also see the current date and time in the Page Designer design view. To implement any visualizer, you extend the CustomTagVisualizer class. The visualizer must also implement and overwrite a doStart() or a doEnd() method. In this case, you are implementing doStart(). Here is an example of the code:

import java.util.*;
import com.ibm.etools.webedit.vct.*;

public class DateTimeTagVisualizer extends CustomTagVisualizer {
	public VisualizerReturnCode doStart(Context context) {
		Date now = new Date();
		context.putVisual(now.toString());
		return VisualizerReturnCode.OK;
	}
}
In this example, the current date and time is stored into context using putVisual(). Then a return code of VisualizerReturnCode. OK is returned to signify that the visual can be used by Page Designer for rendering.

 

Related concepts

Custom tag libraries

Visual custom tags (VCTs)

 

Related tasks

Creating a visualizer plug-in

Updating the plugin.xml file for a VCT

Creating a visualization for a custom component tag