bài 3: lập trình giao diện điều khiển & xử lý sự kiện - lập trình winform -...

Bài 3:LẬP TRÌNH GIAO DIỆN

ĐIỀU KHIỂN & XỬ LÝ SỰ KIỆN

Xây dựng lớp, cấu trúcTạo và sử dụng đối tượngXây dựng lớp kế thừaKhái hình và sử dụng đa hìnhSử dụng các lớp và đối tượng dựng sẵnCollectionTự sinh mã khai báo

Hệ thống bài cũ

Xây dựng lớp, cấu trúcTạo và sử dụng đối tượngXây dựng lớp kế thừaKhái hình và sử dụng đa hìnhSử dụng các lớp và đối tượng dựng sẵnCollectionTự sinh mã khai báo

Lập trình giao diện - Điều khiển & xử lý sự kiện 2

Mục tiêu bài học

Các nhóm điều khiển trên formCác điều khiển thường dùngCác điều khiển chứaCác điều khiển menuCác điều khiển dữ liệuCác thành phầnCác điều khiển hỗ trợ inCác điều khiển hộp thoại

Sự kiện và xử lý sự kiện trong C#

Các nhóm điều khiển trên formCác điều khiển thường dùngCác điều khiển chứaCác điều khiển menuCác điều khiển dữ liệuCác thành phầnCác điều khiển hỗ trợ inCác điều khiển hộp thoại

Sự kiện và xử lý sự kiện trong C#


ĐIỀU KHIỂNTRÊN FORM


ĐIỀU KHIỂNTRÊN FORM

Visual Studio cung cấp rất nhiều điều khiểnCác điều khiển thường dùngCác điều khiển chứaCác điều khiển menuCác điều khiển dữ liệuCác thành phầnCác điều khiển hỗ trợ inCác điều khiển hộp thoại

Điều khiển trong Visual Studio

Visual Studio cung cấp rất nhiều điều khiểnCác điều khiển thường dùngCác điều khiển chứaCác điều khiển menuCác điều khiển dữ liệuCác thành phầnCác điều khiển hỗ trợ inCác điều khiển hộp thoại


CÂY

PHÂ

N C

ẤP

ĐIỀ

U K

HIỂ

N


CÂY

PHÂ

N C

ẤP

ĐIỀ

U K

HIỂ

N

COMMON CONTROLS


Các điều khiển đã họcLàm quen với một số điều khiển

Nhóm điều khiển thường dùng


CheckedListBox thừa kế từ ListBox nên sẽ có các thuộctính và phương thức của ListBoxCheckedListBox là một ListBox chứa các phần tử làCheckBox

CheckedListBox


Thuộc tính

CheckedIndices Trả về một collection các chỉ số được đánh dấu trongCheckedListBox

CheckedItems Trả về một collection các phần tử được đánh dấu trongCheckedListBox

CheckOnClick Nếu bằng true thì các phần tử được đánh dấu khi nhận mộtnhấn đơn còn false thì phần tử sẽ được đánh dấu khi nhậnmột click đúp chuột

Các thuộc tính của CheckedListBox

Nếu bằng true thì các phần tử được đánh dấu khi nhận mộtnhấn đơn còn false thì phần tử sẽ được đánh dấu khi nhậnmột click đúp chuột

Items Trả về các một collection gồm các phần tử của CheckedListBox

SelectedItem Lấy hoặc thiết lập phần tử vừa được chọn trongCheckedListBox

SelectedItems Lấy hoặc thiết lập các phần tử được chọn trongCheckedListBox


Tham khảo thêm các thuộc tính và phương thức của CheckedListBox trênhttp://msdn.microsoft.com/en-us/library/system.windows.forms.checkedlistbox.aspx

http://msdn.microsoft.com/en-

Demo CheckedListBox

private void checkedListBox1_ItemCheck(object sender, ItemCheckEventArgs e){

if (e.NewValue == CheckState.Checked){

listBox1.Items.Add(checkedListBox1.SelectedItem.ToString());}else{

listBox1.Items.Remove(checkedListBox1.SelectedItem.ToString());}

}


private void checkedListBox1_ItemCheck(object sender, ItemCheckEventArgs e){

if (e.NewValue == CheckState.Checked){

listBox1.Items.Add(checkedListBox1.SelectedItem.ToString());}else{

listBox1.Items.Remove(checkedListBox1.SelectedItem.ToString());}

}

ListView là điều khiển dùng để hiển thị một danh sách các phầntử với các biểu tượngWindows Explorer là một ví dụ của ListView

ListView cung cấp nhiều cách hiển thị khác nhau (LargeIcon,Details, SmallIcon, List, Title)Xem Video hướng dẫn tạo Listview

ListView

ListView là điều khiển dùng để hiển thị một danh sách các phầntử với các biểu tượngWindows Explorer là một ví dụ của ListView

ListView cung cấp nhiều cách hiển thị khác nhau (LargeIcon,Details, SmallIcon, List, Title)Xem Video hướng dẫn tạo Listview


Demo ListView

1. Thêm một cột vào Listview Click vào control Listview và chọn properties chọn mụcColumn

2. Nhấn vào nút Add chọn thuộc tính Name và Text để đặttên và nhãn cho cột.


3. Chọn thuộc tính FullRowSelect =true để chọn cả 1 dòng của Listview4. Chọn thuộc tính View có giá trị là Details

Thêm /xóa một hàng vào Listview1. Thêm phần tử vào dòng đầu tiên của Listview

listview1.Items.Add("Ducati"); // thêm cột thứ nhấtlistview1.Items[0].SubItems.Add("2005");listview1.Items[0].SubItems.Add("125");listview1.Items[0].SubItems.Add("40000");

2. Thêm phần tử vào hàng thứ i của Listviewlistview1.Items.Add("Hyundai");listview1.Items[i].SubItems.Add("2007");listview1.Items[i].SubItems.Add("400");listview1.Items[i].SubItems.Add("850000");


2. Thêm phần tử vào hàng thứ i của Listviewlistview1.Items.Add("Hyundai");listview1.Items[i].SubItems.Add("2007");listview1.Items[i].SubItems.Add("400");listview1.Items[i].SubItems.Add("850000");

3. Xóa tất cả các phần tử của Listviewlistview1.Items.Clear(); .

Lấy giá trị của dòng Listview được chọn1. Lấy giá trị cột thứ i của dòng đã chọn (cột đầu tiên có giá trị là 0)

if (listview1.SelectedItems.Count > 0){

listview1.SelectedItems[0].SubItems[0].Text}


TreeView

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

ShowRootLines GetNodeAt AfterCollapse

ImageIndex GetNodeCount BeforeCheck

ShowPlusMinus CollapseAll BeforeCollapseShowPlusMinus CollapseAll BeforeCollapse

AfterSelectAfterExpand

BeforeSelect

BeforeExpand

Thêm Node vào Treeview

1. Click phải chuột vào Treeview chọn mục Properties

2 Chọn mục Node và chọn collection

3 Nhấn nút Add root để thêm node gốc nhấn nút add child để thêm node con

4 Xem Video hướng dẫn thiết kế Treeview

Truy cập đến các node / lấy giá trị node được chọn

1. Giả sử có cây như hình vẽ

3 truy cập phần tử YZFR1 bằng chỉ số:tw.Nodes[0].Nodes[0].Nodes[1].IsSelected

Truy cập phần tử Accord bằng chỉ số:

tw.Nodes[0].Nodes[1].Nodes[0].IsSelected

2. Thuộc tính Node.IsSelected cho biết Node được chọn

3 truy cập phần tử YZFR1 bằng chỉ số:tw.Nodes[0].Nodes[0].Nodes[1].IsSelected

Truy cập phần tử Accord bằng chỉ số:

tw.Nodes[0].Nodes[1].Nodes[0].IsSelected

4. Lấy giá trị của Node được chọn dùng :tw.SelectedNode.Text

Sử dụng để người dùng biết quá trình xử lý của máy tính

ProgressBar


Các thuộc tính vàphương thức của ProgressBar

Thuộc tính Mô tảValue Thiết lập vị trí hiện tại của ProgressBar

Step Thiết lập khoảng giá trị mà phương thức PerformStep sẽ tăng

Maximum Thiết lập giá trị cao nhất

Minimum Thiết lập giá trị nhỏ nhất


Phương thức Mô tảPerformStep Tăng vị trí hiện tại của ProgressBar theo giá trị trong thuộc tính

Step

Tham khảo thêm các thuộc tính và phương thức của CheckedListBox trênhttp://msdn.microsoft.com/en-us/library/system.windows.forms.progressbar.aspx

http://msdn.microsoft.com/en-

Demo quá trình tính tổng từ 1 đến 10

Demo ProgressBar


Demo ProgressBar

//Đề mô quá trình tính tổng từ 1 đến 10private void btnTinh_Click(object sender, EventArgs e){

progressBar.Value = 0;progressBar.Maximum = 100;progressBar.Minimum = 0;progressBar.Step = 10;

int sum = 0;for (int i = 0; i < 10; i++){

sum += i;Thread.Sleep(1000);progressBar.PerformStep();

}}


//Đề mô quá trình tính tổng từ 1 đến 10private void btnTinh_Click(object sender, EventArgs e){

progressBar.Value = 0;progressBar.Maximum = 100;progressBar.Minimum = 0;progressBar.Step = 10;

int sum = 0;for (int i = 0; i < 10; i++){

sum += i;Thread.Sleep(1000);progressBar.PerformStep();

}}

Là điều khiển dùng để hiển thị các trang web với địa chỉđược chỉ ra

WebBrowser


Thuộc tính

Phương thức

WebBrowser

Thuộc tính

LocationURL Thiết lập URL cho trang hiện tại

Thuộc tính

Phương thức


Phương thức

Navigate(url) Duyệt đến trang được chỉ ra

GoBack() Duyệt trang trước đó trong history

GoForward() Duyệt trang tiếp theo trong history

Demo WebBrowser


Demo WebBrowser

private void btnOK_Click(object sender, EventArgs e){

string url = txtUrl.Text;webBrowser.Navigate(new Uri(url));

}


private void btnOK_Click(object sender, EventArgs e){

string url = txtUrl.Text;webBrowser.Navigate(new Uri(url));

}

Tự tìm hiểu các điều khiển còn lại của nhóm CommonControls, xây dựng một demo nhỏ cho mỗi điều khiển

BÀI TẬP VỀ NHÀ

Sử dụng từ khóa: Tên điều khiển Example C# để tìm kiếm


CONTAINERS


Containers


Ví dụ về điều khiển Tab(Options của Firefox)

MENUS & TOOLBARS


Menus & Toolbars


ContextMenuStrip

ToolStrip

StatusStrip

Menu trạng thái (Status Strip)

StatusStrip (Menu trạng thái) Nằm cuối form cho biếttrạng thái hiện tại của ứng dụng


Visual Studio cung cấp menungữ cảnh cho các điều khiểnMenu xuất hiện khi người dùngnhấn phải chuột vào điềukhiển

Muốn sử dụng menu ngữ cảnhcho một điều khiển cần

1. Thêm menu ngữ cảnh vàoform2. Gán menu ngữ cảnh đó chothuộc tính ContextMenuStrip

Menu ngữ cảnh (ContextMenuStrip)

Visual Studio cung cấp menungữ cảnh cho các điều khiểnMenu xuất hiện khi người dùngnhấn phải chuột vào điềukhiển

Muốn sử dụng menu ngữ cảnhcho một điều khiển cần

1. Thêm menu ngữ cảnh vàoform2. Gán menu ngữ cảnh đó chothuộc tính ContextMenuStrip


CÁC ĐIỀU KHIỂN KHÁC


Các điều khiển khác


Cung cấp cơ chế để thực thi hành động sau mỗi khoảngthời gianThuộc tính/Phương thức

Sự kiện

Timer

Thuộc tính/Phương thức Mô tảInterval Chỉ ra khoảng thời gian sự kiện Tick xẩy

ra

Cung cấp cơ chế để thực thi hành động sau mỗi khoảngthời gianThuộc tính/Phương thức

Sự kiện


Chỉ ra khoảng thời gian sự kiện Tick xẩyra

Start() Bắt đầu tính thời gian

Stop() Kết thúc Timer

Thuộc tính/Phương thức Mô tảTick Xẩy ra mỗi khoảng thời gian được chỉ ra

trong thuộc tính Interval

Demo ProgressBar với Timer

private void Form1_Load(object sender, EventArgs e){

pb.Minimum = 0;pb.Maximum = 100;pb.Value = 20;pb.Step = 2;Controls.Add(pb);timer1.Interval = 200;timer1.Start();

}

private void timer1_Tick(object sender, EventArgs e){

pb.PerformStep();if (pb.Value == pb.Maximum){

timer1.Stop();}

}Lập trình giao diện - Điều khiển & xử lý sự kiện 37


pb.Minimum = 0;pb.Maximum = 100;pb.Value = 20;pb.Step = 2;Controls.Add(pb);timer1.Interval = 200;timer1.Start();

}

private void timer1_Tick(object sender, EventArgs e){

pb.PerformStep();if (pb.Value == pb.Maximum){

timer1.Stop();}

}

Chọn ra 3 điều khiển bất kỳ chưa được giới thiệu để tìmhiểu, mỗi điều khiển cho một demo nhỏ


Sử dụng từ khóa: Tên điều khiển Example C# để tìm kiếm


THIẾT LẬP THUỘC TÍNHCHO ĐIỀU KHIỂN


THIẾT LẬP THUỘC TÍNHCHO ĐIỀU KHIỂN

Có hai cách thiết lập thuộc tính cho điều khiểnThiết lập thuộc tính cho các điều khiển trên panelpropertiesViết mã để thiết lập cho tất cả các thuộc tính cho điềukhiển

Khi thiết lập thuộc tính trên panel properties, IDE tự sinhcode trong file Designer.cs

Thiết lập thuộc tính cho điều khiển

Có hai cách thiết lập thuộc tính cho điều khiểnThiết lập thuộc tính cho các điều khiển trên panelpropertiesViết mã để thiết lập cho tất cả các thuộc tính cho điềukhiển

Khi thiết lập thuộc tính trên panel properties, IDE tự sinhcode trong file Designer.cs


Demo thiết lập thuộc tính bằng IDE


// Mã được sinh bởi IDEthis.lblLabel.ForeColor = System.Drawing.SystemColors.HotTrack;this.lblLabel.Location = new System.Drawing.Point(27, 41);this.lblLabel.Name = "lblLabel";this.lblLabel.Size = new System.Drawing.Size(69, 24);this.lblLabel.TabIndex = 0;this.lblLabel.Text = "Hello!!!";

Demo thiết lập thuộc tínhcho điều khiển bằng viết mã


lblHow.Text = "How are you?";this.lblHow.ForeColor = System.Drawing.SystemColors.Highlight;

}



lblHow.Text = "How are you?";this.lblHow.ForeColor = System.Drawing.SystemColors.Highlight;

}

VIẾT MÃ THÊM ĐIỀUKHIỂN VÀO FORM


VIẾT MÃ THÊM ĐIỀUKHIỂN VÀO FORM

Có thể thêm điều khiển vào form bằng cách sử dụngcông cụ hoặc viết mã; trong lúc thiết kế hoặc trong quátrình thực thi ứng dụngCác bước để thêm điều khiển vào form

B1. Tạo thực thể của điều khiểnB2. Thêm điều khiển vào formB3. Thiết lập các thuộc tính cho điều khiển

Viết mã thêm điều khiển vào formCó thể thêm điều khiển vào form bằng cách sử dụngcông cụ hoặc viết mã; trong lúc thiết kế hoặc trong quátrình thực thi ứng dụngCác bước để thêm điều khiển vào form

B1. Tạo thực thể của điều khiểnB2. Thêm điều khiển vào formB3. Thiết lập các thuộc tính cho điều khiển



CheckedListBox clb = new CheckedListBox();Controls.Add(clb);

clb.Items.Add("hi");clb.Items.Add("how");clb.Items.Add("are");clb.Items.Add("you");

}

12

3

SỰ KIỆNCỦA ĐIỀU KHIỂN


SỰ KIỆNCỦA ĐIỀU KHIỂN

Visual Studio cung cấp rất nhiều sự kiện cho mỗi điềukhiển

Điều khiển button được cung cấp 60 sự kiện

Mỗi điều khiển được hỗ trợ một tập các sự kiện khácnhau tùy vào đặc thù của điều khiểnSự kiện được chia làm 3 nhóm chính

Sự kiện đối với chuộtMouseClick, MouseDown, MouseEnter…

Sự kiện đối với bàn phímKeyUp, KeyDown..

Sự kiện khácTextChanged, FontChanged…

Sự kiện điều khiển

Visual Studio cung cấp rất nhiều sự kiện cho mỗi điềukhiển

Điều khiển button được cung cấp 60 sự kiện

Mỗi điều khiển được hỗ trợ một tập các sự kiện khácnhau tùy vào đặc thù của điều khiểnSự kiện được chia làm 3 nhóm chính

Sự kiện đối với chuộtMouseClick, MouseDown, MouseEnter…

Sự kiện đối với bàn phímKeyUp, KeyDown..

Sự kiện khácTextChanged, FontChanged…


Có 3 sự kiện chính của bàn phímKeyDownKeyPressKeyUp

Khi một phím ký tự được nhấn thì các sự kiện xẩy ratheo trình tự KeyDown, KeyPress và KeyUpKhi một phím không phải ký tự được nhấn, chỉ có sựkiện KeyDown và KeyUpSự kiện này sẽ được áp dụng cho điều khiển nào đangnhận được focus

Sự kiện đối với bàn phím

Có 3 sự kiện chính của bàn phímKeyDownKeyPressKeyUp

Khi một phím ký tự được nhấn thì các sự kiện xẩy ratheo trình tự KeyDown, KeyPress và KeyUpKhi một phím không phải ký tự được nhấn, chỉ có sựkiện KeyDown và KeyUpSự kiện này sẽ được áp dụng cho điều khiển nào đangnhận được focus


Demo Sự kiện đối với bàn phím


private void button1_KeyPress(object sender, KeyPressEventArgs e){

MessageBox.Show("Button 1");}

private void button2_KeyPress(object sender, KeyPressEventArgs e){

MessageBox.Show("Button 2");}

Demo Sự kiện đối với bàn phím


Nhấn một phím bất kỳ khiButton 1 được focus

Nhấn một phím bất kỳ khiButton 2 được focus

Để gán một phương thức xử lý sự kiện cho một điềukhiển, cần nối phương thức xử lý sự kiện cho sự kiệnMỗi phương thức xử lý sự kiện có thể nối cho nhiều sựkiện

Xử lý sự kiện trong C#

SỰ KIỆN PHƯƠNG THỨCXỬ LÝ SỰ KIỆN

button1.Click private void button1_Click(objectsender, EventArgs e){}

Để gán một phương thức xử lý sự kiện cho một điềukhiển, cần nối phương thức xử lý sự kiện cho sự kiệnMỗi phương thức xử lý sự kiện có thể nối cho nhiều sựkiện


PHƯƠNG THỨCXỬ LÝ SỰ KIỆN

button1.Click private void button1_Click(objectsender, EventArgs e){}

this.button1.Click += new System.EventHandler(this.button1_Click);

Mã này thuộc file Designer.cs, IDE tự sinh mã

Demo nối một phương thứcxử lý sự kiện với nhiều sự kiện

//Viết mã cho xử lý sự kiệnprivate void xoaTextBoxTong(object sender, EventArgs e){

txtTong.Text = "";}

2

1


Gán phương thức xử lý sự kiệncho các TextBox Số kiện hàngvà Số sách trong mỗi kiện

this.txtSoKienHang.TextChanged += newSystem.EventHandler(this.xoaTextBoxTong);this.txtSoSach.TextChanged += newSystem.EventHandler(this.xoaTextBoxTong);

Mã được IDE tự sinh

2

3

Demo nối một phương thứcxử lý sự kiện với nhiều sự kiện


Nhập vào Số kiện hàng vàSố sách trong mỗi kiện

Nhập vào Số kiện hàng thìgiá trị trong TextBox Tổngsố sách: được xóa

Tìm hiểu các sự kiện hỗ trợ cho các điều khiển được họcngày hôm nay



.NET hỗ trợ rất nhiều điều khiển để thực thi hầu như cácthao tác mong muốn, các điều khiển được gom vào cácnhóm khác nhau tùy vào mục đích sử dụngCác điều khiển CheckListBox, ListView, ProgressBar,WebBrowser thuộc nhóm CommonCác điều khiển ConTextMenu, StatusStrip vàToolStripContainer thuộc nhóm Menu&Toolbar

Tổng kết bài học

.NET hỗ trợ rất nhiều điều khiển để thực thi hầu như cácthao tác mong muốn, các điều khiển được gom vào cácnhóm khác nhau tùy vào mục đích sử dụngCác điều khiển CheckListBox, ListView, ProgressBar,WebBrowser thuộc nhóm CommonCác điều khiển ConTextMenu, StatusStrip vàToolStripContainer thuộc nhóm Menu&Toolbar


Visual Studio cung cấp rất nhiều sự kiện cho mỗi điềukhiển. Mỗi điều khiển được hỗ trợ một tập các sự kiệnkhác nhau tùy vào đặc thù của điều khiểnSự kiện được chia làm 3 nhóm chính: sự kiện đối vớichuột, sự kiện đối với bàn phím và sự kiện khácĐể gán một phương thức xử lý sự kiện cho một điềukhiển, cần nối phương thức xử lý sự kiện cho sự kiệnMỗi phương thức sự kiện có thể nối cho nhiều sự kiện

Tổng kết bài học

Visual Studio cung cấp rất nhiều sự kiện cho mỗi điềukhiển. Mỗi điều khiển được hỗ trợ một tập các sự kiệnkhác nhau tùy vào đặc thù của điều khiểnSự kiện được chia làm 3 nhóm chính: sự kiện đối vớichuột, sự kiện đối với bàn phím và sự kiện khácĐể gán một phương thức xử lý sự kiện cho một điềukhiển, cần nối phương thức xử lý sự kiện cho sự kiệnMỗi phương thức sự kiện có thể nối cho nhiều sự kiện


bài 3: lập trình giao diện điều khiển & xử lý sự kiện - lập trình winform -...

Documents