Ngôn ngữ lập trình java MVC trong swing – Tài liệu text

Ngôn ngữ lập trình java MVC trong swing

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (1.23 MB, 28 trang )

Ngôn ngữ lập trình java
II.MVC trong Swing(2)
III.Ứng dụng MVC trong chương trình:
1.Sự ra đời của mô hình MVC
2.Mô hình MVC trong swing
1.Model(M) – View(V) – Controller(C)
2. Tương tác trong MVC
3. Ưu điểm của MVC trong Swing
1. ShowDemo
2. JListExample
3. JTableExample
1.Sự ra đời của mô hình MVC:
Bắt đầu vào những năm 70 của thế kỷ 20, tại phòng
thí nghiệm Xerox PARC ở Palo Alto, sự ra đời của giao
diện đồ họa (Graphical User Interface) và lập trình
hướng đối tượng (Object Oriented Programming) cho
phép lập trình viên làm việc với những thành phần đồ
họa như những đối tượng đồ họa có thuộc tính và
phương thức riêng của nó. Không dừng lại ở đó, những
nhà nghiên cứu ở Xerox PARC còn đi xa hơn khi cho
ra đời cái gọi là kiến trúc MVC (viết tắt của Model –
View – Controller).

Swing trong java sử dụng kiến trúc Model -View –
Controller (MVC) như một thiết kế nền tảng đằng sau
mỗi một thành phần của nó.

Trong bài báo cáo này, nhóm em sẽ trình bày phương
pháp thiết kế MVC, và minh họa Cách sử dụng MVC
trong swing với ngôn ngữ lập trình java.

MVC được dùng một cách rộng rãi trong nhiều hệ
thống phần mềm hướng đối tượng (OO Application), bất
kể được viết bằng ngôn ngữ hướng đối tượng (OO
Language) nào. Và MVC được biết đến như là một thiết
kế giao diện người dùng hướng đối tượng khá tốt.
2.Mô hình MVC trong swing:
Hình 2: Mô hình MVC cải tiến của Swing
1.Model(M) – View(V) – Controller(C):

MVC trong Swing là kiến trúc cho các ứng dụng
gồm 3 phần:

Model: là phần logic của ứng dụng.(Trạng
thái của đối tượng đồ hoạ hay cấu trúc dữ
liệu của đối tượng)
Ví dụ 1: GUI Component đơn giản là Checkbox
Checkbox có thành phần:


View: phần hiển thị của ứng dụng.

Controller: điều khiển giao tiếp với người dùng.
Ví dụ 2: Trên JList

View để thể hiện nó với trạng thái tương ứng lên màn
hình

Controller :để xử lý những sự kiện khi có sự tương tác
của người sử dụng hoặc các đối tượng khác lên Checkbox.


Model: mô hình dữ liệu cho JList

View: là giao diện hiển thị các mục chọn

Controller: xử lý sự kiện mỗi khi các mục trong
JList được chọn

Model để quản lý trạng thái của nó là check hay uncheck

2. Tương tác trong MVC:

Khi người sử dụng cần thay
đổi trạng thái của đối tượng đồ
họa, thì sẽ tương tác thông qua
Controller của đối tượng đồ
họa.

Controller sẽ thực hiện việc
thay đổi trên Model. Khi có
bất kỳ sự thay đổi nào ở xảy ra
ở Model, nó sẽ phát thông điệp
(broadcast message) thông báo
cho View và Controller biết.

Nhận được thông điệp từ
Model:

View sẽ cập nhật lại thể
hiện của mình, đảm bảo

rằng nó luôn là thể hiện
trực quan chính xác của
Model.

Controller khi nhận được
thông điệp từ Model, sẽ
có những tương tác cần
thiết phản hồi lại người sử
dụng hoặc các đối tượng
khác.

Ví dụ: GUI Component là Checkbox
Khi người sử dụng nhấn chuột vào Checkbox:

Thành phần Controller của Checkbox sẽ
xử lý sự kiện này, yêu cầu thành phần Model
thay đổi dữ liệu trạng thái. Sau khi thay đổi
trạng thái, thành phần Model phát thông điệp
đến thành phần View và Controller
Thành phần Controller nhận được thông điệp
do Model gởi tới sẽ có những tương tác phản hồi
với người sử dụng nếu cần thiết
Thành phần View của Checkbox nhận được
thông điệp sẽ cập nhật lại thể hiện của Checkbox,
phản ánh chính xác trạng thái Checkbox do
Model lưu giữ.
Kiến trúc MVC đã tách biệt (decoupling) sự phụ thuộc
giữa các thành phần trong một đối tượng đồ họa, làm
tăng tính linh động (flexibility) và tính tái sử dụng
(reusebility) của đối tượng đồ họa đó. Một đối tượng

đồ họa bấy giờ có thể dễ dàng thay đổi giao diện bằng
cách thay đổi thành phần View của nó trong khi cách
thức lưu trữ (Model) cũng như xử lý (Controller)
không hề thay đổi. Tương tự, ta có thể thay đổi cách
thức lưu trữ (Model) hoặc xử lý (Controller) của đối
tượng đồ họa mà những thành phần còn lại vẫn giữ
nguyên.
3. Ưu điểm của MVC trong Swing
III.Ứng dụng MVC trong chương trình:
Ví dụ 1: Thiết kế giao diện như hình dưới

Model: Dữ liệu hiển thị cho TextArea

View: Giao diện hiển thị khi nhấn nút “Show”

Controller: Xử lý sự kiện khi nút “Show” được
nhấn
III.Ứng dụng MVC trong chương trình(3):
III.Ứng dụng MVC trong chương trình(1):
package mvc;
import java.awt.FlowLayout;
import java.awt.event.*;
import javax.swing.*;
public class ShowDemo extends JFrame implements ActionListener {
JTextArea jta;
JButton jbt;
public ShowDemo(){
JFrame jf = new JFrame();
jf.getContentPane().setLayout(new FlowLayout());
jf.setSize(300,150);

jta = new JTextArea(2,20);
jbt = new JButton(“Show”);
jbt.addActionListener(this); // Bat su kien
jf.getContentPane().add(jta);
jf.getContentPane().add(jbt);
jf.setVisible(true);
}
III.Ứng dụng MVC trong chương trình(2):
// Phuong thuc xu ly su kien khi nut duoc nhan
public void actionPerformed(ActionEvent e) {
if (e.getSource()==jbt){
jta.setText(“DE TAI BAO CAO NHOM 4”);
}
}
/**
* @param args
*/
public static void main(String[] args) {
// TODO Auto-generated method stub
new ShowDemo();
}
}
III.Ứng dụng MVC trong chương trình(4):
Ví dụ 2: Thiết kế giao diện như hình dưới

Model: Mô hình dữ liệu cho JList

View: Giao diện hiển thị các mục được chọn

Controller: Xử lý sự kiện khi một nút được nhấn

III.Ứng dụng MVC trong chương trình:
III.Ứng dụng MVC trong chương trình(5):
package mvc;
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class JListExample implements ActionListener {
private JList lst1,lst2;
private DefaultListModel dt1,dt2;
private JButton bt1,bt2;
public JListExample(){
JFrame jf = new JFrame();
jf.getContentPane().setLayout(new FlowLayout());
String dsMonHoc[]= {“Pascal”,”Java”,”Visual
Basic”,”C”,”C++”,”C#”};
dt1 = new DefaultListModel();
dt2 = new DefaultListModel();
for (int i =0;i<dsMonHoc.length;i++){
dt1.addElement(dsMonHoc[i]);
}
III.Ứng dụng MVC trong chương trình(6):
lst1 = new JList(dt1);
lst2 = new JList(dt2);
bt1 = new JButton(“>”);
bt1.addActionListener(this);
bt2 = new JButton(“<“);
bt2.addActionListener(this);
jf.getContentPane().add(lst1);
jf.getContentPane().add(bt1);
jf.getContentPane().add(bt2);

jf.getContentPane().add(lst2);
jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
jf.setVisible(true);
lst1.setPreferredSize(new Dimension(100,120));
lst2.setPreferredSize(new Dimension(100,120));
jf.pack();
}
III.Ứng dụng MVC trong chương trình(7):
// Phuong thuc xu ly su kien khi mot nut duoc nhan
publi c void actionPerformed(ActionEvent e) {
if (e.getSource()==bt1){
Object s1 = lst1.getSelectedValue();
dt2.addElement(s1);
dt1.removeElement(s1);
}else{
Object s2 = lst2.getSelectedValue();
dt1.addElement(s2);
dt2.removeElement(s2);
}
}
publi c static void main(String[] args) {
new JListExample();
}
}
III.Ứng dụng MVC trong chương trình(8):
Ví dụ 3: Thiết kế giao diện như hình sau

Model: Mô hình dữ liệu cho JTable

View: Giao diện hiển thị các mục được chọn


Controller: Xử lý sự kiện khi một nút được nhấn
III.Ứng dụng MVC trong chương trình(9):
III.Ứng dụng MVC trong chương trình(10):

MVC được dùng một cách rộng rãi trong nhiều hệthống phần mềm hướng đối tượng (OO Application), bấtkể được viết bằng ngôn ngữ hướng đối tượng (OOLanguage) nào. Và MVC được biết đến như là một thiếtkế giao diện người dùng hướng đối tượng khá tốt.2.Mô hình MVC trong swing:Hình 2: Mô hình MVC cải tiến của Swing1.Model(M) – View(V) – Controller(C):MVC trong Swing là kiến trúc cho các ứng dụnggồm 3 phần:Model: là phần logic của ứng dụng.(Trạngthái của đối tượng đồ hoạ hay cấu trúc dữliệu của đối tượng)Ví dụ 1: GUI Component đơn giản là CheckboxCheckbox có thành phần:View: phần hiển thị của ứng dụng.Controller: điều khiển giao tiếp với người dùng.Ví dụ 2: Trên JListView để thể hiện nó với trạng thái tương ứng lên mànhìnhController :để xử lý những sự kiện khi có sự tương táccủa người sử dụng hoặc các đối tượng khác lên Checkbox.Model: mô hình dữ liệu cho JListView: là giao diện hiển thị các mục chọnController: xử lý sự kiện mỗi khi các mục trongJList được chọnModel để quản lý trạng thái của nó là check hay uncheck2. Tương tác trong MVC:Khi người sử dụng cần thayđổi trạng thái của đối tượng đồhọa, thì sẽ tương tác thông quaController của đối tượng đồhọa.Controller sẽ thực hiện việcthay đổi trên Model. Khi cóbất kỳ sự thay đổi nào ở xảy raở Model, nó sẽ phát thông điệp(broadcast message) thông báocho View và Controller biết.Nhận được thông điệp từModel:View sẽ cập nhật lại thểhiện của mình, đảm bảorằng nó luôn là thể hiệntrực quan chính xác củaModel.Controller khi nhận đượcthông điệp từ Model, sẽcó những tương tác cầnthiết phản hồi lại người sửdụng hoặc các đối tượngkhác.Ví dụ: GUI Component là CheckboxKhi người sử dụng nhấn chuột vào Checkbox:Thành phần Controller của Checkbox sẽxử lý sự kiện này, yêu cầu thành phần Modelthay đổi dữ liệu trạng thái. Sau khi thay đổitrạng thái, thành phần Model phát thông điệpđến thành phần View và ControllerThành phần Controller nhận được thông điệpdo Model gởi tới sẽ có những tương tác phản hồivới người sử dụng nếu cần thiếtThành phần View của Checkbox nhận đượcthông điệp sẽ cập nhật lại thể hiện của Checkbox,phản ánh chính xác trạng thái Checkbox doModel lưu giữ.Kiến trúc MVC đã tách biệt (decoupling) sự phụ thuộcgiữa các thành phần trong một đối tượng đồ họa, làmtăng tính linh động (flexibility) và tính tái sử dụng(reusebility) của đối tượng đồ họa đó. Một đối tượngđồ họa bấy giờ có thể dễ dàng thay đổi giao diện bằngcách thay đổi thành phần View của nó trong khi cáchthức lưu trữ (Model) cũng như xử lý (Controller)không hề thay đổi. Tương tự, ta có thể thay đổi cáchthức lưu trữ (Model) hoặc xử lý (Controller) của đốitượng đồ họa mà những thành phần còn lại vẫn giữnguyên.3. Ưu điểm của MVC trong SwingIII.Ứng dụng MVC trong chương trình:Ví dụ 1: Thiết kế giao diện như hình dướiModel: Dữ liệu hiển thị cho TextAreaView: Giao diện hiển thị khi nhấn nút “Show”Controller: Xử lý sự kiện khi nút “Show” đượcnhấnIII.Ứng dụng MVC trong chương trình(3):III.Ứng dụng MVC trong chương trình(1):package mvc;import java.awt.FlowLayout;import java.awt.event.*;import javax.swing.*;public class ShowDemo extends JFrame implements ActionListener {JTextArea jta;JButton jbt;public ShowDemo(){JFrame jf = new JFrame();jf.getContentPane().setLayout(new FlowLayout());jf.setSize(300,150);jta = new JTextArea(2,20);jbt = new JButton(“Show”);jbt.addActionListener(this); // Bat su kienjf.getContentPane().add(jta);jf.getContentPane().add(jbt);jf.setVisible(true);III.Ứng dụng MVC trong chương trình(2):// Phuong thuc xu ly su kien khi nut duoc nhanpublic void actionPerformed(ActionEvent e) {if (e.getSource()==jbt){jta.setText(“DE TAI BAO CAO NHOM 4”);/*** @param args*/public static void main(String[] args) {// TODO Auto-generated method stubnew ShowDemo();III.Ứng dụng MVC trong chương trình(4):Ví dụ 2: Thiết kế giao diện như hình dướiModel: Mô hình dữ liệu cho JListView: Giao diện hiển thị các mục được chọnController: Xử lý sự kiện khi một nút được nhấnIII.Ứng dụng MVC trong chương trình:III.Ứng dụng MVC trong chương trình(5):package mvc;import java.awt.*;import java.awt.event.*;import javax.swing.*;public class JListExample implements ActionListener {private JList lst1,lst2;private DefaultListModel dt1,dt2;private JButton bt1,bt2;public JListExample(){JFrame jf = new JFrame();jf.getContentPane().setLayout(new FlowLayout());String dsMonHoc[]= {“Pascal”,”Java”,”VisualBasic”,”C”,”C++”,”C#”};dt1 = new DefaultListModel();dt2 = new DefaultListModel();for (int i =0;i”);bt1.addActionListener(this);bt2 = new JButton(“<“);bt2.addActionListener(this);jf.getContentPane().add(lst1);jf.getContentPane().add(bt1);jf.getContentPane().add(bt2);jf.getContentPane().add(lst2);jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);jf.setVisible(true);lst1.setPreferredSize(new Dimension(100,120));lst2.setPreferredSize(new Dimension(100,120));jf.pack();III.Ứng dụng MVC trong chương trình(7):// Phuong thuc xu ly su kien khi mot nut duoc nhanpubli c void actionPerformed(ActionEvent e) {if (e.getSource()==bt1){Object s1 = lst1.getSelectedValue();dt2.addElement(s1);dt1.removeElement(s1);}else{Object s2 = lst2.getSelectedValue();dt1.addElement(s2);dt2.removeElement(s2);publi c static void main(String[] args) {new JListExample();III.Ứng dụng MVC trong chương trình(8):Ví dụ 3: Thiết kế giao diện như hình sauModel: Mô hình dữ liệu cho JTableView: Giao diện hiển thị các mục được chọnController: Xử lý sự kiện khi một nút được nhấnIII.Ứng dụng MVC trong chương trình(9):III.Ứng dụng MVC trong chương trình(10):