Bài 10 : Hàm có sẵn trong Flash – Tự học lập trình Flash

Có lẽ bạn đang nóng lòng muốn lập trình trò chơi gì đó thú vị với Flash. Tuy vậy, bạn cần kiên trì tìm hiểu những khái niệm lập trình cơ bản. Khi có nền tảng vững vàng, bạn mới có thể tự do sáng tạo. Thực ra vẫn có nhiều điều thú vị trong kiến thức cơ bản.
Ngoài hàm trace() mà bạn từng dùng vài lần để theo dõi diễn biến của chương trình, còn khá nhiều hàm có sẵn (built-in function) khác trong Flash, làm đủ thứ việc. Gọi là “hàm có sẵn” để phân biệt với hàm do bạn tự tạo ra, tự đặt tên (user-defined function). Bạn cần biết cách dùng hàm có sẵn trước khi thử tạo ra hàm có chức năng như ý.
Bạn hãy khởi động Flash và chọn Flash Document để tạo tập tin mới. Bạn gõ phím F9 để mở bảng Actions. Nói cho rõ, dòng tiêu đề của bảng là Actions – Frame, ngụ ý rằng những câu lệnh bạn viết trong bảng có hiệu lực đối với khung hiện hành, sẽ được thi hành khi Flash hiển thị khung đó vào lúc chạy. Khác với trường hợp lập trình cho nhân vật hoặc thể hiện, ở đây bạn không viết hàm xử lý tình huống. Bạn gõ hai câu lệnh như sau:

?

1 2 3

result = Math.pow(2, 3); trace("2 lũy thừa 3: " + result);

Câu lệnh thứ nhất tính “2 lũy thừa 3″ và gán kết quả cho biến mang tên result (để tạo ra một biến, bạn thoải mái viết tên biến tùy ý và gán trị cho nó). Câu lệnh thứ hai trình bày trị của biến result ở bảng Output, giúp bạn biết kết quả tính có đúng hay không.
Lúc viết câu lệnh thứ nhất, sau khi bạn gõ Math và dấu chấm, Flash nhanh nhẩu đưa ra danh sách các hàm khả dĩ (hình 1). Bạn gõ thêm chữ p, Flash đoán rằng đó là hàm lũy thừa pow. Thay vì gõ tiếp ow, bạn có thể gõ Enter để chấp thuận cho Flash ghi hàm pow thay mình. Tiếp theo, Flash nhiệt tình đưa ra dòng hướng dẫn nhắc bạn rằng đối mục thứ nhất của hàm pow là cơ số và đối mục thứ hai là số mũ.
Viết xong hai câu lệnh, bạn ấn Ctrl+Enter để chạy chương trình. Khi hiển thị khung số 1 (ngoài khung số 1, bạn chưa có khung nào khác), Flash thi hành hai câu lệnh được ghi ở khung đó. Kết quả xuất hiện ở bảng Output cho thấy Flash “tính toán như thần”: 2 lũy thừa 3: 8.

Có lẽ bạn thấy hơi lạ: “Tại sao phải viết tên hàm là Math.pow, thay vì chỉ viết pow cho gọn?”. Viết Math.pow nghĩa là gọi hàm pow của lớp Math (“lớp toán học”). Những hàm có sẵn của Flash được đặt trong nhiều lớp có tên khác nhau để phân loại. Các hàm trong một lớp phục vụ cho một lĩnh vực nhất định. Bạn cần phân biệt khái niệm lớp (class) khá trừu tượng ở đây với lớp (layer) ở bảng thời tuyến. Trong công việc thực tế, bạn dùng “tầng tầng lớp lớp” ở bảng thời tuyến là để tách biệt những hình vẽ và nhân vật trên sân khấu cho khỏi rối.
Bạn có thể yêu cầu Flash liên tiếp tính lũy thừa với cơ số là 2 và số mũ là 1, 2,…, 9 bằng cách viết lại đoạn mã ActionScript cho khung 1 như sau:

?

1 2 3 4 5 6 7

for(i = 1; i < 10; i++) { result = Math.pow(2, i); trace("2 lũy thừa " + i + ": " + result); }

Chạy chương trình, bạn thu được ngay kết quả trong bảng Output (hình 2). Bạn thấy rõ câu lệnh result = Math.pow(2, i); được thi hành lặp đi lặp lại 9 lần. Người ta gọi đó là một vòng lặp (loop). Trong lần thi hành đầu tiên, biến i được gán trị 1. Mỗi lần lặp lại, trị của biến i tăng thêm 1 so với trước.

Hai câu lệnh tính lũy thừa và xuất kết quả được thi hành lặp đi lặp lại là nhờ được ghi bên trong cặp dấu gộp { } sau dòng lệnh for(i = 1; i < 10; i++). Trong cặp dấu ngoặc ( ) sau từ for, ta diễn đạt việc cần làm khi bắt đầu vòng lặp (gán trị 1 cho biến i) và việc cần làm sau mỗi lần lặp (tăng trị của i thêm 1 và xem i có còn bé hơn 10 hay không). Khi viết i < 10, bạn đã đưa ra điều kiện duy trì vòng lặp. Nếu điều kiện đó không thỏa, vòng lặp kết thúc.
Với biến i chứa trị là số nguyên, để tăng trị của i thêm 1, bạn viết i++. “Sao không dùng một dấu cộng thôi nhỉ?”. Vâng, một dấu cộng thì “tự nhiên” hơn nhưng người ta phải dùng tác tử “cộng cộng” ++ để phân biệt với tác tử “cộng” + thực hiện phép cộng thông thường.
Nói cho đúng, tác tử “cộng” + trong ngôn ngữ ActionScript không hẳn là “phép cộng thông thường”. Khi viết đối mục của hàm trace(), ta đã dùng tác tử “cộng” để ghép chuỗi với trị nguyên. Chắc bạn thấy rằng viết như vậy cũng… “tự nhiên” thôi.

Xem thêm: Tổng hợp 31 bài tự học lập trình Flash

Theo echip.com

Read more »

Bài 9 : Nhân vật phức hợp – Tự học lập trình Flash

Bạn hãy chỉnh sửa nhân vật Square theo cách đơn giản: chọn nhân vật Ball trong danh sách, kéo quả banh trong khung phía trên danh sách, đặt ngay trên hình vuông trong khung lớn ở giữa (hình 1). Làm như vậy, nhân vật Square có thêm một bộ phận mới là nhân vật Ball. Nhân vật Square trở thành nhân vật phức hợp, chứa đựng bên trong nó một nhân vật khác.
Bấm vào mục Scene 1 phía trên bảng Timeline để thoát khỏi chế độ chỉnh sửa nhân vật Square, trở về với sân khấu, bạn thấy hai thể hiện của nhân vật Square giờ đây đều bao gồm một hình vuông và một hình tròn. Lúc chạy chương trình, hai thể hiện của nhân vật Square vẫn có hành vi như trước, chỉ khác ở chỗ có thêm quả banh liên tục “phập phồng” (hình 2). Nhân vật Ball trở thành một bộ phận của nhân vật Square nhưng không hề quên đi “bản năng” của nó.

Xem thêm : Tổng hợp 31 bài tự học lập trình Flash

Theo echip.com

Read more »

Bài 8 : Thuộc tính của thể hiện – Tự học lập trình Flash

Khi chơi đùa với những quả banh (các thể hiện của nhân vật Ball), bạn đã biết đến các biến có sẵn bên trong từng quả banh, cho biết trạng thái của quả banh: _x, _y, _xscale, _yscale, _visible. Các biến như vậy gọi là các thuộc tính (property) của thể hiện. Không giống như biến do bạn tự tạo ra (như biến step cho quả banh màu đỏ), khi bạn thay đổi một thuộc tính của thể hiện nào, trạng thái của thể hiện đó tự động thay đổi. Chẳng hạn, khi gán trị false cho biến _visible của quả banh, quả banh lập tức biến mất.

Để tìm hiểu thêm các thuộc tính khác của thể hiện, bạn nên tạo nhân vật mới. Lần này ta vẽ hình vuông để “thay đổi không khí”. Trước hết, bạn bấm kép vào tên lớp Layer 2 trong bảng Timeline, gõ Balls, rồi gõ Enter. Làm như vậy để đổi tên lớp thành Balls, ngụ ý rằng lớp đang xét là lớp dành cho các quả banh.
Bạn hãy tạo lớp mới dành cho các hình vuông. Bạn bấm nút “tạo lớp mới” (góc dưới, bên trái bảng Timeline), bấm kép vào tên lớp mới Layer 3 và gõ Squares. Để tập trung chú ý vào các hình vuông sắp tạo ra, bạn cho các quả banh biến mất bằng cách bấm vào dấu chấm của hàng biểu thị lớp Balls trong bảng Timeline, ở cột có hình con mắt . Các quả banh chỉ được giấu đi để đỡ vướng víu cho bạn khi làm việc, chúng vẫn “góp mặt” bình thường khi bạn chạy chương trình.
Bạn vẽ hình vuông bằng cách chọn công cụ Rectangle ở hộp công cụ, trỏ vào đâu đó trên sân khấu, giữ phím Shift và giữ phím trái của chuột, kéo chuột qua phải, xuống dưới. Nhờ bạn giữ phím Shift, hình khung được vẽ ra là hình vuông. Bạn nên tô màu cho hình vuông khác với các quả banh, màu xanh lá chẳng hạn (hình 1).

Bạn bấm vào công cụ chọn , bấm vào hình vuông xanh lá để chọn và gõ phím F8 để chuyển hình được chọn thành nhân vật. Hộp thoại Convert to Symbol hiện ra. Bạn gõ Square để đặt tên cho nhân vật mới (hình 2). Ở phần Registration trong hộp thoại, bạn thấy điểm mốc nằm ở tâm nhân vật theo mặc định. Không cần thay đổi điểm mốc, bạn gõ Enter. Hình vuông vừa vẽ tạo nên nhân vật Square. Hình vuông trên sân khấu trở thành thể hiện của nhân vật Square.

Hình vuông xanh lá đang ở tình trạng “được chọn”. Bạn gõ phím F9 để mở bảng Actions, viết hai hàm xử lý tình huống cho hình vuông được chọn như sau:

?

1 2 3 4 5 6 7 8 9 10 11

onClipEvent(load) { step = 10; } onClipEvent(enterFrame) { _rotation += step; }

Trong đó, hàm xử lý tình huống khởi động tạo ra biến step chứa trị số 10, hàm xử lý tình huống chuyển khung cộng biến step vào thuộc tính _rotation của hình vuông. Nhờ vậy, mỗi lần chuyển khung, góc quay của hình vuông lại tăng thêm 10. Bạn chú ý, biến step ta dùng ở đây không phải là biến step đã được dùng cho quả banh màu đỏ. Hai biến step tuy cùng tên nhưng có phạm vi (scope) khác nhau, không có “dây mơ rễ má” gì hết.
Ấn Ctrl+Enter để chạy chương trình, bạn thấy hình vuông quay đều do góc quay của nó “tà tà” tăng lên mỗi lần chuyển khung. “Nếu cứ để hình vuông quay hoài hoài, lẽ nào góc quay sẽ tăng đến… vô cùng?”. Bạn yên tâm, thực ra góc quay của hình vuông chỉ có thể nhận các trị số từ -180 đến 180 (tính bằng độ). Flash tự động điều chỉnh trị được gán cho biến _rotation để có trị thích hợp trong khoảng đó.
Để kiểm tra, bạn có thể ghi câu lệnh theo dõi trace(“Góc quay: ” + _rotation); sau câu lệnh _rotation += step; trong hàm OnClipEvent(enterFrame). Bằng cách dùng hàm trace như vậy, khi chạy chương trình, bạn sẽ thấy dòng thông báo đại loại như thế này: Góc quay: 120. Đó là nhờ chuỗi “Góc quay: ” được ghép với trị số của biến _rotation bằng dấu cộng.
Nếu không muốn có quá nhiều thông báo ở bảng Output khi chạy chương trình, bạn thêm dấu // trước câu lệnh gọi hàm trace:
//trace(“Góc quay: ” + _rotation);
Flash hiểu rằng những gì được ghi sau dấu // trên một dòng là phần chú thích, không cần xét đến khi biên dịch. Do vậy, đặt dấu // trước một câu lệnh giúp bạn tạm thời vô hiệu hóa câu lệnh đó. Khi muốn khôi phục hiệu lực của câu lệnh, bạn chỉ cần xóa dấu // trước câu lệnh.
Bạn hãy nhuộm màu tím cho hình vuông hiện có, gõ phím F11 để mở bảng Library và kéo hình vuông xanh lá từ thư viện vào sân khấu, tạo thêm một thể hiện nữa của nhân vật Square (hình 3). Trong bảng Actions, bạn viết hàm xử lý tình huống như sau cho hình vuông xanh lá:

?

1 2 3 4 5 6 7 8 9 10 11

onClipEvent(mouseMove) { trace("_xmouse: " + _xmouse); trace("_ymouse: " + _ymouse); trace("_alpha: " + _alpha); _alpha -= 1; }

Bạn chạy chương trình để thử đoán nhận ý nghĩa của những thuộc tính mà bạn chưa biết. Bạn sẽ có “đáp án” vào kỳ sau.

Xem thêm : Tổng hợp 31 bài tự học lập trình Flash

Read more »

Bài 7 : Hàm xử lý tình huống – Tự học lập trình Flash

Trong hàm xử lý tình huống bấm chuột onClipEvent(mouseDown) của quả banh màu xanh, bạn đã viết câu lệnh điều kiện if(_yscale == 100). Câu lệnh như vậy đặt điều kiện “nếu biến _yscale của quả banh màu xanh có trị bằng 100″. Biến _yscale xác định tỉ lệ co dãn theo phương thẳng đứng. Bạn chú ý, dấu “bằng” ở đây (==) khác với dấu “gán” (=) mà bạn từng dùng.

Biểu thức điều kiện _yscale == 100 có thể đúng hoặc sai vào lúc chạy. Người ta còn nói “kiểu cách” hơn một chút: biểu thức _yscale == 100 có thể có trị true hoặc false. Nhờ có hàm onClipEvent(mouseDown) của quả banh màu xanh, mỗi khi bạn bấm chuột vào lúc chạy, quả banh đó chuyển đổi qua lại giữa hai trạng thái: được kéo dãn theo phương thẳng đứng hoặc không.
Quả banh màu đỏ và màu xanh đã thể hiện “cá tính” của chúng, ta cũng nên cho quả banh màu cam diễn trò gì đó. Bạn bấm vào quả banh màu cam, gõ phím F9 để mở bảng Actions (hình 1) và gõ đoạn mã như sau:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

onClipEvent(mouseDown) { if(_visible) { _visible = false; } else { _visible = true; } }

Hàm xử lý tình huống bấm chuột onClipEvent(mouseDown) của quả banh màu cam “nói” rằng: nếu biến _visible của quả banh có trị là true thì gán cho nó trị false và ngược lại. Khi biến _visible của quả banh được gán trị false, quả banh trở nên vô hình! Ấn Ctrl+Enter để chạy chương trình, bạn thấy hàm vừa viết rất “hiệu nghiệm”: với mỗi cú bấm chuột, quả banh màu cam biến đi hoặc hiện ra.

Để diễn đạt điều kiện “nếu biến _visible có trị là true”, bạn có thể viết if(_visible == true). Tuy nhiên, cách viết nêu trên gọn hơn và có ý nghĩa tương đương. Bạn còn có thể viết gọn hơn nữa:

?

1 2 3 4 5

onClipEvent(mouseDown) { _visible = !_visible; }

Trong đó, ta dùng tác tử “không”, biểu diễn bằng dấu chấm than (!). Khi đặt dấu chấm than trước biến _visible, bạn nhận được trị true nếu biến _visible có trị false và ngược lại. Kết quả tác động của tác tử “không” được gán trở lại biến _visible. Nói khác đi, câu lệnh _visible = !_visible; cũng có tác dụng chuyển đổi trị của biến _visible giữa true và false.
Bấm chuột nhiều lần vào lúc chạy chương trình, có lẽ bạn đã hơi hơi mỏi tay và chợt nghĩ: “Phải chi mấy quả banh này tự động diễn trò mà không cần chờ bấm chuột”. Để đạt được “ước mơ” giản dị đó, bạn chỉ cần sửa đối mục mouseDown thành enterFrame:

?

1 2 3 4 5

onClipEvent(enterFrame) { _visible = !_visible; }

Đối với hàm xử lý tình huống onClipEvent của quả banh đỏ và quả banh xanh, bạn cũng sửa như vậy. Khi đó, hàm xử lý tình huống “bấm chuột” trở thành hàm xử lý tình huống “chuyển khung”. Bạn nhớ, vào lúc chạy chương trình, Flash không ngừng hiển thị các khung liên tiếp. Mỗi lần khung mới xuất hiện, Flash gọi hàm onClipEvent(enterFrame) của các thể hiện (nếu có). Điều này nghĩa là hàm onClipEvent(enterFrame) của các thể hiện được gọi một cách tự động và liên tục.
Chạy thử chương trình, bạn thấy khỏe re: cả ba quả banh đều hành động mà không chờ bạn “chỉ đạo”, tạo nên hoạt cảnh vui nhộn. Nếu thấy hoạt cảnh diễn biến quá nhanh, bạn dừng chương trình, giảm tốc độ “chạy khung” bằng cách bấm kép vào ô tốc độ ở cạnh dưới bảng Timeline, bấm kép vào ô Frame rate trong hộp thoại vừa hiện ra (hình 2), gõ 6 và gõ Enter (giảm tốc độ từ 12 khung mỗi giây xuống còn 6 khung mỗi giây).

Trong khi quả banh xanh và cam rất năng nổ, quả banh đỏ khiến bạn hơi phiền lòng vì nó dừng lại khi đụng “trần” và đứng yên luôn. Chắc bạn sẽ nghĩ: “Giá như quả banh đỏ liên tục chạy lên chạy xuống thì vui hơn”. Để thực hiện điều này, bạn chọn quả banh đỏ, sửa đổi trong bảng Actions như sau:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

onClipEvent(load) { step = 20; } onClipEvent(enterFrame) { if(_y < 0 || _y > 500) { step = -step; trace("Tôi đổi chiều đây."); } _y += step; }

Như bạn thấy, trong câu lệnh thay đổi tung độ _y của quả banh đỏ, thay vì ghi số cụ thể để xê dịch quả banh từng bước cố định như trước _y += 20; giờ đây ta dùng một biến, gọi là step (bạn tùy ý đặt tên cho biến): _y += step;.
Khi quả banh đụng “trần” hoặc “sàn”, chỉ cần đổi dấu cho trị của biến step, quả banh sẽ đổi chiều chuyển động. Cụ thể, câu lệnh if(_y < 0 || _y > 500) diễn đạt trường hợp đụng “trần” hoặc “sàn”: nếu _y có trị nhỏ hơn 0 hoặc _y có trị lớn hơn 500 (dấu || nghĩa là “hoặc”). Câu lệnh step = -step; dùng để đổi dấu cho trị số của biến step.

Câu lệnh step = 20; đặt bên trong hàm onClipEvent(load) dùng để gán trị ban đầu 20 cho biến step. Hàm onClipEvent(load)được gọi là hàm xử lý tình huống “khởi động” vì nó được gọi khi khởi động hoạt cảnh. Nếu không có hàm như vậy, biến step có trị ban đầu mặc định là 0. Khi đó, cả câu lệnh thay đổi tung độ _y lẫn câu lệnh đổi dấu cho trị số của biến step không có tác dụng gì hết.

Đọc thêm : Tổng hợp 31 bài tự học lập trình Flash

Theo echip.com

Read more »