Lập trình sự kiện nâng cao & đồ họa trong Visual Basic

OpenStax-CNX module: m30182 Lập trình kiện nâng cao & đồ họa Visual Basic∗ KS Lâm Hoài Bảo This work is produced by OpenStax-CNX and licensed under the Creative Commons Attribution License 3.0† Tóm tắt nội dung Mục tiêu: Chương gồm tập nhằm mục đích rèn luyện sinh viên kỹ lập trình kiện nâng cao thao tác xử lý chuột, bàn phím giúp cho sinh viên có nhìn sơ lược cách thức xử lý đồ họa Visual Basic Học xong chương này, sinh viên phải nắm bắt vấn đề sau: - Cách thức sử dụng menu thiết kế giao diện - Cách xử lý kiện chuột bàn phím - Các phương thức đồ họa Kiến thức có liên quan: Giáo trình Visual Basic, Chương Tài liệu tham khảo: Visual Basic Certification Exam Guide - Chapter 3, Page 69 - Dan Mezick & Scot Hillier - McGraw-Hill - 1998 http://www.vovisoft.com/VisualBasic/VB6Chapter12C.htm1 HƯỚNG DẪN Bài tập 2-1 ˆ DỰNG MENU VÀ HỘP THOẠI CƠ BẢN XAY Bước 1: Tạo dự án tên Bt2-1 thư mục Basic\Bt2-1 Chú ý thường xuyên lưu dự án lại Bước 2: Bắt đầu với Menu Editor Nhấp chuột phải lên Form1 Chọn Menu Editor Lúc cửa sổ Menu Editor ∗ Version 1.1: Jul 22, 2009 4:19 am -0500 † http://creativecommons.org/licenses/by/3.0/ http://www.vovisoft.com/VisualBasic/VB6Chapter12C.htm http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Figure http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Figure Hình II.1: Tạo menu Bước 3: Tạo menu File cách thiết lập thuộc tính sau: Caption: &File Name: mnuFile Bước 4: Định nghĩa phần tử menu File, phần tử xuất ta nhấp vào File Ta nhấp nút Next, vệt sáng di chuyển xuống hàng, ta điền thông tin vào Bước 5: Các phần tử menu File phải đặt cấp: Bằng cách nhấp chọn mũi tên phải, ta xác định phần tử thuộc menu File Bước 6: Định nghĩa thuộc tính sau cho phần tử menu sau: Caption: &New Project Name: mnuFileNew http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Bước 7: Chọn nút OK Menu Editor, sau thực thi dự án Khi nhấp chuột vào menu File ta thấy xổ xuống phần tử New Project Menu File Bây trở lại hình soạn thảo Bước 8: Trở lại cửa sổ Menu Editor thêm phần tử tiếp theo; nhớ kiểm tra thứ tự cấp mà phần tử cần thêm vào (phải nằm menu File) Mỗi lần thêm phần tử menu (sau điền Caption Name), cần chọn nút Next để định nghĩa phần tử Cần lưu ý phần tử menu File phải cấp Bước 9: Định nghĩa phần tử sau: Caption: &Open Project .Name: mnuFileOpen Caption: A&dd Project .Name: mnuFileAdd Caption: Sa&ve ProjectName: mnuFileSave Caption: Sav&e Project As .Name: mnuFileSaveAs Bước 10: Phần tử menu đường phân cách, đường phân cách phải có tên, ta khơng thể nhấp chuột để thực thi cơng việc Đường phân cách có Caption dấu “-“ Bây ta thêm đường phân cách sau thêm mục Exit hồn tất Bước 11: Nhấp nút Next, thêm đường phân cách: Caption: -Name: mnuSeparator1 Bước 12: Nhấp Next, thêm mục Exit Caption: E&xitName: mnuFileExit Bước 13: Cấu trúc hệ thống menu ta sau: &File &New Project .&Open Project .A&dd Project .Sa&ve Project Sav&e Project As E&xit Từ ta chèn phần tử vào menu (ở bước ta chèn sau) Bước 14: Muốn chèn thêm phần tử, nhấp vào phần tử vị trí mà phần tử muốn đặt Chẳng hạn, muốn chèn phần tử trước mục Save Project, nhấp vào Save Project sau chọn nút Insert Một phần tử trắng xuất ta điền thông tin vào Bước 15: Định nghĩa mục mới: Caption: &Remove ProjectName: mnuFileRemove Nếu mục Name khoảng trắng ta nhận thơng báo lỗi: “Menu Control must have a name” Ta phải nhập Name vào Bước 16: Gán phím tắt Phím tắt cho phép ta sử dụng bàn phím để truy xuất đến mục Menu Chẳng hạn muốn cho mục Open Project có phím tắt Ctrl + O, ta chọn mục Open Project hộp thoại Menu Editor Bước 17: Nhấp OK Lưu dự án thực thi chương trình Nhấp chọn mục menu, ta thấy khơng tác dụng Do ta phải cung cấp hàm xử lý kiện nhấp vào mục menu Bước 18: Đóng cửa sổ Menu Editor, nhấp File\Exit; cửa sổ Code xuất Thêm đoạn mã sau cho kiện Click mnuFileExit: MsgBox “Dong ung dung .” End Bước 19: Chạy ứng dụng, chọn File\Exit Điều xảy ra? Bước 20: Trở cửa sổ soạn thảo; nhấp chuột vào File\Open Project để mở cửa sổ soạn thảo mã lệnh cho hàm xử lý kiện mnuFileOpen_Click Thêm đoạn mã sau: MsgBox “Ban da nhap vao muc File\Open Project” Bước 21: Chạy ứng dụng Nhấp vào File, Open Project; thơng báo Đóng thơng báo lại Bước 22: Ta dùng phím tắt để chọn Open Project; giữ phím Alt, bấm phím f o http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Bước 23: Một cách khác để chọn File\Open Project bấm phím Ctrl + O Như vậy, ta thấy có cách để chọn File\Open Project Bước 24: Trong nhiều ứng dụng có sử dụng menu, sau chọn mục menu, ta thấy xuất hộp hội thoại gồm nút OK Cancel, có nhiều tùy chọn hay yêu cầu mà người sử dụng chấp nhận hay hủy bỏ Ở vậy, ta mở hộp thoại tương tự Bước 25: Nhấp chuột vào Project\Components Một danh sách điều khiển mà ta thêm vào dự án Chọn Microsoft Common Dialog 6.0 cách đánh dấu vào checkbox chọn OK Lúc VB tự động thêm điều khiển vào ToolBox Bước 26: Điều khiển Common Dialog xuất ToolBox, nhấp đúp đặt vào vị trí Form1 Bước 27: Nhấp chuột vào mục File\Open Project, cửa sổ soạn thảo mã lệnh ra, thêm vào đoạn mã sau hàm xử lý kiện mnuFileOpen_Click: Form1.CommonDialog1.ShowOpen MsgBox “Bạn da chon tap tin: ” & Form1.CommonDialog1.FileName Bước 28: Trong lệnh MsgBox ta có sử dụng phép toán nối chuỗi lại với nhau: chuối “Ban da chon tap tin: ” chuỗi Form1.CommonDialog1.FileName Lưu ý, ta phải sử dụng phép toán “&” để nối chuỗi lại Bước 29: Để mở hộp hội thoại (Common Dialog) ta phải có lời gọi hàm: ShowOpen chẳng hạn Lúc hộp thoại Bước 30: Lưu dự án chạy chương trình Chọn File\Open Project, hộp thoại Chọn tập tin đó, điều xảy tiếp theo? Bước 31: Tìm hiểu lệnh ShowOpen, ShowSave, ShowPrinter, ShowColor Ta gọi chúng cách thêm hàm xử lý kiện cho mục menu, chẳng hạn cho mnuFileSave_Click: Form1.CommonDialog1.ShowSave Bài tập 2-2 ĐỒ HỌA VỚI BASIC Bước 1: Tạo dự án thư mục Basic\Bt2-2 Bước 2: Trong Form1 ta tạo Menu có dạng: http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Figure http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Figure http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Figure http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 Figure Hình II.2: Menu giao diện Với thuộc tính sau: TT Caption Name TT Caption Name Ve hinh MnuVe Duong Tron MnuTron &Pixel MnuPixel 10 &Cung tron MnuCung &Tam giac MnuTg 11 &Bau duc MnuBauduc &Den MnuTgDen 12 Bieu &do MnuBieudo D&o mnuTgDo 13 - MnuGach2 - MnuGach1 14 &Xoa man hinh MnuXoa &Hinh vuong mnuHV 15 - MnuGach3 Hinh khac MnuKhac 16 &Thoat MnuThoat Table http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 10 1.1 HÀM PAINTPICTURE Bước 3: Hàm PaintPicture cho phép ta copy nhanh khối liệu đồ họa, nói nơm na khu vực hình đồ họa form, PictureBox đến nơi khác Thí dụ ta copy hình từ chỗ nầy đến chỗ khác form, hay từ form/PictureBox đối tượng Printer để sau ta in Ta nhấp đúp lên PictureBox Icon ToolBox để đặt PictureBox lên form với thuộc tính sau: Name: picDohoa Visible: False (để ta khơng thấy lúc chạy chương trình) Bước 4: Bây ta load hình vào thuộc tính Picture picDohoa cách chọn tập tin hình ảnh từ cửa sổ Properties Ở ta chọn INTL_NO.BMP từ folder \Program Files\Microsoft Visual Studio\Common\Graphics\Bitmaps\Assorted Figure http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 11 Figure Hình II.3: Lựa chọn tập tin ảnh Trong chương trình nầy ta muốn đè nút trái Mouse xuống di chuyển chuột trỏ chuột đến đâu, hình INTL_NO vẽ đến Bước 5: Ta dùng biến để đánh dấu nút-trái-của-Mouse-Down, đặt tên IsMousedown Khi nhận kiện MouseDown ta đặt IsMouseDown thành True, nhận kiện MouseUp ta đặt lại IsMouseDown thành False Mỗi lần nhận kiện MouseMove IsMouseDown True ta vẽ hình INTL_NO Trong phần [General]\[Declaration], khai báo biến sau: Dim IsMouseDown As Boolean Bước 6: Đầu tiên biến phải khởi tạo False kiện Form_Load: Private Sub Form_Load() IsMouseDown = False End Sub Bước 7: Ta xử lý kiện MouseUp, MouseDown, MouseMove Form sau: http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 12 Private Sub Form_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) IsMouseDown = True End Sub Private Sub Form_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single) If IsMouseDown Then ’ Vẽ hình vị trí X, Y PaintPicture picDohoa.Picture, X, Y, picDohoa.Width, picDohoa.Height End If End Sub Private Sub Form_MouseUp(Button As Integer, Shift As Integer, X As Single, Y As Single) IsMouseDown = False End Sub Bước 8: Chọn Form1 cửa sổ Project Explorer, ta xử lý kiện ta nhấp chọn mục Xoa man hinh menu sau: Private Sub mnuXoa_Click() Cls End Sub Bước 9: Khi ta nhấp chọn mục Thoat menu, chương trình tự động đóng lại ⇒ kiện mnuThoat_Click xử lý: Private Sub mnuThoat_Click() End End Sub Bước 10: Lưu dự án lại, chạy chương trình, thử kéo chuột Form Quan sát kết HÀM PSET Bước 11: Ta dùng hàm PSet (Point Set) để vẽ pixel lên form Ta cần cho biết PSet đâu với màu gì, tức ta cho tọa độ X,Y pixel màu tính từ hàm RGB Dưới đoạn mã để vẽ pixels đủ màu lên form cách bất chừng (randomly) vị trí màu sắc người dùng chọn mục Pixel menu: Private Sub mnuPixel_Click() Dim i As Integer ’ Tọa độ vẽ (X, Y) Dim iXCoord As Integer Dim iYCoord As Integer ’ Màu Dim iRed As Integer Dim iGreen As Integer Dim iBlue As Integer ’ Sinh số ngẫu nhiên Randomize ’ Vẽ 2000 điểm ngẫu nhiên For i = To 2000 ’ Lấy tọa độ X (ngẫu nhiên) ’ Note that Rnd(1) returns a real number between and 1, eg: 0.384 iXCoord = Int(Rnd(1) * ScaleWidth) ’ Lấy tọa độ Y (ngẫu nhiên) iYCoord = Int(Rnd(1) * ScaleHeight) ’ Lấy giá trị ngẫu nhiên từ – 254 cho màu iRed = Int(Rnd(1) * 255) iGreen = Int(Rnd(1) * 255) iBlue = Int(Rnd(1) * 255) ’ Vẽ pixel tọa độ iXCoord, iYCoord http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 13 PSet (iXCoord, iYCoord), RGB(iRed, iGreen, iBlue) Next MsgBox ("Ve xong!") End Sub Trong thí dụ ta dùng hàm Randomize để sinh sẵn nhớ số thực bất chừng từ đến 0.999 Sau lần ta gọi hàm Rnd(1) trả số thực từ số hàm Randomize sinh Do đó, Rnd(1) * ScaleWidth cho ta số thực có trị số từ đến ScaleWidth Muốn đổi số thực số nguyên, ta dùng hàm Int Bước 12: Lưu dự án lại, chạy chương trình Nhấp chọn Pixel menu 1.2 HÀM LINE Hàm Line vẽ đường thẳng từ tọa độ nầy đến tọa độ khác màu ta định Với hai hàm PSet Line ta làm nhiều chuyện Thí dụ muốn cho vật di động, ta xóa vật cách vẽ lại với màu BackColor form, vẽ vật vị trí Muốn vẽ đa giác tam giác hay chữ nhật ta ráp nhiều đường thẳng lại với nhau, đầu đường thẳng cuối đường thẳng vừa vẽ trước Muốn vẽ hình dạng bên hình chữ nhật ta dùng PSet Có ba cách để định tọa độ hai đầu đường thẳng ta muốn vẽ: • Cho biết tọa độ đầu cuối đường thẳng: Ví dụ: Line (50, 100)-(3000, 4000) Khi đường nầy vẽ xong vị trí trỏ đồ họa (Graphic Cursor) có tọa độ vị trí cuối đường, tức CurrentX=3000 CurrentY=4000 trường hợp • Chỉ cho biết tọa độ cuối đường thẳng: Ví dụ: Line -(3600, 4500), vbMagenta Trong trường hợp nầy vị trí Graphic Cursor (CurrentX, CurrentY) lấy làm tọa độ đầu đường thẳng vẽ Tức trước thực thi dòng mã CurrentX=3000 CurrentY=4000 dịng mã tương đương với: Line (3000,4000)-(3600,4500), vbMagenta • Dùng chữ Step để nói khác biệt từ CurrentX CurrentY: Ví dụ: Line Step(400, 600)-Step(800, -500), vbGreen Nếu trước thực thi dòng mã CurrentX=3600 CurrentY=4500 dịng mã tương đương với: Line (4000,5100)-(4800,4600), vbGreen 1.3 Bước 13: Ta vẽ hình tam giác với màu khác nhau: Đỏ Đen Ta xử lý kiện chọn mục Den menu sau: 1.4 Private Sub mnuTgDen_Click() 1.5 ’ Vẽ tam giác với màu đen 1.6 Line (700, 500)-(2800, 2400) 1.7 Line (2800, 2400)-(1800, 900) 1.8 Line (1800, 900)-(700, 500) 1.9 End Sub Bước 14: Vẽ tam giác với màu đỏ tọa độ Sự kiện mnuTgDo_Click: Private Sub mnuTgDo_Click() ’ Vẽ tam giác màu đỏ Line (700, 500)-(2800, 2400), vbRed Line -(1800, 900), vbRed http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 14 Line -(700, 500), vbRed End Sub Bước 15: Ta vẽ hình chữ nhật với góc trịn sau: Chọn Tools\Add Procedure để thêm thủ tục vào: Name: HcnTron Type: Sub Scope: Private Private Sub HcnTron(ByVal X1 As Integer, ByVal Y1 As Integer, _ ByVal X2 As Integer, ByVal Y2 As Integer) Const Delta = 50 ’ Vẽ hcn với góc trịn Line (X1 + Delta, Y1)-(X2 - Delta, Y1) Line -Step(Delta, Delta) Line -(X2, Y2 - Delta) Line -Step(-Delta, Delta) Line -(X1 + Delta, Y2) Line -Step(-Delta, -Delta) Line -(X1, Y1 + Delta) Line -Step(Delta, -Delta) End Sub Bước 16: Ta tạo bóng bên hình chữ nhật cách dùng hàm PSet để chấm đốm cách chừng 50 pixels sau: Private Sub TaoBong(ByVal X1 As Integer, ByVal Y1 As Integer, _ ByVal X2 As Integer, ByVal Y2 As Integer) Const Delta = 50 Dim i As Integer Dim j As Integer ’ Kiem tra X1 < X2 ? ’ Đổi giá trị X1, X2 X1 > X2 If X2 < X1 Then Temp = X1 X1 = X2 X2 = Temp End If ’ Kiểm tra Y1 < Y2 ’ Đổi giá trị Y1, Y2 Y1 > Y2 If Y2 < Y1 Then Temp = Y1 Y1 = Y2 Y2 = Temp End If ’ Vẽ chấm hcn, chấm cách 50 pixel For i = X1 + Delta To X2 - Delta Step 50 For j = Y1 + Delta To Y2 - Delta Step 50 PSet (i, j) Next Next End Sub Bước 17: Bây phối hợp cách vẽ hình chữ nhật với thủ tục TaoBong nói hàm Print ta viết chữ bên khung màu nhạt ta xử lý kiện mnuHcn_Click: Private Sub mnuHV_Click() http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 15 Dim X1 As Integer Dim Y1 As Integer Dim X2 As Integer Dim Y2 As Integer ’ Khởi tạo tọa độ đầu X1 = 4200: Y1 = 1000 X2 = 6200: Y2 = 2000 ’ Vẽ hcn HcnTron X1, Y1, X2, Y2 ’ Tạo bóng TaoBong X1, Y1, X2, Y2 ’ Vị trí để xuất chữ lên hình CurrentX = X1 + 50 CurrentY = Y1 + 50 ’ Kích thước chữ Font.Size = 18 ’ Hiển thị hình Print "Xin chao!" End Sub 1.10 HÀM CIRCLE Bước 18: Dùng hàm Circle để vẽ hình trịn, hình bầu dục cung trịn, với bên không màu hay phủ màu ta định Để vẽ, ta phải cho biết tọa độ tâm đường trịn bán kính Ta xử lý cho kiện mnuTron_Click sau: Private Sub mnuTron_Click() ’ Vẽ đường tròn tâm 2000,1500 bán kính 800 Circle (2000, 1500), 800 ’ Vẽ đường thẳng ngang từ tâm Line (2000, 1500)-Step(0, 800) ’ Vẽ đường thẳng đứng từ tâm Line (2000, 1500)-Step(800, 0) End Sub Bước 19: Bây giờ, thay vẽ nguyên đường tròn, ta vẽ cung tròn với màu đỏ Để định ta vẽ từ vị trí đường trịn đến vị trí khác, thí dụ từ 45 độ đến 230 độ, ta cần phải đổi độ đơn vị Radian cách dùng hàm Rads sau: Chọn Tools\Add Procedure để thêm hàm tên Rads với giá trị sau: Name: Rads Type: Function Scope: Private Private Function Rads(ByVal Degree As Single) As Single ’ Đổi độ sang Radian Const PI = 22 / Rads = Degree / 180 * PI End Function Bước 20: Cung trịn ln vẽ ngược chiều kim đồng hồ Dưới đoạn mã kiện mnuCung_Click để vẽ cung trịn màu đỏ bán kính 800, tâm (4000, 2000), từ 45 độ đến 230 độ: Private Sub mnuCung_Click() Circle (4000, 2000), 800, vbRed, Rads(45), Rads(230) End Sub http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 16 Bước 21: Ta cho tơ màu bên hình trịn, hay Pie Slice (một phần hình trịn) cách đặt thuộc tính FillStyle định màu FillColor Một Pie Slice vịng cung đóng kính hai đường thẳng bán kính hai đầu Muốn vẽ Pie Slice ta đánh thêm dấu trừ ("-") trước hai trị số Radian, tức dùng -Rads(45), -Rads(230) thay Rads(45), Rads(230) Dưới mã lệnh vẽ hai Pie Slices, có tâm lệch chút, đồng thời thêm thích 87.5% 12.5% Hình vẽ tương tự biểu đồ dân số, diện tích Sự kiện mnuBieudo_Click: Private Sub mnuBieudo_Click() FillStyle = ’ Cho phép tô màu FillColor = vbYellow ’ Vẽ Pie Slice từ 90 độ đến 45 độ màu vàng Circle (3000, 4000), 800, , -Rads(90), -Rads(45) ’ Vị trí hiển thị văn CurrentX = 2800: CurrentY = 4400 Print "87.5%" FillColor = vbBlue ’ Vẽ Pie Slice từ 45 độ đến 90 độ màu xanh Circle (3050, 3900), 800, , -Rads(45), -Rads(90) ’ Vị trí hiển thị văn CurrentX = 3400: CurrentY = 3000 Print "12.5%" FillStyle = ’ Không cho phép tô màu End Sub Bước 22: Hàm Circle cịn dùng để vẽ hình bầu dục (Elip) Vẽ hình bầu dục giống vẽ hình trịn ta cần cho thêm tham số gọi Aspect Aspect liên hệ bán kính ngang (chiều ngang) bán kính dọc (chiều cao) Thí dụ Aspect=2 chiều cao hình bầu dục gấp đôi chiều ngang, ngược lại, Aspect=0.5 chiều ngang gấp đơi chiều cao Dưới đoạn mã ta dùng để vẽ hai hình bầu dục kích thước, nằm thẳng đứng nằm ngang ⇒ Sự kiện mnuBauduc_Click xử lý: Private Sub mnuBauduc_Click() Circle (1400, 3000), 800, vbMagenta, , , Circle (1400, 3000), 800, vbBlue, , , 0.5 End Sub Bước 23: Lưu dự án chạy chương trình BÀI TẬP TỰ LÀM 2.1 Bài 1: Thiết kế chương trình có giao diện sau: Hình II.4: Sử dụng Common Dialog http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 17 Figure • Mỗi người dùng chọn mục Font, hộp thoại chọn Font mở cho phép chọn lựa Font, sau họ chọn Font, Font chữ tương ứng TextBox thay đổi theo (Hướng dẫn: Sử dụng thuộc tính Font đối tượng TextBox) • Khi người dùng chọn Color, hộp thoại chọn màu hiển thị cho phép người dùng thay đổi màu chữ TextBox theo màu chọn (Hướng dẫn: Sử dụng thuộc tính ForeColor đối tượng TextBox) 2.2 Bài 2: TRÒ CHƠI PUZZLE (SẮP SỐ) MÔ TẢ http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 18 Figure 10 Không gian chơi gồm 16 ô số, xếp hàng, hàng gồm cột Trong có 15 có giá trị từ đến 15 phân bổ theo thứ tự ngẫu nhiên ô trống (Hình II.5) Hình II.5 Người chơi phải tiến hành lại ô số theo thứ tự để kết hình II.6 trị chơi kết thúc Chương trình hiển thị câu chúc mừng: “Chuc mung! Ban da cong!!!” & tổng thời gian chơi Figure 11 Figure 12 Hình II.6 Người chơi thực chơi lại cách chọn File\New Chương trình tự động xáo lại ô chứa số & ô trống theo thứ tự ngẫu nhiên Việc xếp lại ô số thực cách sử dụng trống Người dùng chuyển số từ ô lân cận đến ô trống cách nhấp chuột lên số Chẳng hạn hình người dùng nhấp chứa số để chuyển đến trống bên & chứa số cũ thành trống Chú ý người dùng di chuyển số thuộc ô lân cận trống Chẳng hạn lân cận trống hình ô 2, 4, 11, 15 http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 19 Hình II.7 ví dụ khác ô lân cận trống Trong trường hợp ô chứa số 9, & 12 Để ý hai ô chứa số & không xem lân cận Figure 13 Hình II.7 CÁC THUẬT TỐN XỬ LÝ Xác định có phải ô lân cận ô trống hành hay không? Đánh số thứ tự ô từ đến 15 theo thứ tự từ phải qua trái & từ xuống Xác định lân cận cho ô Để ý ô có thứ tự (hàng cột 1), (hàng cột 4), 12 (hàng cột 1) & 15 (hàng cột 4) có số lân cận có thứ tự (hàng cột 2), (hàng cột 3), (hàng cột 1), (hàng cột 4), (hàng cột 1), 11 (hàng cột 4), 13 (hàng cột 1), 14 (hàng cột 3) có số lân cận cịn lại có thứ tự 5, 6, 9, 10 có số lân cận Ví dụ: Trong hình 3: Ơ có thứ tự (chứa số 2), có số lân cận 4, có thứ tự (chứa số 3), (khơng chứa số), (chứa số 15), 10 (chứa số 1) Ô có thứ tự 16 (chứa số 7), có số lân cận 2, có thứ tự 12 (chứa số 14), 15 (chứa số 13) Ta có nhận xét rằng, có tất 16 ô có tối đa ô lân cận Như ta sử dụng mảng chiều để lưu trữ giá trị ô lân cận Dim Neibors(0 To 15, To 3) As Integer Ví dụ: Ơ có thứ tự 0: Neibors(0,1) = ‘ Lân cận thứ ô ô thứ Neibors(0,2) = ‘ Lân cận thứ ô thứ Neibors(0,3) = -1 ‘ Khơng có lân cận Neibors(0,4) = -1 ‘ Khơng có lân cận Nếu ô lân cận “ơ Click” có giá trị trống (ơ trống) hốn đổi nội dung “ơ Click” với trống, ngược lại khơng làm Thuật tốn xáo số http://cnx.org/content/m30182/1.1/ OpenStax-CNX module: m30182 20 • • • • Xem khơng gian chơi có 16 trống Chọn ngẫu nhiên 16 số (từ đến 15) để đặt vào trống Sau tiếp tục chọn số lại (15 số chưa chọn) để đặt vào ô thứ Và tiếp tục ô cuối cùng, cho đảm bảo nguyên tắc số chọn không chọn lại Điều tránh tình trạng có hay nhiều có giá trị số • Xóa trống nội dung ô chứa số để tạo ô trống Sử dụng thủ tục Randomize & hàm Rnd, thử nghĩ xem cách thức để kiểm tra xem số sử dụng hay chưa? Viết chương trình xáo số riêng Di chuyển số đến ô trống Thực chất hốn vị nội dung “ơ Click” & “ơ trống” • Gán nội dung “ơ Click” cho “ơ trống” • Xóa trống nội dung “ơ Click” Kiểm tra trò chơi kết thúc Trò chơi đạt đến trạng thái hình kết thúc Viết hàm kiểm tra Đếm thời gian chương trình thực thi Sử dụng định thời gian để đếm thời gian thực thi chương trình http://cnx.org/content/m30182/1.1/