Làm mưa sao rơi với AS2

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

Nhiều bạn có hỏi mình về hiệu ứng sao rơi liên tục trong flash. Hôm nay mình viết tut này hướng dẫn các bạn nhé, cái này cũng tương tự như hiệu ứng tuyết rơi thôi chỉ khác thay bông tuyết là những ánh sao.

Nguyên vật liệu cho bài tập này là một bức ảnh nền có màu tối tối 1 chút để nổi bật những ngôi sao, mình chọn tấm ảnh này làm hình nền:

Sau khi bạn đã chọn xong 1 bức ảnh thích hợp chúng ta sẽ tiến hành làm nhé.

Bước 1:

Tạo 1 file flash mới Ctrl + N chọn loại Action Script 2.0, nhấn Ctrl + J để mở bảng Document Setting điều chỉnh thông số cho phù hợp với yêu cầu của bạn như chiều rộng chiều cao tốc độ frame hình.

Bước 2:

Import bức ảnh làm nền vào file flash của bạn bằng cách vào File > Import > Import to Stage... (Ctrl + R), sau khi Import xong sử dụng công cụ Selection Tool (V) Click vào bức ảnh mở bảng Align: Window > Align (Ctrl + K), căn bức ảnh vào giữa khung hiển thị flash như trong hình dưới:

Làm xong bạn khóa layer này lại nhé.

Bước 3:

Tạo một layer mới, Nhấn Ctrl + để phóng to khung hình, sử dụng công cụ công cụ PolyStar Tool như hình:

Khi bạn chọn công cụ này thì phần thiết lập bên phải sẽ hiện ra, ở mục Tool Setting bạn Click vào Options.. nó hiện ra 1 bảng để bạn nhập giá tri như hình dưới:

OK, bạn chọn màu Fill là màu trắng và màu Stroke là trong suốt nhé, giờ bạn vẽ vào khung hiển thị Flash một hình sao nó sẽ có 4 cạnh trong lúc vẽ giữ phím Shift để được hình tuyệt đối. như hình:

Sử dụng công cụ Selection Tool (V) click chuột vào hình ngôi sao 4 cạnh vừa vẽ Giữ phím Alt và kéo nó ra bên cạnh để copy thêm 1 ngôi sao nữa như trong hình:

Sử dụng công cụ Free Transform Tool (Q), giữ Shift và kéo nhỏ hình sao vừa copy ra lại.

Tiếp tục Giữ Shift quay 1 góc 45 độ như hình:

Click vào ngôi sao bên trái kéo hẹp nó lại như hình:

Click chọn ngôi sao nhỏ xếp đè lên ngôi sao to như hình:

Vậy là ta đã được hình ngôi sao rồi :)

Bước 4:

Click vào layer chứa ngôi sao nhấn phím F8 và convert nó thành dạng Movie Clip,

Sử dụng công cụ Selection Tool (V) click đúp vào movie clip ngôi sao vừa tạo để vào trong. Lần lượt Click vào frame thứ 10 và thứ 20 nhấn phím F6. như hình:

Click trở lại frame thứ nhất, sử dụng công cụ Selection Tool (V), click vào hình ngôi sao chọn màu cho nó là màu xanh, rồi dùng công cụ Free Transform Tool (Q) giữ Shift kéo ngôi sao nhỏ lại, như hình:

Click vào Frame thứ 20, rồi Click vào hình ngôi sao chọn màu Fill để Alpha = 0% như hình mình đã khoanh đỏ:

Giờ bạn click vào bất cứ nơi nào giữa 2 frame 1 đến 10 và 10 đến 20 nhấn chuột phải và chọn: Create Shape Tween

Kết quả:

Vậy là ta đã hoàn thành các bước thiết kế cơ bản.

Bước 5:

Trở lại Scene ban đầu bằng cách nhấn vào 1 trong những phần mình khoanh đỏ ở hình dưới:

Bước 6:

Mở bảng Libraly bằng cách vào Window > Libraly (Ctrl + L), bạn chọn Symbol ngôi sao nhấp chuột phải chọn Properties...

Nó sẽ hiện ra 1 bảng, bạn tích dấu kiểm vào 2 ô Export for ActionScriptExport in frame 1, sau đó đặt tên trong phần Identifier là: star

OK, giờ bạn xóa ngôi sao ở trong stage đi.

Bước 7:

Click vào frame 1 trên layer sao bạn vừa xóa đi chèn vào đoạn code sau:

i = 0;
soLuong = 100;
function createStar() {
_root.attachMovie("star", "star"+i, i);
scale = random(60)+10;
_root["star"+i]._x = Math.random()*Stage.width;
_root["star"+i]._xscale = scale;
_root["star"+i]._yscale = scale;
_root["star"+i].yspeed = Math.random()*3+1;
_root["star"+i].onEnterFrame = function() {
if (this._y>Stage.height) {
this._x = Math.random()*Stage.width;
this._y = 0;
} else {
this._y += this.yspeed;
}
};
i = (i<soLuong) ? i+1 : 0;
}
setInterval(createStar, 100);

Vậy là đã xong bài tập này rồi, muốn cho bao nhiêu sao thì bạn thay đổi ở soLuong nhé, như code trên nó sẽ tạo ra 100 ngôi sao.

Giờ chỉ việc nhấn Ctrl + Enter và xem kết quả của bạn.

Chúc mọi người làm tốt.

aloflash.com

Download

Share