Slot04 creating gui

Creating Graphical User Interface
(GUI & Swing, Part 1)
References:
(1)Textbook, chapter 10, 11
(2)Java-Tutorials/tutorial-2015/uiswing/index.html
Java GUI and the swing package

Why should we study this lecture?
Do you want to create GUI applications (graphic
user interface)?
How do GUI applications execute?
What do Java APIs support for developing GUI
App?
2
Objectives

Review
Knowledge used in this lecture:
Event: Some thing happens.
Event in applications: In almost cases, when IO
devices complete a task, an event is thrown  When
user presses a key or clicks mouse, events are
thrown.
Event handler: Code executes when the appropriate
event is thrown.
How does application know an event?
When an IO device completes a task, a signal (called
as interrupt) from the device will be sent to CPU and
operating system (OS) knows it. OS collects states of
keyboard, mouse position, mouse keys,…, called as
event object then OS passes the event object to the
application.
3

Contents
Two Kinds of Applications
Java Model for Event Management
About Java Foundation Classes (JFC)
A Strategy for Designing the GUI
Using Ordinary Swing Components
A Demonstration
4

1- Two Kinds of Apps
Console App.
Compute-centric Apps
Event-based App.
User-centric Apps(GUI)
Model-View Controller Architecture for GUI component.
Model: Object contains data.
View: Object users can see it on the screen
Controller: Object manages events
[www.songho.ca]5

2-Java model for event
management
Delegates
View
Register Table
Update
GUI
6
Component C1 Specific Event Object E1
- Component
- Keyboard state
- Mouse state
Listener L1
Event handler 1
Event handler 2
Model
-data
-Reference to
listener object Run time Environment (JVM)
Event Component Listener code
E1 C1 L1 1234
E2 C2 L2 5678
……..
Application
(from OS)
Controller

Some Common Events
Object Event Interface Method
JButton ActionEvent ActionListener actionPerformed()
JCheckBox ActionEvent
ItemEvent
ActionListener
ItemListener
actionPerformed()
itemStateChanged()
JRadioButton ActionEvent
ItemEvent
ActionListener
ItemListener
actionPerformed()
itemStateChanged()
JTextField
JTextArea
ActionEvent
FocusEvent
ActionListener
FocusListener
actionPerformed()
focusGained(), focusLost()
JPasswordField ActionEvent ActionListener actionPerformed()
7
More Details about events will be introduced in the next session.

3- About Java Foundation Classes
8
 JFC encompass a group of features for building graphical user
interfaces (GUIs) and adding rich graphics functionality and interactivity
to Java applications. It is defined as containing the features shown in the
table below:
This trail concentrates on the Swing components. We help you choose the appropriate components for your GUI, tell you how to use them, and give you the background
Feature Description
Swing GUI
Components
Includes everything from buttons to split panes to tables. Many components are capable of sorting,
printing, and drag and drop, to name a few of the supported features.
Pluggable Look-
and-Feel Support
Allowing a choice of look and feel. For example, the same program can use either the Java or the
Windows look and feel. Additionally, the Java platform supports the GTK+ look and feel, which
makes hundreds of existing look and feels available to Swing programs. Many more look-and-feel
packages are available from various sources.
Accessibility API Enables assistive technologies, such as screen readers and Braille displays, to get information from
the user interface.
Java 2D API Enables developers to easily incorporate high-quality 2D graphics, text, and images in applications
and applets. Java 2D includes extensive APIs for generating and sending high-quality output to
printing devices.
Internationalization Allows developers to build applications that can interact with users worldwide in their own
languages and cultural conventions. With the input method framework developers can build
applications that accept text in languages that use thousands of different characters, such as
Japanese, Chinese, or Korean.

JFC…
9
 Which Swing Packages Should I Use?
The Swing API is powerful, flexible — and immense. The Swing API has 18
public packages:
This trail concentrates on the Swing components. We help you choose the appropriate components for your GUI, tell you how to use them, and give you the background

4- A Strategy for Designing the GUI
Identify needed components.
Isolate regions and behaviors.
Sketch (phác hoạ) the GUI.
Choose Layout managers.
Requirements
Input data
Output Data
Operations
Implement
event handlers
10

5- Ordinary Swing Component
11
Component Properties:
Name, size, location,
background color,
foreground color, font,
enable, editable
Set/get

Ordinary Swing Components
javax.swing package contains APIs for developing
GUI Apps Refer to Java documentation for more
details of this package.
Almost component class names begin with ‘J’
Three categories:
Container components
Ordinary components:
Menu components.
12

Ordinary Swing Components…
Containers: JFrame, JPanel
They contain other components.
They use layout managers to
determine the size and position of
their child components.
JFrame is a top-level container.
JPanel is called general-purpose
container. It is a lightweight container.
13

Ordinary Components
JLabel
JTextfield
JRadioButton
(ButtonGroup)
JComboBox
JTextArea
JScrollBar
JCheckBox
JButton
14

Demo 1
15
Objectives
Use a panel to group some components
Hide and show those as a whole through this panel
Disable the exit button on the frame
The exit button allows user close the application
GUI:

Demo 1
17
Class Object name Properties
JFrame GUI_01 Layout: null, defaultCloseOperation: DO_NOTHING
Title: GUI-Demo 1
JPanel pEmp Layout: null, Border: tittleBorder
JLabel lbCode Opaque: true, background: green, foreground: white
horizontalAlignment: RIGHT, text: Code
JLabel others Text: Name, Sex, Degree
ButtonGroup bgrpSex
JRadioButton rdMale buttonGroup: bgrpSex, Text: Male, Selected: true,
JRadioButton rdFemale buttonGroup: bgrpSex, Text: Female, Selected: false
JComboBox cbDegree Model:Ph. D., Master, Engineer, Bachelor, Technician
Setup Properties

Demo 1
18
Code:Constructor
Code for handling the event on the button Exit
Code for handling the event on the button ShowHide

Demo 1
19
View code at the end of the source file, inserted
by NetBeans  Comment
View the contents of the method
initComponents(), inserted by NetBeans, to
explore anonymous classes, then verify them
using Window Explorer

Summary
Two Kinds of Applications
Java Model for Event Management
About Java Foundation Classes (JFC)
A Strategy for Designing the GUI
Using Basic Swing Components
20

Slot04 creating gui

More Related Content

What's hot (20)

Similar to Slot04 creating gui (20)

Recently uploaded (20)

Slot04 creating gui