Tài liệu Macromedia Flash - Tự tạo menu flash pdf

Macromedia Flash - Tự tạo menu flash

Trong bài này, bạn có thể khám phá ra cách tạo một menu đơn giản chỉ với
vài mẹo và thủ thuật flash đặc biệt. Ngoài ra, còn sử dụng một số câu lệnh
script đơn giản để có thể:

- Thiết kế một menu
- Tạo hiệu ứng cho menu
Bước 1

Tạo một file flash mới. Vào Modify > Document (Ctrl + J), thiết lập kích
thước của file flash là 151 chiều rộng và 114 chiều cao, tốc độ Frame rate là
30fps. Chọn màu nền của flash là màu đen hoặc bất kỳ màu nào bạn muốn
sau đó kích OK.

Bước 2

Sử dụng công cụ Text Tool (A), vào phần Properties Panel (Ctrl + F3) ở
phía dưới màn hình. Sau đó thiết lập các thông số sau:

- Chọn ô đầu tiên là Static Text
- Chọn font chữ cho menu
- Chọn cỡ chữ
- Chọn màu chữ, trong ví dụ này tôi chọn màu trắng
- Dưới phần cỡ chữ chọn Use Anti-alias for readability.

Sau đó nhập tên và số thứ tự của từng nút trong menu như hình sau

Bước 3

Chọn công cụ Selection Tool (V) và chọn số với text của nút đầu tiên (trong

ví dụ là “HOME PAGE”), nhấn phím F8 (Convert to Symbol) để chuyển
text này sang dạng Movie Clip.

Bước 4

Trong khi Movie Clip vừa tạo vẫn được chọn, vào phần Properties Panel bên
dưới. Trong phần bên trái, bạn tìm tới phần Instance name và nhập tên vào
đây. Trong ví dụ này tôi nhập vào là HomePage_mc

Bước 5

Vẫn chọn công cụ Selection Tool (V) và kích đúp vào movie clip . Bạn sẽ
vào được phần bên trong của Movie Clip

Bước 6

Sau đó chọn text menu, lại tiếp tục nhấn phím F8 (Convert to Symbol) để lại
chuyển nó sang Movie Clip một lần nữa

Bước 7

Chọn frame 15 và nhấn phím F6 trên bàn phím. Tại frame này bạn di chuyển
vị trí của text menu sang bên phải một chút (có thể sử dụng phím mũi tên
hoặc chuột)

Bước 8

Chọn công cụ Selection Tool (V) và kích chọn text. Trong phần bên phải
của Properties Panel, bạn sẽ thấy menu Color. Chọn Tint và đặt màu Tint là
đen, sau đó chọn 100% (như hình dưới)

Bước 9

Kích chuột phải vào bất kỳ vị trí nào trong vùng màu xám giữa hai keyframe
trên timeline và chọn Create Motion Tween từ menu xuất hiện.

Bước 10

Tạo một layer mới đặt tên là effect và kéo xuống dưới layer 1.

Bước 11

Sử dụng công cụ Rectangle Tool (R). Trong phần Color của công cụ đang
chọn, khóa màu viền đường kẻ (Stroke color) bằng cách kích vào biểu tượng
bút chì và chọn ô vuông nhỏ có đường kẻ đỏ gạch chéo. Chọn màu nền vẽ là
#FF691B và vẽ một hình chữ nhật có kích thước 140x14px, sau đó đặt nó
vào vị trí như hình dưới đây


Bước 12

Chọn hình chữ nhật vừa vẽ, nhấn phím F8 (Convert to Symbol) để chuyển
hình chữ nhật sang dạng Movie Clip.

Bước 13

Kích vào frame 15 và nhấn phím F6. Trở lại frame 1, chọn công cụ Free
Transform Tool (Q). Nhấn và giữ phím Shift và kéo giảm chiều ngang kích
thước hình chữ nhật theo như hình sau

Bước 14

Vẫn chọn frame đầu tiên, chọn công cụ Selection Tool (V) và kích vào hình
chữ nhật. Sau đó vào phần Properties Panel ở phía dưới. Trong phần bên
phải bạn sẽ thấy phần menu Color, chọn Alpha và kéo xuống giá trị là 0%.

Bước 15

Kích chuột phải vào bất kỳ vị trí nào trong vùng màu xám giữa hai keyframe
và chọn Create Motion Tween từ menu xuất hiện.

Bước 16

Trở lại scene chính (Scene 1)

Bước 17

Kích đúp vào layer 1 và đổi tên layer thành menu. Sau đó tạo một layer mới
lên trên và đặt tên là invisible button.

Bước 18

Chọn layer invisible button và tạo một nút ảo lên phía trên hình chữ nhật và
text mục menu (xem hình dưới)

Bước 19

Chọn công cụ Selection Tool (V), kích vào nút ảo vừa tạo, vào phần Action
Script Panel (F9) và đưa vào đoạn mã script sau:
on (rollOver) {

_root.mouse_over_home_mc = true;
}
on (rollOut) {
_root.mouse_over_home_mc = fstartlse;
}
on (release){
getURL(" ");
}
Bước 20

Tạo một layer mới phía trên layer invisible button và đặt tên là action.

Bước 21

Kích vào frame đầu tiên của layer action, vào phần Action Script Panel và
đưa vào đoạn mã script sau:
_root.HomePage.onEnterFrame = function() {
if (mouse_over_HomePage) {
_root.HomePage.nextFrame();
} else {
_root.HomePage.prevFrame();
}
};
Vậy là bạn đã hoàn thành được nút đầu tiên của menu. Hãy lặp lại các bước
trên cho các nút khác, chỉ khác nhau ở chỗ bạn phải đặt tên và thay đổi URL
cho phù hợp.