Layout Design

Layout Design

Length: 773 words (2.2 double-spaced pages)

Rating: Excellent

Open Document

Essay Preview

More ↓
Deciding Layouts

Deciding the layout is a very important step in Java GUI programming, just like solving an algorithm in normal programming. Layout decides how the components like labels, buttons, text fields etc are going to be displayed on a frame or window.

Some GUI can be designed using single panel with a single simple layout. Some GUI need to be broken down into smaller panels which have to be added to an outer panel. Each smaller panel can have its own layout.

The simplest layout is the flow layout. Flow layout produces output as a single row. So go for flow layout if you have only 3 or lesser components or if you want all the components in a single row.

Next is grid layout. As long as you can determine the rows and columns, you can use this layout. It is possible to use grid layout for most of the applications which you want to develop with a single panel. You can always use filler labels to occupy the empty spaces. So grid layout works fine in such cases.

But if you want to have a very neat GUI with very good layout, you need to go for more than 1 panel. In that case, grid, flow, and border are all used together.

The development of a GUI depends on the type of problem. There are 2 types of GUI problems:
1.     Problems which just specify that you need to do certain things. In this case, the layout of GUI is totally in your hands.
2.     Problems where you are given a rough drawing on how GUI needs to look.

Type 1:

In case 1, you need to start with a paper and pencil.
-     Read the problem and identify what needs to be displayed to the user
-     Depending on that, draw a simple diagram on how you want your GUI to look
-     Then start deciding on the layout

For example, consider the problem below:

Write a GUI java program that takes 2 numbers from the user, adds them, and displays the sum.


1.     For this, you need 2 text fields to read 2 inputs. 2 labels to tell what to enter in the text fields.
2.     1 button to initiate calculation.
3.     1 text field to display result, and 1 label to address the text field.
4.     The rough diagram will be

5.     For the above diagram, if you are going to use a single panel, then grid layout is the best choice. To decide the layout, dissect the diagram as shown below.

How to Cite this Page

MLA Citation:
"Layout Design." 31 Mar 2020

Need Writing Help?

Get feedback on grammar, clarity, concision and logic instantly.

Check your paper »

Layout Design Essay

- Deciding Layouts Deciding the layout is a very important step in Java GUI programming, just like solving an algorithm in normal programming. Layout decides how the components like labels, buttons, text fields etc are going to be displayed on a frame or window. Some GUI can be designed using single panel with a single simple layout. Some GUI need to be broken down into smaller panels which have to be added to an outer panel. Each smaller panel can have its own layout. The simplest layout is the flow layout....   [tags: essays research papers]

Free Essays
773 words (2.2 pages)

The Typography to Go with Your Responsive Website Design Essay

- Summary: Responsive Website design has been a rage in 2013. The introduction to responsive website design has given way to a separate type of typography, which is only compatible with the responsive website design. This article would be dealing with the responsive typography. When the topic of website comes into consideration, typography plays a very big role. Even some of the stalwarts in website designing consider that typography plays the biggest responsibility, when website design comes into the picture....   [tags: website, design, layout, settings, factors]

Research Papers
643 words (1.8 pages)

Essay about The Servicescape of McDonald´s in China

- The servicescape of McDonald's in china Introduction The servicecapes of McDonald’s in china w ill be analyzed in this study critically. Although McDonald’s takes the local condition in planning the service environment, there are still some problems existing in its servicecape design, such as the use of music, the insufficiency of the spatial layout design and the decoration inside. However, for the sake of better satisfying the customers, the improvement of servicecape design become an important task of McDonald’s to maintain its development in China....   [tags: spatial layout design, decoration, environment]

Research Papers
2129 words (6.1 pages)

A Study On A Restaurant Manager Should Consider Like The Design And Layout Of The Kitchen And Menu

- This report is a detailed study which looks at different aspects that need to be kept in mind while operating a restaurant successfully. For a business in which success isn’t guaranteed, the only accomplishments attained are due to a well-trained, dedicated staff who possess the knowledge, skills and attributes enabling them to work to the best of their abilities. Through extensive research using sources like text-books and journals, the points that a restaurant manager should consider like the design and layout of the kitchen and menu, choosing a supplier and commodity identification, are highlighted....   [tags: Food, Cost]

Research Papers
2429 words (6.9 pages)

The Analysis : Wireframe Rational. Layout Elements I Made Within The Wireframe

- Wireframe Rational Layout The choices with the layout elements I made within the wireframe are simple but effective for swift navigation throughout prevent any delays along with captivating the user as the website will have an interesting colour scheme relating to binding with the purpose of compelling the user to interact. It is noticeable the sidebar is missing, this is ideal to free up space as there was only a miniature amount of information that could be placed in the sidebar area with the possibility of moving onto another page to prioritise business information, give a crisp display and a modern perspective....   [tags: World Wide Web, Web page, Website, Web design]

Research Papers
750 words (2.1 pages)

Graphic Design Of A Graphic Designer Essay

- The big bright light people see all over New York City with amazing designs in them showing magnificent colors and pattern that just leaves one to wonder how do they make these amazing works of art all around the world. The answer is graphic design, they make some of the most amazing pictures and designs you can only see once in your life. They know how to bring people in and get their attention just with colors and the way they blend into one extravagant piece of art. These pieces of brilliant art take time to make just to bring people close enough to know what it is trying to say....   [tags: Graphic design, Design, Communication design]

Research Papers
1264 words (3.6 pages)

Features Of Web Design Layouts Essay

- According to Eccher (2015, p. 169), before a designer begins to build a website, he/she must understand the infrastructure of a web page. As affirmed, a good website is aesthetically pleasing, is usable, and is functional. Web designers seek to have a mortised website. Having a good layout where content is easy to find and to follow achieves the usability aspect of web design. To achieve functionality and aesthetics, one needs good content layout. There exist two types of website design layouts: fixed layout and fluid layout....   [tags: Web browser, World Wide Web, Web page, Web design]

Research Papers
889 words (2.5 pages)

Learning Space Design Brief Essay

- Rationale: This design brief is intended to take into account the results of Heath’s VAST heuristic (relating to activities) (1989, in Elliott-Burns, 2003) and a selection of Lackney’s Design Principles (n.d.). Hennah’s (2007) concepts of traffic flow and layout will be incorporated. The design will also consider the requirements of integrating a guided inquiry pedagogy. The users of the space will also be given the opportunity to take part in the process. Heath’s VAST heuristic offers a “rich alternative” (p7, 1989, as cited in Elliott-Burns, 2005) to a checklist approach to designing and can be used to evaluate a learning space and lead to the design of a new one....   [tags: Design Brief]

Research Papers
2158 words (6.2 pages)


- COMPOSITION AND THE PRINCIPLES OF DESIGN You will apply principles of design and visual organisation to your designs using a combination of balance, scale, unity and proportion, rhythm, symmetry and positive and negative space. By utilising the elements of line, tone, texture, shape, and emphasis, you will achieve visual harmony in your composition and layout. As you develop a working knowledge of the properties of colour, you will apply appropriate colour schemes that reflect the emotions of various consumer markets....   [tags: Design and Technology]

Research Papers
1038 words (3 pages)

Garden Design for the Blind Essay

- Garden Design for the Blind It is a commonly known fact that the removal of one sense sharpens and enhances the perception of the others. We as humans are very centered on sight, and we tend to give less weight to our other senses when it comes to perceiving the world around us. For the most part, our environment tends to consist of designs made for us to experience visually. We do recognize sound as important, but when we are not actively listening to music or speech, sound tends to fade into the background....   [tags: Architecture Design Essays]

Free Essays
873 words (2.5 pages)

Related Searches

As long as you can divide it into rows and columns, you can use grid layout. Otherwise, you need to go for more than 1 panel.

Since I am able to dissect the above diagram into 3 rows and 3 columns, I can use grid layout. In places where there are no components, I can use invisible filler labels.

Type 2:

-     In this case, the developer need not draw a diagram because it is already provided.
-     Print the diagram, take a pencil, and dissect the diagram.
-     Decide the layout.

For example, consider the problem below:

Develop the following GUI:

The GUI must allow the user to enter her name and when she clicks the display button, it must display a welcome message in the text area below.


1.     Dissect the diagram.

2.     Analyze the dissection. The above dissection yields a picture like:

3.     Comparing the dissection and border layout, we find that
-     There is no component in the north.
-     Name label is in the west.
-     Name text field is in the center.
-     Display button is in the east.
-     Text area is in the south.

4. So border layout is best for the problem.

Some day to day applications and guessing of their GUI layouts

Example 1:

Consider the following save window. For now, ignore the images in the GUI and only focus on the GUI components. Lets guess what layout would have been used.

Dissecting the window:

Analyzing the dissection:
1.     This can have 3 panels.
2.     The top panel just has save in label and the combo box.
3.     So the top panel can have flow layout.
4.     Considering that there are no images, the middle panel just has text area.
5.     So middle panel also can have flow layout.
6.     The bottom panel has 3 rows and 3 columns, so grid layout would be necessary.
7.     The outer panel which consists of top, middle, and bottom can be border layout or grid layout.
8.     If it is border layout, then top panel is added to north, middle to center, and bottom to south.
9.     If grid layout, it will have 3 rows and 1 column, first add top, then middle, and then bottom.
Return to