Lập trình Java căn bản - Chương 5 Tạo giao tiếp người dùng

Chia sẻ: Nguyễn Doãn Mạnh Đoàn | Ngày: | Loại File: PDF | Số trang:28

Thêm vào BST

Báo xấu

67
lượt xem 6
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Hiểu mục đích của gói AWT và cấu trúc của gói này. Biết cách sử dụng các đối tượng của gói AWT. Biết cách thiết kế một GUI.. Chúc các bạn học tốt.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Lập trình Java căn bản - Chương 5 Tạo giao tiếp người dùng

Chương 5 T o giao ti p ngư i dùng Graphic User Interface- GUI GUI Slide 1/57 M c tiêu Hi u m c ñích c a gói AWT và c u trúc c a gói này. Bi t cách s d ng các ñ i tư ng c a gói AWT. Bi t cách b c c m t GUI. Bi t cách thi t k m t GUI. GUI Slide 2/57 1
N i dung 5.1- Ôn t p 5.2- GUI là gì? 5.3- Gói AWT c a Java. 5.4- Đưa 1 component vào GUI. 5.5- M t chương trình t o GUI 5.6- S d ng các ñ i tư ng c a AWT. 5.7- B trí các ph n t trên GUI. 5.8- Hư ng d n t o GUI cho 1 ng d ng. 5.9- Tóm t t 5.10- Bài t p GUI Slide 3/57 5.1- Ôn t p • 2 lo i l i c a 1 chương trình: Compile-time error / Run-time error . • Exception = Run-time error • Có th b y 1 exception b ng c u trúc try {…} catch (ExceptionClass e) {…} finally { … } • L i ñư c truy n t method gây exception lên các method g i nó. • Có th t ñ nh nghĩa 1 class Exception k th a t các l p Exception c a Java. GUI Slide 4/57 2
5.2- GUI là gì? • GUI = Graphic User Interface – mô hình giao ti p ki u tương tác gi a ng d ng và user d ng ñ h a. • M i ngôn ng h tr cách t o GUI khác nhau: VB, VC++ dùng d ng drag and drop, C++ ñòi h i programmer vi t toàn b code ñ t o GUI, Java h tr s n các l p t o GUI cho Programmer s d ng. GUI Slide 5/57 GUI là gì?... • GUI= Container + Components Container Components GUI Slide 6/57 3
5.3- Gói AWT c a Java • AWT : abstract windowing toolkit - b công c ch a các l p ñ t o c a s . • AWT là 1 ph n c a JFC- Java Foundation Classes. • S d ng: import java.awt.*; • G m nhi u ph n t (class) ñ t o GUI. • Có các l p qu n lý vi c b trí các ph n t . • Có (event-oriented application) mô hình ng d ng hư ng s ki n. • Có các công c x lý ñ h a và hình nh. • Các l p s d ng các tác v v i clipboard (vùng nh ñ m) như cut, paste. GUI Slide 7/57 C u trúc gói AWT Component Button Checkbox Choice Canvas Label Container TextComponent Panel Window TextField TextArea Applet Frame Dialog GUI Slide 8/57 4
Tham kh o gói java.awt GUI Slide 9/57 Tham kh o gói java.awt GUI Slide 10/57 5
Yêu c u c a GUI • Thân thi n v i user. • S ph n t (element, component) trên GUI thay ñ i tùy thu c vào ng d ng. • Khi user tương tác v i ph n t c a GUI, ng d ng ph i có ph n ng. • L p trình s ki n s bàn ñ n trong chương sau. GUI Slide 11/57 5.4- Đưa 1 component vào GUI Các bư c ñ ñưa 1 component vào GUI ( vi t code ) • T o 1 ñ i tư ng component phù h p. • Xác ñ nh hình th c bên ngoài lúc ñ u c a component. • Đ nh v component này trên GUI. • Thêm component này vào GUI. GUI Slide 12/57 6
5.5- M t thí d Container Components •3 label, •3 text-field •1 checkboxgroup ch a 2 check-box •4 button GUI Slide 13/57 5.6- S d ng các l p c a awt GUI Slide 14/57 7
Component 5.6.1- Container Container Phân c p th a k Panel Window Panel là 1 vùng ch nh t, không có ñư ng vi n Applet Frame Dialog Panel là 1 khung ch nh t, có ñư ng vi n, có các nut1 ñi u khi n c a s GUI Slide 15/57 Container... Container: Đ i tư ng ch a các element, cho phép v , tô màu lên container. Frame và Panel là các class thư ng dùng. Panel thư ng dùng ñ ch a các element trong 1 GUI ph c t p, 1 Frame có th ch a nhi u Panel. Panel, Applet thư ng dùng ñ t o 1 ng d ng nhúng vào Browser. GUI Slide 16/57 8
5.6.2- Frame Constructors: Frame() Make invisible frame Frame(String) Make a visible frame with title GUI Slide 17/57 Frame... Common methods void setSize( int width, int Height) public String getTitle(); public void setTitle(String title); public void setResizable(boolean resizable) public boolean isResizable() public void setVisible(boolean) public boolean isShowing() void show(boolean) void add (...) // add component ... GUI Slide 18/57 9
5.6.3- Panel Panel ph i ñư c ñưa vào Frame khi vi t application vì Frame m i có border Constructors Panel(): t o 1 panel v i b c c m c ñ nh. Panel(LayoutManager layout): t o 1 panel v i b c c ñã bi t. Methods: add (component) // thêm 1 component vào panel setLayout(LayoutManager layout) //ch n ki u b trí components GUI Slide 19/57 5.6.4- Label • Nhãn nh m gi i thích, ch a d li u ch xu t. Constructor: Label() : t o label tr ng Label(String) : t o label có chu i Label (String, int Align) T o label có gióng hàng: Align=LEFT,RIGHT,CENTER Common Methods: void setFont (Font f) void setText(String S) String getText() GUI Slide 20/57 10
5.6.5- TextField • Ch a d li u nh p 1 chu i ký t . • User ch ñư c nh p 1 dòng. Constructors TextField() : t o text field tr ng TextField(int cols) : t o text field tr ng có n c t ch TextField(String S) : t o text field có chu i S TextField (String S, int cols) : text có chu i S, n c t Common Methods: void setEchoChar (char c) - n ñ nh ký t th hi n (password) void setText(String S) String getText() void setEditable(boolean b) boolean isEditable() GUI Slide 21/57 5.6.6- TextArea • Ch a d li u nh p 1 chu i ký t . • User ch ñư c nh p nhi u dòng. Constructors TextArea() TextArea(int cols, int rows) TextArea(String S) TextArea(String S, int rows, int cols) TextArea(String,int cols, int rows, int Scrollbars) Common methods void setText(String) String getText() void setEditable(boolean) boolean isEditable() vois insert(String S, int Index) void replaceRange(String S, int begin, int end) GUI Slide 22/57 11
5.6.7- Button • Công c ñ user ch n 1 tác v . Constructors Button() - t o nút không có nhãn Button(String S) - t o nút có nhãn Common Methods void setLabel(String) - ñ i nhãn String getLabel() - l y n i dung nhãn GUI Slide 23/57 5.6.8- Checkbox/CheckboxGroup • Công c nh p yes/no • Checkbox: multi-option (cho phép ch n nhi u) th hi n d ng h p vuông. • CheckboxGroup ch a nhi u checkbox nhưng ch cho phép ch n 1/n. Ph n t trong CheckboxGroup là ñ i tư ng thu c l p Checkbox nhưng l i th hi n d ng nút tròn (radio button) GUI Slide 24/57 12
Checkbox/CheckboxGroup... Checkbox constructors Checkbox() T o checkbox không nhãn Checkbox(String) T o text box có nhãn T o 1 checkbox có nhãn, có n ñ nh tr ch n l a ñưa vào 1 nhóm trong 1 nhóm Checkbox(String label , boolean state, CheckboxGroup group) Checkbox(String label, CheckboxGroup group, boolean state) Common methods void setLabel(String); String getLabel(); void setState(boolean); boolean getState(); GUI Slide 25/57 5.6.9- List • Công c nh p b ng cách ch n trong 1 danh sách chu i ký t . • Có th ch n 1 ho c nhi u. Constructor Choice() – t o 1 danh sách tr ng Common methods void add(String) ; void addItem(String); void insert(String item, int index) int CountItems(); int getItemCount(); - l y s ph n t String getItem(int Index); int getSelectedInddex(); String getSelectedItem(); void remove(int position) void removeAll() void select(int pos) – áp ñ t 1 m c ch n theo v trí void select(String str) – áp ñ t ch n 1 m c ch n theo n i dung GUI Slide 26/57 13
5.6.10- Scrollbar- Thanh cu n • Công c nh p 1 tr trong 1 kho ng s ( bi u di n b ng Maximum, Minimum) b ng cách kéo con trư t. • T i 1 th i ñi m, con trư t t i vi trí mô t cho tr hi n hành (Value) • Có th có hư ng ngang ho c d c (Orientation) Kích ñây s thay Kích ñây s thay ñ i tăng gi m ñ i tăng gi m theo t ng BLOCK theo t ng UNIT ñã ñã n ñ nh trư c n ñ nh trư c GUI Slide 27/57 Scrollbar... Constructors Scrollbar() - t o thanh cu n d c Scrollbar(int orientation) // VERTICAL|HORIZONTAL Scrollbar(int orientation, int value, int visible, int minimum, int maximum) Common methods void setMaximum(int v) int getMaximum() ; void setMinimum(int v) int getMinimum() int getOrientation() void setUnitIncrement(int v) int getUnitIncrement() void setBlockIncrement(int v) int getBlockIncrement() void setValue(int v) int getValue() void setVisibleAmount(int newAmount) int getVisibleAmount() GUI Slide 28/57 14
Minh h a Click for Demonstration GUI Slide 29/57 5.7- B trí các components lên GUI • Layout : Cách b trí các components lên container. • Không d dàng gì ñ t qu n lý v trí c a các components trên GUI. • LayoutManager là interface mô t v các layout. • Trong gói AWT có hi n th c s n m t s layout, các l p layout này ñ u implement LayoutManager interface. GUI Slide 30/57 15
5.7.1-Layouts có s n trong AWT java.awt.FlowLayout (b trí d ng dòng ch y) java.awt.BorderLayout (b trí v biên khung) java.awt.GridLayout (b trí d ng lư i ñ u nhau) java.awt.GridBagLayout (b trí d ng lư i không ñ u) java.awt.CardLayout (b trí d ng lưng quân bài) Tham kh o docs\api\java\awt\package-tree.html v o docs là thư m c Documantation c a Java 2 GUI Slide 31/57 5.7.2- FlowLayout • B trí các component theo d ng ch y xuôi theo th t mà ph n t này ñư c add vào container. • Đây là layout m c ñ nh c a Panel. • N u có nhi u component trên container Các component có th ñư c ñ t trên nhi u dòng V n ñ gióng hàng (Align) • Gi a các component, chúng h nhau theo chi u d c (vgap) bao nhiêu, theo chi u ngang (hgap) bao nhiêu? GUI Slide 32/57 16
FlowLayout... Constructors FlowLayout() T o FlowLayout m c ñ nh: align= center, vgap=hgap=5 unit. FlowLayout(int align) T o FlowLayout v i align ñã bi t, vgap=hgap=5 unit (default). FlowLayout(int align, int hgap, int vgap) T o FlowLayout v i 3 tham s Tr c a align: các d li u static c a class FlowLayout LEFT CENTER RIGHT LEADING (phía ñ u, tương t LEFT) Click for Demo TRAILING (phía ñuôi, tương t RIGHT) GUI Slide 33/57 5.7.3- BorderLayout • B trí các component theo d ng ra biên c a khung t o ra 5 v trí: EAST, WEST, SOUTH,NORTH, CENTER. • Đây là layout M C Đ NH c a Frame. • N u container ch có 1 component và ñ t nó v trí CENTER thì component này ph kín container. • Cú pháp thêm 1 component vào container t i 1 v trí: Container.add("East", componentName); // ho c Container.add(BorderLayout.EAST, componentName); • Tương t cho “West”, “South”, “North”, “Center” Click for Demo GUI Slide 34/57 17
5.7.4- GridLayout • B trí các component thành 1 lư i rows dòng, cols c t ñ u nhau. Lư i Lư i 3x2 4x4 Lư i 1x4 Lư i 1x4 GUI Slide 35/57 GridLayout... Constructor GridLayout() T o grid layout m c ñ nh 1x1 GridLayout(int rows, int cols) T o grid layout rows x cols .GridLayout(int rows, int cols, int hgap, int vgap) Click for Demo GUI Slide 36/57 18
5.7.5- GridBagLayout • Layout d ng lư i cho phép 1 component chi m 1 s ô k nhau theo c 2 chi u. • Hình Empoyee Info sau là GridBagLayout 6x4, các label bên trái chi m 1ô, các textbox chi m 3 ô ngang. Dòng “Sex” chi m 4 ô ngang, 2 checkbox chi m 2 ô ngang. Các thí d khác GUI Slide 37/57 Class java.awt.GridBagLayout • Constructors: GridBagLayout() • Áp ñ t GridBagLayout cho 1 container: GridBagLayout gb= new GridBagLayout(); FrameName.setLayout(gb); PanelName.setLayout(gb); Vi t ng n g n: FrameName.setLayout(new GridBagLayout()); PanelName.setLayout(new GridBagLayout()); GUI Slide 38/57 19
class GridBagConstraints • Làm sao ñ có th ñưa 1 component vào 1 v trí nhưng tr i dài trên nhi u ô k nhau? • 1 component vào 1 v trí nhưng tr i dài trên nhi u ô k nhau là 1 s “ràng bu c” 1 component vào các ô này. M t ñ i tư ng thu c l p GridBagConstraints s ñ m nhi m vi c này. GUI Slide 39/57 class GridBagConstraints... • Properties – Đa s là static data int gridx, gridy : ô s ñ t component vào int gridwidth, gridheight : s ô s ph theo 2 chi u khi thêm 1 component vào ô double weightx, weighty : Kho ng h c a lư i, m c ñ nh là 0. int anchor : V trí ñ t component, m c ñi6nh là CENTER, các static int ñư c khai báo s n: GridBagConstraints.NORTH, EAST,WEST, SOUTH, NORTHEAST, SOUTHEAST, NORTHWEST, SOUTHWEST. int fill: Xác ñ nh ki u ñ t khi component có kích thư c l n hơm ô s ñư c ñ t vào. Các h ng ñư c dùng: GridBagConstraints.NONE, HORIZONTAL, VERTICAL, BOTH. Insets insets : Đ c t kho ng h gi a các ph n t ñư c ñưa vào, m c ñ nh là 0. int ipadx, ipady: Kho ng ñ n (s pixel tr ng) bên trong c a ph n t theo 2 chi u. M c ñ nh là 0. Khi v ph n t , s thêm 2*ipadx và 2*ipady vào chi u r ng t i thi u và chi u cao t i thi u c a ph n t . GUI Slide 40/57 20