TweetFollow Us on Twitter

Java Layouts
Volume Number:12
Issue Number:10
Column Tag:Getting Started

Java Layouts and Panels

By Dave Mark

Note: Source code files accompanying article are located on MacTech CD-ROM or source code disks.

Last month, we explored Peter Lewis’ CWBlink rewrite, which introduced a host of new Java concepts. This month, we’ll start exploring those concepts, starting off with Java Layouts and Panels.

Layouts

In our first few applets, when we wanted to add elements to our main applet frame, we simply added each element directly to the frame, trusting the default applet setup to place things in the applet window in a way that makes sense. This is fine if all you want to do is slap together an interface and you don’t particularly care how it looks.

Being Mac programmers, though, we are all used to a certain way of laying out an interface. You use ResEdit, or Resorcerer, or even a direct toolbox call, and specify the exact pixel location for each interface element. Unfortunately, the Windows and Unix worlds look very different from the Mac world. While all Macs feature square pixels, and a window looks the same no matter what Mac it’s displayed on, Windows and Unix boxes don’t share this consistency.

Since Java is a cross-platform language, Sun needed to come up with a way to represent the interface elements so they would look decent, no matter what machine they appeared on. The solution was a series of layout classes. You use the setLayout() call to attach a layout to a container. The elements in the container are added to the layout depending on the nature of each layout class. This series of example applets should make the value of layouts clear.

Example One: NoLayout.µ

Create a new Java applet project called noLayout.µ. Create a new source file named noLayout.java and add it to the project:

import java.awt.*;

public class noLayout extends java.applet.Applet
{
 public noLayout()
 {
 add( new Label( “Enter your name:” ) );
 add( new TextField( “<Your name here>”, 30 ) );
 add( new Button( “Eeny” ) );
 add( new Button( “Meeny” ) );
 add( new Button( “Miney-Moe” ) );
 }
}

Next, create a second source file called noLayout.html and add it to the project:

<title>No Layout</title>
<hr>
<applet 
 codebase=”noLayout ƒ” 
 code=”noLayout.class” 
 width=530 height=100>
</applet>
<hr>
<a href=”noLayout.java”>The source.</a>

Make the project; then drag the .html file onto the Applet runner (if you are using CodeWarrior, the applet runner is called Metrowerks Java). Figure 1 shows the noLayout applet as it first appears. Notice that all the elements appear in a single row, in the order in which they were added to the default container.

Figure 1. The noLayout applet before resizing

Figure 2 shows what happens when we shrink the window slightly. Notice that the interface elements have “wrapped” to fit comfortably in the new, resized window. Though it is not at all obvious, you are seeing the default layout at work. This default layout is called FlowLayout (see java.awt.FlowLayout.html). You don’t need to create a FlowLayout object for your containing frame. One is created for you. When you call add(), you are adding to a FlowLayout.

Figure 2. The noLayout applet after resizing

FlowLayout treats your elements like words in a word processor. FlowLayout features three constructors. FlowLayout() with no parameters centers all its elements. FlowLayout( int ) takes a single parameter, one of CENTER, LEFT, or RIGHT, which specifies how this FlowLayout should align its elements. Finally, FlowLayout( int align, int hgap, int vgap ) takes three parameters. The first is either CENTER, LEFT, or RIGHT, the second specifies the horizontal minimum gap between elements, and the third specifies the vertical minimum gap between elements.

For the moment, just remember that FlowLayout is the default layout.

Example Two: LayoutNoPanel.µ

Our second example creates a simple, though not particularly useful, layout. Create a new Java applet project called layoutNoPanel.µ. Create a new source file named layoutNoPanel.java and add it to the project:

import java.awt.*;

public class layoutNoPanel extends java.applet.Applet
{
 public layoutNoPanel()
 {
 setLayout( new BorderLayout() );
 
 add( “North”, new Label( “Enter your name:” ) );
 add( “Center”, 
 new TextField(“<Your name here>”, 30) );
 add( “South”, new Button( “Eeny” ) );
 add( “East”, new Button( “Meeny” ) );
 add( “West”, new Button( “Miney-Moe” ) );
 }
}

Next, create a second source file called layoutNoPanel.html and add it to the project:

<title>Layout, No Panel</title>
<hr>
<applet 
 codebase=”layoutNoPanel ƒ” 
 code=”layoutNoPanel.class” 
 width=530 height=100>
</applet>
<hr>
<a href=”layoutNoPanel.java”>The source.</a>

Make the project, then drag the .html file onto the Applet runner. Figure 3 shows the layoutNoPanel applet as it first appears. If you take a look at the source code, you’ll see that a new BorderLayout object is created and made the current layout using setLayout(). The BorderLayout lets you assign items to the top, bottom, left, right, and center using the add() parameters “North”, “South”, “West”, “East”, and “Center”. To learn more about the BorderLayout class and the various constructors you can use to build one, check out java.awt.BorderLayout.html.

Figure 3. The layoutNoPanel applet before resizing

Figure 4 shows what happens when we shrink the window slightly. Notice that the interface elements have all shrunk accordingly. As I said, this wasn’t particularly useful, but it shows an important concept - how to use a layout in your applet code.

Figure 4. The layoutNoPanel applet after resizing

Before proceeding to the last example, see if you can figure out a way to use the FlowLayout and BorderLayout to organize these components into a more useful form Here’s a hint. You’ll want to take advantage of Panels.

Example Three: LayoutWithPanel.µ

Our third example introduces the concept of Panels. Before you examine the code, take a look at java.awt.Panel.html. Think of a Panel as a visual grouping mechanism. The default layout for a Panel is the FlowLayout. We’re going to create a pair of Panels, one to hold the Label and TextField, and the other to hold the three buttons.

Create a new Java applet project called layoutWithPanel.µ. Create a new source file named layoutWithPanel.java and add it to the project:

import java.awt.*;

public class layoutWithPanel 
 extends java.applet.Applet
{
 public layoutWithPanel()
 {
 setLayout( new BorderLayout() );
 
 Panel  top = new Panel();
 Panel  bottom = new Panel();
 
 top.setLayout( new FlowLayout() );
 
 top.add( new Label( “Enter your name:” ) );
 top.add( new TextField( “<Your name here>”, 30 ) );
 
 bottom.setLayout( new FlowLayout() );
 
 bottom.add( new Button( “Eeny” ) );
 bottom.add( new Button( “Meeny” ) );
 bottom.add( new Button( “Miney-Moe” ) );
 
 add( “Center”, top );
 add( “South”, bottom );  
 }
}

Next, create a second source file called layoutWithPanel.html and add it to the project:

<title>Layout, No Panel</title>
<hr>
<applet 
 codebase=”layoutWithPanel ƒ” 
 code=”layoutWithPanel.class” 
 width=530 height=100>
</applet>
<hr>
<a href=”layoutWithPanel.java”>The source.</a>

Make the project, then drag the .html file onto the Applet runner. Figure 5 shows the layoutWithPanel applet as it first appears. Notice that the Label and TextField stick together, and the three buttons stick together.

The source code starts off by creating a BorderLayout. We then create two Panels and add one to the layout as “Center” (the Label and TextField) and one to the layout as “South” (the three buttons).

Figure 5. The layoutWithPanel applet before resizing

Figure 6 shows what happens when we shrink the window slightly. Notice that the TextField wraps to the next line without affecting the three buttons. This is the value of combining Panels with Layouts.

Figure 6. The layoutWithPanel applet after resizing

Till Next Month...

So far, you’ve seen two Layouts - the FlowLayout and the BorderLayout. In next month’s column, we’ll take a look at the remaining Layout classes: GridLayout, GridBagLayout, and CardLayout.

Before we go, I’d like to address a question I get asked all the time: What is the best Java book to buy? Tough question. There’s no simple answer, but I’ll take a shot at it.

I’ve read most of the major Java books. In general, there’s something to like and dislike about every one. Some books offer a really nice writing style, but suffer from buggy or inaccurate code. A good solution is to buy at least two Java books, so you can do a reality check when one book skimps on a topic or contains a bug that perhaps is properly presented in the other.

Though I usually avoid pushing my own books, I would be doing Barry Boone a disservice if I didn’t mention Learn Java on the Macintosh. Though my name tags along on the cover of the book, this is definitely Barry’s baby, and a good introduction to Java. It is also the only Java book that comes with CodeWarrior Lite for Java. I also like Teach Yourself Java In 21 Days by Lemay and Perkins, Java in a Nutshell by Flanagan, and Java Programming Language Handbook by Friedel and Potts.

You could probably get good results with any of these books. Once you get your brain around Java, you should check out The Java Series from Addison-Wesley and Sun. The Java Programming Language is from Ken Arnold and James Gosling. Ken Arnold is a well known C author and, of course, James Gosling created Java. To me, this is sort of like having Kernighan and Ritchie (or, to be more up-to-date, Harbison and Steele) on your C bookshelf.

That being said, there are so many Java books coming out all the time that you should really go down to the bookstore and flip through some of the newer titles and see if any of them strike your fancy. In the meantime, be sure to check out the various Java tutorials on the Web.

 

Community Search:
MacTech Search:

Software Updates via MacUpdate

Dropbox 193.4.5594 - Cloud backup and sy...
Dropbox is a file hosting service that provides cloud storage, file synchronization, personal cloud, and client software. It is a modern workspace that allows you to get to all of your files, manage... Read more
Google Chrome 122.0.6261.57 - Modern and...
Google Chrome is a Web browser by Google, created to be a modern platform for Web pages and applications. It utilizes very fast loading of Web pages and has a V8 engine, which is a custom built... Read more
Skype 8.113.0.210 - Voice-over-internet...
Skype is a telecommunications app that provides HD video calls, instant messaging, calling to any phone number or landline, and Skype for Business for productive cooperation on the projects. This... Read more
Tor Browser 13.0.10 - Anonymize Web brow...
Using Tor Browser you can protect yourself against tracking, surveillance, and censorship. Tor was originally designed, implemented, and deployed as a third-generation onion-routing project of the U.... Read more
Deeper 3.0.4 - Enable hidden features in...
Deeper is a personalization utility for macOS which allows you to enable and disable the hidden functions of the Finder, Dock, QuickTime, Safari, iTunes, login window, Spotlight, and many of Apple's... Read more
OnyX 4.5.5 - Maintenance and optimizatio...
OnyX is a multifunction utility that you can use to verify the startup disk and the structure of its system files, to run miscellaneous maintenance and cleaning tasks, to configure parameters in the... Read more
Hopper Disassembler 5.14.1 - Binary disa...
Hopper Disassembler is a binary disassembler, decompiler, and debugger for 32- and 64-bit executables. It will let you disassemble any binary you want, and provide you all the information about its... Read more

Latest Forum Discussions

See All

Zenless Zone Zero opens entries for its...
miHoYo, aka HoYoverse, has become such a big name in mobile gaming that it's hard to believe that arguably their flagship title, Genshin Impact, is only three and a half years old. Now, they continue the road to the next title in their world, with... | Read more »
Live, Playdate, Live! – The TouchArcade...
In this week’s episode of The TouchArcade Show we kick things off by talking about all the games I splurged on during the recent Playdate Catalog one-year anniversary sale, including the new Lucas Pope jam Mars After Midnight. We haven’t played any... | Read more »
TouchArcade Game of the Week: ‘Vroomies’
So here’s a thing: Vroomies from developer Alex Taber aka Unordered Games is the Game of the Week! Except… Vroomies came out an entire month ago. It wasn’t on my radar until this week, which is why I included it in our weekly new games round-up, but... | Read more »
SwitchArcade Round-Up: ‘MLB The Show 24’...
Hello gentle readers, and welcome to the SwitchArcade Round-Up for March 15th, 2024. We’re closing out the week with a bunch of new games, with Sony’s baseball franchise MLB The Show up to bat yet again. There are several other interesting games to... | Read more »
Steam Deck Weekly: WWE 2K24 and Summerho...
Welcome to this week’s edition of the Steam Deck Weekly. The busy season has begun with games we’ve been looking forward to playing including Dragon’s Dogma 2, Horizon Forbidden West Complete Edition, and also console exclusives like Rise of the... | Read more »
Steam Spring Sale 2024 – The 10 Best Ste...
The Steam Spring Sale 2024 began last night, and while it isn’t as big of a deal as say the Steam Winter Sale, you may as well take advantage of it to save money on some games you were planning to buy. I obviously recommend checking out your own... | Read more »
New ‘SaGa Emerald Beyond’ Gameplay Showc...
Last month, Square Enix posted a Let’s Play video featuring SaGa Localization Director Neil Broadley who showcased the worlds, companions, and more from the upcoming and highly-anticipated RPG SaGa Emerald Beyond. | Read more »
Choose Your Side in the Latest ‘Marvel S...
Last month, Marvel Snap (Free) held its very first “imbalance" event in honor of Valentine’s Day. For a limited time, certain well-known couples were given special boosts when conditions were right. It must have gone over well, because we’ve got a... | Read more »
Warframe welcomes the arrival of a new s...
As a Warframe player one of the best things about it launching on iOS, despite it being arguably the best way to play the game if you have a controller, is that I can now be paid to talk about it. To whit, we are gearing up to receive the first... | Read more »
Apple Arcade Weekly Round-Up: Updates an...
Following the new releases earlier in the month and April 2024’s games being revealed by Apple, this week has seen some notable game updates and events go live for Apple Arcade. What The Golf? has an April Fool’s Day celebration event going live “... | Read more »

Price Scanner via MacPrices.net

Apple Education is offering $100 discounts on...
If you’re a student, teacher, or staff member at any educational institution, you can use your .edu email address when ordering at Apple Education to take $100 off the price of a new M3 MacBook Air.... Read more
Apple Watch Ultra 2 with Blood Oxygen feature...
Best Buy is offering Apple Watch Ultra 2 models for $50 off MSRP on their online store this week. Sale prices available for online orders only, in-store prices may vary. Order online, and choose... Read more
New promo at Sams Club: Apple HomePods for $2...
Sams Club has Apple HomePods on sale for $259 through March 31, 2024. Their price is $40 off Apple’s MSRP, and both Space Gray and White colors are available. Sale price is for online orders only, in... Read more
Get Apple’s 2nd generation Apple Pencil for $...
Apple’s Pencil (2nd generation) works with the 12″ iPad Pro (3rd, 4th, 5th, and 6th generation), 11″ iPad Pro (1st, 2nd, 3rd, and 4th generation), iPad Air (4th and 5th generation), and iPad mini (... Read more
10th generation Apple iPads on sale for $100...
Best Buy has Apple’s 10th-generation WiFi iPads back on sale for $100 off MSRP on their online store, starting at only $349. With the discount, Best Buy’s prices are the lowest currently available... Read more
iPad Airs on sale again starting at $449 on B...
Best Buy has 10.9″ M1 WiFi iPad Airs on record-low sale prices again for $150 off Apple’s MSRP, starting at $449. Sale prices for online orders only, in-store price may vary. Order online, and choose... Read more
Best Buy is blowing out clearance 13-inch M1...
Best Buy is blowing out clearance Apple 13″ M1 MacBook Airs this weekend for only $649.99, or $350 off Apple’s original MSRP. Sale prices for online orders only, in-store prices may vary. Order... Read more
Low price alert! You can now get a 13-inch M1...
Walmart has, for the first time, begun offering new Apple MacBooks for sale on their online store, albeit clearance previous-generation models. They now have the 13″ M1 MacBook Air (8GB RAM, 256GB... Read more
Best Apple MacBook deal this weekend: Get the...
Apple has 13″ M2 MacBook Airs available for only $849 today in their Certified Refurbished store. These are the cheapest M2-powered MacBooks for sale at Apple. Apple’s one-year warranty is included,... Read more
New 15-inch M3 MacBook Air (Midnight) on sale...
Amazon has the new 15″ M3 MacBook Air (8GB RAM/256GB SSD/Midnight) in stock and on sale today for $1249.99 including free shipping. Their price is $50 off MSRP, and it’s the lowest price currently... Read more

Jobs Board

Early Preschool Teacher - Glenda Drive/ *Appl...
Early Preschool Teacher - Glenda Drive/ Apple ValleyTeacher Share by Email Share on LinkedIn Share on Twitter Read more
Senior Software Engineer - *Apple* Fundamen...
…center of Microsoft's efforts to empower our users to do more. The Apple Fundamentals team focused on defining and improving the end-to-end developer experience in Read more
Relationship Banker *Apple* Valley Main - W...
…Alcohol Policy to learn more. **Company:** WELLS FARGO BANK **Req Number:** R-350696 **Updated:** Mon Mar 11 00:00:00 UTC 2024 **Location:** APPLE VALLEY,California Read more
Medical Assistant - Surgical Oncology- *Apple...
Medical Assistant - Surgical Oncology- Apple Hill WellSpan Medical Group, York, PA | Nursing | Nursing Support | FTE: 1 | Regular | Tracking Code: 200555 Apply Now Read more
Early Preschool Teacher - Glenda Drive/ *Appl...
Early Preschool Teacher - Glenda Drive/ Apple ValleyTeacher Share by Email Share on LinkedIn Share on Twitter Read more
All contents are Copyright 1984-2011 by Xplain Corporation. All rights reserved. Theme designed by Icreon.