LẬP TRÌNH GIAO DIỆN Graphical User Interface (GUI)

1

LẬP TRÌNH GIAO DIỆN Graphical User Interface (GUI)

Chương 3

2

Nội DungNội Dung

Graphical User Interface (GUI) Event Driven Programming Ứng dụng Windows Form dùng C# Khuôn mẫu của ứng dụng Windows Form chuẩn Cách tạo ứng dụng Windows Form

Tạo ứng dụng Form Chỉnh sửa form Thêm component vào form Viết phần xử lý cơ bản

3

GUIGUI

Command line interface: CLICommand line interface: CLI Text user interface: TUIText user interface: TUI

Tương tác qua keyboardThực thi tuần tự

GUI dựa trên textMức độ tương tác cao hơn

4

GUIGUI

Tương tác qua giao diện đồ họa độ phân giải cao

Graphical User Interface: GUI

Đa số các hệ OS hiện đại đều dùng GUI

Cho phép user dễ dàng thao tác

5

GUIsGUIs

Chương trình hiện đại đều dùng GUI Graphical: text, window, menu, button… User: người sử dụng chương trình Interface: cách tương tác chương trình

Thành phần đồ họa điển hình Window: một vùng bên trong màn hình chính Menu: liệt kê những chức năng Button: nút lệnh cho phép click vào TextBox: cho phép user nhập dữ liệu text

6

GUI ApplicationGUI Application

Windows Form là nền tảng GUI cho ứng dụng desktop (Ngược với Web Form ứng dụng cho Web) Single Document Interface (SDI) Multiple Document Interface (MDI)

Các namespace chứa các lớp hỗ trợ GUI trong .NET System.Windows.Forms:

Chứa GUI components/controls và form System.Drawing:

Chức năng liên quan đến tô vẽ cho thành phần GUI Cung cấp chức năng truy cập đến GDI+ cơ bản

7

Event- Driven Programming Event- Driven Programming

Danh sách các lệnh thực thi tuần tự

Việc kế tiếp xảy ra chính là lệnh tiếp theo trong danh sách

Chương trình được thực thi bởi máy tính

Các đối tượng có thể kích hoạt sự kiện và các đối tượng khác

phản ứng với những sự kiện đó

Việc kế tiếp xảy ra phụ thuộc vào sự kiện kế tiếp

Luồng chương trình được điều kiển bởi sự tương tác User-

Computer

Cách truyền thống Event-Driven Programming

8

Event-Driven ProgrammingEvent-Driven Programming

Chương trình GUI thường dùng Event-Drive Programming Chương trình chờ cho event xuất hiện và xử lý Ví dụ sự kiện:

Firing an event: khi đối tượng khởi tạo sự kiện Listener: đối tượng chờ cho sự kiện xuất hiện Event handler: phương thức phản ứng lại sự kiện

9


Minh họa xử lý trong form

ClickUser nhập text vào texbox -> click Button để add chuỗi nhập vào listbox Lấy dữ liệu từ

textboxAdd vào listbox

invoke

Button đưa ra sự kiện clickForm có event handler cho click của button

10


GUI-based events Mouse move Mouse click Mouse double-click Key press Button click Menu selection Change in focus Window activation …

Event

Danh sách event cho Form

11

Windows Forms ApplicationWindows Forms Application

12

Windows Form AppWindows Form App

Sử dụng GUI làm nền tảng Event-driven programming cho các đối tượng trên form Ứng dụng dựa trên một “form” chứa các thành phần

Menu Toolbar StatusBar TextBox, Label, Button…

Lớp cơ sở cho các form của ứng dụng là FormForm

System.Windows.Forms. FormSystem.Windows.Forms. Form

Namespace Class

13

Minh họa WinForm AppMinh họa WinForm App

14

Tạo WinForm AppTạo WinForm App

Tạo project: Windows App

15

Tạo WinForm App từ VS. 2005 Tạo WinForm App từ VS. 2005 (3)(3)

Windows App doVS.2005 khởi tạo12

3

4

1: form ứng dụng2: control toolbox3: Solution Explorer4: Form properties

16

Ứng Dụng WinForm đơn giảnỨng Dụng WinForm đơn giản

Lớp Form cơ sở

Control kiểu Label

Chạy ứng dụng với Form1 làm form chính

Thiết kế form & control

Add control vào form

Form1.cs

17

CCáác bước tạo ứng dụng WinForm cơ c bước tạo ứng dụng WinForm cơ bảnbản

Tạo lớp kế thừa từ lớp Form cơ sở Bổ sung các control vào form

Thêm các label, menu, button, textbox… Thiết kế layout cho form (bố trí control)

Hiệu chỉnh kích thước, trình bày, giao diện cho form Control chứa trong form

Viết các xử lý cho các control trên form và các xử lý khác Hiển thị Form

Thông qua lớp Application gọi phương thức Run

Nên sử dụng IDE hỗ trợ thiết kế GUI!

18

Form vForm vàà control control

Tất cả các thành phần trên form đều là đối tượng Các class control

System.Windows.Forms.Label System.Windows.Forms.TextBox System.Windows.Forms.Button …

Các control là instance của các

lớp trên.object

object

object

object

object

object

19

CCáác thuộc tc thuộc tíính của Formnh của Form

Property Description DefaultName Tên của form sử dụng trong project Form1,Form2…

AcceptButton Thiết lập button là click khi user nhấn Enter

CancelButton Thiết lập button là click khi user nhấn Esc

ControlBox Hiển thị control box trong caption bar True

FormBorderStyle Biên của form: none, single, 3D, sizable Sizable

StartPosition Xác định vị trí xuất hiện của form trên màn hình

WindowsDefaultLocation

Text Nội dung hiển thị trên title bar Form1, Form2, Form3

Font Font cho form và mặc định cho các control

Method DescriptionClose Đóng form và free resource

Hide ẩn form

Show Hiển thị form đang ẩn

Event DescriptionLoad Xuất hiện trước khi form show

20

Phương thức của lớp FormPhương thức của lớp Form

Các hành động có thể thực hiện trên form Activate: cho form nhận focus Close: đóng và giải phóng resource Hide: ẩn form Refresh: tô vẽ lại Show: cho form show ra màn hình (modeless) và activate ShowDialog: hiển thị dạng modal

Find Dialog chính là dạng modeless Font dialog dạng modal

21

Event của FormEvent của Form

Tạo xử lý cho event Trong cửa sổ properties Chọn biểu tượng event Kích đúp vào tên event

Event thường dùng Load: xuất hiện trước khi form xuất hiện

lần đầu tiên Closing: xuất hiện khi form đang chuẩn bị

đóng Closed: xuất hiện khi form đã đóng Resize: xuất hiện sau khi user resize form Click: xuất hiện khi user click lên nền form KeyPress: xuất hiện khi form có focus và

user nhấn phím

Tên event

Trình xử lý nếu có

22

Event của FormEvent của Form

Ví dụ chương trình sẽ hỏi user xác nhận trước khi đóng ứng dụng. Kích đúp vào item FormClosing trong cửa sổ event Hàm Form1_FormClosing được tạo và gắn với sự kiện

FormClosing Viết code cho event handler Form1_FormClosing

this.FormClosing += new FormClosingEventHandler(this.FormClosing += new FormClosingEventHandler( this.Form1_FormClosingthis.Form1_FormClosing ););

23

Property & layout của control Anchor Docking

Các control Label, textbox, button CheckBox, RadioButton, CheckedListBox, ListBox, Combobox, CheckListBox GroupBox, Panel & TabControlGroupBox, Panel & TabControl PictureBox, ImageList TrackBar NumericUpDown DomainUpDown ProgressBar MaskEditBox DateTimePicker MonthCalendar Timer ToolTip Mouse Event handling Keyboard event handling

Tổng quan controls

24


Control là một thành phần cơ bản trên form Có các thành phần

Thuộc tính Phương thức Sự kiện

Tất cả các control chứa trong namespace: System.Windows.Forms

Windows Form

Fig. 12.3 Components and controls for Windows Forms.

26


Truy xuất đến thuộc tính của đối tượng

• Cú pháp

<Tên đối tượng>.<Thuộc tính>

27


Gán giá trị cho thuộc tính của đối tượng

• Cú pháp

<Tên đối tượng>.<Thuộc tính> = Giá trị;

28


Một số thuộc tính của control Text: mô tả text xuất hiện trên control Focus: phương thức chuyển focus vào control TabIndex: thứ tự của control nhận focus

Mặc định được VS.NET thiết lập – Tuy nhiên người lập trình có thể điểu chỉnh

Enable: thiết lập trạng thái truy cập của control Visible: ẩn control trên form, có thể dùng phương thức Hide Anchor:

Neo giữ control ở vị trí xác định Cho phép control di chuyển theo một vị trí khi kích thước của

đối tượng chứa nó thay đổi Size: xác nhận kích thước của control

29

Thuộc tính controls

Common Properties DescriptionBackColor Màu nền của control

BackgroundImage Ảnh nền của control

ForeColor Màu hiển thị text trên form

Enabled Xác định khi control trạng thái enable

Focused Xác định khi control nhận focus

Font Font hiển thị text trên control

TabIndex Thứ tự tab của control

TabStop Nếu true, user có thể sử dụng tab để select control

Text Text hiển thị trên form

TextAlign Canh lề text trên control

Visible Xác định hiển thị control

30


Lệnh gọi thực hiện 1 phương thức (method) của đối tượng Phương thức của đối tượng dùng để thực hiện một hành

động liên quan đến đối tượng đó Cú pháp

<Tên đối tượng>.<Phương thức> ( [ Các tham sô ] ) Ví dụ

Phương thức di chuyển con trỏ vào 1 đối tượng

<Tên đối tượng>.Focus();

31


Sử dụng thư viện các lớp đối tượng

Thời gian: Sử dụng lớp đối tượng DateTime Cú pháp

DateTime.<Hàm liên quan đến thời gian> ( [ Các tham số ] )

Ví dụ: Lấy ngày giờ hiện hành của máy tính

DateTime.Now Lấy giờ hiện hành của máy tính

DateTime.Now. TimeOfDay

32



Màu sắc: Sử dụng lớp đối tượng Color Cú pháp

Color.<Thuộc tính màu sắc> Ví dụ

Màu xanh: Color.Blue Màu đỏ: Color.Red Màu trắng: Color.White Màu đen: Color.Black …

33



Màu sắc: Cách tô màu nền của Textbox

<Tên Textbox>.BackColor = Color.Màu; Cách tô màu chữ của Textbox

<Tên Textbox>.ForeColor = Color.Màu;

34


Các hàm toán học Sử dụng lớp đối tượng Math

Cú pháp

Math.<Các hàm tóan học> ( [ Các tham số ] ) Ví dụ

Lấy căn bậc 2: Math.Sqrt(giá trị) Lũy thừa x^y: Math.Pow(x,y) Làm tròn số: Math.Round(giá trị) Tìm Max 2 số: Math.Max(giá trị 1, giá trị 2) Tìm Min 2 số: Math.Min(giá trị 1, giá trị 2) …

35


Các hàm thường dùng Hàm xuất thông báo

MessageBox.Show (“<Noi dung>”); Ví dụ:

MessageBox.Show (“Xin chào!”); MessageBox.Show (“<Noi dung>”, “<Tiêu dê>”); Ví dụ:

MessageBox.Show (“Xin chào!”, “Welcome”); Hàm đổi chuỗi thành số nguyên

int.Parse(<chuoi sô>) Ví dụ: int.Parse (“123”) 123

36

Control Layout - Anchor

None

FixedSingleFixed3D FixedDialog

Sizable

FormBorderStyle

37


Khi FormBorderStyle = Sizable, form cho phép thay đổi kích thước khi Runtime Sự bố trí của control có thể thay đổi theo

Sử dụng thuộc tính Anchor Cho phép control phản ứng lại với thao tác resize của form

Control có thể thay đổi vị trí tương ứng với việc resize của form Control cố định không thay đổi theo việc resize của form

Các trạng thái neo Left: cố định theo biên trái Right: cố định theo biên phải Top: cố định theo biên trên Bottom: cố định theo biên dưới

38


Button được neo biên trái

Button tự do

Vị trí tương đối với biên trái không đổi

Di chuyển tương ứng theo kích thước mới

39


Thiết lập Anchor cho control

Chọn các biên để neo

Biên được chọn neo,màu đậm

40


Neo theo bốn phía

41

Control Layout - Docking

Các control có thể gắn (dock) với một cạnh nào đó của form, hoặc container của control.

Windows Explorer

TreeView gắn bên trái

ListView gắn bên phải

42


Left Right

Bottom

None

Fill

Top

43


TextBox

Dock = None Dock = Top

Dock = FillTextBox.Multiline = True Dock = Bottom

44

Control Layout - Alignment

Ảnh Ý nghĩa

Canh lề trái, phải, trên, dưới

Canh khoảng cách đều theo chiều dọc, ngang giữa các control

Canh đều kích thước các control.

Lưu ý: Kích thước của control được chọn đầu tiên trong danh sách các control chọn sẽ quyết định kích thước cho toàn bộ control


Ảnh Ý nghĩa

Các control được sắp canh liền tiếp nhau theo chiều ngang. Lưu ý: Khoảng cách giữa control đầu và cuối sẽ được tính sao cho các control còn lại cách đều

Xóa khoảng cách canh đều sắp liền tiếp nhau theo chiều ngang

Tăng hoặc giảm khoảng cách canh liền tiếp nhau theo chiều ngang

45


Ảnh Ý nghĩa

Các control được sắp canh liền tiếp nhau theo chiều dọc

Xóa khoảng cách canh đều sắp liền tiếp nhau theo chiều dọc

Tăng hoặc giảm khoảng cách canh liền tiếp nhau theo chiều dọc

46


Ảnh Ý nghĩa

Canh control ở giữa form theo chiều ngang (dọc)

Xét control nằm chồng lên hoặc nằm dưới 2 control nằm lên nhau

Thiết lập thứ tự Tab Index cho các control. Các control sẽ được đánh thứ tự từ 0->N.Khi người dùng nhấn Tab trong chương trình thì các control sẽ được focus theo thứ tự qui định.

47

48

Các Control

Label, TextBox, ButtonLabel, TextBox, Button

49

Label, TextBox, Button

Label Cung cấp chuỗi thông tin chỉ dẫn

Chỉ đọc Được định nghĩa bởi lớp Label

Dẫn xuất từ Control

TextBox Thuộc lớp TextBox Vùng cho phép user nhập dữ liệu

Cho phép nhập dạng Password

Button Cho phép cài đặt 1 hành động. Dẫn xuất từ ButtonBase

Labels, TextBoxes and Buttons

Labels (lbl) Provide text instruction

Read only text, cannot by modified by user. Defined with class Label1

Derived from class Control

lblMessage

btnPush

btnExit

51


LabelThuộc tính thường dùng

Font Font hiển thị của Label

Text Nội dung text hiển thị

TextAlign Canh lề chuỗi trình bày trên điều khiển

ForeColor Màu text

Visible Trạng thái hiển thị

BorderStyle Kiểu đường viền của điều khiển

FlatStyle Kiểu hiển thị điều khiển theo hệ thống hay chuẩn như đã thiết kế


Labels (lbl) Khai báo và khởi tạo đối tượng Lable Cách 1: Thiết kế Cách 2: Code

void CreateControls()

{ Label lb = new Label();

lb.Text = "This is Lable Object";

this.Controls.Add(lb);

}

lb

btnPush

btnExit

53

Label, TextBox, ButtonTextBox

Thuộc tính thường dùng

Font Font hiển thị của text

Text Nội dung text hiển thị

TextAlign Canh lề text

ForeColor Màu text

Visible Trạng thái hiển thị

Enabled Vô hiệu hóa hay cho phép sử dụng

MaxLength Số lượng ký tự lớn nhất cho phép nhập

Password Giá trị được nhập thay thế bởi ký tự bạn khai báo trong thuộc tính này

Readonly Giá trị true chỉ cho phép đọc giá trị

WordWrap Tự động xuống dòng nếu chuỗi giá trị dài hơn kích thước của điều khiển

54


TextBoxThuộc tính thường dùng

AcceptsReturn Nếu true: nhấn enter tạo thành dòng mới trong chế độ multiline

Multiline Nếu true: textbox ở chế độ nhiều dòng, mặc định là false

ScrollBars Thanh cuộn cho chế độ multiline

Event thường dùng

TextChanged Kích hoạt khi text bị thay đổi, trình xử lý được khởi tạo mặc định khi kích đúp vào textbox trong màn hình design view

MouseClick Xảy ra khi người sử dụng Click trên điều khiển TextBox

55


Demo TextBox

Chuyển thành chữ hoaDouble click vào textbox để tạo event handler cho event

TextChanged


Khai báo và khởi tạo đối tượng Text Cách 1: Thiết kế Cách 2: Code


{ TextBox txt = new TextBox();

txt.Name = "txtHoLot";

txt.Text = "This is TextBox Object";

this.Controls.Add(txt);

} txtHoLottxtHoLot

txtTentxtTen

lblHoLotlblHoLot

lblTenlblTen

btnHoLotbtnHoLot

lblHoVaTenlblHoVaTen


Button Derived from ButtonBase Used to run/activate an Event Procedure Click event

Ví dụ:private void btnThoat_Click(object sender, EventArgs e)

{

this.Close();

}

58


ButtonThuộc tính thường dùng

Text Chuỗi hiển thị trên bề mặt button

FlatStyle Kiểu đường viền của điều khiển Button

Image Chọn Image trong phần Resource để trình bày hình trên điều khiển Button

TextAlign Canh lề diễn giải trên điều khiển

59


ButtonEvent thường dùng

Click Kích hoạt khi user kích vào button, khai báo mặc định khi người lập trình kích đúp vào button trong màn hình Design View của Form.

MouseClick Xảy ra khi người sử dụng Click trên điều khiển button bằng chuột

CheckChanged Xảy ra khi người sử dụng vào điều khiển button

TextChanged Xảy ra khi giá trị diễn giải trên điều khiển bị thay đổi

EnabledChanged Xảy ra khi thuộc tính Enabled thay đổi giá trị

VisibleChanged Xảy ra khi thuộc tính Visible thay đổi giá trị


Khai báo và khởi tạo đối tượng Button


{ Button btn = new Button();

btn.Name = "btnSave";

btn.Text = "&Save";

this.Controls.Add(btn); }

61

Thêm control vThêm control vàào formo form

Kéo thả control vào form

62

Code của phần designCode của phần design

Phần code thiết kế Form1 được tạo tự động

Khai báo các đối tượng control trên Form1

Chứa code khởi tạo control

Form1.Designer.cs

63


Tạo đối tượng

Lần lượt khai báo các thuộc tính cho các control

InitializeComponent

64


InitializeComponent

Đưa các control vào danh sách control của Form1

65

Sửa thuộc tSửa thuộc tíính của controlnh của control

Đổi tên thành txtNum1

Thay đổi các giá trị qua cửa sổ properties -> VS tự cập nhật code

66

Phần xử lýPhần xử lý

Khi click vào Add -> cộng 2 giá trị và xuất kết quả Thực hiện

Button Add cung cấp sự kiện click Form sẽ được cảnh báo khi Add được click Form sẽ lấy dữ liệu từ 2 textbox và cộng -> kết quả

Cơ chế event Button đưa ra sự kiện click: đối tượng publish Form quan tâm đến sự kiện click của button, Form có sẽ

phần xử lý ngay khi button click. Phần xử lý của form gọi là Event Handler Form đóng vai trò là lớp subscribe

67

Khai bKhai bááo event handlero event handler

Kích đúp vào button Add trên màn hình thiết kế cho phép tạo event handler cho sự kiện này.

DClickCửa sổ quản lý event của BtnAdd

event

68


Event handler cho button Add

Cùng signature method với System.EventHandler

69


InitializeComponent

Sự kiện click Trình xử lý được gọi khi event xảy ra

Delegate chuẩn cho event handler

70

Viết phần xử lýViết phần xử lý

Phần xử lý của Form1 khi button click Lấy giá trị của 2 textbox, cộng kết quả và xuất ra MessageBox

71

Kiểm tra dữ liệu nhậpKiểm tra dữ liệu nhập

Nếu user nhập vào chuỗi thì chương trình trên sẽ lỗi! Khắc phục:

Cảnh báo user nhập không đúng dạng Xóa những ký tự không hợp lệ đó

Sử dụng control ErrorProvider để cảnh báo lỗi khi user nhập không đúng Trong Design View: kéo ErrorProvider từ

ToolBox/Component vào form Chặn xử lý sự kiện TextChanged khi user nhập liệu vào

textbox Nếu nhập sai thiết lập lỗi cho control ErrorProvider cảnh

báo!

72

Bổ sung ErrorProviderBổ sung ErrorProvider

Kéo thả ErrorProvider vào design view

73

Xử lý sự kiện TextChanged của Xử lý sự kiện TextChanged của textBoxtextBox

Phần kiểm tra

74

ErrorProvider cảnh bErrorProvider cảnh bááoo

Icon hiển thị lỗi

Di chuyển chuột vào icon, tooltip xuất hiện

Bài tập 1- Trang 1

txtHoLottxtHoLot

txtTentxtTen

lblHoLotlblHoLot

lblTenlblTen

btnHoLotbtnHoLot

lblHoVaTenlblHoVaTen

76

CheckBox RadioButtonCheckBox RadioButton

Các Control

77

CheckBox

Control đưa ra một giá trị cho trước và user có thể Chọn giá trị khi Checked = true Không chọn giá trị: Checked = false

Lớp đại diện CheckBox

Appearance

Checked CheckedChanged

ThreeStateText

PropertiesProperties

78

CheckBox

CheckBoxThuộc tính thường dùng

FlatStyle Kiểu đường viền

Appearance Hình dạng của CheckBox

Checked Trạng thái chọn(True) hay không (False)

CheckState Trạng thái của điều khiển CheckBox đang chọn.

Text Chuỗi trình bày với diễn giải của tùy chọn

TextAlign Canh lề chuỗi diễn giải trên điều khiển

ThreeState Cho phép hay không ba trạng thái Checked, unChecked, Indeterminate của điều khiển CheckBox

79

CheckBox

CheckBoxEvent thường dùng

CheckChanged Kích hoạt khi người sử dụng Click vào điều khiển CheckBox

MouseClick Xảy ra khi người sử dụng Click trên điều khiển CheckBox

Click Xảy ra khi người sử dụng Click vào điều khiển CheckBox

CheckStateChanged Xảy ra khi thuộc tính CheckState bị thay đổi

TextChanged Xảy ra khi giá trị diễn giải của điều khiển bị thay đổi

Enabled Xảy ra khi thuộc tính Enabled thay đổi giá trị

Visible Xảy ra khi thuộc tính Visible thay đổi giá trị

80

CheckBox

ThreeStateThreeState = truetrue : cho phép thiết lập 3 trạng thái: Checkstate = Indeterminate: không xác định CheckState= Checked: chọn CheckState= Unchecked: không chọn

Chưa chọn

81

CheckBox

Khai báo và khởi tạo đối tượng CheckBoxKhai báo và khởi tạo đối tượng CheckBox

void CreateControl()

{ CheckBox chk = new CheckBox();

chk.Name = "chkID";

chk.Text = "Full Detail";

chk.Checked = true;

this.Controls.Add(chk);

}

82

RadioButton

Cho phép user chọn một option trong số nhóm option Khi user chọn 1 option thì tự động option được chọn

trước sẽ uncheck Các radio button chứa trong 1 container (form,

GroupBox, Panel, TabControl) thuộc một nhóm. Lớp đại diện: RadioButton Khác với nhóm CheckBox cho phép chọn nhiều option,

còn RadioButton chỉ cho chọn một trong số các option.

Checked CheckedChanged Text

Appearance

83

RadioButton

Nhóm RadioButton thứ 2 chứa trong

GroupBox2

Nhóm RadioButton thứ 1 chứa trong

GroupBox1

84

RadioButtonThuộc tính thường dùng


Appearance Hình dạng của RadioButton

Checked Trạng thái chọn(True) hay không (False)

Text Chuỗi trình bày với diễn giải của tùy chọn

TextAlign Canh lề chuỗi diễn giải trên điều khiển

RadioButton

85

RadioButtonEvent thường dùng

CheckChanged Kích hoạt khi người sử dụng Click vào điều khiển RadioButton

MouseClick Xảy ra khi người sử dụng Click trên điều khiển RadioButton

Click Xảy ra khi người sử dụng Click vào điều khiển RadioButton

CheckChanged Xảy ra khi người sử dụng Click vào điều khiển RadioButton

TextChanged Xảy ra khi giá trị diễn giải của điều khiển bị thay đổi

Enabled Xảy ra khi thuộc tính Enabled thay đổi giá trị

Visible Xảy ra khi thuộc tính Visible thay đổi giá trị

RadioButton

86

Khai báo và khởi tạo đối tượng RadioButtonKhai báo và khởi tạo đối tượng RadioButton

void CreateControl()

{ RadioButton rd = new RadioButton();

rd.Name = "rdMale";

rd.Text = "Male";

rd.Checked = true;

this.Controls.Add(rd);

}

RadioButton

87

Bài Tập 2-3 trang 6

88

ListBox & ComboBoxListBox & ComboBox

Các Control

89

ListBox & ComboBox

ListBoxListBox Cung cấp một danh sách các itemdanh sách các item cho phép user chọn ListBox cho phép hiển thị scroll nếu các item vượt quá vùng

thể hiện của ListBox

Items MultiColumn

SelectedIndex SelectedItem

ListBoxListBox

SelectedItems

Sorted

Text


90

ListBox & ComboBox

Method & EventMethod & Event

ListBoxListBoxClearSelected

FindString

GetSelected

SetSelected

SelectedIndexChanged

SelectedValueChanged

MethodMethod

EventEvent

91

ListBox & ComboBox


BorderStyle Kiểu đường viền

DataSource Tập dữ liệu vào điều khiển

DisplayMember Tên của trường tương ứng với chuỗi trình bày trên điều khiển

MultiColumn Cho phép trình bày danh sách phần tử trên điều khiển có nhiều cột

Items Tập các phần tử trong điều khiển,bạn có thể sử dụng phương thức Add và AddRange để thêm chuỗi hay phần tử với khóa và giá trị vào điều khiển ListBox

ColumnWidth Chiều rộng của mỗi cột nếu phần tử trình bày trên điều khiển có nhiều cột

ListBox & ComboBox

92

ListBox & ComboBox


Sorted Nếu chọn True thì danh sách xếp tăng dần theo giá trị

ValueMember Giá trị ứng với khóa nếu phần tử có khóa và giá trị

SelectionMode Cho phép chọn một hay nhiều phần tử cùng một lúc

SelectedItems Trả về tập phần tử được chọn

SelectedItem Gán và lấy giá trị object ứng với phần tử đang chọn

SelectedValue Gán hay lấy giá trị ứng với phần tử kiểu object đang chọn

SelectedIndex Gán hay lấy giá trị chỉ mục tương ứng với phần tử đang chọn

ListBox & ComboBox

93

ListBox & ComboBox


DoubleClick Xảy ra khi người sử dụng Double Click trên phần tử

MouseClick Xảy ra khi người sử dụng Click trên điều khiển

MouseDoubleClick Xảy ra khi người sử dụng Double Click trên điều khiển

SelectedIndexChanged Xảy ra khi chỉ mục của phần tử thay đổi

SelectedValueChange Xảy ra khi thay đổi giá trị của phần tử

ListBox & ComboBox

94

ListBox & ComboBox


DisplayMemberChanged Xảy ra khi tên cột khai báo trong thuộc tính DisplayMember thay đổi

ValueMemberChanged Xảy ra khi tên cột khai báo trong thuộc tính ValueMember thay đổi



Phương thức

Add Thêm chuỗi hay đối tượng vào điều khiển

AddRange Thêm tập gồm chuỗi hay nhiều đối tượng vào điều khiển

ListBox & ComboBox

95

Khai báo và khởi tạo đối tượng ComboBoxKhai báo và khởi tạo đối tượng ComboBox


{ ListBox lst = new ListBox();

lst.Name = "lstMonHoc";

lst.Text = "Lập Trinh C#";

lst.Items.Add("Console");

lst.Items.Add("Window Form");

lst.Items.Add("Hướng đối tượng");

lst.Location = new System.Drawing.Point(200, 300);

this.Controls.Add(lst);

}

ListBox & ComboBox

96

ListBox & ComboBox

Thuộc tính ItemsItems cho phép thêm item vào ListBox

Danh sách itemCho phép thêm item trong màn hình thiết kế form

97

ListBox & ComboBox

ListBox hiển thị dạng Multi Column

Hiển thị nhiều cột

98

ListBox & ComboBox

Demo ListBoxListBox

Kiểm tra xem chuỗi nhập có trong list box? - Nếu có: select item đó - Ngược lại: thêm chuỗi mới vào list box

99

ListBox & ComboBox

Sự kiện SelectedIndexChanged

SelectedIndexChangedSelectedIndexChanged

Mỗi khi kích chọn vào item trong listbox sẽ xóa item

được chọn tương ứng

Demo Frm57

100

Số phần tử trong ListBoxSố phần tử trong ListBox TenListBox.Item.countTenListBox.Item.count

Lấy giá trị của 1 phần tử trong ListBoxLấy giá trị của 1 phần tử trong ListBox TenListBox.Items[i]

Thêm một phần tử vào ListBoxThêm một phần tử vào ListBox TenListBox.Items.Add(txtN.Text);

Xóa tất cả các phần tử trong ListBoxXóa tất cả các phần tử trong ListBox TenListBox.Items.Clear();

Xóa phần tử đầu tiên trong ListBoxXóa phần tử đầu tiên trong ListBox TenListBox.Items.RemoveAt(0);

Xóa phần tử cuối cùng của ListboxXóa phần tử cuối cùng của Listbox if (TenListBox.Items.Count !=0)

TenListBox.Items.RemoveAt(TenListBox.Items.Count-1);

ListBox & ComboBox

101

Xóa 1 phần tử trong ListBox tại vị trí bất kỳXóa 1 phần tử trong ListBox tại vị trí bất kỳ int i = 0; while (i < lstlopA.Items.Count) { if (lstlopA.GetSelected(i) == true) lstlopA.Items.RemoveAt(i); i++; }

Chọn 1 phần tử trong listboxChọn 1 phần tử trong listbox TenListBox.SetSelected(i, true);

Kiểm tra 1 phần tử trong List box có đang chọn hay khôngKiểm tra 1 phần tử trong List box có đang chọn hay không TenListBox.GetSelected(i) == true

Gán giá trị cho 1 phần tử của ListBoxGán giá trị cho 1 phần tử của ListBox TenListBox.Items[i] = GiaTri.ToString();

ListBox & ComboBox

102

ListBox & ComboBox

ComboBoxComboBox Kết hợp TextBox với một danh sách dạng drop down Cho phép user kích chọn item trong danh sách drop down

ComboBoxComboBox

Items

DropDownStyle

Sorted

Text AutoCompleteMode

MaxDropDownItems

DropDownHeight

103

ListBox & ComboBox



DataSource Tập dữ liệu vào điều khiển

DisplayMember Tên của trường tương ứng với chuỗi trình bày trên điều khiển

DropDownStyle Kiểu trình bày danh sách phần tử, mặc định là Dropdown(cho phép thêm mới chuỗi),DrodownList chỉ cho phép chọn trong danh sách, Simple(dạng danh sách)

Items Tập các phần tử trong điều khiển, bạn có thể sử dụng phương thức Add và AddRange để thêm chuỗi hay phần tử với khóa và giá trị vào điều khiển ComboBox

MaxDropDownItems Số phần tử lớn nhất có thể liệt kê

ListBox & ComboBox

104

ListBox & ComboBox


MaxLength Số lượng ký tự lớn nhất cho phép nhập, nếu giá trị nhập vào <0 thì mặc định là 0

ValueMember Giá trị ứng với khóa nếu phần tử có khóa và giá trị

Text Giá trị chuỗi ứng với nhãn đang chọn

SelectedText Gán hay lấy giá trị chuỗi ứng với nhãn đang chọn

SelectedItem Gán và lấy giá trị object ứng với phần tử đang chọn

SelectedValue Gán hay lấy giá trị ứng với phần tử object đang chọn

SelectedIndex Gán hay lấy giá trị chỉ mục tương ứng với phần tử đang chọn

ListBox & ComboBox

105

ListBox & ComboBox


TextChanged Xảy ra khi chuỗi trên điều khiển thay đổi

MouseClick Xảy ra khi người sử dụng Click trên điều khiển

MouseDoubleClick Xảy ra khi người sử dụng Double Click trên điều khiển

SelectedIndexChanged Xảy ra khi chỉ mục của phần tử thay đổi

TextChanged Xảy ra khi chuỗi trên điều khiển bị thay đổi

SelectedValueChange Xảy ra khi thay đổi giá trị của phần tử

SelectedChangeCommited Xảy ra khi người sử dụng kết thúc quá trình chọn phần tử trên điều khiển

ListBox & ComboBox

106

ListBox & ComboBox


DisplayMemberChanged Xảy ra khi tên cột khai báo trong thuộc tính DisplayMember thay đổi

ValueMemberChanged Xảy ra khi tên cột khai báo trong thuộc tính ValueMember thay đổi



Phương thức

Add Thêm chuỗi hay đối tượng vào điều khiển

AddRange Thêm tập gồm chuỗi hay nhiều đối tượng vào điều khiển

ListBox & ComboBox

107

Khai báo và khởi tạo đối tượng ComboBoxKhai báo và khởi tạo đối tượng ComboBox


{ ComboBox cb = new ComboBox();

cb.Name = "cboCountry";

cb.Text = "Viet Nam";

this.Controls.Add(cb);

}

ListBox & ComboBox

108

Thêm một phần tử ngẫu nhiên vào trong ComboBoxThêm một phần tử ngẫu nhiên vào trong ComboBox int n; int i = 1; n = Convert.ToInt32(txtN.Text); Random rd = new Random(); while (i <= n) { cboSo.Items.Add(rd.Next(1, n+1).ToString()); i++; } Kiểm tra chọn phần tử trong Combo bằng Index cboSo.SelectedIndex == i

ListBox & ComboBox

109

ListBox & ComboBox

DropDownStyleDropDownStyle

110

ListBox & ComboBox

Bổ sung item trong màn hình design

view //Sử dụng phương thức ADD Combobox for(int i=1; i<=12;i++) cboThu.Items.Add("Mon "+i.ToString());

111

ListBox & ComboBox

Mỗi khi kích chọn một item hiển thị item được chọn trên

MessageBox

112

ListBox & ComboBox

Tính năng AutoCompleteAutoComplete Gõ “Ng”

AutoCompleteMode

AutoCompleteSource

AutoComplete

113

ListBox & ComboBox

Sử dụng biến cố SelectionChangeCommittedSử dụng biến cố SelectionChangeCommittedprivate void cboThu_SelectionChangeCommitted(object sender,

EventArgs e)

{

MessageBox.Show(cboThu.SelectedText, "LẬP TRÌNH C#");

MessageBox.Show(cboThu.SelectedItem.ToString(), "C# căn bản");

}

Demo DinhDangHoten(BaiTapTuan1)

114

ListBox & ComboBox

Sử dụng phương thức AddRangeSử dụng phương thức AddRange

string[] week = new string[7] { "Sun", "Mon", "TUE", "Wed", string[] week = new string[7] { "Sun", "Mon", "TUE", "Wed", "Thu ", "Thu ", "Fri", "Sat" };"Fri", "Sat" };

cboTM.Items.AddRange(week);cboTM.Items.AddRange(week);

cboTM.DisplayMember = "Name";

cboTM.ValueMember = "Value";

Demo Frm58

115

CheckedListBox

Tương tự như list box nhưng mỗi item sẽ có thêm check box.

CheckedItems CheckedIndices

SelectedIndices

SelectedIndices

MultiColumn

SelectionMode


MethodMethodClearSelected

SetSelected

SelectedIndexChanged SelectedValueChanged

Items

116

CheckedListBox

Thuộc tính thường dùng Ý nghĩa

BorderStyle Kiểu đường viền của điều khiển CheckedListBox

MultiColumn Cho phép trình bày danh sách phân tử trên điều khiển có nhiều cột

ColumnWidth Chiều rộng của mỗi cột nếu phần tử trình bày trên điều khiển có nhiều cột

Items Tập các phần tử có trong điều khiển, bạn có thể sử dụng phương thức Add và AddRange để thêm chuỗi hay phần tử với khóa và giá trị vào điều khiển CheckedListBox

SelectionMode Cho phép chọn một hay nhiều phần tử cùng một lúc

Sorted Nếu chọn True thì danh sách sắp xếp tăng dần theo giá trị

SelectedItems Trả về tập phần tử được chọn

CheckedListBox

117

CheckedListBox

Thuộc tính thường dùng Ý nghĩa

SelectedItem Gán hay lấy giá trị object ứng với phần tử đang chọn

SelectedValue Gán hay lấy giá trị ứng với phần tử kiểu object đang chọn

SelectedIndex Gán và lấy giá trị chỉ mục ứng với phần tử đang chọn

CheckedItems Trả về tập phần tử được Check

CheckedListBox

118

CheckedListBox

Biến cố Ý nghĩa

Mouse Click Xảy ra khi người sử dụng Click trên điều khiển

Click Xảy ra khi người sử dụng Click vào điều khiển

ItemChecked Xảy ra khi người sử dụng Click vào biểu tượng CheckBox của từng phần tử

SelectedIndexChanged Xảy ra khi chỉ mục của phần tử được thay đổi

SelectedValueChanged Xảy ra khi giá trị của phần tử được thay đổi trên điều khiển

DoubleClick Xảy ra khi người sử dụng nhấn 2 lần chuột liên tiếp trên phần tử

EnabledChanged Xảy ra khi thuộc tính Enabledd thay đổi giá trị từ True sang False hay ngược lại


CheckedListBox

119

CheckedListBox

Thuộc tính ItemsItems lưu trữ danh sách item Có thể bổ sung vào thời điểm

Design time Run time

Item được check

Item được select

120

CheckedListBox

Khởi tạo và khai báo đối tượng CheckedListBox


{ CheckedListBox chkl = new CheckedListBox();

chkl.Name = "chkCertificate";

chkl.Sorted = true;

chkl.Items.Add("B.A");

chkl.Items.Add("M.B.A");

chkl.Location = new System.Drawing.Point(300, 400);

this.Controls.Add(chkl);

}

121

CheckedListBox

MultiColumn = trueMultiColumn = true

Các item được tổ chức theo nhiều cột

122

CheckedListBox

Sự kiện SelectedIndexChangedSelectedIndexChanged

123

Các Control

GroupBox, Panel & TabControlGroupBox, Panel & TabControl

124

GroupBox & Panel

Bố trí controls trên GUI GroupBoxGroupBox

Hiển thị một khung bao quanh một nhóm control Có thể hiển thị một tiêu đề

Thuộc tính Text Khi xóa một GroupBox thì các control chứa trong nó bị xóa

theo Lớp GroupBox kế thừa từ System.Windows.Forms.Control

PanelPanel Chứa nhóm các control Không có caption Có thanh cuộn (scrollbar)

Xem nhiều control khi kích thước panel giới hạn

125

GroupBox & Panel

Groupbox Mô tả Thuộc tính thường dùng

Controls Danh sách control chứa trong GroupBox. Text Caption của GroupBox

Panel Thuộc tính thường dùng AutoScroll Xuất hiện khi panel quá nhỏ để hiển thị hết

các control, mặc định là false BorderStyle Biên của panel, mặc định là None, các tham

số khác như Fixed3D, FixedSingle Controls Danh sách control chứa trong panel

126

GroupBox & Panel

Minh họa GroupBoxGroupBox

groupBox1 chứa 2 controltextBox1 và button1

textBox2 và button2 chứa trong Controls của Form

127

GroupBox & Panel

Minh họa PanelPanel

scroll

128

TabControl

Dạng container chứa các control khác Cho phép thể hiện nhiều page trên một form duy nhất Mỗi page chứa các control tương tự như group control

khác. Mỗi page có tag chứa tên của page Kích vào các tag để chuyển qua lại giữa các page

Ý nghĩaÝ nghĩa: Cho phép thể hiện nhiều control trên một form Các control có cùng nhóm chức năng sẽ được tổ chức

trong một tab (page)

129

TabControl

TabControlTabControl có thuộc tính TabPagesTabPages Chứa các đối tượng TabPageTabPage

TabControl

TabPage

TabPage

130

ButtonsButtons

TabControl

Thuộc tính AppearanceAppearance

NormalNormal

FlatButtonFlatButton

131

TabControl

Thuộc tính, phương thức & sự kiện thường dùng

Multiline

SelectedIndex

SelectedTab

TabCount

TabPages

SelectedIndexChanged

EventEvent

PropertiesPropertiesMethodMethodSelectTab

DeselectTab

132

TabControl

Thêm/Xóa TabPageKích chuột phải

Thêm/Xóa TabPage

133

TabControl

Chỉnh sửa các TabPage Chọn thuộc tính TabPagesTabPages của TabControl Sử dụng màn hình TabPage Collection EditorTabPage Collection Editor để chỉnh sửa

134

PictureBox

Sử dụng để hiển thị ảnh dạng bitmap, metafile, icon, JPEG, GIF.

Sử dụng thuộc tính Image để thiết lập ảnh lúc design hoặc runtime.

Các thuộc tính Image: ảnh cần hiển thị SizeMode:

Normal StretchImage AutoSize CenterImage Zoom

135

PictureBox

5 pictureBox với các SizeMode

tương ứng

136

ImageList

Cung cấp tập hợp những đối tượng image cho các control khác sử dụng ListView TreeView

Các thuộc tính thường dùng ColorDepth: độ sâu của màu Images: trả về ImageList.ImageCollection ImageSize: kích thước ảnh TransparentColor: xác định màu sẽ transparent

137

ImageList

Các bước sử dụng ImageList Kéo control ImageList từ ToolBox thả vào Form Thiết lập kích thước của các ảnh: ImageSize Bổ sung các ảnh vào ImageList qua thuộc tính Images Sử dụng ImageList cho các control

Khai báo nguồn image là image list vừa tạo cho control Thường là thuộc tính ImageList

Thiết lập các item/node với các ImageIndex tương ứng Việc thiết lập có thể ở màn hình design view hoặc code view

138

ImageList

Tạo ImageListImageList

139

ImageList

Sử dụng ImageList trong ListView

Hiển thị dạng small icon

Khai báo ImageList cho

ListView

listView1

140

ImageList

Thêm Item

Khai báo image cho item qua ImageIndex

141

ImageList

Demo

Mỗi item sẽ có ảnh theo đúng thứ tự ImageIndex được

khai báo trong ImageList

142

TrackBar

Cho phép user thiết lập giá trị trong khoảng cố định cho trước

Thao tác qua thiết bị chuột hoặc bàn phím

Properties

Methods

Maximum Minimum

TickFrequency

TickStyle

Value SetRange

Scroll ValueChanged

143

TrackBar

public void AddTrackBar() { TrackBar tb1 = new TrackBar(); tb1.Location = new Point(10, 10); tb1.Size = new Size(250, 50);

tb1.Minimum = 0; tb1.Maximum = 100;

tb1.SmallChange = 1; tb1.LargeChange = 5; tb1.TickStyle = TickStyle.BottomRight;

tb1.TickFrequency = 10; tb1.Value = 10; Controls.Add(tb1); }

Tạo thể hiện

Thiết lập khoảng: 0 - 100

Số vị trí di chuyển khi dùng phím mũi tên

Số vị trí di chuyển khi dùng phím Page

Kiểu stick ở bên dưới/bên phải track

Số khoảng cách giữa các tick mark

144

TrackBar

Bổ sung Label hiển thị giá trị của TrackBar

145

NumericUpDown

Cho phép user chọn các giá trị trong khoảng xác định thông qua Nút up & down Nhập trực tiếp giá trị

Các thuộc tính Minimum Maximum Value Increment

Sự kiện ValueChanged

Phương thức DownButton UpButton

146

NumericUpDown

Đoạn code thêm control NumericUpDown

public void AddNumericUpDown() { NumericUpDown numUpDn = new NumericUpDown(); numUpDn.Location = new Point(50, 50); numUpDn.Size = new Size(100, 25);

numUpDn.Hexadecimal = true; // hiển thị dạng hexa numUpDn.Minimum = 0; // giá trị nhỏ nhất numUpDn.Maximum = 255; // giá trị lớn nhất numUpDn.Value = 0xFF; // giá trị khởi tạo numUpDn.Increment = 1; // bước tăng/giảm

Controls.Add(numUpDn); // thêm control vào ds control của form}

147

NumericUpDown

Demo

Nhập trực tiếp giá trị

Tăng giảm giá trị

Hiển thị giá trị Hexa

148

DomainUpDown

Cho phép user chọn item trong số danh sách item thông qua Button Up & Down Nhập từ bàn phím

Properties Items: danh sách item ReadOnly: true chỉ cho phép thay đổi giá trị qua Up & Down SelectedIndex: chỉ mục của item đang chọn SelectedItem: item đang được chọn Sorted: sắp danh sách item Text: text đang hiển thị trên DomainUpDown.

Event SelectedItemChanged

149

DomainUpDown

Nhập item cho DomainUpDown

String Collection EditorCho phép nhập item

150

ProgressBar

Hiển thị tiến độ thực hiện của một công việc nào đó Các thuộc tính

Minimum: giá trị nhỏ nhất Maximum: giá trị lớn nhất Step: số bước tăng khi gọi hàm PerformStep Value: giá trị hiện tại Style: kiểu của progress bar

Phương thức PerformStep(): tăng thêm step Increment(int value): tăng vị trí hiện tại của tiến độ với giá trị

xác định

151

ProgressBar

Khai báo thanh tiến độ 0-100, step = 10

Max = 100

Min = 0

Step = 10

152

ProgressBar

153

ProgressBar

Demo

Thể hiện trực quan tiến độ

Tăng tiến độ theo step và cập nhật lại % hoàn thành lên

label

154

MaskEditBox

Control này được sử dụng để qui định dạng thức cho dữ liệu nhập.

Properties: Mask: Thiết lập mặt nạ cho MaskEditBox.

Sử dụng các Mark có sẳn:

155

MaskEditBox• Custom: Thiết lập giá trị Mask tùy ý

Thành phần mask Ý nghĩa

0 Số. Yêu cầu bắt buộc phải nhập số từ 0-9

9 Số hoặc khoảng trắng (Optional)

# Số hoặc khoảng trắng (Optional). Có thể nhập dấu + hoặc -

L Kí tự [a..z] hoặc [A..Z] (Bắt buộc)

? Kí tự [a..z] hoặc [A..Z] (Không bắt buộc)

, Đơn vị phần ngàn (1,234)

. Đơn vị phần lẻ (0.32)

156

MaskEditBox

Properties: Mask: Thiết lập mặt nạ cho MaskEditBox.

MaskCompleted: trả về giá trị true/false cho biết các ký tự bắt buột trong mark có nhập đủ hay không

MaskFull: trả về giá trị true/false cho biết các ký tự tùy chọn và bắt buộc trong mark có nhập đủ hay không

Prompt Char: ký tự hiển thị trong textbox giúp người sử dụng biết nơi cần nhập nội dung

157

MaskEditBox

Properties: TextMaskFormat: Qui định nội dung của textbox có bao gồm

các literal và prompt hay không: ExcludePromptAndLiterals: chỉ lấy nội dung do user nhập vào IncludeLiterals: nội dung bao gồm dữ liệu do user nhập và

literal có trong Mark IncludePrompt: nội dung bao gồm dữ liệu do user nhập và

promt có trong Mark IncludePromptAndLiterals: nội dung bao gồm dữ liệu do user

nhập, literal và promt có trong Mark

Literals

Prompt

158

DateTimePicker

Cho phép chọn ngày trong khoảng xác định thông qua giao diện đồ họa dạng calendar

Kết hợp ComboBox và MonthCalendar Properties

Format: định dạng hiển thị long, short, time, custom

CustomFormat: dd: hiển thị 2 con số của ngày MM: hiển thị 2 con số của tháng yyyy: hiển thị 4 con số của năm …(xem thêm MSDN Online)

MaxDate: giá trị ngày lớn nhất MinDate: giá trị ngày nhỏ nhất Value: giá trị ngày hiện tại đang chọn

159

DateTimePicker

private void AddDateTimePicker() { DateTimePicker DTPicker = new DateTimePicker(); DTPicker.Location = new Point(40, 80); DTPicker.Size = new Size(160, 20); DTPicker.DropDownAlign = LeftRightAlignment.Right; DTPicker.Value = DateTime.Now; DTPicker.Format = DateTimePickerFormat.Custom; DTPicker.CustomFormat = "'Ngày' dd 'tháng' MM 'năm' yyyy"; this.Controls.Add(DTPicker); }

160

DateTimePicker

Demo

Kích drop down để hiện thị hộp

chọn ngày

Chọn ngày trong khoảng cho trước

Định dạng xuất: 'Ngày' dd 'tháng' MM 'năm' yyyy

161

MonthCalendar

Cho phép user chọn một ngày trong tháng hoặc nhiều ngày với ngày bắt đầu và ngày kết thúc.

Một số thuộc tính thông dụng MaxDate, MinDate SelectionStart: ngày bắt đầu chọn SelectionEnd: ngày kết thúc

Sinh viên tự tìm hiểu thêm…

162

Timer

Bộ định thời gian, thiết lập một khoảng thời gian xác định (interval) và khi hết khoảng thời gian đó Timer sẽ phát sinh sự kiện tick.

Properties

MethodsEnabled Interval

Start

Stop Tick

163

Timer

Hiển thị giờ hệ thống

Enable sự kiện Tick

Khoảng thời gian chờ giữa 2 lần gọi Tick

Hiển thị thời gian

164

Timer

Sự kiện Tick

Khai báo trình xử lý sự

kiện Tick

165

Timer

Demo

Mỗi giây sự kiện Tick phát sinh. Trình xử lý của Tick sẽ lấy giờ hệ thống và hiển thị lên

Label

166

ToolTip

Cung cấp chức năng hiển thị một khung text nhỏ khi user di chuyển chuột vào control bất kỳ

Khung text chứa nội dung mô tả ý nghĩa của control Cách sử dụng

Từ ToolBox kéo ToolTip thả vào form Kích chọn control muốn thêm tooltip Trong cửa sổ Properties của control sẽ có thuộc tính

ToolTip. Thêm text vào thuộc tính này để hiển thị khi tooltip xuất hiện.

167

ToolTip

Tạo ToolTip

168

ToolTip

Khai báo Tooltip cho textbox trong Design View

Nội dung Tooltip

169

ToolTip

Khai báo tooltip cho button

Nhập nội dung Tooltip cần hiển

thị

170

ToolTip

Khai báo tooltip cho listbox bằng code

171

ToolTip

Demo

ToolTip xuất hiện khi user di chuyển

chuột vào vùng control

172

Các Event

Mouse EventMouse Event

173

Mouse Event

Mouse là thiết bị tương tác thông dụng trên GUI Một số các thao tác phát sinh từ mouse

Di chuyển Kích chuột

Ứng dụng cần xử lý sự kiện chuột nào sẽ khai báo trình xử lý tương ứng

Lớp MouseEventArgsMouseEventArgs được sử dụng để chứa thông tin truyền vào cho trình xử lý sự kiện mouse.

Mỗi trình xử lý sự kiện sẽ có tham số là đối tượng object và đối tượng MouseEventArgs (hoặc EventArgs)

174

Mouse Event

Tham số cho sự kiện liên quan đến mouse

Tọa độ (x,y) của Tọa độ (x,y) của con trỏ chuộtcon trỏ chuột

Button được nhấnButton được nhấnSố lần kích chuộtSố lần kích chuột

MouseEventArgsMouseEventArgs

175

Mouse Event

Sự kiện chuột với tham số kiểu EventArgs

MouseEnter Xuất hiện khi con trỏ chuột đi vào vùng biên của control

MouseLeave Xuất hiện khi con trỏ chuột rời khỏi biên của control

Sự kiện chuột với tham số kiểu MouseEventArgs

MouseDown/

MouseUp

Xuất hiện khi button được nhấn/thả và con trỏ chuột đang ở trong vùng biên của control

MouseMove Xuất hiện khi chuột di chuyển và con trỏ chuột ở trong vùng biên của control

176

Mouse Event

Thuộc tính của lớp MouseEventArgs

Button Button được nhấn {Left, Right, Middle, none} có kiểu là MouseButtons

Clicks Số lần button được nhấn

X Tọa độ x của con trỏ chuột trong control

Y Tọa độ y của con trỏ chuột trong control

177

Mouse Event

MouseMove

178

Mouse Event

Demo

Hiển thị tọa độ hiện tại của con trỏ chuột

Vị trí hiện tại của con trỏ chuột

179

Mouse Event

Demo thao tác: kích chuột trái tại một điểm A, giữ chuột trái và di chuyển chuột, chương trình sẽ vẽ đường thẳng từ điểm A đến vị trí hiện tại chuột.

Các sự kiện cần xử lý MouseDown:

Xác định điểm A ban đầu MouseMove

Kiểm tra nếu Left button của chuột đang giữ Sử dụng Graphics để vẽ đường thẳng từ A đến vị trí hiện tại

180

Mouse Event

Bước 1: Tạo biến lưu trữ điểm A khi user kích chuột trái Biến pA có kiểu Point là biến thành viên của Form1

Lớp Form1

Biến pA lưu giữ tọa độ khi chuột trái được click

181

Mouse Event

Bước 2 Khai báo xử lý sự kiện MouseDown trong Form1

Trong cửa sổ event của Form1, kích đúp vào sự kiện MouseDown

Lưu lại điểm được nhấn chuột

182

Mouse Event

Bước 3 Cài đặt xử lý sự kiện MouseMove

Kiểm tra nếu LeftButton được nhấn Vẽ đường thẳng từ pA đến vị trí hiện tại

183

Các Event

Keyboard EventKeyboard Event

184

Keyboard Event

Phát sinh khi một phím được nhấn hoặc thả Có 3 sự kiện

KeyPress KeyUp KeyDown

KeyPress phát sinh kèm theo với mã ASCII của phím được nhấn

KeyPress không cho biết trạng thái các phím bổ sung {Shift, Alt, Ctrl…}

Sử dụng KeyUp & KeyDown để xác định trạng thái các phím bổ sung.

185

Keyboard Event

Sự kiện với tham số kiểu KeyEventArgsSự kiện với tham số kiểu KeyEventArgs

KeyDown Phát sinh khi phím được nhấn

KeyUp Phát sinh khi phím được thả

Sự kiện với tham số kiểu KeyPressEventArgsSự kiện với tham số kiểu KeyPressEventArgs

KeyPress Khởi tạo khi phím được nhấn

Thuộc tính của lớp KeyPressEventArgsThuộc tính của lớp KeyPressEventArgs

KeyChar Chứa ký tự ASCII của phím được nhấn

Handled Cho biết sự kiện KeyPress có được xử lý chưa

Thuộc tính của lớp KeyEventArgsThuộc tính của lớp KeyEventArgs

Alt, Control, Shift Trạng thái các phím bổ sung

Handled Cho biết sự kiện đã xử lý

186

Keyboard Event

Thuộc tính của lớp KeyEventArgs (tt)Thuộc tính của lớp KeyEventArgs (tt)

KeyCode Trả về mã ký tự được định nghĩa trong Keys enumeration

KeyData Chứa mã ký tự với thông tin phím bổ sung

KeyValue Trả về số int, đây chính là mã Windows Virtual Key Code

Modifier Trả về giá trị của phím bổ sung

187

Keyboard Event

Keys Enumeration

188

Keyboard Event

Minh họa các sự kiện: KeyPress, KeyDown, KeyUp Khi user nhấn một phím

Bắt sự kiện KeyPress: xuất ra phím được nhấn Bắt sự kiện KeyDown: xuất ra các tham số trong KeyEventArgs

Khi user thả phím Xóa các thông tin mô tả phím được nhấn trong các label

Cách thực hiện Tạo một form minh họa Thiết kế trên form có 2 Label:

lblChar: hiển thị ký tự được nhấn trong KeyPress lblKeyInfo: hiển thị các thông tin của KeyEventArgs khi

KeyDown

189

Keyboard Event

Bước 1: tạo Windows Form như hình mô tả

Label chứa ký tự được nhấn trong sự kiện KeyPress

Label chứa thông tin mã ký tự được nhấn trong sự kiện KeyDown

190

Keyboard Event

Bước 2: Tạo KeyPress Event Handling cho form

191

Keyboard Event

Bước 3: Tạo KeyDown Event Handling cho form

192

Keyboard Event

Demo

193

Keyboard Event

CT Calculator (BT3) mở rộng cho phép xử lý các phím Form nhận xử lý thông điệp KeyDown

Xác định các phím tương ứng rồi gọi sự kiện click của button VD: user gõ phím 1, tương tự như button “1” được nhấn

Cách thực hiện Khai báo trình xử lý sự kiện

KeyDown cho Form chính Thiết lập thuộc tính KeyPreviewKeyPreview

cho Form để nhận sự kiện bàn phím.

194

Keyboard Event

Viết phần xử lý cho sự kiện KeyDown Xác định các phím tương ứng để gọi sự kiện click của các

button.

Gọi event Click của button “1”

Phím '=' được nhấn

Phím ‘+' được nhấn

195

Tóm tắt

Thiết kế layout trên form Anchor Dock các control

Các control trên form Control nhập liệu Control chọn giá trị Container control Component Advanced control

Mouse event Keyboard event

196

Documents

LẬP TRÌNH GIAO DIỆN Graphical User Interface (GUI)