professional java user interfaces phần 1 pdf

10:39 AM 8 March 2006 ffirs.fm 1.0
ffirs.fm Page ii Wednesday, March 8, 2006 10:40 AM
2:9 PM 10 March 2006 front_inter_cover.fm 1.0
Main Patterns and Design Strategies organized by functional layer
front_inter_cover.fm Page i Friday, March 10, 2006 2:12 PM
12:20 PM 8 March 2006 front_inner_paper.fm 1.0
Main principles
• GUI design and overall development
– User-centered design (44)
A design approach for building highly usable user interfaces, putting the emphasis
on the user.
– Cost-driven design (81)
GUI design comes first, with an eye on development complexity. For example,
avoid using ad-hoc components (81) in your GUI as far as possible.
– Iterative GUI development (169)
Iterate: GUI design and implementation, profiling, software and usability testing.
• Implementation
– The principle of Single Functional Responsibility (227)
Provide only one functional responsibility per class/method.
– Object lifecycle management – a general mindset (281)
Instantiate lazily and dispose eagerly, avoid garbage collector bottlenecks.
– Don’t go against the flow (284)
GUI toolkits are complex beasts, so don’t ignore them and implement fancy
designs counter to the architecture or style of the underlying GUI toolkits and
infrastructure (RCP).
Visual refactorings
Other refactorings are discussed in Chapter 5.
• Extract explicit panel (195), Extract stand-alone panel (196), and Composable units (292)
Extract the code of an existing GUI panel into a separate implementation to enhance

modularity and reusability.
• Merge panel (197)
Merge different implementations representing the same panel into a common one.
• Add parameter to panel (197) and Remove parameter from panel (198)
Add parameters to customize a panel and its opposite refactoring, Remove parameter
from panel (198).
• Parameterize panel (199)
Implement two slightly different panels with a unique code base.
• Replace parameter with panel (200)
Instead of adding a parameter, separate the implementation of the two panels.
• Rename panel (201)
Change the name of a panel.
front_inner_paper.fm Page i Wednesday, March 8, 2006 12:29 PM
12:30 PM 8 March 2006 back_inner_paper.fm 1.0
Cheat Sheet
An extremely simplified and by no means exhaustive basic reference to some of the topics
discussed in the book.
GUI Design
• How do I signal to the user my GUI is busy?
Change mouse pointer to hour glass for any operation that lasts more than two
seconds, always use progress indicators, and update progress every five seconds.
• How do I validate my GUI?
Involve users in design, use prototyping, software testing, memory profiling
(Chapter 5), questionnaire evaluation (Appendices A and B), and usability testing.
• How do I organize the GUI window area?
Use the
Area Organization
design strategy (120).
• How do I allow the user to select or create information in a GUI?
Use the Chooser design strategy, 126.

• How do I deploy my GUI?
Use Java Web Start when the user population is confident with approving certificates,
as for internal software. Use installers in other cases, and for large installation
bundles. Consider also using applets!
Software Design
• How do I keep my GUI responsive to user interaction during long-running
operations?
Use the Active Object pattern, 280 (for Swing, the
SwingWorker
class) for any opera-
tion that might last more than one second.
• How do I implement control (reaction to user interaction) in my GUI?
Depending on the number of items to be controlled by control rules, use:
– Scattered control (260) – few items, reactive-only control rules.
– Centralized control, the Mediator pattern (263) – many items, any kind of control
rule.
– Explicit Control State (260) – complex control rules, need for flexibility.
• How do I implement undo/redo in a GUI?
Build a queue or stack of edits (587), use the
Command
pattern (258) for user actions.
• How do I implement role-based authorization/security in my GUI?
Build a dedicated authorization manager class using Adaptation (272).
back_inner_paper.fm Page 758 Wednesday, March 8, 2006 12:30 PM
12:30 PM 8 March 2006 back_inner_cover.fm 1.0
• How do I implement user customization and user profiles in my GUI?
Build a dedicated profile manager class using Adaptation (272).
• How do I reuse existing panels in my GUI?
Use visual refactorings (194).
• How do I organize implementation for modularity and extensibility in a large or

complex GUI?
Define and implement a
Composable Unit
strategy, 292.
• How do I implement content assembly – adding components to a screen or panel – in
a GUI?
Depending on the features you want use:
– Static assembly (229), for simple layouts, no reusability.
– Simple Builders (229), for ease of use, separation of concerns, limited flexibility.
– Create and use Domain-specific or Little languages, 466 – good separation, maximum
flexibility.
• How do I organize complex event-based interactions among objects in my GUI?
Use an Event Arbitrator (245) to:
– Avoid event loops and rationalize chains of observers-observables.
– Shield client classes from low-level events.
– Forward events to complex data structures based on the Composite pattern.
• How do I handle large data collections?
Depending on the context of the problem, use:
– Eager disposal (281) of objects that are no longer needed – simple references,
extremely large trees.
– Weak or soft references, for cached objects and data that can be created or fetched
on the fly.
– Paging (281) for loading a few pages at time, discarding old ones, such as large
table models or large collections of expensive objects.
• How do I communicate data remotely in a modular way?
Separate screen data state from domain objects using Data Transfer Objects (234).
• How do I handle data represented in widgets?
Define Screen Data State (SDS, 330) and the widgets that will interface SDS to the
user. For synchronization with domain objects data (if any) use:
– Manual synchronization of SDS and data, for simple, small GUIs.

– Data binding support, for medium to large, complex GUIs.
back_inner_cover.fm Page 758 Wednesday, March 8, 2006 12:30 PM
10:39 AM 8 March 2006 ffirs.fm 1.0
Professional Java User
Interfaces
ffirs.fm Page i Wednesday, March 8, 2006 10:40 AM
10:39 AM 8 March 2006 ffirs.fm 1.0
ffirs.fm Page ii Wednesday, March 8, 2006 10:40 AM
10:39 AM 8 March 2006 ffirs.fm 1.0
Professional Java User
Interfaces
Mauro Marinilli
ffirs.fm Page iii Wednesday, March 8, 2006 10:40 AM
Copyright © 2006 John Wiley & Sons Ltd, The Atrium, Southern Gate, Chichester,
West Sussex PO19 8SQ, England
Telephone (+44) 1243 779777
Email (for orders and customer service enquiries):
Visit our Home Page on www.wiley.com
All Rights Reserved. No part of this publication may be reproduced, stored in a retrieval system or transmitted in
any form or by any means, electronic, mechanical, photocopying, recording, scanning or otherwise, except under
the terms of the Copyright, Designs and Patents Act 1988 or under the terms of a licence issued by the Copyright
Licensing Agency Ltd, 90 Tottenham Court Road, London W1T 4LP, UK, without the permission in writing of the
Publisher. Requests to the Publisher should be addressed to the Permissions Department, John Wiley & Sons Ltd,
The Atrium, Southern Gate, Chichester, West Sussex PO19 8SQ, England, or emailed to , or faxed
to (+44) 1243 770620.
Designations used by companies to distinguish their products are often claimed as trademarks. All brand names
and product names used in this book are trade names, service marks, trademarks or registered trademarks of their
respective owners. The Publisher is not associated with any product or vendor mentioned in this book.
This publication is designed to provide accurate and authoritative information in regard to the subject matter
covered. It is sold on the understanding that the Publisher is not engaged in rendering professional services. If

professional advice or other expert assistance is required, the services of a competent professional should be sought.
Other Wiley Editorial Offices
John Wiley & Sons Inc., 111 River Street, Hoboken, NJ 07030, USA
Jossey-Bass, 989 Market Street, San Francisco, CA 94103-1741, USA
Wiley-VCH Verlag GmbH, Boschstr. 12, D-69469 Weinheim, Germany
John Wiley & Sons Australia Ltd, 33 Park Road, Milton, Queensland 4064, Australia
John Wiley & Sons (Asia) Pte Ltd, 2 Clementi Loop #02-01, Jin Xing Distripark, Singapore 129809
John Wiley & Sons Canada Ltd, 22 Worcester Road, Etobicoke, Ontario, Canada M9W 1L1
Wiley also publishes its books in a variety of electronic formats. Some content that appears in print may not be
available in electronic books.
Library of Congress Cataloging-in-Publication Data
Marinilli, Mauro.
Professional Java user interfaces / Mauro Marinilli.
p. cm.
Includes bibliographical references and index.
ISBN 0-471-48696-5 (pbk. : alk. paper)
1. Java (Computer program language) 2. User interfaces (Computer
systems) I. Title.
QA76.73.J38M34954 2006
005.13'3 dc22
2006004498
British Library Cataloguing in Publication Data
A catalogue record for this book is available from the British Library
ISBN 13: 978-0-471-48696-5
ISBN 10: 0-471-48696-5
Typeset in 10/13.5pt Palatino by Laserwords Private Limited, Chennai, India
Printed and bound in Great Britain by Bell & Bain, Glasgow
This book is printed on acid-free paper responsibly manufactured from sustainable forestry in which at least two
trees are planted for each one used for paper production.
ffirs.fm Page iv Wednesday, March 8, 2006 10:40 AM

To the person who keeps alive in his daily work
the Spirit of Wonder of the early days.
fdedic.fm Page v Wednesday, March 8, 2006 10:39 AM
10:38 AM 8 March 2006 fdedic.fm 1.0
fdedic.fm Page vi Wednesday, March 8, 2006 10:39 AM
Brief Contents
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
Acknowledgements xxi
Introduction xxiii
1 Putting GUI Development into Context 1
Part I User Interface Design
2 Introduction to User Interface Design 31
3 Java GUI Design 77
4 Recurring User Interface Designs 119
Part II Software Design
5 Iterative GUI Development with Java 169
6 Implementation Issues 223
7 Code Organization 287
8 Form-Based Rich Clients 323
9 Web-Based User Interfaces 359
10 J2ME User Interfaces 375
11 Java Tools and Technologies 393
12 Advanced Issues 447
Part III Examples
13 Rich Client Platforms 471
14 The Personal Portfolio Application 497
15 An Example OO User Interface 535
Brief Contents
ftoc.fm Page vii Thursday, March 16, 2006 6:09 PM
viii Brief Contents

modified 6:9 PM 16 March 2006 ftoc.fm 1.0
16 An Example Ad-Hoc Component 567
A A Questionnaire for Evaluating Java User Interfaces 607
B A Questionnaire for Evaluating J2ME Applications 613
References 621
Index 629
ftoc.fm Page viii Thursday, March 16, 2006 6:09 PM
Contents
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
Acknowledgements xxi
Introduction xxiii
The interactivity thrill xxiii
Usable GUIs and usable books xxiv
The organization of the book xxv
Three levels of advice xxvii
Conventions used in the book xxviii
Source code xxviii
Reader feedback xxix
Book readers and personas xxix
Lars, a Java intermediate programmer xxx
Keiichi, a tech lead xxx
Shridhar, a professor in computer science xxxi
Melinda (Mellie), a manager xxxi
William, a first year student in a Master in CS course xxxii
Karole, a business analyst xxxiii
Juan, an experienced programmer xxxiii
1 Putting GUI Development into Context 1
1.1 Introduction 2
1.2 Focusing on users 2
1.3 A functional decomposition for user interfaces 3

1.4 Tool selection: the Java singularity 6
Of running little green men and wrong choices 7
1.5 Organizational aspects 7
People and GUIs 8
Team composition 10
1.6 Early design 12
Use case diagrams and GUIs 12
Contents
ftoc.fm Page ix Thursday, March 16, 2006 6:09 PM
x Contents
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
1.7 Lifecycle models, processes and approaches 14
Rational Unified Process 15
Extreme Programming and other Agile approaches 20
LUCID methodology 22
Evolutionary Prototyping process 24
1.8 UML notation 26
Class diagrams 26
Sequence diagrams 28
State diagrams 29
1.9 Summary 30
Part IV User Interface Design
2 Introduction to User Interface Design 31
2.1 The human factor 32
A model of interactive systems – seven stages
and two gulfs 32
Developers are part of the design process 34
Short term memory and cognitive modeling 36
Interacting with human beings 39
User-centered design 44

Simplified thinking aloud 46
2.2 Display organization 47
Esthetic considerations 49
Abstract-Augmented Area for GUIs 51
2.3 Interaction styles 57
Menu selection 57
Form filling 59
Language-based styles 62
Direct manipulation 63
2.4 Conceptual frameworks for UI design 64
Entity-based approaches to UI design 65
Metaphor-based approaches to UI design 66
Function-based approaches to UI design 67
‘Null’ approach to UI design 67
Object-oriented user interfaces 69
2.5 Assessing the quality of a GUI 72
Usability heuristics 73
2.6 Summary 75
ftoc.fm Page x Thursday, March 16, 2006 6:09 PM
Contents xi
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
3 Java GUI Design 77
3.1 Java technology for GUIs 77
Assembling the components 77
Three levels of component cost 79
3.2 Cost-driven design 81
Ad-hoc versus custom – the difference between ‘run’ and ‘ride’ 81
When ad-hoc is the only way to go 83
3.3 Exploring the design space for a point chooser 86
Standard designs 88

Ad-hoc designs 91
Mixed designs 97
Conclusions 99
3.4 Design guidelines for the Java platform 100
Introduction to the guidelines 100
J2SE user interface design guidelines 103
3.5 The Java look and feel design guidelines 108
Some definitions 109
The Java ‘look’ 109
The Java ‘feel’ 110
Some terminology 112
An example – applying the guidelines for designing dialogs 114
3.6 Summary 117
4 Recurring User Interface Designs 119
4.1 GUI area organization 120
Terminology 120
Main frames 121
Multiple document interfaces 123
Wizards 124
4.2 Choosers 126
Chooser activation mechanisms 127
Chooser interaction styles 128
Broadening the choice 131
Conclusions 133
4.3 Memory components 133
Input history 134
Saving user preferences 134
4.4 Lazy initialization 135
ftoc.fm Page xi Thursday, March 16, 2006 6:09 PM
xii Contents

modified 6:9 PM 16 March 2006 ftoc.fm 1.0
4.5 Preference dialogs 137
Preference dialogs styles 138
4.6 Waiting strategies 141
4.7 Flexible layout 144
4.8 Common dialogs 146
The ‘About’ dialog 146
Log-in dialog 149
First-time message dialogs 150
Splash window 151
4.9 Command components 152
Graphic conventions 156
Toolbar composition 157
Command composition 158
4.10 Accessibility 160
Testing the final product for accessibility 161
Conclusions 161
4.11 Navigation and keyboard support 161
Keyboard shortcuts 161
Tab traversal 162
4.12 Internationalization 163
4.13 Help support 164
4.14 Icons and images 165
4.15 Leveraging object-oriented programming 166
4.16 Summary 167
Part V Software Design
5 Iterative GUI Development with Java 169
5.1 Iterating wisely 171
5.2 Introduction to prototyping 173
Uses for prototyping 174

The two dimensions of prototyping 176
Competitors’ product as ready-made prototypes 177
Prototyping as a philosophy for development 177
Prototypes and customers 178
5.3 Prototyping alternatives 179
Different types of prototypes 179
Storyboards 182
ftoc.fm Page xii Thursday, March 16, 2006 6:09 PM
Contents xiii
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
5.4 GUI builders 184
5.5 Reusable prototyping widgets 187
A tree prototype utility class 187
A visual container prototype utility class 190
5.6 GUI refactoring 191
Some classic refactorings 191
Some GUI-specific refactorings 194
Failing with style 201
5.7 Introduction to user interface testing 203
Test-driven development 204
What’s first – GUI design or implementation? 204
5.8 Software testing of Java GUIs 206
How to test – GUI software test approaches 206
What to test – test coverage criteria 210
5.9 Usability testing of Java GUIs 211
5.10 JRE runtime management 214
Introduction to profiling 214
Common problems 216
Continuous profiling 219
A posteriori profiling 220

5.11 Summary 221
6 Implementation Issues 223
6.1 Revisiting the abstract model 224
Testing the various layers 226
The principle of Single Functional Responsibility 227
Isolating presentation details 228
6.2 Content 229
Content assembly 229
Explicit navigation 231
6.3 Business domain 231
6.4 Data input-output 233
A comprehensive data IO design strategy 233
Some design patterns 234
Remote communication design 235
Security issues 236
6.5 Making objects communicate 239
The Observer pattern 240
Swing events 242
ftoc.fm Page xiii Thursday, March 16, 2006 6:09 PM
xiv Contents
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
SWT events 243
Design-time class decoupling with events 243
Event Arbitrator 245
Misuses of event-based messaging 248
Alternatives to event-based communication mechanisms 250
6.6 Separating data from views 251
Model-View-Controller 252
6.7 Interaction and control 257
Representing user actions with the Command pattern 257

Control issues 260
A state-oriented approach to GUI control 265
6.8 Some design patterns for GUIs 271
Adaptation 271
Composite Context 277
Active Object 279
Object lifecycle management – a general mindset 280
Value Model 282
6.9 GUI complexity boosters 283
6.10 Summary 285
7 Code Organization 287
7.1 Introducing software architectures 287
Taming references 289
Composable units 292
Evolving order and appropriate architectures 294
7.2 Some common GUI architectures 295
The smart GUI antipattern 296
A semi-smart GUI architecture 297
A three-layer architecture 298
A four-layer architecture 299
7.3 A three-layer organization for GUI code 300
Overview 301
The presentation layer 303
The application layer 304
The service layer 305
7.4 Two examples of a three-layer implementation 306
An MP3 player 306
An electronic circuit simulator and editor 309
ftoc.fm Page xiv Thursday, March 16, 2006 6:09 PM
Contents xv

modified 6:9 PM 16 March 2006 ftoc.fm 1.0
7.5 The service layer 314
Overview 314
Persistence services 319
Factory services 319
Other services 320
7.6 Summary 321
Key ideas 322
8 Form-Based Rich Clients 323
8.1 Introduction 323
Defining rich clients 324
Java rich clients 325
GUI design for rich clients: the Third Way 326
8.2 Reference functional model 326
Distributing behavior between client and server 327
Common problems 329
8.3 Runtime data model 329
Validation 332
When to validate and notify 339
8.4 The cake-ordering application, the XP way 343
Setting up the first Iteration 344
Content first 346
Data second 350
Commands third 353
Closing the loop with the server 357
8.5 Summary 358
9 Web-Based User Interfaces 359
9.1 An overview of Web user interfaces 359
9.2 GUI design for the Web 361
Fine graphics details 361

Area organization 362
Levels of client-side control 362
Navigation issues 365
9.3 Implementing Web applications with Java 368
The typical architecture of a Web application 368
Basic Java Web GUI technologies 369
Java applets 370
ftoc.fm Page xv Thursday, March 16, 2006 6:09 PM
xvi Contents
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
9.4 From Web applications to rich clients 371
Different development habits 372
9.5 Summary 373
10 J2ME User Interfaces 375
10.1 Introduction to the MID profile 375
Main UI concepts 376
Main UI limitations 379
Cost-driven design for J2ME GUIs 379
10.2 The MIDP UI API 379
UI widgets 379
10.3 Designing MIDP GUIs 382
Abstract GUI designs 384
10.4 Designing navigation 385
10.5 An example custom item 387
10.6 An example ad-hoc item 388
10.7 An example application 389
The code 391
10.8 Summary 392
11 Java Tools and Technologies 393
11.1 Introduction to tool selection 394

11.2 Evaluating open source software 394
Open Source Maturity Model 396
11.3 SWT or Swing? 397
The toolkits 397
Choosing a toolkit 403
Mix and match 409
11.4 Other GUI technologies 410
11.5 Utility libraries 411
Security tools 412
Deployment tools 413
Glazed Lists 413
JGoodies Swing Suite 414
L2FProd Common Components 415
Other OSS component libraries 415
Some commercially-available Swing components 418
11.6 Test tools 420
11.7 Profiling tools 421
ftoc.fm Page xvi Thursday, March 16, 2006 6:09 PM
Contents xvii
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
11.8 GUI builders 422
11.9 Presentation layer technologies 424
Assessing a look and feel 425
Swing look and feels 426
SWT Presentation 442
11.10 Declarative GUIs with Java 443
XML-based formats 443
11.11 Summary 445
12 Advanced Issues 447
12.1 Building on top of existing libraries 447

Attributes 448
Roll your own framework 451
12.2 Memory management for complex GUIs 454
A practical case 455
12.3 Restructuring existing GUI code 457
Porting an old applet – a case study 459
Long-life GUIs 463
Providing new deployment support 464
12.4 Exploiting technology 465
12.5 Domain-specific and Little languages 466
12.6 The future of Java GUIs 468
12.7 Summary 469
Part VI Examples
13 Rich Client Platforms 471
13.1 Introduction to Java rich client platforms 471
The case for RCP applications 472
What’s in an RCP 473
GUI design guidelines and RCPs 474
13.2 The NetBeans RCP 474
NRCP architecture 475
13.3 The Spring RCP 476
13.4 The Eclipse RCP 477
Eclipse plug-in architecture 477
Eclipse RCP plug-ins 478
The workbench – the building blocks of ERCP GUIs 479
GUI design guidelines for ERCP applications 482
ftoc.fm Page xvii Thursday, March 16, 2006 6:09 PM
xviii Contents
modified 6:9 PM 16 March 2006 ftoc.fm 1.0
13.5 Choosing the best RCP for your needs 483

When to employ an RCP 484
13.6 Legal issues 485
Eclipse 485
Netbeans 486
13.7 An example Eclipse RCP application 486
The application 487
Introducing client-side modular architectures 489
The Snooper application architecture 492
13.8 Summary 496
14 The Personal Portfolio Application 497
14.1 The scenario 497
A note on lifecycle models 498
14.2 Analysis 499
Early analysis 499
Some scenarios 503
A refined use case diagram 504
Individuating boundary classes 505
14.3 Choosing a technology 505
14.4 An initial GUI design 506
An initial GUI paper mock-up 506
A second GUI paper mock-up 508
A throw-away GUI prototype 511
Validating the throw-away prototype 512
14.5 The final GUI 513
14.6 Implementation 515
Software requirements 516
The software architecture 516
14.7 Resources 524
Localization bundles 525
Images 525

14.8 The code 525
The remote explorer director 526
The prototype 529
14.9 Deployment issues 529
Server support 529
ftoc.fm Page xviii Thursday, March 16, 2006 6:09 PM