Thứ Hai, 20 tháng 6, 2011

Hiệu ứng chữ: quả cầu ánh sáng


Với bài hướng dẫn này bạn sẽ biết cách làm thế nào để tạo được hiệu ứng ánh sáng cho chữ, sử dụng “quả cầu ánh sáng” và Action Script trong Flash 8.

Bước 1: Mở một file Flash mới với độ kích thước là 300 x 200px và màu nền là màu đen.

Bước 2: Click đúp vào Layer1 để đổi tên thành layer Background. Sau đó Insert một layer mới với tên là Light ball.

Bước 3: Chọn Oval Tool (O) và chọn các thuộc tính sau

- Stroke color: phải chọn chế độ không màu
- Fill color: chọn màu trắng
- Giữ phím Shift kéo ra nền để được hình tròn và thay đổi kích thước hình tròn thành 162x162px

Bước 4: Click vào hình tròn vừa vẽ, mở Color Mixer Panel (Shift+F9) và thiết lập các thuộc tính giống hình dưới đây.

Kết quả hình tròn của bạn sẽ như hình dưới:

Bước 5: Lại chọn layer Light ball và nhấn phín F8 (Convert to Symbol) để chuyển đổi nó sang Movie Clip

- Type: Movie clip

- Registration: chọn tâm giữa

Bước 6: Mở Properties Panel (Ctrl+F3) và nhập tên Movie Clip vừa chuyển đổi vào phần

Bước 7: Click đúp chuột vào Movie Clip vừa tạo (lightBall) hoặc click chuột phải và chọn Edit in Place

Bước 8: Click trên frame 10, 20, 30 và 40 nhấn phím F6 vào mỗi frame (để tạo Keyframe)

Bước 9: Trở lại frame 10 chọn Free Transform Tool (Q) và kéo cho “light ball” của bạn nhỏ đi. Sau đó, mở Color Mixer Panel và thiết lập các lựa chọn như hình dưới.

Bước 10: Chọn frame 20, vào Free Transfrom Tool (Q) và kéo hình nhỏ đi chút nữa.

Bước 11: Chọn frame 30, lại tiếp tục chọn Free Transform Tool (Q) và tăng kích thước hình tròn lên một chút. Sau đó mở Color Mixer Panel và đặt màu ở slide bên trái là #789EF5 (hoặc màu bạn tự chọn)

Bước 12: Chọn layer1, trong phần Properties (Ctrl+F3) dưới Tween bạn chọn Shape

Bước 13: Trở lại scene chính (Scene 1) chọn frame đầu tiên của layer bóng, mở Action Script Panel (F9) và paste vào đó nội dung script sau:

startDrag ("lightBall", true);
_level0.drag = lightBall;

Bước 14: Thêm một layer mới và đặt tên là Text

Bước 15: Khoá và ẩn tất cả các layer ngoại trừ layer Text. Chọn layer Text và dùng công cụ Text Toll (A) với màu chữ là màu trắng rồi nhập vào nội dung tuỳ ý.

Bước 16: Copy đoạn text vừa nhập và đưa vào một layer mới, đặt tên layer mới này là Text1. Sau đó, thay đổi màu chữ của Text1 thành màu: #C4E8FD và sử dụng phím mũi tên để di chuyển layer này lệch xuống và sang phải một chút (xem hình dưới)

Bước 17: Bỏ ẩn và bỏ khoá cho tất cả các layer

Bước 18: Chọn layer Text và chuyển đổi nó sang dạng Mask bằng cách click chuột phải vào layer Text và chọn Mask.

Và như vậy là đã hoàn thành rồi, bạn hãy chạy thử file của mình xem nào. Bạn có thể lấy file đã hoàn thiện tại đây.

======================================

startDrag

Usage startDrag(target,[lock ,left , top , right, bottom])

· target Đường dẫn tới movie clip để kéo (drag: di chuyển con trỏ chuột trong khi vẫn nhấn và giữ phím trên chuột).

· lock Một giá trị logic Boolean xác định xem movie clip có khả năng kéo (draggable movie clip) bị khoá đối với điểm giữa của vị trí con trỏ (true), hay bị khoá với điểm mà ở đó người dùng click lên trên movie clip lần đầu tiên (false). Tham số này là tùy chọn.

· left, top, right, bottom Các giá trị liên quan đến các tọa độ của movie clip's parent ("mẹ" của movie clip, ta hiểu là instance cấp cao hơn, nơi movie clip được đặt) xác định một hình chữ nhật chứa movie clip (a constraint rectangle for the movie clip). Những tham số này là tùy chọn.

Returns: Không giá trị trả về.

Description: Action (hành vi); tạo một target movie clip có thể kéo được khi movie đang trình diễn. Ở một thời điểm chỉ một movie clip có thể kéo được. Ngay khi một thao tác startDrag (bắt đầu kéo) được thực thi, movie clip giữ nguyên khả năng kéo được (remains draggable) cho đến khi dứt khoát được dừng lại bởi một hành vi stopDrag, hoặc cho đến khi hành vi startDrag đối với một movie clip khác được gọi.

Example: Để tạo một movie clip mà người dùng có thể định vị trong bất kỳ vị trí nào, kèm theo các hành vi startDrag và stopDrag vào một nút bên trong movie clip.

on(press) { startDrag(this,true);}

on(release) { stopDrag();}


MovieClip._droptarget

myMovieClip._droptarget

Description: Property (read-only) {Thuộc tính (chỉ đọc)}; trả về đường dẫn tuyệt đối trong ký hiệu vạch xiên của instance movie clip trên đó MovieClip đã được thả (was dropped). Tham số _droptarget luôn luôn trả về một đường dẫn bắt đầu với một vạch xiên (/). Để so sánh thuộc tính _droptarget của một instance với một tham chiếu, hãy sử dụng hàm eval để chuyển đổi giá trị trả về từ cú pháp vạch xiên (slash syntax) thành một tham chiếu cú pháp chấm (dot syntax reference).

Example:Ví dụ sau ước lượng thuộc tính _droptarget của instance movie clip garbage và dùng eval để chuyển đổi nó từ cú pháp vạch xiên thành một tham chiếu cú pháp chấm. Tham chiếu garbage sau đó được so sánh với tham chiếu tới movie clip instance trash. Nếu hai tham chiếu tương đương, tính nhìn thấy được của garbage được thiết đặt thành false. Nếu chúng không tương đương, instance garbage được xác lập lại thành các vị trí gốc của nó.

if (eval(garbage._droptarget) == _root.trash) { garbage._visible = false;} else { garbage._x = x_pos; garbage._y = y_pos;}

Các biến x_pos y_pos đều được thiết đặt trên Frame 1 của movie bởi đoạn script sau đây:

x_pos = garbage._x;y_pos = garbage._y;


stopDrag

stopDrag()
Parameters: None.

Returns: Nothing.

Description: Action (hành vi); ngừng thao tác kéo hiện tại.

Example: Câu lệnh này ngừng hành vi kéo (drag) trên instance mc khi người dùng nhả (release) nút con trỏ:

on(press) {startDrag("mc");}

on(release) {stopdrag();}


MovieClip.stopDrag

myMovieClip.stopDrag()

Parameters: None.

Returns: Nothing.

Description: Method (phương pháp, cách thức); kết thúc một method startDrag. Một movie đã được làm cho có khả năng kéo bởi method startDrag vẫn còn có khả năng kéo cho đến khi một method stopDrag được thêm, hoặc cho đến khi movie khác trở thành có khả năng kéo. Tại một thời điểm chỉ một movie clip có thể kéo được.



1 nhận xét:

sms_6x72 nói...

Bài này khá đơn giản mà hay.

Đăng nhận xét

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | 100 Web Hosting