Designing Applications Tutorials JBuilder 2006.pdf

Designing Applications: Tutorials

JBuilder ® 2005

Borland Software Corporation

100 Enterprise Way

Scotts Valley, California 95066-3249

www.borland.com

Refer to the file deploy.html located in the redist directory of your JBuilder product for a complete list

of files that you can distribute in accordance with the JBuilder License Statement and Limited

Warranty.

Borland Software Corporation may have patents and/or pending patent applications covering subject

matter in this document. Please refer to the product CD or the About dialog box for the list of

applicable patents. The furnishing of this document does not give you any license to these patents.

product names are trademarks or registered trademarks of Borland Software Corporation in the

United States and other countries. All other marks are the property of their respective owners.

For third-party conditions and disclaimers, see the Release Notes on your JBuilder product CD.

Printed in the U.S.A.

JB2005designui-tutorials 6E5R0804

0405060708-987654321

PDF

Contents

Chapter 1

User interface tutorials 1

Documentation conventions . . . . . . . . . . . . . 2

Developer support and resources. . . . . . . . . . . 3

Contacting Borland Developer Support . . . . . . 3

Online resources. . . . . . . . . . . . . . . . . . 3

World Wide Web . . . . . . . . . . . . . . . . . . 4

Borland newsgroups . . . . . . . . . . . . . . . . 4

Usenet newsgroups . . . . . . . . . . . . . . . . 4

Reporting bugs . . . . . . . . . . . . . . . . . . 4

Step 15: Showing filename and state in

the window title bar. . . . . . . . . . . . . . . . . 38

Step 16: Deploying the Text Editor application

to a JAR file . . . . . . . . . . . . . . . . . . . . 41

Overview . . . . . . . . . . . . . . . . . . . . . 41

Running the Archive Builder . . . . . . . . . . . 42

Testing the deployed application from

the command line . . . . . . . . . . . . . . . . 46

Modifying the JAR file and retesting

the application . . . . . . . . . . . . . . . . . 47

Chapter 2

Tutorial: Creating a simple

user interface 7

Creating the UI . . . . . . . . . . . . . . . . . . . . 7

Using layouts . . . . . . . . . . . . . . . . . . . . . 8

Adjusting constraints. . . . . . . . . . . . . . . . 9

Attaching events . . . . . . . . . . . . . . . . . . . 9

Chapter 4

Tutorial: Creating a UI with

nested layouts 49

Step 1: Creating the UI project . . . . . . . . . . . 50

Using the Project wizard . . . . . . . . . . . . . 50

Step 2: Generating the application source files . . . 51

Using the Application wizard . . . . . . . . . . . 51

Step 3: Changing contentPane’s layout . . . . . . . 53

Step 4: Adding the main panels . . . . . . . . . . . 54

Step 5: Creating toolbars . . . . . . . . . . . . . . 56

Step 6: Adding toolbar buttons. . . . . . . . . . . . 57

Step 7: Adding components to the

middle panel . . . . . . . . . . . . . . . . . . . . 59

Step 8: Creating a status bar . . . . . . . . . . . . 60

Step 9: Converting to portable layouts. . . . . . . . 61

Step 10: Completing your layout . . . . . . . . . . . 63

Chapter 3

Tutorial: Building a Java text editor 11

What this tutorial demonstrates . . . . . . . . . . . . 11

Sample code for this tutorial . . . . . . . . . . . . 12

Step 1: Setting up . . . . . . . . . . . . . . . . . . . 12

Creating the project . . . . . . . . . . . . . . . . 13

Selecting the project’s code style options . . . . . 14

Using the Application wizard. . . . . . . . . . . . 14

Suppressing automatic hiding of JFrame . . . . . 16

Setting the look and feel . . . . . . . . . . . . . . 16

Step 2: Adding a text area . . . . . . . . . . . . . . 17

Step 3: Creating the menus . . . . . . . . . . . . . . 20

Step 4: Adding a FontChooser dialog. . . . . . . . . 22

Setting the dialog’s frame and title properties . . . 22

Creating an event to launch the FontChooser . . . 22

Step 5: Attaching a menu item event to the

FontChooser. . . . . . . . . . . . . . . . . . . . . 24

Step 6: Attaching menu item events

to JColorChooser . . . . . . . . . . . . . . . . . . 25

Step 7: Adding a menu event handler

to clear the text area. . . . . . . . . . . . . . . . . 26

Step 8: Adding a file chooser dialog . . . . . . . . . 26

Internationalizing Swing components . . . . . . . 27

Step 9: Adding code to read text from a file. . . . . . 28

Step 10: Adding code to menu items

for saving a file . . . . . . . . . . . . . . . . . . . 29

Step 11: Adding code to test if a file

has been modified . . . . . . . . . . . . . . . . . . 31

Step 12: Activating the toolbar buttons . . . . . . . . 33

Specifying button tool tip text . . . . . . . . . . . 33

Creating the button events . . . . . . . . . . . . . 33

Creating a fileOpen() method . . . . . . . . . . . 34

Creating a helpAbout() method . . . . . . . . . . 35

Step 13: Hooking up event handling to

the text area . . . . . . . . . . . . . . . . . . . . . 36

Step 14: Adding a context menu to the text area . . . 37

Chapter 5

Tutorial: Creating a GridBagLayout

in JBuilder 65

Using GridBagLayout . . . . . . . . . . . . . . . . 66

What is GridBagLayout? . . . . . . . . . . . . . 67

What is the component’s display area?. . . . . . 67

What are GridBagConstraints? . . . . . . . . . . 69

Why is GridBagLayout so complicated? . . . . . 69

Why use GridBagLayout? . . . . . . . . . . . . 70

Simplifying GridBagLayout . . . . . . . . . . . . 70

Sketch your design on paper first . . . . . . . 70

Use nested panels and layouts . . . . . . . . 72

Use the JBuilder visual designer . . . . . . . 73

Prototype your UI in null or XYLayout . . . . . 75

Creating a GridBagLayout in JBuilder . . . . . . . . 76

About the design . . . . . . . . . . . . . . . . . 76

Step 1: Design the layout structure . . . . . . . . 77

Step 2: Create a project for this tutorial . . . . . 81

Step 3: Add the components

to the containers . . . . . . . . . . . . . . . . 81

Add the main panel to the UI frame . . . . . . 82

Create the left panel and add

its components. . . . . . . . . . . . . . . . 82

Create the right panel and add

its components. . . . . . . . . . . . . . . . 84

Create the bottom panel and add

its components. . . . . . . . . . . . . . . . 85

Step 4: Convert the upper panels

to GridBagLayout . . . . . . . . . . . . . . . . 85

Step 5: Convert the lower panel

to GridLayout . . . . . . . . . . . . . . . . . . 86

Step 6: Convert the outer panel

to GridBagLayout . . . . . . . . . . . . . . . . 86

Step 7: Make final adjustments . . . . . . . . . . 86

GridLayout panel . . . . . . . . . . . . . . . . 88

Upper panels . . . . . . . . . . . . . . . . . . 90

Conclusion . . . . . . . . . . . . . . . . . . . . 94

Tips and techniques . . . . . . . . . . . . . . . . . 94

Setting individual constraints in the designer . . . 94

anchor . . . . . . . . . . . . . . . . . . . . . 94

fill . . . . . . . . . . . . . . . . . . . . . . . . 95

insets . . . . . . . . . . . . . . . . . . . . . . 95

gridwidth, gridheight . . . . . . . . . . . . . . 96

ipadx, ipady . . . . . . . . . . . . . . . . . . 97

gridx, gridy . . . . . . . . . . . . . . . . . . . 98

weightx, weighty . . . . . . . . . . . . . . . . 98

Behavior of weight constraints . . . . . . . . . 99

Using drag and drop to edit constraints . . . . . 101

Dragging a component to an empty cell . . . 102

Dragging a component to

an occupied cell . . . . . . . . . . . . . . 103

Dragging a large component into

a small cell . . . . . . . . . . . . . . . . . 105

Dragging the black sizing nibs into

an adjacent empty cell . . . . . . . . . . . 106

Adding components . . . . . . . . . . . . . . . 108

Miscellaneous tips . . . . . . . . . . . . . . . . 109

Switch back to XYLayout for

major adjustments. . . . . . . . . . . . . . 109

Remove weights and fill before making

adjustments . . . . . . . . . . . . . . . . . 109

Making existing GridBagLayout code

visually designable . . . . . . . . . . . . . . . 110

Differences in code . . . . . . . . . . . . . . 110

Modifying code to work in the designer . . . . 110

Code generated by JBuilder in Part 2. . . . . 111

Other resources on GridBagLayout . . . . . . 112

GridBagConstraints . . . . . . . . . . . . . . . . . 113

anchor . . . . . . . . . . . . . . . . . . . . . . 113

fill . . . . . . . . . . . . . . . . . . . . . . . . . 113

insets . . . . . . . . . . . . . . . . . . . . . . . 114

gridwidth, gridheight . . . . . . . . . . . . . . . 114

ipadx, ipady . . . . . . . . . . . . . . . . . . . 115

gridx, gridy . . . . . . . . . . . . . . . . . . . . 115

weightx, weighty . . . . . . . . . . . . . . . . . 116

Examples of weight constraints . . . . . . . . . 116

Index

119

Chapter 1

User interface tutorials

These tutorials are designed to help you quickly get comfortable with using the visual

designer. Each tutorial has a different emphasis, so you can choose the tutorial that

most closely matches your needs.

Here is a quick and simple tutorial to introduce you to the designer:

Chapter 2, “Tutorial: Creating a simple user interface” — Create a simple GUI, play

with layouts and constraints, and hook up an event.

These tutorials provide in-depth practice with important aspects of the designer:

Chapter 3, “Tutorial: Building a Java text editor” — Create and deploy a real

application to load, edit, and save text files, hooking events up to buttons and

menus.

Chapter 4, “Tutorial: Creating a UI with nested layouts” — Design a user interface

with nested panels and layouts, converting between different layouts.

Chapter 5, “Tutorial: Creating a GridBagLayout in JBuilder” — Learn how to use

GridBagLayout and GridBagConstraints. Create a GridBagLayout UI container in

the designer.

These tutorials assume you are familiar with Java and with the JBuilder IDE. For more

information on these and other pertinent subjects, see below.

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika: