Bài giảng Lập trình hướng đối tượng - Chương 7: Tương tác với người dùng trong ứng dụng C#

 Chương 7
 Tương tác với người dùng trong ứng dụng C#
 7.0 Dẫn nhập 
 7.1 Tổng quát về tương tác giữa người dùng & chương trình
 7.2 Đối tượng vẽ và cơ chế vẽ nội dung
 7.3 Xuất chuỗi văn bản
 7.4 Xuất ảnh bitmap
 7.5 Xuất hình ₫ồ họa toán học
 7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 7.8 Kết chương
Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
© 2010 Slide 1
7.0 Dẫn nhập 
 Chương này giới thiệu cách thức tương tác giữa người dùng và
 chương trình ₫ể nhập/xuất dữ liệu.
 Chương này cũng giới thiệu các ₫ối tượng giao diện cùng các tác
 vụ xuất dữ liệu dạng chuỗi, dạng bitmap, dạng hình ₫ồ họa toán
 học. Kết hợp 3 loại dữ liệu này, ta có thể tạo kết xuất bất kỳ.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 2
7.1 Tổng quát về tương tác người dùng/chương trình
 Trong lúc chương trình chạy, nó thường phải tương tác với người
 dùng. Sự tương tác gồm 2 hoạt ₫ộng chính :
 . chờ nhận dữ liệu do người dùng cung cấp hay chờ nhận lệnh
 của người dùng ₫ể thực thi 1 chức năng nào ₫ó.
 . hiển thị thông báo và/hoặc kết quả tính toán ra màn hình/máy
 in ₫ể người dùng biết và sử dụng.
 Sự tương tác giữa người dùng và máy tính ₫ược thực hiện thông
 qua các thiết bị nhập/xuất (thiết bị I/O - input/output) như bàn
 phím/chuột ₫ể nhập dữ liệu hay lệnh, màn hình/máy in ₫ể xuất kết
 quả hay thông báo...
 Hiện có hàng trăm hãng chế tạo thiết bị I/O, mỗi hãng chế tạo rất
 nhiều model của cùng 1 thiết bị (td. hãng HP chế rất nhiều model
 máy in phun mực, máy in laser,...). Mỗi model thiết bị của từng
 hãng có những tính chất vật lý riêng và khác với các model khác.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 3
7.1 Tổng quát về tương tác người dùng/chương trình
 Để giúp người lập trình truy xuất các thiết bị I/O dễ dàng, ₫ộc lập
 với tính chất phần cứng của thiết bị, HĐH Windows và VC# ₫ã che
 dấu mọi tính chất phần cứng của các thiết bị và cung cấp cho người
 lập trình 1 giao tiếp sử dụng duy nhất, ₫ộc lập với thiết bị : người
 dùng sẽ tương tác với chương trình thông qua các ₫ối tượng giao
 diện :
 . người dùng ra lệnh bằng cách kích hoạt sự kiện xác ₫ịnh của 1
 ₫ối tượng giao diện. Thí dụ click chuột vào button "Bắt ₫ầu giải"
 ₫ể ra lệnh chương trình giải dùm phương trình bậc 2 có 3 tham
 số a, b, c ₫ã nhập.
 . nhập giá trị ₫úng/sai thông qua chọn/cấm chọn RadioButton
 hay checkbox.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 4
7.1 Tổng quát về tương tác người dùng/chương trình
 . nhập chọn lựa 1/n thông qua chọn RadioButton tương ứng
 trong GroupBox, hay chọn mục tương ứng trong Listbox,
 ComboBox.
 . nhập số nguyên, số thực, chuỗi thông qua TextBox...
 . xuất kết quả ra màn hình thông qua các ₫ối tượng RadioButton,
 Checkbox, TextBox, ListBox, ComboxBox, TreeView...
 Trong trường hợp cần xuất kết quả phức tạp bất kỳ, ta xem nó như
 là tập hợp nhiều chuỗi văn bản, nhiều phần tử ảnh bitmap, nhiều
 phần tử ₫ồ họa toán học như hình chữ nhật, hình tròn,... Xuất kết
 quả phức tạp là quá trình lặp vẽ từng phần tử cấu thành kết quả
 phức tạp.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 5
7.2 Đối tượng vẽ và cơ chế vẽ nội dung
 Các ₫ối tượng Form, PictureBox, Printer cho phép vẽ nội dung bất
 kỳ lên chúng.
 Mỗi lần cần vẽ lại nội dung của ₫ối tượng (lúc bắt ₫ầu hiển thị, lúc
 thay ₫ổi vị trí, kích thước của ₫ối tượng), máy sẽ tạo sự kiện Paint,
 sự kiện này sẽ kích hoạt hàm xử lý tương ứng của ₫ối tượng. Như
 vậy, nếu muốn vẽ thông tin chi tiết lên ₫ối tượng, người lập trình
 phải ₫ịnh nghĩa hàm xử lý sự kiện Paint của ₫ối tượng và hiện
 thực thuật giải ₫ể vẽ chi tiết thông tin lên ₫ối tượng.
 Khi cần thiết, người lập trình có thể gọi tác vụ Refresh() của ₫ối
 tượng ₫ể nhờ máy tạo dùm sự kiện Paint hầu vẽ lại ₫ối tượng.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 6
7.2 Đối tượng vẽ và cơ chế vẽ nội dung
 Template của hàm xử lý sự kiện Paint của ₫ối tượng như sau :
 private void Form1_Paint(object sender, PaintEventArgs e) {
 //xác ₫ịnh ₫ối tượng mục tiêu
 Control control = (Control)sender;
 //thay ₫ổi kích thước, vị trí nếu cần
 //xác ₫ịnh ₫ối tượng graphics (₫ối tượng vẽ) của ₫ối tượng
 Graphics g = e.Graphics;
 //gọi các tác vụ vẽ của ₫ối tượng vẽ như DrawImage,
 //DrawString, DrawLine,... ₫ể xuất các thông tin bitmap,
 //chuỗi văn bản, hình ₫ồ họa toán học.
 }
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 7
7.3 Xuất chuỗi văn bản
 Đối tượng vẽ (graphics) cung cấp khoảng 70 tác vụ vẽ khác nhau,
 mỗi tác vụ gồm nhiều biến thể (overloaded) ₫ể giúp ta ₫iều khiển
 vẽ nội dung dễ dàng, tiện lợi. Ở ₫ây chúng ta chỉ giới thiệu 1 số tác
 vụ phổ dụng.
 Tác vụ DrawString cho phép xuất chuỗi văn bản theo ₫ịnh dạng
 xác ₫ịnh. Nó có nhiều biến thể, biến thể khá mạnh và dùng phổ
 biến có ₫ặc tả như sau :
 public void DrawString (
 string s, //chuỗi cần xuất
 Font font, //các tính chất font chữ cần dùng ₫ể vẽ
 Brush brush, //màu vẽ chuỗi
 float x, //toạ ₫ộ x của ₫iểm canh lề chuỗi
 float y, //tọa ₫ộ y của ₫iểm canh lề chuỗi
 StringFormat format); //thuộc tính ₫iều khiển vẽ chuỗi
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 8
7.3 Xuất chuỗi văn bản
 Thí dụ ta có biến now miêu tả thông tin thời ₫iểm hiện hành, ta có
 thể viết ₫oạn code sau ₫ể rút trích thông tin từbiến now và xuất
 thông tin giờ/phút/giây ra giữa form ứng dụng :
 //tạo chuỗi miêu tả giờ/phút/giây hiện hành
 String buf = "" + now.Hour + ":" + now.Minute + ":" + now.Second;
 //tạo ₫ối tượng font chữ cần dùng
 Font myFont = new Font("Helvetica", 11);
 //tạo biến miêu tả chế ₫ộ canh giữa khi xuất chuỗi
 StringFormat format1 = new StringFormat(StringFormatFlags.NoClip);
 format1.Alignment = StringAlignment.Center;
 //xuất chuỗi miêu tả giờ/phút/giây
 g.DrawString(buf, myFont, System.Drawing.Brushes.Blue,
 xo, rec.Height - 35, format1);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 9
7.4 Xuất ảnh bitmap
 Tác vụ DrawImage cho phép vẽ bitmap từnguồn có sẵn, thí dụ từ
 file bitmap. Nó có nhiều biến thể, biến thể khá mạnh và dùng phổ
 biến có ₫ặc tả như sau :
 public void DrawImage (
 Image image, //₫ối tượng chứa ảnh bitmap gốc
 Rectangle destRect, //vùng chữ nhật chứa kết quả
 //trong ₫ối tượng vẽ
 int srcX, //tọa ₫ộ x của vùng ảnh gốc
 int srcY, //tọa ₫ộ y của vùng ảnh gốc
 int srcWidth, //₫ộ rộng vùng ảnh gốc cần vẽ
 int srcHeight, //₫ộ cao vùng ảnh gốc cần vẽ
 GraphicsUnit srcUnit, //₫ơn vị ₫o lường ₫ược dùng
 ImageAttributes imageAttr) //cách thức xử lý từng pixel
 //ảnh gốc khi vẽ
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 10
7.4 Xuất ảnh bitmap
 srcX, srcY, srcWidth, srcHeight
 destRect
 Image
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 11
7.5 Xuất hình ₫ồ họa - Tác vụ DrawLine
 Tác vụ DrawLine cho phép vẽ ₫oạn thẳng ₫ược xác ₫ịnh bởi 2
 ₫ỉnh. Nó có nhiều biến thể, biến thể khá mạnh và dùng phổ biến
 có ₫ặc tả như sau :
 public void DrawLine (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 int x1, //tọa ₫ộ x của ₫iểm ₫ầu
 int y1, //tọa ₫ộ y của ₫iểm ₫ầu
 int x2, //tọa ₫ộ x của ₫iểm cuối
 int y2); //tọa ₫ộ y của ₫iểm cuối
 Trước khi gọi DrawLine, phải tạo ₫ối tượng Pen miêu tả nét, màu
 của ₫ường vẽ :
 //tạo pen với màu Blue, nét vẽ 2 pixel
 Pen pen = new Pen(Color.FromArgb(0,0, 255), 2);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 12
7.5 Xuất hình ₫ồ họa - Tác vụ DrawLines
 Tác vụ DrawLines cho phép vẽ nhiều ₫oạn thẳng liên tiếp nhau
 ₫ược xác ₫ịnh bởi danh sách các ₫ỉnh. Nó có nhiều biến thể, biến
 thể khá mạnh và dùng phổ biến có ₫ặc tả như sau :
 public void DrawLines (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 Point[] points); //danh sách các ₫ỉnh
 Trước khi gọi DrawLines, phải tạo ₫ối tượng Pen miêu tả nét, màu
 của ₫ường vẽ :
 //tạo pen với màu Blue, nét vẽ 2 pixel
 Pen pen = new Pen(Color.FromArgb(0,0, 255), 2);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 13
7.5 Xuất hình ₫ồ họa - Tác vụ DrawRectangle
 Tác vụ DrawRectangle cho phép vẽ hình chữ nhật ₫ược xác ₫ịnh
 bởi2₫ỉnhchéonhau.Nócónhiềubiếnthể,biếnthểkhámạnhvà
 dùng phổ biến có ₫ặc tả như sau :
 public void DrawRectangle (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 int x1, //tọa ₫ộ x của ₫iểm ₫ầu
 int y1, //tọa ₫ộ y của ₫iểm ₫ầu
 int x2, //tọa ₫ộ x của ₫iểm cuối
 int y2) //tọa ₫ộ y của ₫iểm cuối
 Lưu ý tác vụ DrawRectangle chỉ vẽ ₫ường biên, muốn tô nền hình
 chữ nhật, ta cần gọi tác vụ FillRectangle (₫ặc tả giống như tác vụ
 DrawRectangle), chỉ khác là tham số ₫ầu là ₫ối tượng mẫu tô :
 //tạo brush với màu ₫ỏ, tô ₫ặc
 Brush brush = new SolidBrush(Color.FromArgb(255, 0, 0));
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 14
7.5 Xuất hình ₫ồ họa - Tác vụ DrawEllipse
 Tác vụ DrawEllipse cho phép vẽ hình ellipse ₫ược xác ₫ịnh bởi
 hình chữ nhật bao quanh nó. Nó có nhiều biến thể, biến thể khá
 mạnh và dùng phổ biến có ₫ặc tả như sau :
 public void DrawEllipse (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 int x1, //tọa ₫ộ x của ₫iểm ₫ầu
 int y1, //tọa ₫ộ y của ₫iểm ₫ầu
 int x2, //tọa ₫ộ x của ₫iểm cuối
 int y2) //tọa ₫ộ y của ₫iểm cuối
 Lưu ý tác vụ DrawEllipse chỉ vẽ ₫ường biên, muốn tô nền hình
 ellipse, ta cần gọi tác vụ FillEllipse (₫ặc tả giống như tác vụ
 DrawEllipse), chỉ khác là tham số ₫ầu là ₫ối tượng mẫu tô :
 //tạo brush với màu ₫ỏ, tô ₫ặc
 Brush brush = new SolidBrush(Color.FromArgb(255, 0, 0));
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 15
7.5 Xuất hình ₫ồ họa - Tác vụ DrawArc
 Tác vụ DrawArc cho phép vẽ 1 phần ₫ường ellipse ₫ược xác ₫ịnh
 bởi hình chữ nhật bao quanh nó. Nó có nhiều biến thể, biến thể
 khá mạnh và dùng phổ biến có ₫ặc tả như sau :
 public void DrawArc (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 Rectangle rect, //miêu tả hình chữ nhật ngoại tiếp
 float startAngle, //góc bắt ₫ầu (theo chiều kim ₫ồng hồ)
 float sweepAngle ) //₫ộ lớn phần ₫ường ellipse cần vẽ
 Lưu ý tác vụ DrawArc chỉ vẽ ₫ường biên, không có tác vụ FillArc
 ₫ể tô nền.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 16
7.5 Xuất hình ₫ồ họa - Tác vụ DrawPie
 Tác vụ DrawPie cho phép vẽ 1 phần bánh ellipse ₫ược xác ₫ịnh bởi
 hình chữ nhật bao quanh nó. Nó có nhiều biến thể, biến thể khá
 mạnh và dùng phổ biến có ₫ặc tả như sau :
 public void DrawPie (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 Rectangle rect, //miêu tả hình chữ nhật ngoại tiếp
 float startAngle, //góc bắt ₫ầu (theo chiều kim ₫ồng hồ)
 float sweepAngle ) //₫ộ lớn phần bánh ellipse cần vẽ
 Lưu ý tác vụ DrawPie chỉ vẽ ₫ường biên, muốn tô nền bánh ellipse,
 ta cần gọi tác vụ FillPie (₫ặc tả giống như tác vụ DrawPie), chỉ
 khác là tham số ₫ầu là ₫ối tượng mẫu tô :
 //tạo brush với màu ₫ỏ, tô ₫ặc
 Brush brush = new SolidBrush(Color.FromArgb(255, 0, 0));
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 17
7.5 Xuất hình ₫ồ họa - Tác vụ DrawPolygon
 Tác vụ DrawPolygon cho phép vẽ hình nhiều cạnh khép kín. Nó có
 nhiều biến thể, biến thể khá mạnh và dùng phổ biến có ₫ặc tả như
 sau :
 public void DrawPolygon (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 Point[] points) //danh sách các ₫ỉnh của polygon
 Lưu ý tác vụ DrawPolygon chỉ vẽ ₫ường biên, muốn tô nền hình
 polygon, ta cần gọi tác vụ FillPolygon (₫ặc tả giống như tác vụ
 DrawPolygon), chỉ khác là tham số ₫ầu là ₫ối tượng mẫu tô :
 //tạo brush với màu ₫ỏ, tô ₫ặc
 Brush brush = new SolidBrush(Color.FromArgb(255, 0, 0));
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 18
7.5 Xuất hình ₫ồ họa - Tác vụ DrawCurve
 Tác vụ DrawCurve cho phép vẽ cong trơn xuyên qua nhiều ₫iểm
 theo phép tension xác ₫ịnh. Nó có nhiều biến thể, biến thể khá
 mạnh và dùng phổ biến có ₫ặc tả như sau :
 public void DrawCurve (
 Pen pen, //miêu tả nét, màu ₫ường vẽ
 Point[] points //danh sách các ₫ỉnh của polygon
 int offset, //vị trí ₫iểm bắt ₫ầu vẽ trong danh sách
 int numberOfSegments, //số ₫oạn cần vẽ
 float tension); //phép tension ₫ược dùng
 )
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 19
7.5 Xuất hình ₫ồ họa - Tác vụ DrawCurve
 private void Form1_Paint(object sender, PaintEventArgs e) {
 //tạo 2 bút vẽ cho ₫ường thẳng và cong
 Pen redPen = new Pen(Color.Red, 3);
 Pen greenPen = new Pen(Color.Green, 3);
 //tạo các ₫ỉnh
 Point point1 = new Point(10, 100), point2 = new Point(40, 75);
 Point point3 = new Point(70, 125), point4 = new Point(100, 50);
 Point point5 = new Point(130, 180), point6 = new Point(160, 40);
 Point point7 = new Point(200, 100);
 Point[] curvePoints = { point1, point2, point3, point4, point5, point6, point7 };
 //vẽ các ₫oạn thẳng.
 e.Graphics.DrawLines(redPen, curvePoints);
 //thiết lập offset, số ₫oạn cong, và tension.
 int offset = 0, numSegments = 6;
 float tension = 0.5F;
 //vẽ ₫ường cong trơn qua các ₫ỉnh.
 e.Graphics.DrawCurve(greenPen, curvePoints, offset, numSegments, tension);
 }
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 20
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 Để củng cố kiến thức về các tác vụ xuất nội dung tổng hợp chứa
 chuỗi văn bản, ảnh bitmap và các hình ₫ồ họa toán học, chúng ta
 hãy viết ứng dụng giả lập ₫ồng hồ treo tường có 3 kim
 giờ/phút/giây và có quả lắc theo góc 20 ₫ộ.
 Phân tích thông tin cần xuất, ta thấy có các thành
 phần :
 . hình bitmap miêu tả khung ₫ồng ₫ồ, bản số
 ₫ồng hồ.
 . 4 ₫oạn thẳng miêu tả 3 kim giờ/phút/giây và
 cầnlắc.Vòngtrònnhỏmiêutảquảlắc.Các
 hình toán học này thay ₫ổi vị trí theo thời
 gian.
 . chuỗi hiển thị giờ/phút/giây.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 21
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 Dùng ₫ối tượng Timer với thời gian ₫ếm khoảng 40ms, mỗi lần
 ₫ếm xong nó tạo sự kiện Paint ₫ể kích hoạt hàm vẽ lại Form ứng
 dụng. Như vậy mỗi giây ta vẽ lại khoảng 25 lần, tốc ₫ộ như thế này
 là vừa ₫ủ ₫ể người dùng cảm thấy ₫ồng hồ gần như thật.
 Qui trình ₫iển hình ₫ể xây dựng ứng dụng ₫ồng hồ quả lắc gồm các
 bước sau ₫ây :
1. Chạy VS .Net, chọn menu File.New.Project ₫ể hiển thị cửa sổ New
 Project.
2. Mở rộng mục Visual C# trong TreeView "Project Types", chọn mục
 Windows, chọn icon "Windows Application" trong listbox
 "Templates" bên phải, thiết lập thư mục chứa Project trong listbox
 "Location", nhập tên Project vào textbox "Name:" (td. VCDongho),
 click button OK ₫ể tạo Project theo các thông số ₫ã khai báo.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 22
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
3.Form₫ầutiêncủaứngdụng₫ãhiểnthịtrongcửasổthiếtkế,lúc
 này form hoàn toàn trống, chưa chứa ₫ối tượng giao diện nào.
4. Nếu cửa sổ ToolBox chưa hiển thị, chọn menu View.Toolbox ₫ể
 hiển thị nó (thường nằm ở bên trái màn hình). Duyệt tìm phần tử
 Timer (trong nhóm Comopents hay nhóm All Window Forms),
 chọn nó, dời chuột vào trong form (ở vị trí nào cũng ₫ược vì ₫ối
 tượng này không ₫ược hiển thị) và vẽ nó với kích thước tùy ý. Hiệu
 chỉnh thuộc tính (Name) = myTimer.
5. Chọn ₫ối tượng myTimer, cửa sổ thuộc tính của nó sẽ hiển thị, click
 icon ₫ể hiển thị danh sách các sự kiện của ₫ối tượng, ấn kép
 chuột vào comboBox bên phải sự kiện Tick ₫ể máy tạo tự ₫ộng hàm
 xử lý cho sự kiện này.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 23
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
6. Viết code cụ thể cho hàm như sau :
 //hàm phục vụ Timer
 private void myTimer_Tick(object sender, EventArgs e) {
 myTimer.Stop();//dừng ₫ếm timer
 this.Refresh(); //vẽ lại form theo giờ hiện hành
 }
7. Ấn phải chuột vào mục Form1.cs trong cửa sổ Solution Explorer
rồi chọn option View Designer ₫ể hiển thị lại cửa sổ thiết kế Form.
Chọn Form, cửa sổ thuộc tính của nó sẽ hiển thị, click icon ₫ể hiển
thị danh sách các sự kiện của Form, duyệt tìm sự kiện Paint, ấn kép
chuột vào comboBox bên phải sự kiện Paint ₫ể máy tạo tự ₫ộng hàm
xử lý cho sự kiện này. Viết code cụ thể cho hàm như sau :
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 24
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 private void Form1_Paint(object sender, PaintEventArgs e) {
 //tạo ₫ối tượng image gốc
 Image bgimg = Image.FromFile("c:\\bgclock.bmp");
 //xác ₫ịnh ₫ối tượng mục tiêu
 Control control = (Control)sender;
 //thay ₫ổi kích thước form theo ảnh khung ₫ồng hồ
 control.Size = new Size(bgimg.Width + 10 + 8, bgimg.Height + 10 + 
 35);
 //xác ₫ịnh ₫ối tượng graphics (₫ối tượng vẽ) của ₫ối tượng
 Graphics g = e.Graphics;
 //vẽ bitmap miêu tả khung ₫ồng hồ
 g.DrawImage(bgimg, 5,5);
 //₫ịnh nghĩa các biến cần dùng
 Rectangle rec = control.DisplayRectangle;
 Pen hPen;
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 25
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 Brush hBrush;
 int xo,yo,rql,rh,rm, rs;
 int x, y;
 //thiết lập tâm ₫ồng hồ
 xo = 76; yo = 74; 
 //thiết lập bán kính cần lắc, kim giờ/phút/giây
 rql = 140; rh = 50; rm = 55; rs = 60; 
 //tạo pen ₫ể vẽ cần lắc
 hPen = new Pen (Color.FromArgb(0,0, 255),2);
 //tạo brush ₫ể tô nền quả lắc
 hBrush = new SolidBrush(Color.FromArgb(255, 0, 0));
 //xác ₫ịnh giờ/phút/giây hiện hành
 DateTime now = DateTime.Now;
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 26
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 //tính góc của cần lắc (góc quay max. là 40 ₫ộ)
 double goc = 80*now.Millisecond/1000;
 if (goc < 40) goc = goc +70;
 else goc = 150-goc;
 //₫ổi góc cần lắc từ ₫ộ ra radian
 goc = goc*3.1416/180;
 //xác ₫ịnh tâm quả lắc (₫iểm còn lại của cần lắc)
 x = xo+(int)(rql*Math.Cos(goc)); 
 y = yo+(int)(rql*Math.Sin(goc));
 //vẽ cần lắc
 g.DrawLine(hPen, xo, yo, x, y);
 //vẽ quả lắc
 g.FillEllipse(hBrush, x-3, y-3, 5, 5);
 g.DrawEllipse(hPen,x-4,y-4,7,7);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 27
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 //tạo pen ₫ể vẽ kim giờ
 hPen = new Pen(Color.FromArgb(0,0,0),3);
 //tính góc của kim giờ
 goc = 90+360*(now.Hour+(double)now.Minute/60)/12;
 //₫ổi góc từ ₫ộ ra radian
 goc = goc*3.1416/180;
 //xác ₫ịnh tọa ₫ộ ₫ỉnh thứ 2 của kim giờ
 x = xo - (int)(rh * Math.Cos(goc));
 y = yo - (int)(rh * Math.Sin(goc));
 //vẽ kim giờ
 g.DrawLine(hPen, xo, yo, x, y);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 28
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 //tạo pen ₫ể vẽ kim phút
 hPen = new Pen(Color.FromArgb(65,110,55),2);
 //tính góc của kim phút
 goc = 90+360*now.Minute/60;
 //₫ổi góc từ ₫ộ ra radian
 goc = goc*3.1416/180;
 //xác ₫ịnh tọa ₫ộ ₫ỉnh thứ 2 của kim phút
 x = xo - (int)(rm * Math.Cos(goc));
 y = yo - (int)(rm * Math.Sin(goc));
 //vẽ kim phút
 g.DrawLine(hPen, xo, yo, x, y);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 29
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 //tạo pen ₫ể vẽ kim giây
 hPen = new Pen(Color.FromArgb(237,5,220),1);
 //tính góc của kim giây
 goc = 90+360*now.Minute/60;
 //₫ổi góc từ ₫ộ ra radian
 goc = goc*3.1416/180;
 //xác ₫ịnh tọa ₫ộ ₫ỉnh thứ 2 của kim giây
 x = xo - (int)(rs * Math.Cos(goc));
 y = yo - (int)(rs * Math.Sin(goc));
 //vẽ kim giây
 g.DrawLine(hPen, xo, yo, x, y);
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 30
7.6 Thí dụ viết ứng dụng vẽ ₫ối tượng phức hợp
 //tạo chuỗi miêu tả giờ/phút/giây hiện hành
 String buf = "" + now.Hour + ":" + now.Minute + ":" + now.Second;
 //tạo ₫ối tượng font chữ cần dùng
 Font myFont = new Font("Helvetica", 11);
 //tạo biến miêu tả chế ₫ộ canh giữa khi xuất chuỗi
 StringFormat format1 = new StringFormat(StringFormatFlags.NoClip);
 format1.Alignment = StringAlignment.Center;
 //xuất chuỗi miêu tả giờ/phút/giây
 g.DrawString(buf, myFont, System.Drawing.Brushes.Blue,
 xo, rec.Height - 35, format1);
 //cho phép timer chạy tiếp
 myTimer.Start();
 }
 8. Chọn menu Debug.Start Debugging ₫ể dịch và chạy ứng dụng. 
 Xem kết quảvà ₫ánh giá kết quả.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 31
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Các ₫ối tượng giao diện, dù nhỏ hay lớn (Button, TextBox,
 ListBox, TreeView,), ₫ều ₫ược Windows quản lý giống nhau :
 Windows xử lý chúng như là window.
 Mỗi window sẽ ₫ược hiển thị ở dạng mặc ₫ịnh là hình chữ nhật có
 ₫ường viền xung quanh và titlebar ở phía trên. Tuy nhiên ta có thể
 miêu tả lại hình dạng cho window theo nhu cầu riêng của mình.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 32
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Window chứa các thuộc tính sau ₫ây có liên quan ₫ến việc xác
 ₫ịnh chính xác hình dạng của nó :
 . BackgroundImage : miêu tả hình bitmap ₫ược dùng ₫ể hiển thị
 nền window và ₫ể xác ₫ịnh hình dạng của window.
 . FormBorderStyle : miêu tả chế ₫ộ hiển thị các ₫ường biên và
 titlebar của window.
 . Region : miêu tả vùng hiển thị và làm việc của window, nó
 gồm từ1 tới nhiều vùng rời rạc, mỗi vùng rời rạc ₫ược bao
 ₫óng bởi 1 ₫ường viền khép kín.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 33
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Đường viền khép kín của 1 vùng ₫ộc lập có thể ₫ược xác ₫ịnh bằng
 1 trong 2 phương pháp :
 . Danh sách các ₫oạn thẳng hay cong liên tiếp và khép kín, mỗi
 ₫oạn thẳng hay cong có thể miêu tả bởi 1 hàm toán học như
 Line, Arc,....
 . Do hình bitmap nào ₫ó xác ₫ịnh.
 Có 2 kỹ thuật xây dựng window có hình dạng bất kỳ :
 . Khai báo các thuộc tính liên quan 1 cách trực quan tại thời
 ₫iểm thiết kế.
 . Lập trình ₫ộng ₫ể thiết lập các giá trị phù hợp cho các thuộc
 tính liên quan ₫ến window.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 34
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 QuitrìnhxâydựngFormgiaodiệncóhìnhdạngbấtkỳbằngcách
 khai báo các thuộc tính liên quan 1 cách trực quan tại thời ₫iểm
 thiết kế : Tạo form cần dùng, chọn nó ₫ể hiển thị cửa sổ thuộc tính,
 tìm và thiết lập giá trị cho các thuộc tính sau ₫ây :
 . BackgroundImage : khai báo file bitmap ₫ược dùng ₫ể hiển thị
 nền của Form và ₫ể xác ₫ịnh hình dạng của Form. Lưu ý hình
 bitmap cần có tính chất : các vùng diện tích của bitmap phải có
 màu khác với màu nền của hình bitmap; kích thước hình
 bitmap nên phù hợp với nhu cầu sử dụng của form tương ứng.
 . FormBorderStyle = None ₫ể không hiển thị titlebar và ₫ường
 viền mặc ₫ịnh.
 . TranparenceKey : miêu tả màu nền của hình bitmap cần lọc bỏ
 (theo ₫ịnh dạng RGB).
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 35
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Thí dụ hãy xây dựng ứng dụng giải phương trình bậc 2 có hình
 dạng như sau :
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 36
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Qui trình xây dựng ₫ối tượng giao diện có hình dạng bất kỳ bằng
 cách viết code thiết lập ₫ộng các thuộc tính liên quan : Tạo ₫ối
 tượng cần dùng, viết ₫oạn code thiết lập 3 thuộc tính liên quan khi
 cần thiết :
 . BackgroundImage : miêu tả hình bitmap ₫ược dùng ₫ể hiển thị
 nền window (nếu muốn hiển thị hình nền).
 . FormBorderStyle = None.
 . Region : miêu tả vùng diện tích làm việc của ₫ối tượng.
 Thường Region ₫ược xác ₫ịnh thông qua ₫ối tượng Path, ₫ối tượng
 này miêu tả ₫ường viền của Region.
 Để tạo ₫ối tượng Path, ta có thể dùng các hàm toán học miêu tả
 từng ₫oạn viền khép kín của Region hay dùng ₫ường viền của hình
 bitmap bất kỳ.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 37
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Qui trình tìm Path của hình ₫ồ họa bitmap
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 38
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 for (y = 0; y <= yMax - 1; y++) { //duyệt từng hàng bitmap
 idx = isrow; //xác ₫ịnh offset (trong buffer) chứa pixel cần xử lý 
 for (x = 0; x <= xMax - 1; x++) { //duyệt từng pixel trên hàng 
 if (Equal(pbase, idx, Key)) { //nếu là pixel nền thì bỏ qua
 idx = idx + 4; continue; }
 //nhớ lại vị trí pixel tái nhất của vùng ₫ang tìm ₫ược B
 int x0 = x;
 //duyệt tìm các pixel còn lại của vùng hiện hành G
 while (x < xMax && (!Equal(pbase, idx, Key))) { R
 x = x + 1; idx = idx + 4; }
 //add path của vùng tìm ₫ược vào ₫ối tượng Path A
 path.AddRectangle(new Rectangle(x0, y, x - x0, 1));
 }
 isrow = isrow + bitmapData.Stride; //₫ến pixel ₫ầu hàng kế
 }
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 39
7.7 Xây dựng ₫ối tượng giao diện có hình dạng tùy ý
 Thí dụ hãy xây dựng ứng dụng giải phương trình bậc 2 có hình
 dạng như sau :
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 40
7.8 Kết chương 
 Chương này ₫ã giới thiệu cách thức tương tác giữa người dùng và
 chương trình ₫ể nhập/xuất dữ liệu.
 Chương này cũng ₫ã giới thiệu các ₫ối tượng giao diện cùng các
 tác vụ xuất dữ liệu dạng chuỗi, dạng bitmap, dạng hình ₫ồ họa
 toán học. Kết hợp 3 loại dữ liệu này, ta có thể tạo kết xuất bất kỳ.
 Khoa Khoa học & Kỹ thuật Máy tính Môn : Lập trình hướng ₫ối tượng
 Trường ĐH Bách Khoa Tp.HCM Chương 7 : Tương tác với người dùng trong ứng dụng C#
 © 2010 Slide 41