JSC >
Guidelines Home Page >  Java Look and Feel Design Guidelines
>
Part IV: Backmatter
>
B: Graphics Repository
  Previous Next Contents/Index/Search


B: Graphics Repository

This appendix presents toolbar button and menu item graphics designed specifically for use in Java look and feel applications. The information is based on the Java Look and Feel Graphics Repository, which is available at # .

 The contents of this appendix are available on the book's companion CD-ROM.

  As a general rule, use 16 x 16 pixel graphics for menu items and 24 x 24 pixel graphics for toolbar buttons.

These professional-quality graphics can save valuable development time and ensure consistent graphics and terminology across Java look and feel applications.

The graphics are organized into six functional groups:

  • General
  • Navigation
  • Text
  • Tables
  • Media
  • Development tools

The repository provides:

  • Small and large graphics. The 16 x 16 and 24 x 24 pixel graphics.
  • Description. Explanation of the concept underlying each pair of graphics. Use this information to help you decide whether these graphics are appropriate to represent a specific feature of your application. You might use a modified, context-driven version of this explanation to describe the feature in your status bar.
  • Name. Title to be used in corresponding menu items or button text. Variables, set off by curly braces, appear in some name fields. If the runtime value of this parameter is available, provide it for users.
  • Tool tip. Brief phrase appearing next to the pointer when the pointer is over one of these graphics. Variables, set off by curly braces, appear in some of the tool tip fields. If the runtime value of this parameter is available, provide it for users.
  • Keyboard shortcut. Keystroke combination (usually a modifier key and a character key) that activates the related menu item. Attach shortcuts to simple and constantly used features (like Ctrl-X for Cut). Ensure that each shortcut is unique within your application. For more information and guidelines on shortcuts, see Keyboard Shortcuts. For a summary of shortcuts, see Table 8.
  • Mnemonic. A mnemonic shows users which key to press (in conjunction with the Alt key) to activate a command or another GUI component. This section suggests appropriate letters to underline (in order of preference) in the related menu item or button. Choose from among the suggested mnemonics to aid consistency. For rules on choosing mnemonics for your toolbar buttons and menu items, see Mnemonics.
  • File name. The relative path name for the specified graphic in the Java Archive. The online file name follows this format:
.../toolbarButtonGraphics/ groupName / NameSize .gif
All of the graphics reside in the toolbarButtonGraphics folder of the Java Archive. Therefore, the file-name information includes only the groupName subdirectory and NameSize .gif file name. Because the graphics are located in subdirectories, the path information is necessary. For instance, the repository contains two graphics for Stop--one for media transport and one for general use.

  • Other notes. Miscellaneous information about the graphics, including cross-references to related graphics or concepts.

  Provide both graphics and text in a toolbar when you deem it appropriate--for instance, to accommodate novice or occasional users and those with poor vision. If you decide to display both button text and graphics, provide a way for end users to indicate their preferences for button text only, graphics only, or button text and graphics.

  You can use the information in this appendix to create Swing actions. For more on Swing actions, see the Java 2 Platform, Standard Edition, v 1.3 API Specification by visiting link .

General Graphics

This section provides general-purpose graphics that represent:

  • Adding objects
  • Saving edits or checkpoints
  • Stopping tasks or processes
  • Adjusting the screen display
  • Changing magnification levels
  • Specifying preferences and properties
  • Printing
  • Displaying and retrieving previously visited locations
  • Creating and sending electronic mail
  • Aligning and justifying objects
  • Searching
  • Editing objects and data
  • Importing and exporting objects
  • Providing help and information

Adding Objects

This section contains graphics that represent the addition of an object to an existing set of objects.

Add

 


Graphics  
Description Adds an object to an existing set of objects
Name Add { Object Name }
Tool Tip Add { Object Name }
Mnemonic A, D
File Name .../general/Add16.gif
.../general/Add24.gif
Other Notes For more information on the plus symbol in the lower- right corner of the document graphic, see Add Object Indicators.





New

 


Graphics  
Description Creates a new object
Name New { Object Name }
Tool Tip New { Object Name }
Shortcut Ctrl-N
Mnemonic N, W
File Name .../general/New16.gif
.../general/New24.gif
Other Notes For more information on the twinkle symbol on the lower-right corner of the document graphic, see New Object Indicators.





Open

 


Graphics  
Description Opens the specified object
Name Open { Object Name }
Tool Tip Open { Object Name }
Shortcut Ctrl-O
Mnemonic O, P, N
File Name .../general/Open16.gif
.../general/Open24.gif





Saving Edits or Checkpoints

The graphics in this section provide representations for saving edits or checkpoints for a specified object or group of objects.

Save

 


Graphics  
Description Commits all interim edits or checkpoints for an object to a permanent storage area
Name Save
Tool Tip Save
Shortcut Ctrl-S
Mnemonic S, V
File Name .../general/Save16.gif
.../general/Save24.gif





Save All

 


Graphics  
Description Commits all interim changes of a group of objects to a permanent storage area
Name Save All
Tool Tip Save All
Mnemonic A, S, V, L
File Name .../general/SaveAll16.gif
.../general/SaveAll24.gif





Save As

 


Graphics  
Description Saves the object being edited to a different, permanent storage area
Name Save As
Tool Tip Save As
Mnemonic A, S, V
File Name .../general/SaveAs16.gif
.../general/SaveAs24.gif





Stopping a Task

The graphic in this section represents stopping an action or a process. Compare this section to Stop, which is for media transport processes.

Stop

 


Graphics  
Description Halts the execution of a task
Name Stop { Action or Process }
Tool Tip Stop { Action or Process }
Mnemonic S, T, P
File Name .../general/Stop16.gif
.../general/Stop24.gif
Other Notes The Stop feature should be available only when there is an activity to halt.





Updating the Screen Display

This section provides graphics to represent updating the screen display with new data.

Refresh

 


Graphics  
Description Updates screen display with new data
Name Refresh { Object Name }
Tool Tip Refresh { Object Name }
Mnemonic R, F, S, H
File Name .../general/Refresh16.gif
.../general/Refresh24.gif





Changing Magnification Levels

This section provides graphics to represent changing the magnification level used to view an object.

Zoom

 


Graphics  
Description Changes the magnification level used to view an object
Name Zoom
Tool Tip Zoom
Mnemonic Z, M
File Name .../general/Zoom16.gif
.../general/Zoom24.gif





Zoom In

 


Graphics  
Description Increases the magnification level used (to view the details of an object)
Name Zoom In
Tool Tip Zoom In
Mnemonic I, Z, N, M
File Name .../general/ZoomIn16.gif
.../general/ZoomIn24.gif





Zoom Out

 


Graphics  
Description Decreases the magnification level used (to view more of an object)
Name Zoom Out
Tool Tip Zoom Out
Mnemonic O, Z, T, M
File Name .../general/ZoomOut16.gif
.../general/ZoomOut24.gif





Specifying Preferences and Properties

This section provides graphics to represent the display of:

  • Global attributes of the current application that might be set by users (preferences)
  • Local characteristics of a selected object that might be specified by users (properties)

Preferences

 


Graphics  
Description Displays global attributes of the current application that might be set by users
Name Preferences
Tool Tip Preferences
Mnemonic P, R, F
File Name .../general/Preferences16.gif
.../general/Preferences24.gif
Other Notes See Properties Indicators.





Properties

 


Graphics  
Description Displays local characteristics of a selected object that might be edited by users
Name Properties
Tool Tip Properties
Mnemonic P, R, T, S
File Name .../general/Properties16.gif
.../general/Properties24.gif
Other Notes See Properties Indicators.





Printing

This section provides graphics that represent operations such as page setup, printing, and print previews.

Page Setup

 


Graphics  
Description Enables users to specify properties for the current print job
Name Page Setup
Tool Tip Page Setup
Mnemonic G, S, P
File Name .../general/PageSetup16.gif
.../general/PageSetup24.gif
Other Notes See Properties Indicators. Page setup properties might include printer selection, paper orientation, size, and so forth.





Print

 


Graphics  
Description Sends an object or set of objects to be printed
Name Print
Tool Tip Print
Shortcut Ctrl-P
Mnemonic P, R, N
File Name .../general/Print16.gif
.../general/Print24.gif





Print Preview


Graphics  
Description Provides a preliminary representation of the output that would be generated by the Print menu item
Name Print Preview
Tool Tip Print Preview
Mnemonic R, P, V, W
File Name .../general/PrintPreview16.gif
.../general/PrintPreview24.gif





Displaying and Retrieving Previously Visited Locations

This section provides graphics that represent bookmarks and history files.

A bookmark is a saved URL (uniform resource locator) for a web page that has been added to a list of saved URLs. When users view a particular web site and want to return to it subsequently, they can create a bookmark for the site.

On the other hand, a history file displays a list of previously visited locations (or opened files).

Bookmarks

 


Graphics  
Description Displays a list of documents marked for later retrieval
Name Bookmarks
Tool Tip Bookmarks
Mnemonic B, K, M, R
File Name .../general/Bookmarks16.gif
.../general/Bookmarks24.gif





History

 


Graphics  
Description Displays a list of previously visited locations (or opened files)
Name History
Tool Tip History
Mnemonic H, S, T, Y
File Name .../general/History16.gif
.../general/History24.gif





Creating and Sending Electronic Mail

This section provides graphics that represent the creation and sending of electronic mail messages.

Compose Mail

 


Graphics  
Description Creates a new electronic mail message
Name Compose Mail
Tool Tip Compose Mail
Mnemonic M, L, C
File Name .../general/ComposeMail16.gif
.../general/ComposeMail24.gif





Send Mail

 


Graphics  
Description Sends the specified electronic mail message
Name Send Mail
Tool Tip Send Mail
Mnemonic S, M, L, N
File Name .../general/SendMail16.gif
.../general/SendMail24.gif





Aligning Objects

This section contains graphics that represent the alignment of objects. Compare these graphics with the graphics in Justifying Objects.

Do not use these graphics for textual objects. Instead use the graphics described in Text Alignment and Justification.

Align Bottom

 


Graphics  
Description Positions an object so that it lines up with the lower horizontal edge of its container
Name Align Bottom { Object Name }
Tool Tip Align Bottom { Object Name }
Mnemonic B, T, M
File Name .../general/AlignBottom16.gif
.../general/AlignBottom24.gif





Align Center

 


Graphics  
Description Positions an object so that it is in the middle of its container along both horizontal and vertical axes
Name Align Center { Object Name }
Tool Tip Align Center { Object Name }
Shortcut Ctrl-E
Mnemonic C, N, T, R
File Name .../general/AlignCenter16.gif
.../general/AlignCenter24.gif
Other Notes Do not use these graphics for textual objects; see Align Center.





Align Left

 


Graphics  
Description Positions an object to line up with the leading vertical edge of its container
Name Align Left { Object Name }
Tool Tip Align Left { Object Name }
Shortcut Ctrl-L
Mnemonic L, F, T
File Name .../general/AlignLeft16.gif
.../general/AlignLeft24.gif
Other Notes Do not use these graphics for textual objects; see Align Left.





Align Right

 


Graphics  
Description Positions an object to line up with the trailing vertical edge of its container
Name Align Right { Object Name }
Tool Tip Align Right { Object Name }
Shortcut Ctrl-R
Mnemonic R, G, H, T
File Name .../general/AlignRight16.gif
.../general/AlignRight24.gif
Other Notes Do not use these graphics for textual objects; see Align Right.





Align Top

 


Graphics  
Description Positions an object to line up with the upper horizontal edge of its container
Name Align Top { Object Name }
Tool Tip Align Top { Object Name }
Mnemonic T, P
File Name .../general/AlignTop16.gif
.../general/AlignTop24.gif





Justifying Objects

This section provides graphics to represent the justification of objects. Compare these graphics to those described in Text Alignment and Justification.

Horizontally Justify

 


Graphics  
Description Positions an object so that it fills the middle of its container evenly all the way to either vertical edge
Name Horizontally Justify { Object Name }
Tool Tip Horizontally Justify { Object Name }
Mnemonic H, R, Z
File Name .../general/AlignJustifyHorizontal16.gif
.../general/AlignJustifyHorizontal24.gif
Other Notes Do not use these graphics for textual objects; see Justify.





Vertically Justify

 


Graphics  
Description Positions an object to fill the middle of its container evenly all the way to either horizontal edge
Name Vertically Justify { Object Name }
Tool Tip Vertically Justify { Object Name }
Mnemonic V, R, T
File Name .../general/AlignJustifyVertical16.gif
.../general/AlignJustifyVertical24.gif
Other Notes Do not use these graphics for textual objects; see Justify.





Searching

This section provides graphics that represent search operations ranging from simple find-and-replace features within a document or a web page to a more comprehensive search feature with a scope as broad as one or more web sites or the entire World Wide Web.

Find In

 


Graphics  
Description Displays a window that enables the user to specify criteria to search for a specified object
Name Find In { Scope }
Tool Tip Find In { Scope }
Shortcut Ctrl-F
Mnemonic F, N, D
File Name . ../general/Find16.gif
.../general/Find24.gif
Other Notes Compare to Search. Find is used within an object (such as a document), whereas Search is used for more extensive operations across objects (for instance, multiple documents within a folder).





Find Again

 


Graphics  
Description Searches for the next instance of the object specified by the previous Find In command
Name Find Again { Object Name }
Tool Tip Find Again { Object Name }
Shortcut Ctrl-G
Mnemonic A, G, N
File Name .../general/FindAgain16.gif
.../general/FindAgain24.gif
Other Notes Compare to Find In and Search.





Replace

 


Graphics  
Description Substitutes one object for another
Name Replace
Tool Tip Replace
Shortcut Ctrl-H
Mnemonic R, P, L, C
File Name .../general/Replace16.gif
.../general/Replace24.gif





Search

 


Graphics  
Description Searches for a specified object
Name Search { Object Name } { in Scope }
Tool Tip Search { Object Name } { in Scope }
Mnemonic S, R, C, H
File Name .../general/Search16.gif
.../general/Search24.gif
Other Notes Compare to Find In.





Editing Objects and Data

The graphics in this section represent common editing features such as copying, cutting, pasting, undoing, and redoing.

Copy

 


Graphics  
Description Duplicates the selected object and makes it available to be pasted elsewhere
Name Copy
Tool Tip Copy
Shortcut Ctrl-C
Mnemonic C, P, Y
File Name .../general/Copy16.gif
.../general/Copy24.gif





Cut

 


Graphics  
Description Removes the selected object from its current location and makes it available to be pasted elsewhere
Name Cut
Tool Tip Cut
Shortcut Ctrl-X
Mnemonic T, C
File Name .../general/Cut16.gif
.../general/Cut24.gif
Other Notes See also Delete and Remove.





Delete

 


Graphics  
Description Removes the selected object from its current location
Name Delete
Tool Tip Delete
Shortcut Delete
Mnemonic D, L, T
File Name .../general/Delete16.gif
.../general/Delete24.gif
Other Notes See also Remove and Cut.





Remove

 


Graphics  
Description Removes the selected item from its current context
Name Remove
Tool Tip Remove
Mnemonic R, M, V
File Name .../general/Remove16.gif
.../general/Remove24.gif
Other Notes See also Delete and Cut.





Paste

 


Graphics  
Description Inserts an object or data previously placed in a temporary holding area
Name Paste
Tool Tip Paste
Shortcut Ctrl-V
Mnemonic P, S, T
File Name .../general/Paste16.gif
.../general/Paste24.gif
Other Notes The object or data is usually placed in the temporary holding area by the Cut or Copy command. Compare to Copy and Cut.





Edit

 


Graphics  
Description Enables users to modify the selected object
Name Edit
Tool Tip Edit
Mnemonic E, D, T
File Name .../general/Edit16.gif
.../general/Edit24.gif





Undo

 


Graphics  
Description Reverses the last transaction
Name Undo { Action }
Tool Tip Undo { Action }
Shortcut Ctrl-Z
Mnemonic U, N, D
File Name .../general/Undo16.gif
.../general/Undo24.gif





Redo

 


Graphics  
Description Reverses the effect of the last undone transaction
Name Redo { Action }
Tool Tip Redo { Action }
Shortcut Ctrl-Y
Mnemonic R, D
File Name .../general/Redo16.gif
.../general/Redo24.gif
.





Importing and Exporting Objects

The graphics in this section represent the importing and exporting of objects. To import involves bringing objects or data (for example, documents created in another application, text files, and graphics files) into your application. To export means to save an object or data in a format other than your application's native format.

Import

 


Graphics  
Description Opens an object or data that is in a format other than the application's native format
Name Import
Tool Tip Import
Mnemonic I, M, P, T
File Name .../general/Import16.gif
.../general/Import24.gif





Export

 


Graphics  
Description Saves an object or data in a format other than the application's native format
Name Export
Tool Tip Export
Mnemonic X, E, P, T
File Name .../general/Export16.gif
.../general/Export24.gif





Providing Help and Information

This section contains graphics that represent standard and contextual help, information about an object or a task, About boxes, and tips of the day.

Help

 


Graphics  
Description Provides instructions and information to aid users in completing tasks
Name Help
Tool Tip Help
Shortcut F1
Mnemonic H, L, P
File Name .../general/Help16.gif
.../general/Help24.gif
Other Notes As a general rule, help provides a system for browsing, searching, viewing, and reading information. It has more options than contextual help but might require activity that is tangential to the user's task.





Contextual Help

 


Graphics  
Description Displays information to users based on their working location in a piece of software
Name Contextual Help
Tool Tip Contextual Help
Shortcut Shift-F1
Mnemonic C, T, X, H
File Name .../general/ContextualHelp16.gif
.../general/ContextualHelp24.gif
Other Notes Compare to the previous section.





Information

 


Graphics  
Description Displays information about an object or task
Name Information
Tool Tip Information
Mnemonic I, N, F, O
File Name .../general/Information16.gif
.../general/Information24.gif





About

 


Graphics  
Description Provides information about the application as a whole
Name About { Application Name }
Tool Tip About { Application Name }
Mnemonic A, B, T
File Name .../general/About16.gif
.../general/About24.gif
Other Notes For more information on About boxes, see Designing About Boxes.





Tip of the Day

 


Graphics  
Description Provides a short hint about a feature of the application
Name Tip of the Day
Tool Tip Tip of the Day
Mnemonic T, D, P
File Name .../general/TipOfTheDay16.gif
.../general/TipOfTheDay24.gif




Java Look and Feel Design Guidelines, second edition.
Copyright 2001. Sun Microsystems, Inc. All Rights Reserved.
Previous Next Contents/Index/Search
Left Curve
Java SDKs and Tools
Right Curve
Left Curve
Java Resources
Right Curve
JavaOne Banner
Java 8 banner (182)