LẬP TRÌNH GIAO DIỆN VỚI SWING ppsx

GIAO DIỆN NGƯỜI DÙNG VỚI JAVA + Cung cấp các công cụ cho phép tạo giao tiếp trực quan và hấp dẫn với người dùng,được biết đến là swing + Giao diện với người dùng bao gồm 1 cửa sổ chính v

1.Giới thiệu về Swing

Swing là thư viện lập trình mở rộng của java Nó mở rộng các đối tượng giao diện đồ họa cơbản của java Swing còn được gọi là thư viện JEC (Java Foundations Class) Khi muốn sử dụng các đối tượng đồ họa của thư viện này, ta phải khai báo chỉ thị:

Import javax.swing.*;

2 Tại sao lại sử dụng Swing?

Swing là gói con được kế thừa và phát triển từ gói giao diện awt – 1 gói giao diện đời đầu Swing sử dụng những thư viết tự viết độc lập với hệ thống do đó tính ổn định cao, loại bỏ được nhược điểm của awt là phụ thuộc vào hệ thống dẫn đến những kết quả khác nhau ở những hệ điều hành khác nhau

Định nghĩa những yếu tố dụng nhất tạo nên cảm quan (Look And Feel) cho mỗi thành phần Swing Trong gói này chứa các gói con là javax.swing.plaf.basic, javax.swing.plaf.metal và javax.swing.plaf.multi

Chứa những chức năng cần thiết cho việc bổ sung chức năng undo

II Các thành phần trong swing

NỘI DUNG

+ Giao diện người dùng với Java (Java GUI)

+ Các Container : JFrame, JPanel, Jdialog

+ Các component: Jlabel, Jtextfield, Jbutton, JComboBox, JcheckBox, JradioButton+ Layout manager: FlowLayout, GridLayout, BorderLayout, …

+ Tạo menu

1 GIAO DIỆN NGƯỜI DÙNG VỚI JAVA

+ Cung cấp các công cụ cho phép tạo giao tiếp trực quan và hấp dẫn với người dùng,được biết đến là swing

+ Giao diện với người dùng bao gồm 1 cửa sổ chính và các control được đặt lên trên

+ Các thành phần tạo giao diện nằm trong gói javax.swing

+ Tên của các lớp này bắt đầu bằng chữ J

+ Các thành phần đồ họa được đưa vào content pane, không đưa trực tiếp vào đối tượng JFrame

+ JPanel là container trung gian dùng để chứa các conponent khác

+ Thường dùng để phân chia các component trong ứng dụng

JPanel p = new JPanel ();

JFrame f = new JFrame(“Testing a Panel”);

JPanel không thể được nhìn thấy trực tiếp Do đó, chúng ta cần thêm panel đến một frame

Vì vậy ta cần tạo một JFrame mới và thêm JPanel mới được tạo này vào đó

Kết xuất của chương trình:

JDialog

Lớp JDialog tương tự như lớp JFrame, nghĩa là JDialog là lớp con của lớp Window.Đối tượng dialog được tạo như sau:

JFrame myframe=new JFrame(“My frame”);

String title = “Title”;

boolean modal = true;

JDialog dlg=new JDialog(myframe, title, modal);

Tham số modal chỉ ra rằng dialog sẽ ngăn chặn bất kỳ tương tác nào xảy đến với cáccửa sổ được mở khác, trong khi dialog đang được hiển thị trên màn hình Kiểu hộpthoại này ngăn chặn người dùng tương tác với các cửa sổ khác (của cùng ứng dụng)trên màn hình, cho tới khi dialog được đóng lại

2 CÁC THÀNH PHẦN GIAO TIẾP NGƯỜI DÙNG CƠ BẢN

+ Form được dùng để thu thập thông tin tù phía người dùng

+ Trong khi giao tiếp, component được dùng để cho phép nhập liệu là TextField hoặc TextBox

+ Để khởi tạo các phần tử, các bước cần phải thực hiện là:

Tạo phần tử

Thiết lập các thuộc tính (size, color, font, …)Đưa nó vào màn hình

Các loại component

Hình 2.1 JLabel

+ Được dùng để hiện thị văn bản (text) và hình ảnh (image)

+ Tạo hiệu ứng trực quan cho màn hình giao diện

+ Các hàm khởi tạo:

JLabel(); Tạo JLabel trốngJLabel(String st); Tạo JLabel với nội dung là stJLabel(Icon img); Tạo JLabel nội dung là hình ảnh imgJLabel(int align); Tạo một JLabel với một chế độ canh lề (alignment) , canh

lề có thể là JLabel.LEFT, JLabel.RIGHT hay JLabel.CENTER

Các phương thức được sử dụng phổ biến của label được trình bày ở bảng bên dưới:

Phương thức Chức năng

setFont(Font f) Thay đổi phông chữ của JLabelsetText(String s) Thiết lập nhãn cho Jlabel

getText() Lấy nội dung hiện tại của nhãn

Bảng 2.1 Các phương thức của JLabel

Chương trình 2.1 chỉ ra cách sử dụng của Label:

Chương trình 2.1

import javax.swing.*;

class Labeltest

{

JLabel label=new JLabel(“This is just a label”);

public static void main(String args[])

add(label); Label sẽ hiển thị chỉ khi nó được thêm vào container Ở đây, JFrame là

container mà thành phần JLabel được thêm vào Việc này được thực hiện bằng cách sửdụng phương thức add()

Kết xuất của chương trình được chỉ ra ở hình sau

JTextField(); tạo JTextField mớiJTextField(int cols); tạo JTextField mới với số cột cho trướcJTextField(String text); tạo JTextField mới với nội dung cho trướcJtextField(String text, int col);

Các phương thức thường được sử dụng của đối tượng TextField được tóm tắt trongbảng sau:

setEchoChar(char) Đặt các kí tự được hiện ra thay thế

ký tự nhập vào

setText(String s) Gán nội dung cho TextField

setEditable(boolean) Xác định TextField có soạn thảo

được hay không Nó chỉ được soạnthảo khi giá trị tham số truyền vào

là True

isEditable() Xác định xem trường có đang trong

mode soạn thảo hay không Giá trịtrả về kiểu Boolean

Chương trình sau chỉ ra cách sử dụng của TextField:

JPanel p = new JPanel();

JFrame f = new JFrame();

Kết xuất của chương trình được chỉ ra ở hình bên dưới:

JTextArea

+ Cho phép nhập nhiều dòng văn bản

+ Có hỗ trợ thanh cuộn

+ Hàm khởi tạo:

JTextArea(); tạo mới một JTextAreaJTextArea(int rows, int cols); tạo mới một JTextArea với số cột và số dòng

cho trướcJTextArea(String text); tạo mới một JTextArea với nội dung cho trướcJTextArea(String text, int rows, int cols);

Các phương thức thường được sử dụng nhiều nhất của JTextArea:

setText(String) Gán nội dung cho JTextArea

getText() Trả về nội dung của JTextArea

setEdiable(boolean) Xác định xem JTextAreacó thể được soạn

thảo hay không JTextArea có thể được soạnthảo khi giá trị này là True

isEdiable() Xác định xem JTextArea có đang trong chế

độ soạn thảo được không Trả về giá trị làkiểu Boolean

insertText(String, int) Chèn chuỗi được vào vị trí được cho trước

replaceText(String, int, int) Thay thế văn bản nằm giữa vị trí int, int cho

JLabel lb=new JLabel(“Details”);

JTextArea ta=new JTextArea();

JFrame f=new JFrame(“TextArea”);

JPanel p=new JPanel();

import java.awt.*;

class DemoFrm extends JFrame {

public DemoFrm() {

super("Demo Frame");

JPanel p = new JPanel();

JLabel l = new JLabel("Password");

JPasswordField pf = new JPasswordField(12);pf.setEchoChar('*');

+ Thể hiện chức năng nút bấm

+ JButton là lớp con của lớp AbstractButton

+ Đối tượng JButton bao gồm chuỗi văn bản, hình ảnh và các đường viền+ Khởi tạo:

JButton b1 = new JButton(“red”);

JButton b2 = new JButton(“Green”);

JButton b3 = new JButton(“Blue”);

JFrame f= new JFrame(“Button”);

JPanel p= new JPanel();

p.add(b1);

p.add(b2);

JCheckBox(String text, boolean selected);

JCheckBox(String text, Icon icon);

JCheckBox(String text, Icon icon, boolean selected);JCheckBox(Action a);

Chương trình sau minh họa cách sử dụng các checkbox

JLabel l=new JLabel("CheckBoxes");

JCheckBox b1=new JCheckBox("red",true);

JCheckBox b2=new JCheckBox("Green",false);JCheckBox b3=new JCheckBox("Blue",false);

JFrame f=new JFrame("Checkbox and radiobutton");JPanel p=new JPanel();

JRadioButton(String text, boolean selected);

JRadioButton(String text, Icon icon);

JRadioButton(String text, Icon icon, boolean selected);JRadioButton(Action a);

Chương trình sau minh họa cách sử dụng các radiobutton:

JLabel l=new JLabel("JRadioButton");

JRadioButton b1=new JRadioButton("red",true);JRadioButton b2=new JRadioButton("Green",false);JRadioButton b3=new JRadioButton("Blue",false);

JFrame f=new JFrame("JCheckbox");

JPanel p = new JPanel();

ButtonGroup bg = new ButtonGroup();

Kết xuất được chỉ ra ở hình bên dưới:

JList

+ Khi các thông tin dùng để lựa chọn nhiều, chúng ta có thể dùng 1 danh sách để cho phép việc chọn lựa

+ Component JList cho phép sắp xếp dữ liệu hiển thị, có thể phân nhóm

+ JList có thể hiển thị chuỗi và icon

+ JList không hỗ trợ double click chuột

JLabel l = new JLabel("Colors");

String []listData = {"white","black","blue","green"};JList list = new JList(listData);

Cách sử dụng JComboBox tương tự JList

Kết xuất

BỐ TRÍ CÁC THÀNH PHÂN BÊN TRONG CÁC ĐỐI TƯỢNG CHỨA

Layout manager điều khiển cách trình bày vật lý của các phần tử GUI như là button,textbox, option button v.v… Một layout manager tự động bố trí các thành phần này trongcontainer

Các kiểu trình bày khác nhau:

Tất cả các thành phần mà chúng ta vừa tạo sử dụng layout manager mặc định Cho

ví dụ, FlowLayout là cách trình bày mặc định của một applet Layout manager này sẽ

tự động xắp xếp các thành phần Tất cả các thành phần được đặt trong một container,

và được xắp xếp nhờ layout manager tương ứng Layout manager được thiết lậpbằng phương thức setLayout()

Bây giờ chúng ta sẽ tìm hiểu chi tiết các cách trình bày và cách bố trí các thành phần của ta vào những vị trí mong muốn

FlowLayout

FlowLayout là layout manager mặc định cho Applet và Panel Các thành phần được xắp xếp

từ góc trái trên đến góc phải dưới của màn hình Khi một số thành phần được tạo, chúngđược xắp xếp theo hàng, từ trái sang phải

Lớp FlowLayout có 3 cấu trúc:

public FlowLayout();

public FlowLayout(int alignment);

public FlowLayout(int alignment, int horizontalGap, int verticalGap);

aglignment có các giá trị FlowLayout.LEFT, FlowLayout.CENTER, FlowLayout.RIGHT.Thông số horizontalGap và verticalGap xác định số Pixel đặt giữa các thành phần

Chương trình sau minh họa về FlowLayout manager

import javax.swing.*;

import java.awt.FlowLayout;

class Fltest extends JFrame

{

JButton b1=new JButton(“Center Aligned Button 1”);

JButton b2=new JButton(“Center Aligned Button 2”);

JButton b3=new JButton(“Center Aligned Button 3”);

public Fltest(String title)

 NORTH – Đặt ở đỉnh của container.

 EAST – Đặt phía bên phải của container

 SOUTH – Đặt ở phía dưới của container

 WEST – Đặt phía bên trái của container

 CENTER – Đặt ở giữa của container

Để thêm một thành phần vào vùng North, bạn sử dụng cú pháp sau:

Button b1=new Button(“North Button”); // khai báo thành phần

setLayout(new BorderLayout()); // thiết lập layout

add(b1,BorderLayout.NORTH); // thêm thành phần vào layout

Các thành phần vẫn giữ nguyên vị trí tương đối của chúng kể cả khi container bị thay đổikích thước Các thành phần được đặt trong vùng North, South được dàn nằm ngang trongkhi đó các thành phần đặt trong vùng East và West lại được dàn thẳng đứng Các thànhphần được đặt trong vùng Center sẽ được dàn đều vào những khu vực nằm giữa củacontainer

add(b2,BorderLayout.CENTER); // thêm thành phần vào vùng Center

Khi tất cả các thành phần được đặt vào các vùng tương ứng, lúc đó JFrame sẽ giống nhưsau:

BorderLayout có thể chứa nhiều hơn 5 thành phần Để thực hiện điều này, chúng ta có thể

sử dụng các Panel với các layout khác nhau để chứa các thành phần, và sau đó đặt cácpanel này vào trong BorderLayout

CardLayout Manager

CardLayout có thể lưu trữ một ngăn xếp (stack) các giao diện Mỗi giao diện giống như mộtbảng (card) Bảng thường là đối tượng Panel Một thành phần độc lập như button sẽ điềukhiển cách trình bày các bảng ở lớp trên cùng.

Đầu tiên, chúng ta bố trí tập hợp các thành phần được yêu cầu trên các panel tương ứng.Mỗi panel sẽ được bố trí vào các layout khác nhau Ví dụ:

Bước kế tiếp là thêm các panel khác vào panel chính:

panelMain.add(“Red Panel”, panelOne);

panelMain.add(“Blue Panel”, panelTwo);

Phương thức add() sử dụng hai tham số Tham số đầu tiên là một String làm nhãn của panel

và tham số thứ hai là tên đối tượng Panel

Chương trình minh họa CardLayout:

Trong hình bên trên, các panel được thêm vào panel chính như là các thẻ riêng biệt Vì thếchỉ có thẻ đầu tiên mới được thấy trên màn hình Nhưng người dùng có thể điều hướngsang các panel khác sử dụng các phương thức của CardLayout.

GridLayout Manager

GridLayout trợ giúp việc chia container vào trong ô lưới Các thành phần được đặt trong các

ô giao của dòng và cột Mỗi lưới nên chứa ít nhất một thành phần Một lưới được sử dụngkhi tất cả các thành phần có cùng kích thước

GridLayout được tạo như sau:

Gridlayout g1=new GridLayout(4,3);

JButton btn[];

String str[]={“1”, “2”, “3”, “4”, “5”, “6”, “7”, “8”, “9”};public Gltest(String title)

GridBagLayout Manager

GridBagLayout là cách trình bày hiệu quả và phức tạp hơn bất cứ cách trình bày nào khác.Layout này đặt các thành phần vào vị trí chính xác Với layout này, các thành phần khôngcần có cùng kích thước Nó tương tự như GridLayout manager, khi các thành phần đượcxắp xếp trong lưới theo dòng và cột Tuy nhiên, thứ tự đặt các thành phần không theonguyên tắc từ trái sang phải và từ trên xuống dưới

GridBagLayout gb=new GridBagLayout()

ContainerName.setLayout(gb);

Để sử dụng layout này, bạn cần cung cấp thông tin về kích thước và vị trí của mỗi thànhphần Lớp GridBagLayoutConstraints chứa tất cả các thông tin mà lớp GridLayout cần để bốtrí và định kích thước mỗi thành phần Bảng sau liệt kê danh sách các biến thành viên củalớp GridBagConstraints

Các biến thành viên Mục đích

weightx, weighty Chỉ ra sự phân phối của khoảng trống trong

GridBagLayout Giá trị mặc định cho các biến này là0

gridwidth, gridheight Chỉ ra số lượng các ô (cell) chiều ngang và chiều

dọc trong vùng hiển thị của một thành phần

ipadx, ipady Chỉ ra lượng làm thay đổi chiều cao và chiều rộng

tối thiểu của thành phần Nó sẽ thêm 2*ipadx vàochiều rộng tối thiểu và 2*ipady vào chiều cao tốithiểu của thành phần Giá trị

mặc định cho cả hai là 0

anchor Chỉ ra cách xắp xếp các thành phần trong cell Mặc

định sẽ đặt vào giữa cell Các thành viên dữ liệutĩnh (static) sau đây có thể được sử dụng:

trị của gridx là ‘GridbagConstraints.RELATIVE’ thì thành phần được thêm sẽ nằm ở vị trí bên phải củathành phần cuối cùng

fill Chỉ ra cách mà một thành phần được bố trí vào cell

thế nào nếu như cell lớn hơn thành phần Mặc định

là kích thước thành phần không thay đổi

Bảng Các biến thành viên của lớp GridBagConstraints

Bảng sau đây cung cấp một danh sách các biến dữ liệu tĩnh là các giá trị cho biến fill:

GridBagConstraints.NONE Mặc định, không làm thay đổi kích

thước của thành phần

GridBagConstraints.HORIZONTAL Tăng chiều rộng của thành phần theo

chiều ngang (HORIZONTAL) để làm cho thành phần khớp với chiều ngang

GridBagConstraints.VERTICAL Tăng chiều cao của thành phần theo

chiều đứng (VERTICAL) để làm chothành phần khớp với chiều dọc

GridBagConstraints.BOTH Tăng chiều rộng, chiều cao của thành

phần theo cả chiều ngang và chiều dọc

insets Xác định khoảng cách top, buttom, left

và right giữa các thành phần Mặc định

là 0

Bảng Các biến thành viên dữ liệu tĩnh của biến fill

Sử dụng phương thức setConstraints() để thiết lập các hằng số cho mỗi thành phần Cho vídụ:

addComponent(ta,0,0,4,1);

gbc.fill=GridBagConstraints.HORIZONTAL;addComponent(b1,0,1,1,1);

gbc.fill=GridBagConstraints.HORIZONTAL;addComponent(b2,0,2,1,1);

Kết xuất của chương trình được chỉ ra ở hình

Giải thích đoạn mã trên:

Thành viên fill của lớp GridBagConstraints chỉ ra thành phần có thể được mở rộng theohướng nằm ngang và thẳng đứng Cú pháp sau mô tả thành phần chỉ được mở rộng theohướng nằm ngang:

Ở đây gridx, gridy là cột và dòng nơi mà thành phần có thể được đặt vào

Sử dụng cú pháp sau để chỉ ra số lượng các cột và dòng mà các thành phần có thể chiếmgiữ:

Làm việc không có LayoutManager (Absolute Positioning)

+Bạn có thể đặt các vị trí cho các component mà không cần đung layout manager Giải pháp này dùng để xác định hoàn toàn kích thước và vị trí của component

+ Mặc dù có thể làm việc mà không cần Layout Manager, bạn nên dùng Layout

manager nếu có thể để thay đổi kích thước của Container và điều chỉnh hình dạng của các thành phần phụ thuộc vao Platform

JButton b1 = new JButton("one");

JButton b2 = new JButton("two");

JButton b3 = new JButton("three");