GIÁ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 8. Chọn tiếp trên trình đơn Modify > Break Apart hoặc nhấn phím tổ hợp Ctrl + B để tách mối liên kết các ký tự này. 9. Bây giờ bạn sẽ dùng màu tô cho ký tự. Dùng công cụ Brush, nhấp chuột chọn tiếp công cụ Brush Mode trong hộp công cụ. Nhấp chuột vào vùng công cụ Bush Mode. 10. Chọn công cụ Paint Inside trong mục tùy chọn Options tại mục Brush Mode. Sau đó chọn màu đỏ trong hộp màu Fill Color. 11. Nhấp chuột tiếp vào mục Brush Size để chọn cọ tô màu cho phù hợp. Để dễ dàng tô màu cho chữ ta nhấp chọn công cụ Zoom Tool để phóng to kích thước ký tự. 12. Sau khi thực hiện xong các thao tác trên, ta tiến hành tô màu cho chữ. Bạn bắt đầu tô tại keyframe thứ 3 trên Layer1. Hai keyframe đầu tiên không có gì thay đổi, bạn nhấn phím F6 để tạo ra keyframe thứ 2. Chú ý : Bạn phải tô màu cho ký tự từ trong ra ngoài và tô từng đoạn ngắn trên mỗi kí tự. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 312 GIÁ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 13. Khi bạn tô được đoạn nào, hãy dùng công cụ Arrow Tool nhấp chuột chọn đoạn đó. Sau đó vào trình đơn Modify > Group hoặc nhấn tổ hợp phím Ctrl + G để nhóm từng đoạn màu tô này. Chọn đoạn ký tự vừa tô Nhóm vùng tô sau khi chọn 14. Khi bạn thực hiện việc tô từng đoạn, sau đó chọn và nhóm đoạn tô màu này như thế nhằm cô lập từng đoạn màu tô. Bạn tiếp tục thực hiện các bước như trên cho đến khi vùng màu cho chữ “ DIRECTOR” kết thúc . Chú ý: Trong khi tô màu cho từng đoạn và nhóm các đoạn này trên mỗi ký tự. Các đoạn này phải nằm trên từng frame riêng biệt. Bạn có thể nhấn phím F6 hoặc chọn trên trình đơn Insert > Keyframe để tạo theo cách frame-by-frame. Bạn hãy chú ý thật kỹ vào công cụ hộp màu Fill Color sau mỗi bước nhấn phím F6 tạo keyframe mới, công cụ này sẽ chuyển sang màu xanh. Do đó bạn phải chọn lại màu đỏ để tô các ký tự có cùng màu. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 313 GIÁ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 15. Lúc bây giờ các ký tự trên chữ “ Director ” có màu đỏ và được hình thành bởi nhiều đoạn màu tô. Tô màu trên ký tự E tại keyframe thứ 52 Chú y ù: Một lần nữa khi bạn tô màu cho mỗi đoạn trên một ký tự, bạn phải tô màu từ trong ra ngoài. Cách thực hiện như thế màu tô mới có thể nằm gọn vào trên từng đoạn. Khi bạn tô màu kết thúc một đoạn ký tự nào đó, bạn phải để một keyframe tiếp theo sau nó không được tô. Ví dụ như khi bạn tô màu xong vùng ký tự D, sau đó đến ký tự I. Trước khi bắt đầu tô màu ký tự I, bạn phải để keyframe này không được tô màu gì hết. Sau đó mới bắt đầu thực hiện tiếp việc tô màu cho ký tự I. Nếu bạn tô màu mà thấy rằng lớp màu vừa tô nằm bên dưới đoạn cần tô hay nằm bên dưới lớp ký tự thì bạn phải tiến hành tô lại thao tác vừa thực hiện. Tô màu trên ký tự T tại keyframe thứ 52 TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 314 GIÁ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 Chuổi ký tự sau khi việc tô màu kết thúc 16. Bây giờ bạn sẽ chèn biểu tượng cây viết vào vùng làm việc hiện hành bằng cách chọn trên trình đơn Help > Samples > Writing Pen trong Flash 4 hoặc bạn có thể vẽ một cây bút rất đơn giản . 17. Nếu bạn có Flash 4 , hãy kích hoạt file này và chọn cây viết mẫu Writing Pen bằng cách vào trình đơn Window > Library (hoặc nhấn tổ hợp phím Ctrl + L ) cửa sổ nhỏ Library xuất hiện. Tại mục Name , nhấp phải chuột vào chọn mục Pen, xuất hiện biểu tượng cây viết trong vùng xem trùc tại cửa sổ thư viện. 18. Chọn trên trình đơn Insert > Layer để tạo một Layer mới và đặt tên cho Layer này là Layer Cay Viet. Sau đó kéo biểu tượng cây viết vào trong vùng làm việc tại file đang thực hiện đoạn phim. Bây giờ bạn sẽ thấy cây viết xuất hiện trong vùng làm việc với kích thước quá lớn so với vùng làm việc. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 315 GIÁ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 Đối tượng cây viết xuất hiện trong vùng làm việc 19. Đảm bảo rằng đối tượng cây viết đang được chọn. Bây giờ bạn sẽ bắt đầu hiệu chỉnh cây viết cho phù hợp với kích thước vùng làm việc. Chọn công cụ Arrow Tool trên hộp công cụ và nhấp chuột vào chọn công cụ Scale trong vùng công cụ bổ sung bên dưới tại mục Options. 20. Sau đó bạn kéo các handle điều khiển tại các góc đối tượng đang được chọn để có được kích thước đối tượng thích hợp. Cây viết sau khi được thay đối kích thước TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 316 GIÁ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 21. Di chuyển biểu tượng cây viết sao cho ngòi viết nằm chính xác tại điểm bắt đầu của chuỗi ký tự tại keyframe thứ nhất trên Layer Cay Viet. Sau đó nhấn phím F6 để tạo ra keyframe thứ 2. Chú y ù : Bạn có thể dùng công cụ Arrow Tool , chọn công cụ Rotate trong mục chọn Options bên dưới bảng công cụ. Sau đó bạn có thể xoay cây viết này theo vò trí mong muốn. Hơn thế nữa bạn muốn tạo cho cây viết chuyển động uyển chuyển khi diễn hoạt chúng trong Flash Player. 22. Di chuyển cây viết đến vò trí bắt đầu vùng màu tô trên ký tự tại keyframe thứ 2 trên Layer Cay Viet. 23. Bây giờ bạn nhấn phím F6 tiếp tục để tạo mới keyframe thứ 3. Di chuyển ngòi viết đến vò trí kết thúc vùng màu tô thứ nhất trên ký tự đầu tiên của chữ “ DIRECTOR ”. Sau đó nhấn phím F6 tiếp tục để tạo ra keyframe thứ 4. Bạn cũng di chuyển ngòi viết đến vò trí kết thúc đoạn tô màu thứ 2. Trong khi đó bạn có thể xoay cây viết theo hướng thích hợp mong muốn. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 317 GIÁ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 Ngòi viết tại vò trí kết thúc đoạn tô màu thứ nhất (ảnh trái) trong keyframe thứ 3 và đoạn tô màu thứ hai tại keyframe thứ 4 (ảnh phải) 24. Bạn lặp lại bước 23 ở trên cho các keyframe tiếp theo cho đến hết chuỗi ký tự. Chú ý : Trong quá trình tạo các hành động cho đối tượng, bạn nên chú ý đến việc chỉnh sửa góc độ của ngòi viết sao cho phù hợp với từng nét chữ trên vùng màu tô khi chúng thể hiện trên đoạn phim. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 318 GIÁ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 8 CÁCH DÙNG CÁC SYMBOL VÀ INSTANCE TỔNG QUAN VỀ CÁCH DÙNG CÁC SYMBOL VÀ INSTANCE Một Symbol là một ảnh đồ họa, nút hay một đoạn Movie Clip mà bạn tạo ra và sau đó dùng lại trong đoạn phim này và các đoạn phim khác. Bất kỳ Symbol nào bạn tạo ra sẽ tự động trở thành một phần trong thư viện. Một Instance (sự kiện) là một bản sao của Symbol nằm trong vùng Stage hoặc lồng trong một Symbol khác. Một Instance có thể khác nhau về màu sắc, kích thước và chức năng so với Symbol của nó. Khi bạn hiệu chỉnh một Symbol, tất cả các Instance của Symbol này sẽ được cập nhật. Nhưng khi bạn hiệu chỉnh một Instance của một Symbol thì chỉ có Symbol đó được cập nhật. Chú ý : Bạn có thể tạo ra các Symbol font trong Flash. Việc sử dụng các Symbol trong đoạn phim sẽ làm giảm kích thước file. Việc lưu nhiều Instance của một Symbol đòi hỏi tốn ít khoảng trống hơn việc lưu một vùng mô tả của một thành phần cho mỗi sự kiện. Chẳng hạn như bạn có thể làm giảm kích thước file của đoạn phim nếu bạn chuyển đổi các ảnh tónh như ảnh nền Background thành các Symbol mà sau đó bạn sẽ dùng lại. Ngoài ra việc sử dụng các Symbol có thể làm làm chuyển động nhanh đoạn phim phát lại vì một Symbol cần được tải xuống trong trình duyệt chỉ một lần. Ngoài ra việc sử dụng các Symbol có thể cho phép bạn chia sẽ các ảnh và các thành phần khác như đoạn Movie Clips hoặc âm thanh trong Flash movies. Bạn có thể nhóm các Symbol vào trong một Shared Library và kết nối đến các mục trong Shared Library từ bất kỳ Flash movies nào mà không cần phải nhập vào các mục Item vào trong đoạn phim. Để biết thêm về cách dùng các Symbol và Instance, bạn hãy chọn trên trình đơn Help > Lessons > Symbols để biết thêm chi tiết (bằng tiếng Anh) hay xem giáo trình thiết kế Web : Phần bài tập –Tự học Macromedia Flash bằng hình ảnh. Một Symbol trong thư viện và hai Instance trong vùng Stage TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 165 GIÁ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 8 CÁC LOẠI HÀNH VI (BEHAVIOR) CỦA SYMBOL Mỗi Symbol có một Timeline và Stage duy nhất. Khi bạn tạo ra một Symbol, bạn chọn cho Symbol đó có hành vi như thế nào phụ thuộc vào khi bạn dùng nó trong đoạn phim. Dùng các Graphic Symbol (biểu tượng đồ họa) đối với các ảnh tónh và tạo ra các bộ phận chuyển động có thể sử dụng lại được liên kết đến Timeline của đoạn phim chính. Những Graphic Symbol hoạt động đồng bộ với Timeline của đoạn phim chính. Các điều khiển và âm thanh tương tác sẽ không hoạt động trong một Graphic Symbol chuyển động. Sử dụng các Symbol nút (Button Symbol) để tạo ra các nút tương tác khi nhấp chuột, cuộn hoặc các hành động khác. Bạn xác đònh ảnh đồ họa kết hợp với nhiều trạng thái nút khác nhau và sau đó gán hành động cho Instance nút này. Dùng các Symbol Movie Clip để tạo ra các bộ phận chuyển động. Các Movie Clip có nhiều frame riêng biệt trong Timeline và chúng diễn hoạt độc lập với Timeline của đoạn phim chính — Bạn có thể nghó rằng chúng chỉ là các đoạn phim nhỏ nằm bên trong một đoạn phim chính, có thể có các điều khiển tương tác, âm thanh và ngay cả các Instance khác của Movie Clip. Ngoài ra bạn cũng có thể đặt các Instance của Movie Clip vào bên trong Timeline của một Symbol nút để tạo ra các nút chuyển động. Bạn có thể gán các Clip Parameter (các biến giá trò) vào một Movie Clip để tạo ra một đoạn “Smart” Clip (Clip thông minh). Ngoài ra bạn cũng có thể thêm các Action cho Clip và các tập lệnh (Script) vào Smart Clip để tạo ra các thành phần giao diện như — Các nút Radio, trình đơn xổ xuống hoặc các lời chú thích cho công cụ (Tooltip) đáp lại khi bạn nhấp chuột hoặc dùng các sự kiện khác. Để biết rõ hơn về phần này, bạn có thể xem mục trợ giúp Action Script Help. Chú ý : Các Symbol Movie Clip chuyển động sẽ không hoạt động trong môi trường Flash Authoring. Để xem được các Symbol Movie Clip chuyển động này bạn hãy chọn trên trình đơn Control > Test Movie hoặc trình đơn Control > Test Scene . TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 166 GIÁ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 8 TẠO RA CÁC SYMBOL Bạn có thể tạo ra các Symbol từ các đối tượng đã chọn trong vùng Stage hoặc có thể tạo ra một Symbol rỗng hoặc nhập vào nội dung trong chế độ Symbol-editing. Các Symbol có thể có tất cả các chức năng mà bạn tạo ra trong Flash bao gồm chức năng chuyển động. Bằng cách dùng các Symbol chuyển động, bạn có thể tạo ra nhiều đoạn phim chuyển động trong khi kích thước file rất nhỏ. Bạn phải cân nhắc việc tạo ra các Symbol chuyển động khi có một Action lập lại hay tuần hoàn liên tục chẳng hạn như con chim bay lên và xuống. Tạo ra một Symbol mới với đối tượng được chọn: 1. Chọn một hay nhiều đối tượng trong vùng Stage và chọn trên trình đơn Insert > Convert to Symbol . 2. Trong hộp thoại Symbol Properties, nhập vào tên của Symbol và chọn mục Behavior cho Symbol đó như : Movie Clip, Button hay Graphic. 3. Chọn xong nhấp OK. Flash sẽ thêm Symbol vào trong thư viện. Vùng chọn trong vùng Stage trở thành một Instance của Symbol. Bạn không thể hiệu chỉnh trực tiếp đối tượng trong vùng Stage được nữa mà bạn phải mở nó trong chế độ Symbol-editing. Bạn có thể xem mục “Hiệu chỉnh các Symbol” để biết thêm chi tiết. Tạo ra một Symbol rỗng mới: 1. Đảm bảo rằng không có đối tượng nào được chọn trong vùng Stage và bạn có thể thực hiện một trong những thao tác như sau: Chọn trên trình đơn Insert > New Symbol. Nhấp chuột vào nút New Symbol tại góc trái phía dưới trong cửa sổ Library. Chọn lệnh New Symbol trong trình đơn Library Options tại góc phải phía trên trong cửa sổ Library. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 167 . sang màu xanh. Do đó bạn phải chọn lại màu đỏ để tô các ký tự có cùng màu. TỦ SÁCH STK – THẾ GIỚI ĐỒ HỌA BIÊN SOẠN : KS PHẠM QUANG HUY 31 3 GIÁO TRÌNH THIẾT KẾ WEB : PHẦN BÀI TẬP – TỰ HỌC MACROMEDIA. HUY 31 7 GIÁ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 Ngòi viết tại vò trí kết thúc đoạn tô màu thứ nhất (ảnh trái) trong keyframe thứ 3 và. nhóm đoạn tô màu này như thế nhằm cô lập từng đoạn màu tô. Bạn tiếp tục thực hiện các bước như trên cho đến khi vùng màu cho chữ “ DIRECTOR” kết thúc . Chú ý: Trong khi tô màu cho từng đoạn