14 Copyright © 2005, Oracle. All rights reserved. User Interface Design: Swing Basics Planning the Application Layout

14-2 Copyright © 2005, Oracle. All rights reserved. Objectives After completing this lesson, you should be able to do the following: Explain Abstract Window Toolkit (AWT), Swing, and Java Foundation Classes (JFC) Detail the Swing UI containment hierarchy Describe how to use layout managers Add UI containers to an application to group components Embed UI components into UI containers Use the Swing pluggable look and feel

14-3 Copyright © 2005, Oracle. All rights reserved. Running Java UI Applications

14-4 Copyright © 2005, Oracle. All rights reserved. AWT, Swing, and JFC AWT, or Abstract Window Toolkit ( java.awt ): –A graphical user interface library –The predecessor to Swing components and the foundation for Swing and JFC Swing ( javax.swing ): –A more powerful graphical user interface library –Built on top of the AWT class hierarchy Java Foundation Classes (JFC): –A collection of APIs including: AWT, Swing, Accessibility API, Pluggable Look and Feel –Java 2D API, Drag and Drop support (since JDK 1.2)

14-5 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-6 Copyright © 2005, Oracle. All rights reserved. JButtonJSliderJTree JComboBoxJTextFieldJProgressBar InventoryItem Swing Features A set of visual components that have been available since JDK 1.1, but part of core JDK since version 1.2: Lightweight components compared to AWT Pluggable look and feel API Many more components than AWT

14-7 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-8 Copyright © 2005, Oracle. All rights reserved. Lightweight or Heavyweight Components? Heavyweight components Strong dependency on native peer code Each rendered in its own opaque window Early AWT components were mostly heavyweight Include some Swing top-level components ( JFrame, JApplet, JDialog ) Lightweight components No dependence on native peer code Can have transparent backgrounds Most Swing components are lightweight When displayed, they can appear nonrectangular Must be displayed in heavyweight container

14-9 Copyright © 2005, Oracle. All rights reserved. Planning the UI Layout Building a UI application involves planning, even more so when building Swing applications. Planning requires understanding the following concepts and their relationship: UI containment hierarchy (a root component that comprises nested containers and components) Container levels and types (such as top-level or intermediate containers) Layout managers and their types (used by each container) Components that can be added into containers

14-10 Copyright © 2005, Oracle. All rights reserved. The Containment Hierarchy Top-level containers –Frame –Dialog –Applet Intermediate containers –Panel –Scroll Pane Atomic components –Label –Text items –Buttons Frame Panel Atomic components

14-11 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-12 Copyright © 2005, Oracle. All rights reserved. Top-Level Containers Swing provides JFrame, JDialog, or JApplet, with changeable properties such as: –A content pane for holding intermediate containers or components, by using the getContentPane() or setContentPane() methods –A border, by using a setBorder() method –A title, by using a setTitle() method –Window decorations such as buttons for closing and minimizing (excludes applets) AWT provides Frame, Dialog, or Applet –These do not provide properties such as a content pane or borders.

14-13 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-14 Copyright © 2005, Oracle. All rights reserved. Intermediate Containers Designed to contain components (or containers): Can be nested within other containers Types of intermediate containers: –Panels for grouping containers or components –Scroll Panes to add scroll bars around components that can grow, such as a list or a text area –Split Panes to display two components in a fixed area, which is adjustable by the user –Tabbed Panes for containing multiple components, showing only one at a time, based on user selection –Tool Bars for grouping components, such as buttons –Internal Frames for nested windows

14-15 Copyright © 2005, Oracle. All rights reserved. Atomic Components Buttons Check boxes Combo boxes Text Lists Labels

14-16 Copyright © 2005, Oracle. All rights reserved. Layout Management Overview

14-17 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-18 Copyright © 2005, Oracle. All rights reserved. Border Layout Has five areas: North, South, West, East, and Center Has center area that expands to fill the available space Displays only one component in each area Makes each area useful for holding intermediate panels

14-19 Copyright © 2005, Oracle. All rights reserved. GridBag Layout Is based on a grid Allows components to span multiple rows and columns Allows rows and columns to differ in size Uses the components preferred size to control cell size

14-20 Copyright © 2005, Oracle. All rights reserved. GridBag Constraints Cell position Cell span Expansion weighting Fill rules Anchoring Component padding External insets

14-21 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-22 Copyright © 2005, Oracle. All rights reserved. Using Layout Managers Layout managers are designed to manage multiple components simultaneously. Using a layout manager with containers requires: –Creating a container and a layout manager object –Setting the layout property of the container –Adding items (components or other containers) into the regions that are defined by the layout manager Different layout managers require different arguments to control component placement.

14-23 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-24 Copyright © 2005, Oracle. All rights reserved. Combining Layout Managers VerticalFlow Grid GridBag null Border

14-25 Copyright © 2005, Oracle. All rights reserved. Using Frames or Dialogs A Java frame is equivalent to an application window. Use the JFrame for a main window –It has properties for icons, title, window decorations for minimize, maximize, and close buttons. –It uses BorderLayout by default. –It provides a default content pane that occupies the center region of the layout. –You can set the frame size with the setSize() method, and make it visible by using the setVisible() method. Use JDialog for a modal window –You must dismiss a modal window before the application that invokes it can become active.

14-26 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-27 Copyright © 2005, Oracle. All rights reserved. Using JPanel Containers JPanel is a general purpose container. Can use any layout manager (uses Flowlayout by default) Can use any border Can have added components or other panels/containers by using the add() method JPanel myPanel = new JPanel(new BorderLayout()); JTextArea jTextArea1 = new JTextArea(); myPanel.setBorder(BorderFactory.createRaisedBevelBorder()); myPanel.add(jTextArea1, BorderLayout.SOUTH);

14-28 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-29 Copyright © 2005, Oracle. All rights reserved. Adding Borders to Components Borders are Swing objects. –Defined in javax.swing.borders Use setBorder() to assign a border to a component. Create borders with the class called javax.swing.BorderFactory. Create borders separately to use with many components. jPanel1.setBorder(BorderFactory.createBevelBorder( BevelBorder.LOWERED,Color.lightGray,Color.darkGray)); Border etchedBorder = BorderFactory.createEtchedBorder();//pre-create border jPanel2.setBorder(etchedBorder); // use border`

14-30 Copyright © 2005, Oracle. All rights reserved. Using Internal Frames An internal frame is the equivalent of a document window that is contained within an application window for multiple-document interface (MDI) window applications. Use JInternalFrame for an internal window: –Similar to JFrame, it can contain intermediate containers and components and use a layout manager. –By default it is not closable, iconifiable, maximizable, or visible. Use a JDesktopPane as the content pane in which the internal frames are added: –Controls the size and placement of internal frames –Uses a null layout manager by default

14-31 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-32 Copyright © 2005, Oracle. All rights reserved. Swing Text Controls

14-33 Copyright © 2005, Oracle. All rights reserved. Adding Components with Oracle JDeveloper 10g Use the wizard to create a JFrame. Select a layout manager. Add components from the Component Palette. Fine-tune component properties.

14-34 Copyright © 2005, Oracle. All rights reserved. Creating a Frame Frame

14-35 Copyright © 2005, Oracle. All rights reserved. Adding Components Use the Component Palette to add Swing items to the Frame

14-36 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-37 Copyright © 2005, Oracle. All rights reserved. Setting Pluggable Look and Feel Swing applications provide support for a different look and feel to adapt to the visual environment of the operating system. The look and feel: Is application-specific: –Can be initialized when the application starts –Can change dynamically Affects lightweight Swing components Supports Win, Mac, Java (Metal) and Motif Uses javax.swing.UIManager class –Provides the setLookAndFeel() method, which accepts a look and feel class name string.

14-38 Copyright © 2005, Oracle. All rights reserved. Notes Page

14-39 Copyright © 2005, Oracle. All rights reserved. Summary In this lesson, you should have learned the following: Frames are top-level containers. Panels are intermediate containers that can be nested. Each container can have its own layout manager. Layout managers control component placement. You can combine layout managers within an application. You can control the applications look and feel.

14-40 Copyright © 2005, Oracle. All rights reserved. Practice 14: Overview This practice covers: Creating a class based on JFrame for the main window of the OrderEntry application –Add a default menu and status bar. –Add a JDesktopPane and set it as the content pane. Creating a class based on JInternalFrame to manage order creation and data entry –Create the container layout hierarchical structure for the order-entry frame components. –Add some of the components to this frame. Setting layout managers for each container

14-41 Copyright © 2005, Oracle. All rights reserved. Notes Page for Practice 14

14-42 Copyright © 2005, Oracle. All rights reserved. Practice 14: Notes

14-43 Copyright © 2005, Oracle. All rights reserved. Practice 14: Notes

14-44 Copyright © 2005, Oracle. All rights reserved. Practice 14: Notes

14-45 Copyright © 2005, Oracle. All rights reserved. Practice 14: Notes

14-46 Copyright © 2005, Oracle. All rights reserved.