The Layout View
The tree at the lower left of the Application Builder is the Layout View. Here you visually place components together by dragging them on top of each other. The Layout View will show the entire structure of your screen module.
To save your Project before doing a Final Compile, click twice on the Main panel and choose Save Project Settings from the pop-up menu.
Clicking two times (not double-clicking) on a component in Layout View will bring up the command menu. Single clicking on a component that is already highlighted will also bring it up. The features of this pop-up are (1) Refresh (2) Remove Object (3) Remove Objects, if there are more than one on the selected component, (4) on Main the pop-up will also have Save Project Settings. Use the Refresh feature to force the whole screen to redraw.
The Save Project Settings feature cannot be used if you are in the process of building a data component in the Data Wizard. The components on the layout must each be finished before doing a Save Project Settings command.
Rearranging Components
To move a component from one area to another on the form, use the Layout View tree. Click and hold then drag the desired component to the new location. Generally, the screen will refresh automatically to show the results of the move. If necessary, Click twice on Main or on the component and choose Refresh from the pop-up.
The component you are moving must be dropped exactly on the icon of the receiving component.
![]()
The elements of more complicated components can also be rearranged, which is one of the strengths of JDesignerPro. For example, the Columns component creates numerous sub-components in order to layout the fields nicely and within the structure of the Layout Managers. But you can move the fields to any location on the screen. Below is an example of how to manipulate the Columns to rearrange them.
Let's say we want to move the State and ZIP fields on our form so they are on the same line as City.
1. We drag stateLabel and drop it onto the cityLine.
![]()
2. We drag stateLine and drop it onto the cityLine.