LAB ACTIVITY 2B

Learning Outcomes

By the end of this lab, students should be able to :

• Write a Java program using Frame class from Swing package.

• Write a Java Program using GUI objects from Swing package.

Hardware/ Software : Personal Computer, Java Development Kit version X.x.x., NetBeans IDE 12.0

LAB ACTIVITY 2B

Question:

Follow the instructions below to build an interface as depicted in the image below. You are required to use Java Swing components to construct this interface and utilize an appropriate layout.

Step 1: Create a Java Project/Class

1. Open Your IDE: Start your Integrated Development Environment (IDE) like Eclipse, NetBeans, or IntelliJ IDEA.

2. Create a New Project:

   • In your IDE, select File > New > Project.

   • Choose Java Project and click Next.

   • Name your project ("LabActivity_2") and click Finish.

3. Create a New Class:

   • Right-click on the src folder in your project and select New > Class.

   • Name your class ( "LabActivity_2B") and check the box to include the main method.

   • Click Finish.

Step 2: Set Up the JFrame

1. Import Packages: At the top of your class, import both AWT and Swing packages to access necessary GUI components.

2. Define the Constructor: Define the constructor for your class LabActivity2B, where you configure the JFrame.

3. Main Method: The main method creates an instance of LabActivity2B, which activates the constructor and initializes the graphical user interface

Step 3: Setting the Properties of the Frame

Set the properties as coding below:

Step 4: Declare all the objects

Step 5: Set the Project Title in the Label

Step 6: Develop the Inner Classes for Information and Buttons

In this scenario, we aim to divide the components into two distinct panels to organize the user interface effectively. The Info panel will hold all the fields related to student information, and the ButtonsPanel will contain the operational buttons like Add, Clear, Display, etc. This structured separation enhances both the aesthetics and functionality of the application.

Step 7: Call Inner Class

Step 7: Populate the Inner Classes Info() with the Components

Once the structure of the inner classes is established, the next step involves adding the necessary UI components to each panel to build the functional sections of the interface.

Step 8: Arrange all the components using GridBagLayout

The Info class is an inner class that extends JPanel. This panel is designed to hold components related to collecting user input about student information. It uses GridBagLayout, which provides a flexible grid of cells where components can be placed, and each component may occupy one or more cells.

GridBagLayout: This layout manager is particularly useful for creating complex user interfaces where you need precise control over component sizes and positioning. It uses GridBagConstraints to specify constraints for components.

• Constraints (GridBagConstraints): This object specifies where and how components should be added to the layout. Key properties include:

  • gridx and gridy set the cell at column x and row y where the component starts.

  • fill: When set to GridBagConstraints.HORIZONTAL, the component expands horizontally.

  • insets: Defines the padding around the component.

• • Arrange the components for grid

The GridBagLayout in Java Swing provides a very flexible layout manager by allowing components to be positioned in a grid of cells, where each component can specify constraints that determine how they are displayed within the grid. The positioning within this grid is primarily controlled by two important constraints: gridx and gridy. 

gridx and gridy are properties of the GridBagConstraints class, which dictate the position of a component within the grid:

• gridx specifies the column position within the grid. It indicates the row-relative position where the left side of the component should be placed. The leftmost column has a gridx value of 0, and it increases by 1 as you move to the right. Setting gridx to GridBagConstraints.RELATIVE positions the component just to the right of the previous component.

• gridy specifies the row position in the grid. It indicates the column-relative position where the top of the component should be placed. The topmost row has a gridy value of 0, and it increases by 1 as you move down. Setting gridy to GridBagConstraints.RELATIVE positions the component just below the component that was added before it.

Step 10: Populate the Inner Classes Info() with the Components and Arrange all the components using FlowLayout

The ButtonsPanel class also extends JPanel but is focused on housing the control buttons like Add, Clear, Display, etc.

FlowLayout: This layout manager is chosen for the ButtonsPanel because it simply lays out components in a single row, wrapping to the next line as space requires. It's ideal for button groups where alignment and order are crucial but precise positioning is not necessary.

Step 11 :Observe your output.