III. Chuẩn ₫ầu r a:
Bài thực hành số 5 3: Xây dựng form giao diện có hình dạng tùy ý I Mục tiêu :
I. Mục tiêu :
Giúp SV làm quen với qui trình ₫iển hình ₫ể xây dựng một ứng dụng dùng Form giao diện với hình dạng tùy ý bằng môi trường Visual Studio .Net.
II. Nội dung :
Lập trình tạo form giao diện của chương trình giải phương trình bậc 2 với hình dạng tùy ý, khai báo thủ tục xử lý sự kiện, viết code cho thủ tục xử lý sự kiện ₫ể giải phương trình bậc 2.
III. Chuẩn ₫ầu ra :
Sinh viên nắm vững và thực hiện thành thạo qui trình ₫iển hình ₫ể xây dựng một ứng dụng dùng Form giao diện với hình dạng tùy ý bằng môi trường Visual Studio .Net, thiết lập giá trị các thuộc tính cho từng phần tử giao diện, khai báo thủ tục xử lý sự kiện cho sự kiện quan tâm của ₫ối tượng giao diện, viết code cho thủ tục xử lý sự kiện ₫ể thực hiện giải thuật có ₫ộ phức tạp trung bình.
IV. Phân tích :
Chương trình chứa 1 ₫ối tượng Form, hình dạng của Form sẽ do 1 hình bitmap qui ₫ịnh (chứ không phải là hình chữ nhật như bình thường), Form chứa các ₫ối tượng bên trong :
- 3 cặp ₫ối tượng (Label+TextBox) ₫ể người dùng nhập 3 tham số a,b,c - 1 ₫ối tượng Button ₫ể kích hoạt chức năng giải phương trình
- 3 ₫ối tượng Label ₫ể hiển thị kết quả.
- 1 ₫ối tượng Button ₫ể ₫óng Form và dừng chương trình.
V. Qui trình :
1. Copy thư mục Form_GPTB2 quản lý Project chương trình của bài 5.1 thành thư mục mới có tên là Form_NonRec_GPTB2.
2. Dùng chương trình xử lý ảnh ưa thích (Paint, PhotoShop, Corel Draw,...) soạn ảnh bitmap miêu tả hình dạng và kích thước của Form, thí dụ như hình sau :
Lưu ảnh lên file (thí dụ d:\bgform.bmp). Lưu ý ảnh qui ₫ịnh hình dạng của Form nên có các tính chất thiết yếu sau ₫ây :
- kích thước phải phù hợp với nhu cầu của Form ứng dụng.
- màu vùng bao phủ Form phải ₫ồng nhất và dễ xác ₫ịnh bằng phần mềm, thí dụ màu trắng (255,255,255) hay ₫en (0,0,0).
- tất cả các phần tử bên trong qui ₫ịnh vùng của Form phải khác màu với màu nền bao phủ Form.
3. Chạy VS .Net, chọn menu File.Open.Project và mở lại Project ₫ược chứa trong thư mục Form_NonRec_GPTB2.
4. Dời chuột về cửa sổ "Solution Explorer", ấn phải chuột vào mục Form1.cs ₫ể hiển thị menu lệnh kèm theo nó, chọn option "View Designer" ₫ể hiển thị lại cửa sổ thiết kế Form1.
5. Chọn Form ₫ể hiển thị cửa sổ thuộc tính của Form, duyệt tìm thuộc tính BackgroundImage, ấn chuột vào button ... bên phải thuộc tính này rồi khai báo file ảnh d:\bgform.bmp làm ảnh nên cho Form1.
6. Chỉnh lại kích thước của Form sao cho chứa trọn vẹn ảnh nền bên trong Form. Sắp xếp lại các ₫ối tượng bên trong Form sao cho chúng nằm gọn trong vùng ảnh nền. Thiết lập thuộc tính qui ₫ịnh màu nền (BackColor) cho các ₫ối tượng giao diện sao cho khác biệt với màu vùng bao phủ Form.
7. Tiếp tục duyệt tìm thuộc tính FormBorderStyle của Form và hiệu chỉnh thành None. 8. Tiếp tục duyệt tìm thuộc tính TransparencyKey của Form và hiệu chỉnh thành màu trắng
(White). Đây là màu của vùng bao phủ vùng ảnh miêu tả hình dạng của Form.
9. Vẽ thêm 1 button ở vị trí thích hợp trong Form có (Name) = btnClose, Text = "Close" ₫ể phục vụ ₫óng Form và dừng chương trình. Tạo hàm xử lý sự kiện Click chuột trên button này và viết code cho hàm như sau :
private void btnClose_Click(object sender, EventArgs e) {
Close(); //₫óng Form và dừng chương trình }
10. Dời chuột về cửa sổ "Solution Explorer", ấn phải chuột vào mục Form1.cs ₫ể hiển thị menu lệnh kèm theo nó, chọn option "View Designer" ₫ể hiển thị lại cửa sổ thiết kế Form1. Chọn Form ₫ể hiển thị cửa sổ thuộc tính của Form, click icon trong cửa sổ thuộc tính của Form ₫ể hiển thị danh sách các sự kiện của Form, tạo lần lượt các hàm xử lý sự kiện MouseDown, MouseMove, MouveUp cho Form.
11. Hãy viết code cho 3 hàm xử lý chuột vừa tạo ra ở bước 8 như sau (phục vụ dời vị trí Form ứng dụng khi nó ₫ang chạy) :
private void Form1_MouseDown(object sender, MouseEventArgs e) {
int xOffset, yOffset; (adsbygoogle = window.adsbygoogle || []).push({});
if (e.Button == MouseButtons.Left) {
xOffset = -e.X - SystemInformation.FrameBorderSize.Width; yOffset = -e.Y - SystemInformation.CaptionHeight -
SystemInformation.FrameBorderSize.Height;
mouseOffset = new Point(xOffset, yOffset); isMouseDown = true;
} }
private void Form1_MouseUp(object sender, MouseEventArgs e) {
if (e.Button == MouseButtons.Left) isMouseDown = false; }
private void Form1_MouseMove(object sender, MouseEventArgs e) {
if (isMouseDown) {
Point mousePos = Control.MousePosition;
mousePos.Offset(mouseOffset.X, mouseOffset.Y); Location = mousePos;
} }
12. Dời chuột lên ₫ầu class Form1 rồi viết tiếp ₫oạn code ₫ịnh nghĩa các thuộc tính sau ₫ây : //₫ịnh nghĩa các biến cần dùng ₫ể quản lý Form
private Point mouseOffset;
private Boolean isMouseDown = false;
13. Chọn menu Debug.Start Debugging ₫ể dịch và chạy ứng dụng. Hãy thử nhập từng bộ ba (a,b,c) của phương trình bậc 2 rồi ấn button "Bắt ₫ầu giải" ₫ể giải và xem kết quả.
14. Hãy thử drag mouse ₫ể dời Form từ vị trí này sang vị trí khác. 15. Hãy click vào button Close ₫ể dừng chương trình.
MÔN : LẬP TRÌNH HƯỚNG ĐỐI TƯỢNG
Bài thực hành số 5.4 : Xây dựng form giao diện có hình dạng tùy ý I. Mục tiêu :
Giúp SV làm quen với qui trình ₫iển hình ₫ể xây dựng một ứng dụng dùng Form giao diện với hình dạng tùy ý bằng môi trường Visual Studio .Net.
II. Nội dung :
Lập trình tạo form giao diện của chương trình giải phương trình bậc 2 với hình dạng tùy ý, khai báo thủ tục xử lý sự kiện, viết code cho thủ tục xử lý sự kiện ₫ể giải phương trình bậc 2.
III. Chuẩn ₫ầu ra :
Sinh viên nắm vững và thực hiện thành thạo qui trình ₫iển hình ₫ể xây dựng một ứng dụng dùng Form giao diện với hình dạng tùy ý bằng môi trường Visual Studio .Net, thiết lập giá trị các thuộc tính cho từng phần tử giao diện, khai báo thủ tục xử lý sự kiện cho sự kiện quan tâm của ₫ối tượng giao diện, viết code cho thủ tục xử lý sự kiện ₫ể thực hiện giải thuật có ₫ộ phức tạp trung bình.
IV. Phân tích :
Chương trình chứa 1 ₫ối tượng Form, hình dạng của Form có thể là hình chữ nhật mặc ₫ịnh hay sẽ do 1 hình bitmap qui ₫ịnh. Việc chuyển ₫ổi hình dạng của Form sẽ₫ược thực hiện bởi yêu cầu người dùng thông qua 1 button. Form chứa các ₫ối tượng bên trong :
- 3 cặp ₫ối tượng (Label+TextBox) ₫ể người dùng nhập 3 tham số a,b,c - 1 ₫ối tượng Button ₫ể kích hoạt chức năng giải phương trình
- 3 ₫ối tượng Label ₫ể hiển thị kết quả.
- 1 ₫ối tượng Button ₫ể₫óng Form và dừng chương trình. - 1 ₫ối tượng Button ₫ể switch hình dạng Form.
V. Qui trình : (adsbygoogle = window.adsbygoogle || []).push({});
1. Copy thư mục Form_GPTB2 quản lý Project chương trình của bài 5.1 thành thư mục mới có tên là Form_NonRec_GPTB2_P.
2. Dùng chương trình xử lý ảnh ưa thích (Paint, PhotoShop, Corel Draw,...) soạn ảnh bitmap miêu tả hình dạng và kích thước của Form, thí dụ như hình sau :
Lưu ảnh lên file (thí dụ d:\bgform.bmp). Lưu ý ảnh qui ₫ịnh hình dạng của Form nên có các tính chất thiết yếu sau ₫ây :
- kích thước phải phù hợp với nhu cầu của Form ứng dụng.
- màu vùng bao phủ Form phải ₫ồng nhất và dễ xác ₫ịnh bằng phần mềm, thí dụ màu trắng (255,255,255) hay ₫en (0,0,0).
- tất cả các phần tử bên trong qui ₫ịnh vùng làm việc của Form phải khác màu với màu nền bao phủ Form.
3. Chạy VS .Net, chọn menu File.Open.Project và mở lại Project ₫ược chứa trong thư mục Form_NonRec_GPTB2_P.
4. Dời chuột về cửa sổ "Solution Explorer", ấn phải chuột vào mục Form1.cs ₫ể hiển thị menu lệnh kèm theo nó, chọn option "View Designer" ₫ể hiển thị lại cửa sổ thiết kế Form1.
5. Chọn Form ₫ể hiển thị cửa sổ thuộc tính của Form, duyệt tìm thuộc tính BackgroundImage, ấn chuột vào button ... bên phải thuộc tính này rồi khai báo file ảnh d:\bgform.bmp làm ảnh nên cho Form1.
6. Chỉnh lại kích thước của Form sao cho chứa trọn vẹn ảnh nền bên trong Form. Sắp xếp lại các ₫ối tượng bên trong Form sao cho chúng nằm gọn trong vùng ảnh nền. Thiết lập thuộc tính qui ₫ịnh màu nền (BackColor) cho các ₫ối tượng giao diện sao cho khác biệt với màu vùng bao phủ Form.
7. Vẽ thêm 1 button ở vị trí thích hợp trong Form có (Name) = btnClose, Text = "Close" ₫ể phục vụ₫óng Form và dừng chương trình. Tạo hàm xử lý sự kiện Click chuột trên button này và viết code cho hàm như sau :
private void btnClose_Click(object sender, EventArgs e) {
Close(); //₫óng Form và dừng chương trình }
8. Dời chuột về cửa sổ "Solution Explorer", ấn phải chuột vào mục Form1.cs ₫ể hiển thị menu lệnh kèm theo nó, chọn option "View Designer" ₫ể hiển thị lại cửa sổ thiết kế
Form1. Vẽ thêm 1 label "Chọn hình dạng của form" và 1 ComboBox có (Name)=cbTrans có 4 options "Hình chữ nhật bình thường", "Hình do ảnh nền qui ₫ịnh", "Hình ₫a giác", "Hình chữ nhật bo ₫ầu". Tạo hàm xử lý sự kiện SelectedIndexChanged cho cbTrans và viết code cho hàm như sau :
private void cbTrans_SelectedIndexChanged(object sender, EventArgs e) { int i = cbTrans.SelectedIndex; int h, w; GraphicsPath path; Bitmap bm; switch (i) { case 0: //hình chữ nhật this.BackgroundImage = null; this.FormBorderStyle = FormBorderStyle.Sizable; this.Region = null; fNonRec = false; break; case 1: //hình do ảnh nền bm = (Bitmap)Bitmap.FromFile("d:\\bgform.bmp"); Color col = bm.GetPixel(1, 1);
this.ClientSize = new Size(bm.Width, bm.Height); this.Region = ConvertB2R(bm, col);
this.BackgroundImage = bm;
this.FormBorderStyle = FormBorderStyle.None; break;
case 2: //hình ₫a giác
path = new GraphicsPath(); h = this.ClientSize.Height; w = this.ClientSize.Width;
path.AddLine(new Point(0, h / 4), new Point(w / 4, 0)); path.AddLine(new Point(w / 4, 0), new Point((3 * w) / 4, 0)); path.AddLine(new Point((3 * w) / 4, 0), new Point(w, h / 4)); path.AddLine(new Point(w, h / 4), new Point(w, (3 * h) / 4)); path.AddLine(new Point(w, (3 * h) / 4), new Point((3 * w) / 4, h)); path.AddLine(new Point((3 * w) / 4, h), new Point(w / 4, h)); path.AddLine(new Point(w / 4, h), new Point(0, (3 * h) / 4)); path.AddLine(new Point(0, (3 * h) / 4), new Point(0, h / 4)); //tạo vùng giới hạn bởi các path vẽ ở trên
this.Region = new Region(path);
bm = (Bitmap)Bitmap.FromFile("d:\\bgform1.bmp"); this.BackgroundImage = bm;
this.FormBorderStyle = FormBorderStyle.None; break;
case 3: //hình chữ nhật bo tròn path = new GraphicsPath(); h = this.ClientSize.Height; w = this.ClientSize.Width;
path.AddArc(0, 0, w / 2, h / 2, 180, 90);
path.AddArc(w/2, 0, w / 2, h / 2,270,90);
path.AddLine(new Point(w, h / 4), new Point(w, (3 * h) / 4)); path.AddArc(w/2, h/2, w / 2, h / 2,0,90);
path.AddLine(new Point((3 * w) / 4, h), new Point(w / 4, h)); path.AddArc(0, h/2, w / 2, h / 2,90,90); (adsbygoogle = window.adsbygoogle || []).push({});
path.AddLine(new Point(0, (3 * h) / 4), new Point(0, h / 4)); //tạo vùng giới hạn bởi các path vẽ ở trên
this.Region = new Region(path);
bm = (Bitmap)Bitmap.FromFile("d:\\bgform2.bmp"); this.BackgroundImage = bm; this.FormBorderStyle = FormBorderStyle.None; break; } }
9. Dời chuột về cửa sổ "Solution Explorer", ấn phải chuột vào mục Form1.cs ₫ể hiển thị menu lệnh kèm theo nó, chọn option "View Designer" ₫ể hiển thị lại cửa sổ thiết kế Form1. Chọn Form ₫ể hiển thị cửa sổ thuộc tính của Form, click icon trong cửa sổ thuộc tính của Form ₫ể hiển thị danh sách các sự kiện của Form, tạo lần lượt các hàm xử lý sự kiện MouseDown, MouseMove, MouveUp cho Form.
10. Hãy viết code cho 3 hàm xử lý chuột vừa tạo ra ở bước 9 như sau (phục vụ dời vị trí Form ứng dụng khi nó ₫ang chạy) :
private void Form1_MouseDown(object sender, MouseEventArgs e) {
int xOffset, yOffset;
if (e.Button == MouseButtons.Left) {
xOffset = -e.X - SystemInformation.FrameBorderSize.Width; yOffset = -e.Y - SystemInformation.CaptionHeight -
SystemInformation.FrameBorderSize.Height;
mouseOffset = new Point(xOffset, yOffset); isMouseDown = true;
} }
private void Form1_MouseUp(object sender, MouseEventArgs e) {
if (e.Button == MouseButtons.Left) isMouseDown = false; }
private void Form1_MouseMove(object sender, MouseEventArgs e) {
if (isMouseDown) {
Point mousePos = Control.MousePosition;
mousePos.Offset(mouseOffset.X, mouseOffset.Y); Location = mousePos;
} }
11. Dời chuột lên ₫ầu file (trước phát biểu class Form1) rồi thêm các lệnh using sau ₫ây : using System.Drawing.Imaging;
12. Dời chuột về ₫ầu class Form1 rồi viết tiếp ₫oạn code ₫ịnh nghĩa các thuộc tính và các hàm dịch vụ sau ₫ây :
//₫ịnh nghĩa các biến cần dùng ₫ể quản lý Form private Point mouseOffset;
private Boolean isMouseDown = false;
//hàm kiểm tra 1 pixel ảnh có trùng màu qui ₫ịnh không bool Equal(Byte[] pbase, int idx, Color key)
{
if (pbase[idx] != key.B) return false; if (pbase[idx] != key.G) return false; if (pbase[idx] != key.R) return false; if (pbase[idx] != key.A) return false; return true;
}
//hàm chuyển ảnh bitmap thành Region qui ₫ịnh ₫ường viền của ảnh Region ConvertB2R(Bitmap bitmap, Color Key)
{
// Dim modeFlag As Boolean = (mode = TransparencyMode.ColorKeyOpaque) GraphicsUnit unit = GraphicsUnit.Pixel; (adsbygoogle = window.adsbygoogle || []).push({});
RectangleF boundsF = bitmap.GetBounds(ref unit);
Rectangle bounds = new Rectangle((int)boundsF.Left, (int)boundsF.Top, (int)boundsF.Width, (int)boundsF.Height);
//get access to the raw bits of the image
BitmapData bitmapData = bitmap.LockBits(bounds, ImageLockMode.ReadOnly, PixelFormat.Format32bppArgb);
//Get the address of the first line. IntPtr ptr = bitmapData.Scan0;
//Declare an array to hold the bytes of the bitmap. //This code is specific to a bitmap with 24 bits per pixels. int bytes = Math.Abs(bitmapData.Stride) * bitmap.Height; byte[] pbase = new byte[bytes];
//Copy the RGB values into the array.
System.Runtime.InteropServices.Marshal.Copy(ptr, pbase, 0, bytes); //avoid property accessors in the for
int yMax = (int)boundsF.Height; int xMax = (int)boundsF.Width; //to store all the little rectangles in
GraphicsPath path = new GraphicsPath(); int isrow = 0;
int idx = 0; int x, y;
for (y = 0; y <= yMax - 1; y++) {
idx = isrow;
for (x = 0; x <= xMax - 1; x++) {
//is this transparent? if ((yes, just go on with the loop if (Equal(pbase, idx, Key))
{
idx = idx + 4; continue; }
//store where the scan starts int x0 = x;
//not transparent - scan until we find the next transparent byte while (x < xMax && (!Equal(pbase, idx, Key)))
{
x = x + 1; idx = idx + 4; }
//add the rectangle we have found to the path path.AddRectangle(new Rectangle(x0, y, x - x0, 1)); }
//jump to the next line
isrow = isrow + bitmapData.Stride; }
//now create the region from all the rectangles Region region = new Region(path);
//clean up path.Dispose(); bitmap.UnlockBits(bitmapData); return region; } 13. Tìm và hiệu chỉnh lại hàm khởi tạo Form1 như sau : public Form1() { InitializeComponent();
lblKetqua.Text = lblX1.Text = lblX2.Text = ""; this.BackgroundImage = null;
}
14. Soạn thảo thêm 2 ảnh bitmap d:\bgform1.bmp và d:\bgform2.bmp ₫ể dùng làm ảnh nền cho các dạng form khác nhau.
15. Chọn menu Debug.Start Debugging ₫ể dịch và chạy ứng dụng. Hãy thử nhập từng bộ ba (a,b,c) của phương trình bậc 2 rồi ấn button "Bắt ₫ầu giải" ₫ể giải và xem kết quả. (adsbygoogle = window.adsbygoogle || []).push({});
16. Hãy thử chọn từng mục khác nhau trong danh sách ComboBox ₫ể chuyển Form từ hình chữ nhật mặc ₫ịnh ↔ hình dạng khác.
17. Hãy thử drag mouse ₫ể dời Form từ vị trí này sang vị trí khác. 18. Hãy click vào button Close ₫ể dừng chương trình.
MÔN : LẬP TRÌNH HƯỚNG ĐỐI TƯỢNG