Online Media

Trong bài này chúng ta sẽ từng bước học cách tạo ra các hiệu ứng hình ảnh sử dụng các cú kích chuột. Bạn có thể sử dụng các hiệu ứng này cho banner flash, cho một số presentation... Bây giờ chúng ta sẽ bắt đầu!

Bước 1

Đầu tiên, lưu bức ảnh dưới đây lại

Bước 2

Tạo một tài liệu flash mới. Nhấn tổ hợp phím Ctrl+J trên bàn phím (Document Properties) và thiết đặt chiều rộng tài liệu của bạn là 400 pixels và chiều dài của nó là 300 pixels. Chọn màu trắng làm màu nền. Thiết đặt frame rate của Flash movie là 40 và nhấn OK.

Bước 3

Gọi layer ảnh hiện tại là image. Nhấn kép vào tên mặc định của nó (layer 1) để thay đổi tên. Nhấn Enter khi bạn đã gõ xong tên mới.

Bước 4

Bây giờ chọn File > Import > Import to stage (Ctrl + R) và import bức ảnh mà bạn vừa lưu lại trong bước 1.

Bước 5

Trong khi bức ảnh vẫn đang được lựa chọn, nhấn phím F8 (Convert to Symbol) để chuyển đổi nó sang một Movie Clip Symbol.

Bước 6

Bây giờ đi vào Flash Library (Ctrl+L), nhấn chuột phải lên image_mc và chọn Linkage

Bước 7

Trong cửa sổ Linkage Properties, chọn Export for ActionScript và tại phần Class gõ vào CoolImage như hình dưới đây:

Bây giờ nhấn OK, bỏ qua cảnh báo ActionScript Class Warning. Hãy nhấn OK.

Bước 8

Bây giờ chọn bức ảnh trong stage và nhấn phím delete trên bàn phím để xóa nó

Bước 9

Chọn frame đầu tiên và vào phần Action Script Panel (F9). Sau đó, tìm vào đoạn code này phía trong khung actions:

function Main() {
stage.addEventListener(MouseEvent.CLICK, AddImage);
}

Main();
function AddImage(e:MouseEvent):void {
var newImage:CoolImage = new CoolImage();
this.addChild(newImage);

newImage.x = mouseX;
newImage.y = mouseY;
newImage.scaleX = 0;
newImage.scaleY = 0;

newImage.alpha = 0;
newImage.addEventListener(Event.ENTER_FRAME, ZoomImage);
}
function ZoomImage(e:Event):void {
var imageMC:MovieClip = MovieClip(e.target);
imageMC.scaleX += .05;
imageMC.scaleY += .05;

if (imageMC.scaleX < 4) {
imageMC.alpha += .05;
} else {
imageMC.alpha -= .05;
if (imageMC.alpha < .8) {
imageMC.removeEventListener(Event.ENTER_FRAME, ZoomImage);
}
}
}

Chúng ta đã hoàn tất. Chúc các bạn thành công!