Basic Design

Any gaming application needs a Graphical User Interface along with the logic to work out well with the user. As you already know, we are using JSWING for GUI. In the last blog we discussed about the components. Let’s see how to use them to design our project.

We have designed two frames for the actual game and one frame for user setting.(We will discuss more about it in the up coming blogs.) Two gaming frames have same design, but different logic and the user setting has different design.

Design of Gaming Frame:

The following can be observed in the inspector window,

·          We have used Border layout for the frame. This divides the frame into 5 sections- east, west, south, north, center.

·         Amongst these 5 sections, East block contains button with name ‘Refresh’.  It clears the previous game and starts new game.

·         West block contains button with name ‘User Mode’. By clicking on this button, you can go to the user setting.

·         North Block contains a text field. It shows the result of the game.

·         Center block contains a Panel. It contains the play buttons.

·          We haven’t used the South block.

·         We have used Grid layout For the Panel. This layout enables us to put the components in desired columns and rows format.

·         In our project, we have used 3X3 grid to store the 9 buttons to play ‘X’ and ‘O’s.

Design for User Setting:

·         In this frame , we haven’t used any layout for the frame itself.

·         First, we have added a Panel in the frame and the Panel has Border layout.

·         In the panel, we have only used East, West and the Center block.

·         Center block contains label- ‘User Mode’.

·         East block contains a button with name ‘One user’. By clicking on it you can start the game in one user mode.

·         West block contains a button with name ‘Two user’. By clicking on it you can start the game in one user mode.

In this blog, we have only discussed about the basic design. The logic behind the code will be explained in the next blog. Until then HAPPY CODING!