AloFlash ! Cộng đồng flash Việt Nam



You are here: Tutorials  AS 1.0 - 2.0 Giọt nước rơi AS2

Giọt nước rơi AS2

Email In PDF.
Xem kết quả: / 35
Bình thườngTuyệt vời 

Chào các bạn, nhìn hiệu ứng này cũng khá hấp dẫn hôm nay mình xin hướng dẫn các bạn cách tạo nó. Mong rằng nó sẽ làm bạn thích thú.

Nguyên vật liệu cho bài tập này là 1 hình nền phù hợp bạn có thể chọn 1 tấm hình bạn thích, hoặc bạn có thể thiết kế chuyển động tùy theo ý bạn, cái này nó chỉ phủ trên lớp bề mặt flash nên bạn có thể làm thế nào tùy ý. Mình chọn tấm ảnh này làm nền.

Chúng ta bắt đầu nhé.

Bước 1:

Tạo 1 file flash mới Ctrl + N, chọn loại ActionScript 2.0, bạn có thể nhấn Ctrl + J để mở bảng Document Setting điều chỉnh các thông số phù hợp với file flash bạn làm.

Bước 2:

Import bức ảnh vào file flash của bạn, bằng cách vào: File > Import > Import to Stages..., sau đó mở bảng Align bằng cách vào Window > Align (Ctrl + K) điều chỉnh như hình dưới để căn bức ảnh vào giữa khung hiển thị của flash.

Bước 3:

Sử dụng công cụ Selection Tool (V) click chọn vào bức ảnh nhấn phím F8 để Convert nó thành dạng Movie Clip và đặt tên cho nó là: photo_mc

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

Bước 4:

Tạo 1 layer mới, nhấn Ctrl + để phóng to lên, sử dụng công cụ Oval Tool (O) giữ phím Shift vẽ 1 hình tròn.

Sử dụng công cụ SelectionTool (V) click chọn hình tròn vừa vẽ, vào: Window > Swatches (Ctrl + F9) mở bảng Swatches chọn loại Radial như hình dưới:

Sau đó bạn vào: Window > Color (Shift + F9) để mở bảng Color như hình dưới:

Bạn hãy để ý thanh màu sắc, ở trên ta thấy có 2 màu đen và trắng, giờ bạn hãy Click vào thanh đó để thêm và điều chỉnh màu sắc như hình dưới nhé.

Giờ thì bạn hãy làm như sau, tất cả những ô khóa màu trắng bạn để Alpha là 0% nhé. ta sẽ được như sau:

Giờ bạn sử dụng công cụ Selection Tool (V) Click chọn hình tròn đó rồi nhấn F8 để Convert nó thành dạng Movie Clip. Sau đó bạn Click đúp 2 lần vào movie này để vào bên trong.

Ở trong này bạn Click vào frame thứ 60 nhấn F6 để tạo keyframe tại đây bạn chỉnh mục Color sao cho tất cả khóa màu để Alpha là O% nhé.

Click vào frame đầu tiên, sử dụng công cụ Free Transform Tool (Q) và giữ phím Alt kéo hình tròn nhỏ hết cỡ lại:

Click chuột phải vào bất cứ nơi nào giữa 2 frame 1 và 60 bạn chọn Create Shape Tween.

OK, giờ bạn click vào frame 60 nhấn F9 để mở bảng ActionScript chèn vào đoạn code sau:

this._x = random(Stage.width);
this._y = random(Stage.height);
gotoAndPlay(random(10));

Nhấn F9 để tắt bảng ActionScript ta sẽ được như hình:

OK giờ thì chúng ta hãy quay ra Scene đầu tiên bằng cách nhấn vào 1 trong những vùng mình đã khoanh tròn ở hình dưới:

Sau khi ra ngoài bạn nhấn phím Delete để xoa bỏ MovieClip hình tròn ta vừa tạo, sau đó bạn mở Libraly bằng cách vào: Window > Libraly (Ctrl + L), click chuột phải vào Movie Clip hình tròn ta vừa tạo chọn Propreties...

Thiết lập như hình dưới đặt tên cho nó là:  wave

OK. Giờ bạn Click vào frame đầu tiên trên layer 2, nhấn F9 để mở bảng ActionScript chèn vào đoạn code sau:

 

import flash.filters.DisplacementMapFilter;
import flash.display.BitmapData;
import flash.geom.Point;
this.createEmptyMovieClip("waterHold", this.getNextHighestDepth());
waterHold._visible = false;
var numOfRipples:Number = 65;
var speed:Number = 18;
for (var i:Number = 0; i<numOfRipples; i++) {
var ripple:MovieClip = waterHold.attachMovie("wave", "wave"+waterHold.getNextHighestDepth(), waterHold.getNextHighestDepth(), {_x:random(Stage.width), _y:random(Stage.height)});
ripple.gotoAndPlay(random(65));
}
onEnterFrame = function () {
var bm:BitmapData = new BitmapData(waterHold._width+65, waterHold._height+65, true, 0x50000000);
bm.draw(waterHold);
photo_mc.filters = [new DisplacementMapFilter(bm, new Point(0, 0), -1, 1, 1, speed)];
};

Vậy là đã hoàn tất bài tập này, bạn có thể nhấn Ctrl + Enter để xem kết quả.

Qua bài tập này, nếu bạn nào muốn thay hiệu ứng giọt nước có thể nghĩ ra cách khác để ứng dụng, flash thiên biến vạn hóa, bạn chỉ cần nắm dc cơ bản có thể tạo ra vô vàn điều lý thú trên điều cơ bản đó.

Chúc các bạn thành công.

aloflash.com

Download

 

Bình luận (13)Add Comment
0
...
được viết bởi huy1878, Tháng mười hai 26, 2010
ồ bác cưới à, chúc mừng bác, bác cứ chơi tuần trăng mật vui vẻ rồi lúc nào rảnh giúp chúng em nhé, thank bác nhiều smilies/cheesy.gif
0
...
được viết bởi aloflash, Tháng mười hai 27, 2010
Ah không, Cưới mấy bạn mình, anh mình, sếp mình... smilies/cry.gif Chứ mình đã có người yêu đâu mà cưới.
0
...
được viết bởi Trần Vũ, Tháng tư 02, 2011
Tớ làm không được..! Chăc kém quá...Bạn nào có giáo trình chi tiết cho tớ Xin nhé! Thks!!
0
...
được viết bởi NH, Tháng chín 02, 2011
Vay chuc bac mau co nguoi yeu nhe. Cam on bac vi tat ca nhung dieu bac da lam cho cong dong nay
0
...
được viết bởi nguyen van toan.HELP ME!, Tháng mười 29, 2011
minh dung macrmedia flash 8.0 lam ko duoc dung ko. sao minh lam khong duoc
0
...
được viết bởi FUONGMULTIMEDIA, Tháng mười hai 02, 2011
minnh lam duoc ma
0
...
được viết bởi ongtran009, Tháng mười hai 17, 2011
anh dùng đuôi nào mà đưa lên mạng được thế.em dùng swf thấy hiệu ứng nhưng ko tải lên mạng được.con dùng đuôi avi và đuôi flv đưa lên mạng được nhưng chả thấy hiệu ứng chỉ thấy hình thui à.anh giúp em với
0
...
được viết bởi vu., Tháng một 05, 2012
sao em làm được nhưng k nước k nnhanh như bác làm....chỉ giáo em với @@
0
...
được viết bởi linh, Tháng hai 18, 2012
Thankssmilies/grin.gif
0
...
được viết bởi minh, Tháng mười một 30, 2012
Sao mình cũng làm các bước như bạn nói mà vẫn ko được nhỉ smilies/sad.gif
0
...
được viết bởi mup, Tháng sáu 18, 2013
cam ơn ban nhieu lam !
smilies/grin.gif
0
...
được viết bởi ..., Tháng sáu 26, 2013
mình dùng flash 8.0 sao có mục Create Shape Tween
0
...
được viết bởi nhimxu, Tháng ba 31, 2014
lam den lan t2 rui van k dc . huhu

Viết bình luận
nhỏ hơn | lớn hơn

busy