Bài 6: Ứng dụng đồ họa – Liệt kê các số nguyên tố

Lê Hồng Phương phuonglh@gmail.com Khoa Toán-Cơ-Tin học Trường ĐH Khoa học Tự nhiên, ĐHQG Hà Nội

Nội dung

● Liệt kê các số nguyên tố

● Các thành phần đồ họa

● Quản lí sự kiện

● Sử dụng lớp nội

2012-2013 Object-Oriented Programming: Introduction to Swing 2

Liệt kê các số nguyên tố

● Sử dụng thư viện Swing để phát triển một ứng dụng với giao diện đồ họa cho phép liệt kê các số nguyên tố.

● Sử dụng lại lớp PrimeNumbers (Bài giảng 1)

2012-2013 Object-Oriented Programming: Introduction to Swing 3

Liệt kê các số nguyên tố

● Cửa sổ ứng dụng có tên “Prime Numbers”,

gồm hai panô.

● Panô Input chứa 3 thành phần:

– Một nhãn (JTextLabel)

– Một trường văn bản (JTextField)

– Một nút bấm (JButton)

● Panô Result chứa 2 thành phần:

– Một vùng văn bản (JTextArea)

– Một khung cuộn (JScrollPane)

2012-2013 Object-Oriented Programming: Introduction to Swing 4

Liệt kê các số nguyên tố

● Khi nhập một số n vào trường văn bản và bấm phím Ok hoặc gõ Enter thì vùng văn bản hiển thị các số nguyên tố nhỏ hơn n.

– Mỗi số nguyên tố nằm trên một dòng

– Nếu có nhiều số nguyên tố, vượt quá số dòng của màn hình thì thanh cuộn tự động xuất hiện.

2012-2013 Object-Oriented Programming: Introduction to Swing 5

Các thành phần đồ họa

● Chương trình sử dụng các thành phần đồ họa sau

của thư viện Swing:

– JFrame (cửa sổ ứng dụng)

– JPanel (hai panô Input và Result)

– JLabel

– JButton

– JTextField

– JTextArea

– JScrollPane

– BorderLayout, TitledBorder

2012-2013 Object-Oriented Programming: Introduction to Swing 6

Chương trình

● Các lớp của chương trình:

– PrimeNumbers

– PrimeNumberFrame (là một JFrame)

– PrimeNumberApp (chứa hàm main)

● PrimeNumbers không chứa các thành phần đồ họa, chỉ cài đặt thuật toán kiểm tra và liệt kê số nguyên tố.

2012-2013 Object-Oriented Programming: Introduction to Swing 7

Chương trình: PrimeNumberApp

public class PrimeNumberApp {

public static void main(String[] args) {

PrimeNumberFrame app = new PrimeNumberFrame(); app.setVisible(true);

}

}

2012-2013 Object-Oriented Programming: Introduction to Swing 8

Chương trình: PrimeNumberFrame

public class PrimeNumberFrame extends JFrame {

private JTextField nTextField; private JButton okButton; private JTextArea resultTextArea; private PrimeNumbers pn;

public PrimeNumberFrame() {

Các phương thức kế thừa từ JFrame

setTitle("Prime Numbers"); setSize(200, 400); setDefaultCloseOperation(EXIT_ON_CLOSE); initialize();

} // more code goes here...

}

2012-2013 Object-Oriented Programming: Introduction to Swing 9

Chương trình: PrimeNumberFrame

● Một lớp vật chứa (JFrame, JPanel...) dùng để chứa các

thành phần đồ họa (nút bấm – JButton, trường văn bản – JTextField, nhãn văn bản – JLabel...)

● Swing sử dụng lớp LayoutManager để quản lí việc bài trí

các thành phần đồ họa.

● Có nhiều kiểu bài trí khác nhau:

– BorderLayout

– BoxLayout, CardLayout, FlowLayout, GridBagLayout,

GridLayout, GroupLayout, SpringLayout

2012-2013 Object-Oriented Programming: Introduction to Swing 10

Chương trình: PrimeNumberFrame

● BorderLayout cho phép đặt đối tượng vào một trong 5 vị

trí:

– NORTH

NORTH

WEST

EAST

CENTER

– SOUTH

SOUTH

– EAST

– WEST

– CENTER

● Kích thước của các đối tượng thường được co dãn tự

động theo kích thước của thành phần vật chứa.

2012-2013 Object-Oriented Programming: Introduction to Swing 11

Chương trình: PrimeNumberFrame

private void initialize() { pn = new PrimeNumbers(); // prepare the input panel JPanel inputPanel = new JPanel(); inputPanel.setBorder(new TitledBorder("Input")); inputPanel.setLayout(new BorderLayout()); inputPanel.add(new JLabel("Enter n = "), BorderLayout.WEST); nTextField = new JTextField(); inputPanel.add(nTextField); okButton = new JButton("Ok"); inputPanel.add(okButton, BorderLayout.EAST); // add the input panel to the frame getContentPane().add(inputPanel, BorderLayout.NORTH);

// more code goes here

}

2012-2013 Object-Oriented Programming: Introduction to Swing 12

Chương trình: PrimeNumberFrame

private void initialize() {

Gọi một hàm tạo khác của lớp JPanel

// ...

// prepare the result panel JPanel resultPanel = new JPanel(new BorderLayout()); resultPanel.setBorder(new TitledBorder("Result")); resultTextArea = new JTextArea(); resultPanel.add(new JScrollPane(resultTextArea),

BorderLayout.CENTER);

// add the output panel to the frame getContentPane().add(resultPanel, BorderLayout.CENTER);

// more code goes here

}

2012-2013 Object-Oriented Programming: Introduction to Swing 13

Chương trình: PrimeNumberFrame

class EnumeratePrimeNumbersListener implements ActionListener {

@Override public void actionPerformed(ActionEvent event) {

int n = Integer.parseInt(nTextField.getText()); String primes = pn.listPrimeNumbers(n); resultTextArea.setText(primes);

}

}

● Quản lí sự kiện:

– Viết một bộ nghe sự kiện (bấm phím, kích chuột...), là

một lớp cài đặt giao diện ActionListener

– Giao diện này có một phương thức duy nhất.

public void actionPerformed(ActionEvent event)

2012-2013 Object-Oriented Programming: Introduction to Swing 14

Chương trình: PrimeNumberFrame

class EnumeratePrimeNumbersListener implements ActionListener {

@Override public void actionPerformed(ActionEvent event) {

int n = Integer.parseInt(nTextField.getText()); String primes = pn.listPrimeNumbers(n); resultTextArea.setText(primes);

}

}

● Lớp EnumeratePrimeNumbersListener là lớp nội, nằm

trong lớp PrimeNumberFrame.

● Vì sao sử dụng lớp nội?

– Tiện lợi trong việc truy nhập các dữ liệu của lớp chứa nó (Ví dụ, sử dụng các trường pn, resultTextArea của lớp PrimeNumberFrame).

2012-2013 Object-Oriented Programming: Introduction to Swing 15

Chương trình: PrimeNumberFrame

● Gắn bộ nghe sự kiện bấm phím Enter (hoặc kích

chuột trái) cho trường văn bản và nút bấm:

private void initialize() {

// ...

// add an action listener to the Ok button EnumeratePrimeNumbersListener listener = new EnumeratePrimeNumbersListener(); okButton.addActionListener(listener); // add the same action listener to the text field nTextField.addActionListener(listener);

}

2012-2013 Object-Oriented Programming: Introduction to Swing 16

Tham khảo thêm

● Graphical User Interfaces

– http://docs.oracle.com/javase/tutorial/ui/TOC.html

● Creating GUI with JFC/Swing

– http://docs.oracle.com/javase/tutorial/uiswing/index.html

● API Documentation:

– http://docs.oracle.com/javase/6/docs/api/

– Browse javax.swing.* packages

2012-2013 Object-Oriented Programming: Introduction to Swing 17