Tutorial Step 10 Step 12

Creating a UI with nested layouts

Step 11: Changing to BorderLayout

Now for the middle section of the UI. What you want to end up with is something that looks pretty much the same as it does right now in XYLayout or null layout. To accomplish this, start with panel 12 which contains the URL label and the text field.
  1. Change panel 12 to BorderLayout.
    Because of the way you drew the two components in this panel, BorderLayout should assign the label to the West, and the text field to the Center of the BorderLayout panel. If they were assigned different constraint values, change them now.

  2. Next, select panel 3 and set it also to BorderLayout.
    Again, since you drew panel 12 the width of panel 3, and filled the rest of the panel with the text area, BorderLayout should assign the correct layout constraints: panel 12 is North, and the text area is Center.

Your UI won't change much visibly by doing this. Go on to the next step.

Tutorial Step 10 Step 12