Tạo nhân vật di chuyển theo phím mũi tên

In
Xem kết quả: / 13
Bình thườngTuyệt vời 

Đây là một bài hướng dẫn Action Script cơ bản. Bài tập này không dùng để làm một hình ảnh hoạt động mà là bài cơ bản hướng dẫn việc điểu khiển hướng đi tương quan của nhân vật, đồ vật...

 

Thông thường bạn có thể áp dụng bài tập này để bước đầu tập làm phần hoạt động di chuyển của nhân vật game. Lưu ý là phần nhân vật bạn có thể tự tạo hoặc lấy theo hình mẫu của bài.



Bước 1:

Vào [b]File > New[/b] (Ctrl + N) và chọn [b]Flash Document[/b] để mở một file flash mới.

Bước 2:

Điều chỉnh kích thước file sao cho phù hợp bằng cách vào [b]Modify > Document[/b] (Ctrl + J) và thiết lập chiều rộng, chiều cao. Bài tập này sẽ chọn kích thước file là 400 x 300 pixel.



Bước 3:

Điều đầu tiên cần làm là bạn phải tạo một nhân vật với 4 hướng khác nhau: nhìn từ bên trái, bên phải, trước và sau. Những hình ảnh này sẽ minh hoạt hoạt động của nhân vật. Bạn có thể lấy 4 hình sau làm mẫu để tạo ra nhân vật tương tự (lưu ý là những hướng nhân vật này sau khi được tạo phải chuyển sang dạng Movie clip và lưu trên Library):



Bước 4:

Sau khi đã có 4 hình tượng nhân vật, bạn cần đặt chúng chung vào một movie clip để điều khiển di chuyển. Tại frame 1 của movie chính (frame trống), vào [b]Insert > New Symbol[/b] (Ctrl + F8) để tạo một Movie clip mới. Tại ô Name bạn nhập vào tên phù hợp (trong trường hợp bài này đặt là mc_character, chọn Movie Clip và kích OK. Trong movie clip mới này, bạn tạo thêm 2 layer mới với tên là actions và laybels lên trên layer character ban đầu



Bước 5:

Vào frame 20 của cả 3 layer và nhấn phím F5. Tại frame 5, 10 và 15 của cả 3 layer, nhấn F6. Kích vào frame 1 của layer labels, tại phần Properties (Ctrl + F3) đặt tên frame này là right



Bước 6:

Tại frame 5 của layer labels, đặt tên là left, frame 10 đặt là up, frame 20 đặt là down. Kết quả bạn sẽ có như hình sau:



Lưu ý: Ta có thể đặt 4 frame chính này trên 4 frame liên tiếp, tuy nhiên như vậy rất khó để nhìn tên frame nên bài hướng dẫn này đặt trên 4 frame là 1, 5, 10 và 14

Bước 7:

Tại frame 1 của layer character, kéo hình nhân vật hướng sang phải vào. Bạn có thể căn giữa hình này bằng thành phần Align palette (Ctrl + K). Đảm bảo nút To Stage được chọn và kích vào 2 nút căn giữa theo chiều ngang và chiều dọc.



Bước 8:

Tại frame 5 của layer character, kéo hình nhân vật hướng sang trái vào và tiếp tục căn giữa. Thực hiện tương ứng với các frame 10 (đằng sau) và 15 (đằng trước).



Bước 9:

Bước cuối cùng là thêm mã Action Script vào. Lần lượt trên frame 1, 5, 10 và 15 của layer actions, thêm đoạn code sau vào (Ctrl + F9):
stop();


Bước 10:

Trở lại timeline chính, kéo movie clip mc_character từ thư viện Library vào vùng làm việc.



Chọn thành phần vừa kéo, vào phần Action Script và đưa vào đoạn code sau:
onClipEvent (enterFrame) { if (Key.isDown(Key.RIGHT)) { this._x += 5; this.gotoAndStop("right"); } if (Key.isDown(Key.LEFT)) { this._x -= 5; this.gotoAndStop("left"); } if (Key.isDown(Key.UP)) { this._y -= 5; this.gotoAndStop("up"); } if (Key.isDown(Key.DOWN)) { this._y += 5; this.gotoAndStop("down"); } }

Cuối cùng là thử hoạt động của nhân vật. Bạn có thể download file nguồn tại đây.

Share