Step 1

The first step is to build the basic framework for the user interface. In the discussion that follows, we will build the interface as a separate window, rather than as a panel contained within the applet window.

To simplify the code, we will move the code for building the window out of the init method and into its own buildWindow method. Second, we have added code to allow the user to close the window by clicking on the button in the upper right corner of the window. Doing this requires (or, rather, is simplified by) adding a MyFrame class and creating an instance of it as the outer frame for the "application."

import java.applet.Applet;
import java.awt.*;
import java.awt.event.*;

public class step1 extends Applet {

// provides separate window for ui components

MyFrame outerBox;

Panel topPanel;
Panel centerPanel;
Panel bottomPanel;

  public void init ( ){
    buildWindow ();
  } // end init

  //****************** buildWindow

  private void buildWindow ( )  {

    outerBox = new MyFrame ( );

    topPanel = new Panel ( );
    centerPanel = new Panel ( );
    bottomPanel = new Panel ( );

    topPanel.setBackground (Color.red);
    centerPanel.setBackground (Color.white);
    bottomPanel.setBackground (Color.blue);

    outerBox. setLayout (new BorderLayout ( ) );
    outerBox.add ("North", topPanel);
    outerBox.add ("Center", centerPanel);
    outerBox.add ("South", bottomPanel);
    outerBox.resize (600, 500);
    outerBox. setBackground (Color.white);

    outerBox.addWindowListener ( outerBox );

    outerBox.show( );

  }  // end buildWindow ()

}// end step1

public class MyFrame extends Frame implements WindowListener {

  //***********  Interface Methods   ***********

  //****  WindowListener methods

  public void windowActivated ( WindowEvent e )  {
  }

  public void windowDeactivated ( WindowEvent e )  {
  }

  public void windowOpened ( WindowEvent e )  {
  }

   public void windowClosed ( WindowEvent e )  {
  }

  public void windowClosing ( WindowEvent e )  {
    this.hide ();
    this.dispose ();
  }

  public void windowIconified ( WindowEvent e )  {
  }

  public void windowDeiconified ( WindowEvent e )  {
  }

}  // end MyFrame

Run the applet