Macromedia Flash - Gradient màu theo di chuyển chuột

Bài tập này sẽ hướng dẫn bạn tạo một hình gradient màu bằng cách di chuyển chuột, sử dụng Action Script trong Flash 8.

Bước 1

Tạo một file flash mới, nhấn Ctrl + R trên bàn phím (Document Properties), thiết lập WidthHeight đều bằng 200px

Bước 2

Chọn frame đầu tiên, mở Action Script Pannel (F9) và đưa vào đoạn script sau:

import flash.filters.GradientBevelFilter;
var shapeClip:MovieClip = this.createEmptyMovieClip("shape_mc", 1);
shape_mc

with (shapeClip) {
beginFill(0xFF0000, 100);
moveTo(0, 0);
lineTo(200, 0);
lineTo(200, 200);
lineTo(0, 200);
lineTo(0, 0);
endFill();
}

shapeClip._x = (Stage.width - shapeClip._width) / 2;
shapeClip._y = (Stage.height - shapeClip._height) / 2;

var colors:Array = new Array(0xFFFFFF, 0xCCCCCC, 0x000000);
var alphas:Array = new Array(1, 0, 1);
var ratios:Array = new Array(0, 128, 255);
var gradientBevel:GradientBevelFilter = new GradientBevelFilter(10, 45, colors, alphas, ratios, 4, 4, 5, 3);
var mouseListener:Object = new Object();
mouseListener.onMouseDown = function() {
gradientBevel.strength++;
shapeClip.filters = [gradientBevel];
};

mouseListener.onMouseMove = function() {
gradientBevel.blurX = (_xmouse / Stage.width) * 255;
gradientBevel.blurY = (_ymouse / Stage.height) * 255;
shapeClip.filters = [gradientBevel];
};

Mouse.addListener(mouseListener);

Bước 3

Giải thích từng đoạn script

Đoạn này

import flash.filters.GradientBevelFilter;

bao gồm các bộ lọc

Đoạn này

var shapeClip:MovieClip = this.createEmptyMovieClip("shape_mc", 1);

để tạo Movie Clip với tên tương ứng

Đoạn này

shape_mc
with (shapeClip) {
beginFill(0xFF0000, 100);
moveTo(0, 0);
lineTo(200, 0);
lineTo(200, 200);
lineTo(0, 200);
lineTo(0, 0);
endFill();
}

xác định kích cỡ của movie

Đoạn này

shapeClip._x = (Stage.width - shapeClip._width) / 2;
shapeClip._y = (Stage.height - shapeClip._height) / 2;

để tạo hình dạng

Đoạn này

var colors:Array = new Array(0xFFFFFF, 0xCCCCCC, 0x000000);

thiết lập màu sắc

Đoạn này

var alphas:Array = new Array(1, 0, 1);

thiết lập góc

Đoạn này

var ratios:Array = new Array(0, 128, 255);

thiết lập kích thước

Đoạn này

var gradientBevel:GradientBevelFilter = new GradientBevelFilter(10, 45, colors, alphas, ratios, 4, 4, 5, 3);

Bao gồm bộ lọc góc xiên của hình gradient và thiết lập alpha với kích cỡ.

Đoạn này

var mouseListener:Object = new Object();
mouseListener.onMouseDown = function() {
gradientBevel.strength++;
shapeClip.filters = [gradientBevel];
};
mouseListener.onMouseMove = function()

Xác định hàm cho chuột di chuyển.

Tải về file nguồn.

Thứ Tư, 07/05/2008 09:42
21 👨 4.095
0 Bình luận
Sắp xếp theo