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

Apple iTunes 12.2 - Play Apple Music...
Apple iTunes lets you organize and stream Apple Music, download and watch video and listen to Podcasts. It can automatically download new music, app, and book purchases across all your devices and... Read more
Apple Security Update 2015-005 - For OS...
Apple Security Update 2015-005 is recommended for all users and improves the security of OS X. For detailed information about the security content of this update, please visit: http://support.apple.... Read more
Apple HP Printer Drivers 3.1 - For OS X...
Apple HP Printer Drivers includes the latest HP printing and scanning software for OS X Lion or later. For information about supported printer models, see this page. Version 3.1: The latest printing... Read more
Epson Printer Drivers 3.1 - For OS X 10....
Epson Printer Drivers installs the latest software for your EPSON printer or scanner for OS X Yosemite, OS X Mavericks, OS X Mountain Lion, and OS X Lion. For more information about printing and... Read more
Xcode 6.4 - Integrated development envir...
Xcode provides everything developers need to create great applications for Mac, iPhone, and iPad. Xcode brings user interface design, coding, testing, and debugging into a united workflow. The Xcode... Read more
OS X Yosemite 10.10.4 - Apple's lat...
OS X Yosemite is Apple's newest operating system for Mac. An elegant design that feels entirely fresh, yet inherently familiar. The apps you use every day, enhanced with new features. And a... Read more
Dash 3.0.2 - Instant search and offline...
Dash is an API Documentation Browser and Code Snippet Manager. Dash helps you store snippets of code, as well as instantly search and browse documentation for almost any API you might use (for a full... Read more
FontExplorer X Pro 5.0 - Font management...
FontExplorer X Pro is optimized for professional use; it's the solution that gives you the power you need to manage all your fonts. Now you can more easily manage, activate and organize your... Read more
Typinator 6.6 - Speedy and reliable text...
Typinator turbo-charges your typing productivity. Type a little. Typinator does the rest. We've all faced projects that require repetitive typing tasks. With Typinator, you can store commonly used... Read more
Arq 4.12.1 - Online backup to Google Dri...
Arq is super-easy online backup for the Mac. Back up to your own Google Drive storage (15GB free storage), your own Amazon Glacier ($.01/GB per month storage) or S3, or any SFTP server. Arq backs up... Read more

Hands-On With Raceline CC
Set for release soon, Rebellion’s motorbike racing game, Raceline CC certainly looks stylish. But how does it play? I got my hands on a preview build to answer exactly that. | Read more »
Siegefall - Tips, Tricks, and Strategies...
So, you fancy establishing a base and ruling the world again. Siegefall is a convenient place to do that, but how about some great tips and tricks on how best to go about it? Here are a few ideas on how to get ahead as a beginner to this medieval... | Read more »
The WWE Comes to Racing Rivals - Because...
Racing Rivals is a racing game that's all about, well, rivalry. And who knows rivalry better than WWE superstars (shhhh, that was rhetorical)? [Read more] | Read more »
Hey, Who Put Apple Music in My SoundHoun...
One of the App Store's popular music discovery sources - SoundHound - has already been updated to include Apple's own music discovery source - Apple Music. That was fast! [Read more] | Read more »
Arcane Legends has a New Expansion Calle...
Arcane Legends has been going strong since it debuted at the tail end of 2012. So well, in fact, that it's already up to its sixth expansion. [Read more] | Read more »
Vector 2 is Officially a Thing and it...
Vector is a pretty cool parkour-driven runner that's gotten a pretty decent following since it first came out - although personally I think more people could stand to show it some love. Anyway, Nekki has announced that a sequel isofficially on its... | Read more »
Get Ready to Trucksform and Roll Out (an...
It looks like NuOxygen is bringing the truck-transforming racer Trucksform (get it?) to iOS in a couple of weeks. Although really it's more of an auto-driver than a racer. But still, transforming trucks! [Read more] | Read more »
This Week at 148Apps:June 22-26, 2015
June's Summer Journey Continues With 148Apps How do you know what apps are worth your time and money? Just look to the review team at 148Apps. We sort through the chaos and find the apps you're looking for. The ones we love become Editor’s Choice,... | Read more »
LEGO® Minifigures Online (Games)
LEGO® Minifigures Online 1.0.1 Device: iOS iPhone Category: Games Price: $4.99, Version: 1.0.1 (iTunes) Description: | Read more »
World of Tanks Blitz celebrates its firs...
Today marks the first anniversary of the launch of World of Tanks Blitz, the mobile version of the PC tank battler, World of Tanks. World of Tanks Blitz launched on iOS and Android on June 26th last year and to celebrate, Wargaming is giving all... | Read more »

Price Scanner via MacPrices.net

Apple Releases OS X 10.10.4 With WIFi Fix, iO...
On Tuesday, Apple released final versions of OS X 10.10.4 and iOS 8.4, as well as updates for the Safari browser for OS X Yosemite, Mavericks, and Mountain Lion. The OS X 10.10.4 update focuses on... Read more
Dual-Band High-Gain Antennas for Home Wi-Fi N...
Linksys has announced what it claims are the first dual-band, omni-directional high-gain antennas for the consumer market. The new Linksys high-gain antennas available in a 2- and 4-pack (WRT004ANT... Read more
Apple refurbished 2014 15-inch Retina MacBook...
The Apple Store has Apple Certified Refurbished 2014 15″ 2.2GHz Retina MacBook Pros available for $1609, $390 off original MSRP. Apple’s one-year warranty is included, and shipping is free. They have... Read more
Clearance 2014 MacBook Airs available for up...
Adorama has 2014 MacBook Airs on sale for up to $301 off original MSRP including NY + NJ sales tax and free shipping: - 11″ 256GB MacBook Air: $798 $301 off original MSRP - 13″ 128GB MacBook Air: $... Read more
5K iMacs on sale for $100 off MSRP, free ship...
B&H Photo has the new 27″ 3.3GHz 5K iMac on sale for $1899.99 including free shipping plus NY tax only. Their price is $100 off MSRP. They have the 27″ 3.5GHz 5K iMac on sale for $2199, also $100... Read more
27-inch 3.2GHz iMac on sale for $1679, save $...
B&H Photo has the 27″ 3.2GHz iMac on sale for $1679.99 including free shipping plus NY sales tax only. Their price is $120 off MSRP. Read more
12-inch 1.2GHz Gray MacBook on sale for $1487...
Amazon.com has the new 12″ 1.2GHz Gray MacBook in stock and on sale for $1487 including free shipping. Their price is $102 off MSRP, and it’s the lowest price available for this model. We expect... Read more
15-inch 2.2GHz Retina MacBook Pro on sale for...
Amazon.com has the 15″ 2.2GHz Retina MacBook Pro on sale for $1819 including free shipping. Their price is $180 off MSRP, and it’s the lowest price available for this model. Read more
OtterBox Releases New Symmetry Series Metalli...
Otterbox’s new Symmetry Series of smartphone cases flaunts the best of both both street style and street smarts with their new metallic finishes and trusted OtterBox protection for iPhone 6 and... Read more
Eliminate Cable Chaos with New GE Branded Wra...
GE licensee Jasco Products has introduced a new line of GE branded Wrap-n-Charge USB wall chargers with built-in cable management. “We are always working to combine great technology with innovative... Read more

Jobs Board

*Apple* TV Live Streaming Frameworks Test En...
**Job Summary** Work and contribute towards the engineering of Apple 's state-of-the-art products involving video, audio, and graphics in Interactive Media Group (IMG) at Read more
Project Manager, WW *Apple* Fulfillment Ope...
…a senior project manager / business analyst to work within our Worldwide Apple Fulfillment Operations and the Business Process Re-engineering team. This role will work Read more
Senior Data Scientist, *Apple* Retail - Onl...
**Job Summary** Apple Retail - Online sells Apple products to customers around the world. In addition to selling Apple products with unique services such as iPad Read more
*Apple* Music Producer - Apple (United State...
**Job Summary** Apple Music seeks a Producer to help shepherd some of the most important content and editorial initiatives within the music app, with a particular focus Read more
Sr. Technical Services Consultant, *Apple*...
**Job Summary** Apple Professional Services (APS) has an opening for a senior technical position that contributes to Apple 's efforts for strategic and transactional Read more
All contents are Copyright 1984-2011 by Xplain Corporation. All rights reserved. Theme designed by Icreon.