When you complete the steps for creating a JSF page and adding Trinidad components, the visual editor looks similar to this:
Note: From the
dropdown menu on the visual editor toolbar, choose
to redraw the page, if necessary.
The visual editor shows a rectangle representing the Form component; as you add components to the page you will drop them inside this rectangle, or inside components within the rectangle.
The Structure window shows the hierarchy of components on the page:
A component selected in the Structure window is highlighted in the visual editor. For example, selecting
tr:panelGroupLayout in the Structure window highlights the Panel Group Layout component in the visual editor.
While using the visual editor to design a user interface is convenient and easy, using the Structure window to insert, move, or delete components provides precise control.