Bài 5.

Lập trình giao

diện - GUI
Các gói lập trình giao diện trong Java

 Java cung cấp các gói lập trình giao diện chính sau:
• java.awt: cung cấp các lớp cơ bản để lập trình giao diện
• javax.swing: cung cấp các lớp mới để xây dựng giao diện chương
trình dễ dàng, mềm dẻo hơn
• java.swt: được phát triển bởi IBM
 Giao diện chương trình gồm cửa sổ và các thành phần điều
khiển (nút bấm, ô nhập dữ liệu...) đặt lên trên
 Có thể sử dụng plug-in để hỗ trợ:
• Eclipse: WindowsBuilder Pro
• Netbean: đã tích hợp
XÂY DỰNG GIAO DIỆN
VỚI JAVA SWING
Các gói trong Java Swing

 Swing cung cấp 18 gói có thể sử dụng xây dựng giao diện đồ họa
 Thường sử dụng lệnh import javax.swing.* để chương trình trở nên
ngắn gọn
 Ưu điểm của Swing so với AWT:
 Cung cấp thêm các đối tượng mới để xây dựng giao diện đồ họa
 look-and-feel: tùy biến để các thành phần giao diện của Swing nhìn
giống như các thành phần giao diện của HĐH
 Hỗ trợ các thao tác sử dụng bàn phím thay chuột
 Sử dụng tài nguyên hiệu quả hơn
Các thành phần của Swing
Swing Container

 Top-level container:
• JFrame: sử dụng cho các cửa sổ chính của chương trình
• JApplet: sử dụng trên trình duyệt
• JDialog: cửa sổ thông báo
 Secondary container: JPanel
• Thêm các đối tượng vào cửa sổ JFrame:
• Không thể thêm trực tiếp
• Phải tương tác qua Content Pane của Jframe
 Đối tượng JFrame cung cấp 2 phương thức
• getContentPane() trả lại một đối tượng ContentPane thuộc lớp
Container
• setContentPane(JPanel): thiết lập nội dung cho Content Pane
JFrame
 Là một cửa sổ có tiêu đề, viền, thanh menu ( tùy chọn ) và các thành
phần được chỉ định khác
 Nó có thể di chuyển, thay đổi kích thước và có icon đại diện
 Nó không phải là một subclass của JComponent
 Nó thường được dùng để chứa các thành phần giao diện khác ( Button,
Label, … )
Một số phương thức cơ bản của JFrame

 setSize(int width,int height) : Đặt kích thước cho JFrame

 setLocation(int x,int y) : Đặt vị trí cho JFrame.( Mặc định thì một
JFrame sẽ hiển thị ở vị trí góc trên – trái của màn hình. )
 setVisible(boolean b) : Đặt JFrame ẩn/hiện
 setDefaultCloseOperation(int operation): Đặt hành động mặc định sẽ
xảy ra khi người dùng “close” Frame. Mặc định là HIDE_ON_CLOSE,
các lựa chọn khác gồm DO_NOTHING_ON_CLOSE,
DISPOSE_ON_CLOSE, EXIT_ON_CLOSE
 setTitle(String title) : Đặt tiêu đề cho JFrame
 setResizable(boolean b): Đặt JFrame có được thay đổi kích thước hay
không
Các hàm tạo của JFrame
 JFrame() : Khởi tạo một frame mới invisible
 JFrame(GraphicsConfiguration qc) : Tạo một Frame được chỉ
địnhGraphicsConfiguration của màn hình thiết bị và tiêu đề trắng
 JFrame(String title) : Tạo một frame mới invisibile với tiêu đề được chỉ
định
 JFrame(String title, GraphicsConfiguration qc) : Tạo một Frame được
chỉ định tiêu đề và GraphicsConfiguration của màn hình thiết bị.
Các bước cơ bản tạo một cửa sổ JFrame :

 B1 : Khởi tạo một đối tượng của lớp JFrame

 B2 : Đặt kích thước cho JFrame
 B3: Đặt tiêu đề cho JFrame ( Nếu không đặt thì thanh tiêu đề sẽ trắng )
 B4: Đặt hành động mặc định cho việc “close” JFrame
 B5: Đặt JFrame hiển thị
 Ví dụ về JFrame
import javax.swing.JFrame;

public class HelloWorld {

public static void main(String[] args) {
// create frame with title "HelloWorld"
JFrame frame = new JFrame("HelloWorld");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

// set Size and location frame

frame.setSize(250, 200);
frame.setLocation(300, 200);

// display frame
frame.setVisible(true);
}
}
JPanel
 JPanel là một container (thùng chứa) nó dùng để chứa các đối tượng
tương tự như JFrame tuy nhiên nó không phải là 1 JFrame. Dễ hiểu hơn
thì bạn có thể hình dùng ngôi nhà của chúng ta là 1 JFrame, còn phòng
ngủ, phòng khách, phòng ăn đó là các JPanel, tức là trong một JFrame
chứa các JPanel, trong mỗi JPanel lại có thể chứa các đối tượng hoặc
thậm chí là các JPanel khác.
Các thao tác JPanel

 Chúng ta có 2 Phương thức khởi tạo JPanel hay dùng đó là:

– JPanel(): Tạo 1 JPanel với Layout mặc định là FlowLayout.
– JPanel(LayoutManager layout): Tạo 1 JPanel với Layout được chỉ
định.
 Sử dụng phương thức add để thêm các compent cho mà Jpanel chứa.
 Xem ví dụ. JPanel
Layout trong Java Swing

 Layout trong Java Swing là sự sắp xếp các thành phần JComponent bên
trong Container theo từng phương cách nhất định. Tác vụ sắp xếp nói
trên được thực hiện tự động bởi Layout Manager.
 Trong java Swing có các lớp Layout sau:
 FlowLayout
 BoxLayout
 BorderLayout
 GridLayout
FlowLayout
 FlowLayout là layout mặc định trong Java Swing.
 FlowLayout có cách sắp xếp các thành phần trong giao diện giống với
cách mà bạn viết trên giấy, chữ này kế tiếp chữ kia và hết hàng thì
xuống dòng.
 Ví dụ đơn giản: Xây dựng ứng dụng có 7 Button, sắp xếp các JButton
trong giao diện chương trình sử dụng FlowLayout

 Xem ví dụ
BoxLayout trong Java Swing

 Cách sắp xếp các Component của BoxLayout. Giống như cách bạn sắp
xếp các chiếc hợp chồng lên nhau theo chiều dọc hoặc nằm kề nhau
theo chiều ngang
 Hãy đi vào một Ví dụ xây dựng ứng dụng đơn giản bao gồm :
 1 JLabel : ” BoxLayout Java Swing – kynangcntt.info”
 1 JTextField
 1 JButton : “OK”
 Sử dụng BoxLayout sắp xếp giao diện chương trình
BorderLayout trong Java Swing

 BorderLayout chia giao diện Container thành 5 phần Đông, Tây, Nam,
Bắc, Trung tâm và các Component được sắp xếp vào từng phần được
chia.
 Ví dụ : Xây dựng ứng dụng có 5 JButton ( North, West, East, South )
 Sắp xếp các thành phần trong giao diện sử dụng BorderLayout.
GridLayout trong Java Swing
 GridLayout quản lý, sắp xếp các thành phần giao diện vào một bảng với
các ô bằng nhau. Giống như cách ta sắp xếp từng quân cờ vào bàn cờ
vậy 😉

 Ví dụ : Xây dựng chương trình như hình sau :

JLabel
 Có nguồn gốc từ JComponent, được dùng để tạo một nhãn văn bản
 Cung cấp text chỉ dẫn hoặc thông tin trên giao diện người dùng : hiển
thị một dòng đơn text chỉ đọc , một hình ảnh hoặc cả text và hình ảnh.
 Chúng ta thường sử dụng JLabel khi cần tạo một thành phần giao diện
người dùng hiển thị một thông điệp hoặc một hình ảnh.
Các phương thức cơ bản của JLabel

 setText(String text): Đặt giá trị text cho JLabel

 getText() : Lấy giá trị text của JLabel
 setToolTipText(String text) : Đặt Tooltip cho JLabel ( Khi di chuột trên
Label sẻ hiển thị text tip )
 setForeground(Color fg): Đặt màu cho chữ
 setIcon(Icon icon) : Đặt icon cho JLabel
 setSize(int width, int height) : Đặt kích thước cho JLable
Các hàm khởi tạo của JLabel

 JLabel() : Tạo một thể hiện JLabel không có hình ảnh và một chuỗi
rỗng
 JLabel(Icon image, int horizontalAlignment) : Tạo một thể hiện JLabel
chỉ định một hình ảnh và horizontal alignment
 JLabel(String text) : Tạo một thể hiện JLabel chỉ định text
 JLabel(String text, Icon icon, int horizontalAlignment) : Tạo một thể
hiện JLabel chỉ định text, image và horizontal alignment
 JLabel(String text, int horizontalAlignment) : Tạo một thể hiện JLabel
chỉ định text, và horizontal alignment.
JButton
 JButton là một đối tượng mà cho phép chúng ta khi click chuột vào sẽ
thực hiện một việc gì đó.
Khởi tạo JButton:
 JButton() : Tạo một Button không có text hoặc icon
 JButton(Action a) : Tạo một Button có thuộc tính được lấy từ một
Action
 JButton(Icon icon) : Tạo một Button chỉ định một icon
 JButton(String text) : Tạo một Button chỉ định text
 JButton(String text, Icon icon) : Tạo một Button chỉ định text và icon
;
}

Tạo và bắt sự kiện vớiJButton

 Cách 1: Tạo action cho Jbutton ta sử dụng phương thức addActionListener
của JButton để thực hiện việc này. Sau đó có thể tạo mới 1 ActionListener
ngay trong đó. Gõ new Action sau đó ấn Ctrl + Space (cách) NetBean hoặc
Eclipse sẽ hiển thị cho danh sách các phương thức và interface,
chọn ActionListener() nó sẽ tự động tạo phương thức ActionPerformed().

lb = new JLabel("My JLabel");

// create JButton with text "Click Button"
JButton btn = new JButton("Click Button");
// add action
btn.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent arg0) {
changeTextJLabel();

}
});
private void changeTextJLabel() {
lb.setText("You are clicked JButton")
}
Tạo và bắt sự kiện vớiJButton
 Cách 2: implements Interface ActionListener để phục vụ việc lắng nghe
sự kiện. Khi implements Interface này thì chúng ta cần phải Override
phương thức actionPerfomed() của nó để thực hiện việc lắng nghe sự
kiện
 Xem source code ví dụ
JTextField
 là một đối tượng cho phép người dùng nhập một dòng văn bản. Thường
dùng để nhập dữ liệu với các thông tin ngắn
Các hàm khởi tạo của JTextField

 JTextField(): Tạo mới 1 JTextField

 JTextField(Document doc, String text, int columns): Tạo 1 JTextField
sử dụng mô hình lưu trữ văn bản với đoạn text và số cột (coloumns)
 JTextField(int columns): Tạo JTextField trống với độ rộng là columns
 JTextField(String text): Tạo JTextField với text cho trước
 JTextField(String text, int columns): Tạo JTextField với text và độ rộng
cho trước.
Xử lý dữ liệu trên JTextField
 Muốn lấy dữ liệu (mà ở đây thực chất là một chuỗi) từ JTextField ta
dùng phương thức getText().
 Muốn đặt dữ liệu cho JtextField ta dùng phương thức setText(String
text).
 Phương thức requestFocus() giúp con trỏ nhảy (tập trung) đến
JTextField đó.
 Phương thức setEditable(boolean edit) để đặt có được nhập dữ liệu
cho JTextField hay không.
 getSelectedText(): lấy đoạn text được chọn trong JTextField
 setSelectionStart(int selectionStart) và setSelectionEnd(int
selectionEnd) đặt vị trí bắt đầu và kết thúc để chọn text
 getCaretPosition() và setCaretPosition(position) lấy và đặt vị trí hiện
thời của con trỏ.
 Xem source code ví dụ
Xử lý sự kiện trên JTextField
 Để bắt sự kiện của các phím ta sử dụng phương
thức addKeyListener() và làm tương tự như các cách bắt sự kiện của
JButton nhưng với KeyListener chứ không phải với ActionListener.
 Sử dụng phương thức setHorizontalAlignment để căn lề cho
JTextField.
 Xem source code ví dụ
Resources

 java.sun.com
 Java docs
 Java support forum : supportforum.sun.com
 Java tutorial
 …