Chương 4 KỸ THUẬT LẬP TRÌNH GIAO DIỆN NGƯỜI DÙNG (GUI) TRONG JAVA

Chương 4

KỸ THUẬT LẬP TRÌNH  GIAO DIỆN NGƯỜI DÙNG (GUI) TRONG JAVA

Nội dung

 Khái niệm, đặc điểm cơ bản  Tổng quan thư viện AWT  Tổng quan JFC Swing  Component  Container  Layout manager  Các bước xây dựng GUI

 Các component cơ bản  Các container  Các kiểu layout manager  Mô hình, cơ chế xử lý event  Ví dụ minh họa, bài tập

 Ví dụ minh họa

Tài liệu đọc thêm

[1] Kathy Walrath, Mary Campione, Alison Huml, Sharon Zakhour.

The  JFC  Swing  Tutorial,  Second  Edition.  Copyright  ©  2004  Sun  Microsystems, Inc.

Thư viện GUI trong java

t

ư ệ ỗ ợ ậ

ỗ ợ

ấ

ợ

ớ

ế

• Th vi n h tr : t p h p các l p java cung c p h tr thi k , xây d ng GUI. ự ế

 awt (java.awt.*) Abstract Window Toolkit

 swing (javax.swing.*)

 Các components c a các nhà cung c p th 3

ủ

ứ

ấ

Tổng quan về AWT

AWTEvent

Container

Panel

Applet

Font

Button

Window

Frame

FontMetrics

Label

Dialog

FileDialog

TextField

TextComponent

Object

Color

TextArea

Graphics

List

Component

Choice

CheckBox

LayoutManager

CheckBoxGroup

Canvas

MenuComponent

MenuItem

Menu

MenuBar

Scrollbar

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Tổng quan về JFC Swing

Khái niệm component

component.

 Tất cả các thành phần cấu tạo nên chương trình GUI được gọi là

 Containers,   TextField, Label, Checkbox, TextArea  Scrollbars, Scrollpanes, Dialog   …

 Ví dụ

Khái niệm container

và tô màu.  Frame/JFrame, Panel/JPanel, Dialog/JDialog,

ScrollPane/JScrollPane, …

 Là thành phần mà có thể chứa các thành phần khác,có thể vẽ

 Gắn component vào khung chứa  containerObj.add(compObj);

 Lấy thông tin của component  objectName.get…( );  Gán thông tin cho component  objectName.set…( );

Khái niệm Layout Manager

 Flow Layout  Border Layout  Grid Layout  GridBag Layout   Null Layout  …

 Các loại layout khác nhau:

‘setLayout( )’

 Trình quản lý layout được thiết lập bằng cách gọi phương thức

Nguyên tắc xây dựng GUI trong java

Dialog/JDialog, …

 Lựa chọn 1 container: Frame/JFrame, Window/JWindow,

 Tạo các điều khiển: (buttons, text areas..)  Đưa các điều khiển vào vùng chứa  Sắp xếp các điều khiển(layout)  Thêm các xử lý sự kiện (Listeners)

FlowLayout

đến góc phải dưới của màn hình

 Là trình quản lý layout mặc định cho các applet và các panel  Với FlowLayout các thành phần sẽ được xắp xếp từ góc trái trên

 FlowLayout layout = new FlowLayout();  FlowLayout layout = new FlowLayout(FlowLayout.RIGHT); // Canh lề bên phải

 Các constructor:

FlowLayout

Flow Layout – Left and Right Aligned

BorderLayout

container

 Là trình quản lý layout mặc định cho Window, Frame và Dialog  Trình quản lý này có thể xắp xếp đến 5 thành phần trong

SOUTH, WEST và CENTER của container

 Các thành phần có thể được đặt vào 5 hướng NORTH, EAST,

 Button b1= new Button(“North Button”);   setLayout(new BorderLayout( ));       add(b1, BorderLayout.NORTH);

 Ví dụ: Để thêm một thành phần vào vùng North của container

BorderLayout

GridLayout

tr vi c chia container

thành m t l

ượ

c b trí ố

ợ ệ i ộ ướ ầ

i nên ch a ít nh t ứ

ấ

 H ỗ

m t thành ph n ầ  Ki u layout này đ

ượ ử ụ

c s d ng t c các thành ph n có ầ

 Các thành ph n đ trong các dòng và c tộ ướ

cướ

GridLayout layout = new GridLayout(no. of rows, no. of  columns); containerObj.setLayout(layout);

 M t ô l ộ ộ ể khi t ả ấ cùng kích th

GridBagLayout

các cột

 Bố trí các thành phần một cách chính xác  Các thành phần không cần có cùng kích thước  Các thành phần được xắp xếp trong một lưới chứa các dòng và

phải và trên­xuống­dưới

 Thứ tự đặt các thành phần không tuân theo hướng từ trái­sang­

 GridBagLayout gb = new GridBagLayout( );

 Hàm constructor

GridBagLayout

ữ ấ ả

ớ

ỗ

ớ

 L p ‘ớ GridBagLayoutConstraints’ l u tr t t c các thông tin mà l p ư GridLayout yêu c u: V trí và kích ị ầ thu c m i thành ph n ầ

NullLayout

c c a các components

• T do trong vi c đ nh v trí và kích th ệ ị

ự

ị

ướ ủ

Frame fr = new Frame("NullLayout Demo");

fr.setLayout(null);

Mô hình xử lý sự kiện

Có 3 yếu tố quan trọng trong mô hình xử lý sự kiện:

 Nguồn phát sinh sự kiện (event source)

 Sự kiện (event object)

 Bộ lắng nghe sự kiện (event listener)

Mô hình xử lý sự kiện

ồ

ả

Ngu n phát sinh s ki n ự ệ c n ph i đăng ký “b ộ ầ l ng nghe” đ x lý khi ắ ng

ể ử i dùng tác đ ng

ườ

ộ

class MyMenuItemListener implements ActionListener {

…

}

Hành động, sự kiện, lắng nghe

Đối tượng Sự kiện Bộ lắng nghe

Window, Frame, … WindowEvent WindowListener

Button, MenuItem, … ActionEvent ActionListener

TextComponent, … TextEvent TextListener

List, … ActionEvent ActionListener

… ItemEvent ItemListener

ComponentEvent ComponentListener

MouseEvent MouseListener

MouseMotionListener KeyListener KeyEvent

Tổng quan về event của AWT, Swing

java.awt.event.* java.awt.event.*

javax.swing.event.* javax.swing.event.*

Bài thực hành

components, đối tượng khung chứa container, bộ quản lý trình  bày Layout Manager.

 Viết chương trình minh họa việc sử dụng các đối tượng

nhân tương tự chương trình Calculator trên windows.

 Viết chương trình xây dựng giao diện chương trình máy tính cá

trình ứng dụng MS. WordPad trên Windows.

 Viết chương trình xây dựng giao diện tương tự giao diện của

Windows Explorer.

 Viết chương trình xây dựng giao diện chương trình tương tự