Bài 43: Trò chơi tìm số nhỏ nhất
Theo đề nghị của một bạn đọc, ta hãy dựa vào kiến thức, kinh nghiệm đã có để thực hiện trò chơi mới với luật chơi như sau: "Khi bấm chọn ô có giá trị nhỏ nhất hiện có trong bảng thì ô đó biến mất. Nếu bấm sai quá 3 lần thì trò chơi kết thúc. Mỗi ô bấm đúng được 5 điểm. Khi kết thúc có thông báo số điểm đạt được. Mỗi lần chơi lại, các ô được xếp ngẫu nhiên theo một trật tự khác và loại bỏ một số ô đồng thời bổ sung thêm một số ô có giá trị khác".
Khi lập trình, để tiến đến mục tiêu, ta không nên giải quyết mọi vấn đề đồng thời, mà nên chọn vấn đề ưu tiên, cốt lõi để giải quyết. Sau khâu "giải quyết thô", bạn có thể tiến hành từng bước "giải quyết tinh" một cách dễ dàng. Vấn đề cốt lõi cần giải quyết là sắp xếp ngẫu nhiên các số đã cho vào các ô của trò chơi. Từ kinh nghiệm từ trò chơi lật hình và trò chơi xếp hình, bạn có thể hình dung cách giải quyết như sau: tạo trước một nhân vật có dạng một ô chứa dòng chữ động, tạo ra một loạt thể hiện của nhân vật ấy, xếp chúng ngay ngắn trên sân khấu và chọn ngẫu nhiên từng số trong một dãy nào đó để thể hiện trong dòng chữ động. Xin nhắc bạn, dòng chữ động là dòng chữ có nội dung thay đổi tùy ý vào lúc chạy chương trình. Trước hết, để có nhân vật "ô chứa số", ta cần vẽ một hình khung trên sân khấu trống trơn. Sau khi quy định màu viền và màu tô mong muốn, bạn dùng công cụ vẽ hình khung Rectangle Tool  để vẽ trên sân khấu một hình vuông. Để có hình vuông, bạn giữ phím Shift khi kéo chuột. Tuy nhiên, ta có thể tùy ý quy định lại chiều rộng và chiều cao của hình khung. Vẽ xong, bạn ấn Ctrl+A để chọn hình vừa vẽ, ấn Ctrl+F3 để mở bảng Properties ứng với hình ấy. Bạn quy định chiều rộng là 100 trong ô W và chiều cao cũng là 100 trong ô H. Để tạo ra dòng chữ động, bạn bấm chọn công cụ Text Tool  , căng khung chữ vừa vặn với chiều rộng của hình vuông đã có (hình 1). Trong bảng Properties ứng với khung chữ, bạn chọn Dynamic Text trong ô Text type. Bấm vào ô Instance Name, bạn gõ tên label cho dòng chữ động. Trong ô Font Size, bạn chọn cỡ chữ lớn (26). Bạn bấm nút Text (fill) color, chọn màu chữ tương phản với màu tô của hình vuông. Bạn đừng quên bấm nút Align Center  để dòng chữ động được "gióng giữa". Điều này giúp dòng chữ động nằm giữa hình vuông một cách cân đối. Hiện tại, dòng chữ động chưa cần có nội dung gì cả. Nội dung của dòng chữ động sẽ được tạo ra vào lúc chạy chương trình.
Xong xuôi, bạn ấn Ctrl+A để chọn tất cả (cả hình vuông lẫn dòng chữ động), gõ phím F8 để chuẩn bị chuyển đổi các thứ đã chọn thành nhân vật. Trong hộp thoại Convert to Symbol (hình 2), bạn gõ Tile trong ô Name để đặt tên cho nhân vật. Ở mục Registration, bạn chọn điểm mốc của nhân vật là điểm ở góc trên, bên trái. Bạn nhớ bật ô duyệt Export for ActionScript vì ta sẽ cần tạo ra thể hiện của nhân vật Tile vào lúc chạy chương trình. Bạn bấm OK để đóng hộp thoại.
Theo "thói quen" của trò chơi lật hình và ráp hình, ta sẽ tạo ra 16 thể hiện của nhân vật Tile (sau này, bạn tùy ý sửa lại mọi chi tiết của trò chơi), xếp thành 4 hàng, 4 cột. Như vậy, sân khấu nên có kích thước là 400 x 430. Chiều cao 430 pi-xôn đủ cho 4 hàng (mỗi hàng có chiều cao 100 pi-xôn) và một "dòng tình trạng" (có chiều cao 30 pi-xôn) để thông báo điểm số của người chơi và hiển thị thông tin khác, nếu cần. Bạn gõ phím V để dùng công cụ chọn Selection Tool, bấm vào nền sân khấu. Bảng Properties bày ra những thuộc tính của sân khấu. Bạn bấm nút Size để mở hộp thoại Document Properties (hình 3), quy định chiều rộng và chiều cao của sân khấu ở mục Dimensions. Nhân tiện, bạn bấm nút Background color để chọn màu nền thích hợp. Bạn bấm OK để đóng hộp thoại.
Gõ phím F9 để mở bảng Actions - Frame, bạn gõ đoạn mã quen thuộc như sau để tạo 16 thể hiện từ nhân vật Tile, quản lý chúng bằng một dãy 2 chiều tiles (4 hàng, 4 cột) và sắp xếp chúng trên sân khấu:
tiles = new Array();
n = 0;
for(i = 0; i < 4; i++) {
tiles[i] = new Array();
for(j = 0; j < 4; j++) {
attachMovie("Tile", "tile" + i + j, n++);
tiles[i][j] = this["tile" + i + j];
tiles[i][j]._x = 100 * j;
tiles[i][j]._y = 100 * i;
tiles[i][j].label.text = 10;
}
}
Câu lệnh tiles[i][j].label.text = 10; dùng để thử nghiệm việc hiển thị nội dung của dòng chữ động label trong từng thể hiện bằng cách gán số 10 cho thuộc tính text của dòng chữ động. Chạy thử chương trình, bạn có kết quả như hình 4.
Việc chọn ngẫu nhiên những trị số cho trước trong một dãy nào đó có thể phân thành hai thao tác: tạo ra một dãy mới chứa các trị số của dãy đã cho theo trật tự ngẫu nhiên và lấy từng trị số ra khỏi dãy đó. Với cách đặt vấn đề như vậy, dãy số mới đóng vai trò như một cái khay (tray) để chứa tạm những số bạn chọn ngẫu nhiên. Khi lấy hẳn trị số ra khỏi khay để hiển thị trên màn hình, bạn tránh được tình trạng một trị số được hiển thị nhiều lần. Vì sao ta không xáo trộn ngẫu nhiên các trị số trong dãy đã cho và lấy trị số ra khỏi dãy đó, mà lại cần một dãy trung gian, đóng vai trò cái khay? Bạn chú ý, ta cần giữ nguyên vẹn dãy trị số đã cho với tư cách "kho số". Bất cứ lúc nào, bạn luôn có thể trở về "kho số" để chọn. Thao tác như vậy cần thiết khi bắt đầu lại trò chơi. Thực hiện ý định vừa nêu, bạn bổ sung một dãy chứa trị số vào chương trình và gọi một hàm để chọn ngẫu nhiên từng trị số, đưa vào một dãy khác (cái khay):
nums = [ 2.2, 1.2, 3.65, 0.71, 0.31, 0.01, 3.25, 0.45, 2.25, 5.2, 2.5, 0.09, 0.65, 4.6, 0.37, 0.25, 3.75, 1.7, 0.48, 5.5 ];
shuffleNumbers();
tiles = new Array();
n = 0;
for(i = 0; i < 4; i++) {
...
}
function shuffleNumbers() {
tray = new Array();
for(i = 0; i < nums.length; i++)
if(getRandom(0, 1))
tray.push(nums[i]);
else
tray.unshift(nums[i]);
}
function getRandom(min, max) {
return Math.floor(Math.random()*(max - min + 1) + min);
}
Trong đoạn mã vừa viết, hàm shuffleNumbers lấy ngẫu nhiên các số từ dãy đã cho (dãy nums), đưa vào dãy trung gian (dãy tray). Cụ thể, sau khi tạo ra dãy tray trống rỗng, hàm shuffleNumbers "tung đồng xu" dựa vào hàm getRandom quen thuộc. Nếu hàm getRandom cho trị số khác 0, trị số lấy từ dãy nums được đưa vào cuối dãy tray bởi hàm push của dãy tray. Nếu hàm getRandom cho trị số 0, trị số lấy từ dãy nums được đưa vào đầu dãy tray bởi hàm unshift của dãy tray. Sau khi có được dãy tray chứa các trị số của dãy nums một cách lộn xộn, bạn dùng hàm pop của dãy tray để lấy trị số cuối ra khỏi dãy tray, hiển thị trên màn hình:
...
shuffleNumbers();
tiles = new Array();
n = 0;
for(i = 0; i < 4; i++) {
tiles[i] = new Array();
for(j = 0; j < 4; j++) {
attachMovie("Tile", "tile" + i + j, n++);
tiles[i][j] = this["tile" + i + j];
tiles[i][j]._x = 100 * j;
tiles[i][j]._y = 100 * i;
//tiles[i][j].label.text = 10;
tiles[i][j].label.text = tray.pop();
}
}
...
Với cách viết như trên, sau một lần lặp, trị số cuối dãy tray rời khỏi dãy đó, đi vào dòng chữ động của một ô trên màn hình. Để sự tráo trộn được thực hiện triệt để hơn, bạn có thể lại "tung đồng xu" để quyết định lấy trị số ra khỏi dãy tray ở cuối dãy (bởi hàm pop của dãy) hoặc ở đầu dãy (bởi hàm shift của dãy):
...
shuffleNumbers();
tiles = new Array();
n = 0;
for(i = 0; i < 4; i++) {
tiles[i] = new Array();
for(j = 0; j < 4; j++) {
attachMovie("Tile", "tile" + i + j, n++);
tiles[i][j] = this["tile" + i + j];
tiles[i][j]._x = 100 * j;
tiles[i][j]._y = 100 * i;
//tiles[i][j].label.text = 10;
if(getRandom(0, 1))
tiles[i][j].label.text = tray.shift();
else
tiles[i][j].label.text = tray.pop();
}
}
...
Chạy thử chương trình, bạn có kết quả trông như hình 5.
Chia sẻ với bạn bè của bạn: |
