Bạn có thể chọn màu để tô màu hoặc muốn đổi màu cho vòng tròn thì nhấp chuột vào hộp màu Fill Color chọn một màu và tô màu cho đối tượng.. Bây giờ bạn chọn trên trình đơn Insert > Keyfra
Trang 1TWEEN HÌNH CHUYỂN ĐỘNG
Trong bài tập này các bạn sẽ được hướng dẫn cách tạo một đối tượng chuyển động bằng cách Tween hình Đây là phần mở đầu cơ bản mà các bạn khi thiết kế hoạt hình trên Flash cần phải quen thuộc Trong bài tập này các bạn sẽ tạo một vòng tròn có màu di chuyển từ trái sang phải
Các bước được tiến hành như sau:
1 Khởi động chương trình Flash, nhấp chuột vào Start > Programs > Macromedia
Flash 5 > Flash 5.
2 Cửa sổ làm việc xuất hiện và mở file mới có tên là Movie1 Con trượt trên thanh thước Timeline đang ở keyframe thứ nhất trên Layer1
Giáo trình Macromedia Flash: Hướng dẫn tạo mặt nạ hình
trịn màu cho layer
Trang 2GIÁO TRÌNH THIẾT KẾ WEB : PHẦN BÀI TẬP – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH CHƯƠNG 14
3 Chọn trên trình đơn File > Save hay Save As Sau đó nhấp chuột vào mục File
name trong hộp thoại Save As và đặt tên cho file mới là “Tween -1” Sau khi nhập xong nhấp chuột vào nút Save
4 Bây giờ bạn hãy nhấp chuột vào công cụ Oval Tool từ bảng công cụ hoặc nhấn
phím O trên bàn phím để kích hoạt công cụ vẽ này Sau đó nhấp chuột vào cửa sổ màn hình làm việc và kéo chuột cho đến khi bạn tạo vòng tròn vừa ý Con trỏ chuột sẽ biến đổi thành hình tròn và chữ thập
5 Bạn có thể chọn màu để tô màu hoặc muốn đổi màu cho vòng tròn thì nhấp chuột
vào hộp màu Fill Color chọn một màu và tô màu cho đối tượng Giả sử ở đây
chúng ta chọn màu xanh (Blue) có trong bảng màu
.
Trang 36 Nhấp chuột chọn công cụ Arrow Tool trong hộp công cụ hay nhấn phím V trên
bàn phím Sau đó bạn nhấp đúp chuột vào đối tượng vòng tròn để chọn cả đường viền vòng tròn
7 Lúc này trên Timeline ở khung keyframe, vạch màu đỏ tượng trưng cho vị trí đầu đang phát ở tại keyframe thứ nhất Bạn hãy nhấp chuột vào keyframe thứ nhất trên Layer1 này
8 Chọn trên trình đơn Insert > Create Motion Tween Đối tượng xuất hiện đường
khung màu xanh nhạt bao quanh đối tượng cùng với dấu cộng chính giữa vòng tròn
Trang 4GIÁO TRÌNH THIẾT KẾ WEB : PHẦN BÀI TẬP – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH CHƯƠNG 14
Chú ý : Bạn phải nhấp chuột tương ứng với Layer hiện hành đang được chọn Bạn không nên nhấp chuột lên phía trên hoặc xuống phía dưới
10 Bây giờ bạn chọn trên trình đơn Insert > Keyframe hoặc nhấn phím F6 để tạo
đường chuyển động cho đối tượng Sau đó trên Layer1 hiện hành có đường mũi tên từ keyframe thứ nhất hướng đến keyframe 30 xuất hiện
Chú ý : Để di chuyển vòng tròn chạy theo phương nằm ngang (hay một phương nào khác chính xác hơn) bạn nên cho xuất hiện các ô lưới trên màn hình làm việc bằng cách chọn trên trình đơn
View > Grid > Show Grid hay nhấn phím Ctrl + phím dấu nháy đơn (‘)
.
Trang 511 Bây giờ bạn hãy nhấp chuột vào keyframe cuối cùng trên thanh thước Timeline Sau đó kéo vòng tròn đến vị trí mới nơi mà bạn muốn đối tượng dừng chuyển động
Chú yù : Nếu bạn muốn vị trí mới nằm ngang cùng thẳng hàng so với điểm ban đầu, bạn nhớ
nhấn thêm phím Shift trong khi di chuyển vòng tròn
Vòng tròn ở vị trí đầu (bên trái) và vị trí cuối chuyển động
12 Cuối cùng bạn nhấn phím Enter ở bàn phím hay nhấn nút Play trên thanh công cụ
Controller để xem kết quả vừa thực hiện Nếu vòng tròn diễn hoạt từ điểm đầu đến điểm cuối là bạn đã thành công
Trang 6GIÁO TRÌNH THIẾT KẾ WEB : PHẦN BÀI TẬP – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH CHƯƠNG 14
TẠO HAI VÒNG TRÒN CHUYỂN ĐỘNG
NGƯỢC CHIỀU NHAU
Bài tập này cũng tương tự như bài tập 1 nhưng ở đây tạo hai vòng tròn chạy ngược chiều nhau Trong bài tập 1 ta đã tạo vòng tròn màu xanh chạy từ trái sang phải, bây giờ các bạn tiếp tục làm theo các bước sau để tạo vòng tròn màu đỏ chạy ngược lại từ phải sang trái
1 Mở lại file vừa lưu với tên file là Tween-1 trong bài vừa mới thực hành ở trên
2 Tạo mới thêm một Layer nữa bằng cách chọn trên trình đơn Insert > Layer hay
nhấp chuột vào nút dấu cộng bên dưới tên Layer trong thanh thước Timeline
3 Layer2 xuất hiện vùng bôi đen cho biết nó đang hiện hành và bây giờ bạn sẽ làm việc trên Layer2 này Nhấp chuột vào keyframe thứ nhất trên Layer2
4 Bạn vẫn chọn công cụ Oval Tool trong hộp công cụ Sau đó nhấn giữ phím Shift
trong khi vẽ 1 vòng tròn màu đỏ tại góc phải dưới vùng làm việc
5 Các bước tiến hành tạo chuyển động cho vòng tròn đỏ từ phải sang trái tương tự như bài tập ở trên Nhấp chuột vào keyframe thứ nhất trên Layer2 và chọn trên
.
Trang 7Nhấp chuột vào keyframe thứ nhất trên Layer2
6 Nhấp chuột vào keyframe cuối cùng trên Layer2 (keyframe 30) Sau đó nhấp chuột vào vòng tròn màu đỏ và kéo sang trái
7 Cuối cùng bạn nhấn phím Enter hay chọn trên trình đơn Control > Play hay chọn
Control > Test Movie để diễn hoạt đoạn phim trong Flash Player
Trang 8GIÁO TRÌNH THIẾT KẾ WEB : PHẦN LÝ THUYẾT - TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH CHƯƠNG 7
3 Nhấp chuột vào nút Insert Layer để tạo ra
một Layer mới
4 Nhấp chuột vào Layer mới và chọn trên
trình đơn Edit > Paste Frames
Xoá Layer:
1 Chọn Layer muốn xoá
Bạn có thể thực hiện một trong những cách sau đây:
• Nhấp chuột vào nút Delete Layer trong thanh thước Timeline
• Kéo Layer vào nút Delete Layer
• Nhấp phải chuột (trong Windows) hoặc nhấp Control (trong Macintosh) vào tên Layer và chọn lệnh Delete
Layer trong trình đơn
Khoá hoặc mở khoá một hay nhiều Layer, bạn có thể thực hiện một trong những cách sau đây:
Nhấp chuột vào cột Lock bên phải tên của Layer để khoá Layer đó Nhấp chuột vào cột Lock một lần nữa để mở khoá cho Layer đó
♦
Nhấp chuột vào biểu tượng cái móc khoá để khoá tất cả các Layer và nhấp chuột vào móc khoá một lần nữa để mở khoá Kéo chuột qua cột Lock để khoá hay mở
♦
.
Trang 9Nhấn phím Alt và nhấp chuột (trong
Windows) hay phím Option (trong
Macintosh) vào trong cột Lock bên
phải tên Layer để khoá tất cả các
Layer khác Nhấn phím Alt và nhấp
chuột hoặc nhấn Option và nhấp vào
trong cột Lock một lần nữa để mở
khoá tất cả các Layer
♦
Thay đổi trật tự của các Layer : Kéo một hay nhiều Layer trong thanh thước Timeline
CÁCH DÙNG GUIDE LAYER
Để trợ giúp trong khi vẽ, bạn có thể dùng
Guide Layer Bạn có thể tạo bất kỳ Layer nào
để trở thành Guide Layer Các Guide Layer
được chỉ ra bởi biểu tượng Guide bên trái tên
Layer Các Guide Layer không xuất hiện khi
bạn xuất đoạn phim Flash Player
Ngoài ra bạn có thể tạo ra một Guide Layer chuyển động để điều khiển quá trình chuyển động của một đối tượng trong vùng chuyển động Tweened Animation Bạn có thể tham khảo mục “Đường dẫn chuyển động Tween Motion” để biết thêm chi tiết
Chú Ý: Kéo một Layer bình thường vào trong Guide Layer chuyển đổi Layer đó trở thành Guide Layer chuyển động Để tránh việc chuyển đổi tình cờ này, bạn hãy kéo tất cả các Guide Layer xuống bên dưới cùng trong bảng trật tự Layer
Đặt tên Layer là
Guide Layer:
Chọn Layer và
nhấp phải chuột (trong
Windows) hoặc nhấn
Control (trong Macintosh),
sau đó chọn lệnh Guide
trong trình đơn Chọn lại
lệnh Guide lần nữa để
Trang 10GIÁO TRÌNH THIẾT KẾ WEB : PHẦN LÝ THUYẾT - TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH CHƯƠNG 7
Để tạo ra một Mask
Layer, bạn đặt đối tượng được tô
màu trong một Layer Mask
Layer sẽ phát hiện ra vùng được
liên kết, các Layer nằm bên
dưới đối tượng được tô màu và
nó dấu tất cả các vùng khác
Nội dung của Mask
Layer có thể là một đối tượng
độc lập hay một Instance (Mask
Layer trong Flash cung cấp các
chức năng tương tự như lệnh
Paste Inside trong FreeHand.)
Tạo ra một Mask Layer:
1 Chọn hoặc tạo một Layer có nội dung sẽ hiển thị xuyên qua các lỗ trong mặt nạ
2 Với Layer mớiø vừa tạo, hãy chọn nó, bạn hãy chọn trên trình đơn Insert > Layer để
tạo ra một Layer mới thứ hai ở trên nó Một Mask Layer luôn có lớp mặt nạ bên dưới nó ngay lập tức Vì vậy bạn phải chắc chắn rằng tạo Mask Layer trong vị trí đúng
3 Vẽ đối tượng tô màu hoặc tạo ra một Instance tại
Layer thứ hai này của một biểu tượng trong Mask
Layer Flash sẽ bỏ qua chế độ ảnh màu Bitmap,
màu Gradient, màu trong suốt (Transparency) và
các loại đường thẳng trong một Mask Layer Bất
kỳ vùng màu tô nào cũng sẽ trở thành trong suốt
trong chế độ Mask, vùng không tô màu sẽ trở nên
mờ đi
4 Nhấp phải chuột (trong Windows) hoặc nhấn
Control (trong Macintosh) vào tên của Mask
Layer trên thanh thước Timeline và chọn lệnh
Mask trong trình đơn
Layer này được chuyển đổi sang Mask Layer
được chỉ định bằng biểu tượng hình mũi tên chỉ
xuống Layer bên dưới ngay lập tức được kết nối
đến Mask Layer và nội dung hiển thị xuyên qua
vùng màu tô trong mặt nạ Tên của Layer có lớp
mặt nạ thụt vào và biểu tượng thay đổi sang mũi
tên chỉ xuống sang phải
Sau đó để hiển thị hiệu ứng mặt nạ này trong Flash, bạn hãy khoá toàn bộ Mask
.