Trong bài này bạn sẽ thực hành tạo ảnh động (animation) theo phương pháp motion tween kết hợp với mask layer để cho dòng chữ TUỔI TRẺ ONLINE xuất hiện dần theo từng ký tự. Các bước thực hành như sau:
1. Chuyển về vùng làm việc mặc địnhBạn bấm chọn vùng
Essentials để chọn lại vùng làm việc mặc định của Flash, tiếp đến bấm chọn
Reset Essentials để khôi phục vùng làm việc mặc định này và bắt đầu vào bài thực hành 2. (
Xem bài thực hành 1 về vùng làm việc)
2. Tạo mới một flash document. (
Xem bài thực hành 1 về tạo một flash document)
3. Lưu một flash document. (
Xem bài thực hành 1 về lưu một flash document)
Chọn folder
FLASH CS4 ONLINE, sau đó lưu file này lại với tên
002_motion_mask.fla4. Sử dụng Text Tool để viết một đoạn text. 4.1. Bấm chọn vào
Text Tool trên thanh công cụ bên phải:
4.2. Nhấp chuột vào chỗ 12.0pt trên
Property Inspector:
4.3. Đổi số
12 thành
50 rồi nhấn phím
ENTER để chấp nhận giá trị mới:
4.4. Bấm chuột vào
Stage và gõ vào dòng chữ
TUỔI TRẺ ONLINE:
4.5. Bấm phí
ESCAPE để thoát khỏi khung text, lúc này cả đoạn text đã được chọn và có một khung hình chữ nhật bao quanh:
4.6. Để canh giữa đoạn text này trên
Stage, trước hết chọn
Edit>Cut từ menu:
Kế đến chọn
Edit>Paste in Center từ menu:
Bạn thu được dòng chữ được canh giữa Stage như sau:
5. Thêm một layer vào Timeline.5.1 Bấm chuột vào nút
New Layer để thêm một layer vào
Timeline:
5.2 Bấm đúp vào Layer 2 và đổi tên thành
mask:
6.Chọn Rectangle Tool để vẽ hình chữ nhật.6.1 Bấm chọn
Rectangle Tool từ thanh công cụ:
Chuột sẽ đổi hình dáng từ mũi tên sang chữ thập + .
6.2 Kéo chuột từ góc trên bên trái sang góc dưới bên phải để bao phủ chữ TUỔI TRẺ ONLINE:
Bạn thu được một hình chữ nhật màu xanh bao phủ chữ TUỔI TRẺ ONLINE:
7. Sử dụng Selection Tool để chọn hình chữ nhật và tạo motion tween.7.1 Bấm chọn Selection Tool trên thanh công cụ bên phải:
7.2 Bấm chọn hình chữ nhật. Khi đã được chọn, hình chữ nhật chuyển sang dạng hạt li ti, đồng thời phía dưới chuột xuất hiện mũi tên bốn chiều:
7.3 Bấm phím phải chuột cho xuất hiện menu ngữ cảnh và chọn
Create Motion Tween:
7.4 Do hình chữ nhật vừa tạo ra không phải là một symbol nên flash thông báo cần phải chuyển nó sang symbol để tạo tween (xem thêm phần tìm hiểu về symbol ở cuối bài). Bạn bấm OK để đồng ý:
Sau khi bấm chọn OK, bạn thấy một số thay đổi như sau:
1. Hình chữ nhật không còn những hạt li ti nữa vì đã được chuyển thành
symbol.
2. Trên
Property Inspector xuất hiện biểu tượng symbol (hình bánh xe) là Movie Clip với dòng chữ
Instance of: Symbol 1. (
xem thêm phần tìm hiểu về symbol ở cuối bài)
3. Trong khu vực
frame của
Timeline, Flash đã tự động bổ sung số frame thành 24 frame (mặc định cho motion tween hoàn thành trong một giây - theo mặc định Flash CS4 thiết lập tốc độ 24 fps). Đồng thời
Playhead được di chuyển đến frame số 24. Bên cạnh đó bạn còn thấy các frame từ 1 đến 24 đã được đổi sang màu xanh nhạt đặc trưng của motion tween của Flash CS4.
7.5 Bấm
F6 để chèn
keyframe vào vị trí frame 24 (Xem bài thực hành 1- cách chèn keyframe), tại frame này xuất hiện một hình thoi màu đen. Đây là đặc trưng của motion tween mới của Flash CS4.
7.6 Đưa chuột đến keyframe 1 của motion tween và bấm chọn keyframe 1 khi nhìn thấy phía dưới chuột xuất hiện một khung chữ nhật mờ, playhead sẽ chuyển đến keyframe 1
7.7. Đưa chuột vào mép phải của hình chữ nhật, bấm và di chuyển hình chữ nhật sang trái, giữ phím Shift để hình chữ nhật di chuyển theo chiều ngang.
Khi nhả chuột ra, bạn thu được sự thay đổi như hình vẽ.
Trên hình bạn thấy một đường thẳng có các chấm dọc theo đường thể hiện vị trí của các frame, đây là điểm đặc trưng của motion tween cho đối tượng của Flash CS4, hoàn toàn khác với motion tween của các phiên bản Flash trước đây (Flash CS4 gọi motion tween theo cách cũ là
Classic motion tween)
7.8 Motion tween kéo dài 24 frame, trong khi đoạn text chỉ kéo dài 1 frame, bạn bổ sung frame cho layer chứa đoạn text bằng cách bấm chuột vào frame số 24 của layer chứa đoạn text.
Để chèn thêm frame vào Timeline bạn chọn
Insert > Timeline > Frame từ menu (hoặc bấm phím tắt
F5):
Kết quả thu được như sau:
7.9. Bấm phím phải chuột vào layer mask để xuất hiện menu ngữ cảnh và chọn Mask. Biểu tượng của các layer sẽ biến đổi như phần bên phải của hình dưới đây đồng thời cả hai layer này bị khóa lại.
Lúc này trên Stage dòng chữ TUỔI TRẺ ONLINE bị hình chữ nhật che khuất đã xuất hiện đầy đủ. (
Xem thêm phần Tìm hiểu về Mask layer ở cuối bài)
8. Xem thử animation lúc đang biên soạn Để xem thử kết quả lúc đang biên soạn, bạn nhấn phím
ENTER. Chữ TUỔI TRẺ ONLINE với từng ký tự xuất hiện nhanh qua màn hình.
9. Xuất file thành flash movieĐể xuất file thành flash movie, bạn chọn
Control > Test Movie từ menu:
Flash sẽ xuất thành file
002_motion_mask.swf:
Tuy nhiên, file flash movie lặp lại liên tục gây cảm giác không thoải mái khi xem. Bạn bổ sung số frame để khi Flash tạo được dòng chữ TUỔI TRẺ ONLINE hoàn chỉnh thì sẽ dừng lại 2 giây.
Đóng file flash movie lại bằng cách bấm vào dấu X .
Tốc độ của bài đang thiết lập là 24 fps, để dừng lại 2 giây bạn bổ sung 48 frame. Số frame hiện có là 24, bạn chọn frame số 72 trên Timeline.
Để chèn thêm frame vào Timeline, bạn chọn
Insert > Timeline > Frame từ menu (hoặc bấm phím tắt F5).
Thực hiện tương tự cho layer còn lại, kết quả thu được như sau:
Chọn
Control > Test Movie từ menu (hoặc phím tắt Ctrl+Enter) để xem kết quả.
Lần này Flash sẽ dừng lại 2 giây để người xem có thời gian thưởng thức tác phẩm của bạn.
GV TRƯƠNG VĂN NĂNG
Công ty TNHH Khải Thiên (KTC Co., Ltd)---------------------------------------------------------------------------------------
Phần lý thuyết bổ sung cho bài thực hành
Tìm hiểu về symbol
Symbol được xem như một dạng dữ liệu đóng gói trong Flash. Dữ liệu này có thể là một nét vẽ, một đường thẳng, một hình chữ nhật, một bức ảnh v.v.
Khi một symbol được tạo ra, bản gốc của nó được cất giữ ở thư viện (Library). Bản sao của symbol mà bạn nhìn thấy trên Stage gọi là một Instance của symbol (hay bản copy). Bạn có thể phóng to, thu nhỏ, làm méo, đổi màu, v.v. một bản sao của symbol trên Stage mà không làm ảnh hưởng đến nội dung của bản gốc trong thư viện. Muốn thay đổi nội dung của bản gốc, bạn phải sửa từ bản gốc ở thư viện.
Bạn có thể tạo được ba loại symbol: Movie Clip, Graphic và Button. Đặc điểm của các symbol là chúng có Timeline riêng hay còn gọi là Timeline của symbol (Symbol Timeline). Còn timeline của bản thân Flash document gọi là timeline chính (Main Timeline) .
Một số cách để tạo symbol:
1. Chọn một đối tượng rồi chuyển nó sang symbol (sẽ có bài thực hành riêng)
2. Tạo mới một symbol với timeline rỗng (chưa có nội dung) rồi bắt đầu bổ sung nội dung (sẽ có bài thực hành riêng)
3. Cho Flash tự động tạo symbol như vừa thực hiện trong bài này.
Hiệu quả khi sử dụng symbol:
Symbol giúp giảm kích thước tác phẩm đáng kể. Nếu bạn có một flash document có vẽ mười hình chữ nhật bằng công cụ vẽ Rectangle Tool và một flash document với mười hình chữ nhật là bản sao lấy từ một symbol hình chữ nhật gốc từ thư viện thì flash document tạo từ symbol có kích thước file nhỏ hơn nhiều. Do vậy, khi sử dụng một đối tượng nào đó hai lần trở lên, bạn nên chuyển nó sang symbol. |
Tìm hiểu về Mask LayerTrong các lễ hội hóa trang, mặt nạ dùng để che những gì phía sau nó. Kết quả là bạn chỉ thấy hình ảnh của mặt nạ.Trong Flash, Mask Layer có hiệu ứng ngược lại. Khi Mask Layer có hiệu lực thì bạn không nhìn thấy nội dung của Mask Layer mà chỉ nhìn thấy những gì bị Mask Layer che khuất trước đó. Như trong bài mẫu trên đây, nội dung của Mask Layer là hình chữ nhật. Khi Mask Layer có hiệu lực, bạn không nhìn thấy hình chữ nhật mà nhìn thấy dòng chữ TUỔI TRẺ ONLINE bị hình chữ nhật che khuất trước đó.Do hình chữ nhật trong Mask Layer di chuyển từ trái sang phải, bản thân nó che phủ dòng chữ TUỔI TRẺ ONLINE theo từng ký tự từ bên trái cho đến khi che hết dòng chữ thì dừng lại. Do đó khi Mask Layer có hiệu lực, bạn thấy dòng chữ TUỔI TRẺ ONLINE xuất hiện dần theo từng ký tự.Làm sao nhận ra Mask Layer?Lúc đang biên soạn Flash document, khi bạn tạo mới một Mask Layer (bằng cách bấm phím phải của chuột vào layer và chọn Mask từ menu ngữ cảnh), Flash lập tức khóa Mask Layer và khóa cả layer ngay dưới nó và lập tức hiệu ứng Mask có hiệu lực. Layer phía dưới được gọi là layer bị mask (Masked). Nếu nhìn vào bên trái các layer, biểu tượng các layer giờ đã thay đổi: Mask Layer có motion tween:Mask Layer không có motion tween:Một điều cần lưu ý là nội dung của Mask Layer có thể có màu sắc bất kỳ, không nhất thiết phải là màu xanh như trong bài thực hành này.Khi muốn thay đổi nội dung của Mask Layer hoặc layer bị mask, bạn chỉ việc mở khóa layer cần thay đổi nội dung và thực hiện các thay đổi cần thiết. Lúc này hiệu ứng mask không còn hiệu lực ở flash document, nhưng khi xuất tác phẩm ra thành flash movie, hiệu ứng mask lại có hiệu lực.
