TÌM HIỂU CÔNG CỤ macromedia Flash MX

Macromedia Flash MX là các ứng dụng multimedia (đa phương tiện ) cho phép các nhà thiết kế tạo ra các ứng dụng, các bản trình diễn, hoạt hình, website…với nội dung phong phú, hấp dẫn. Các ứng dụng này được tạo bằng cách tích hợp ảnh, hình vẽ, âm thanh, video và văn bản. Tập tin kết xuất từ Flash hiển thị được trên hầu hết các hệ điều hành máy tính, thiết bị cầm tay, điên thoại và tivi. Người dùng dễ dàng xem được Flash trên máy tính bởi trình thể hiện Flash Player.

ĐỀ TÀI : TÌM HIỂU CÔNG CỤ macromedia Flash MX

Lời nói đầu

Macromedia Flash MX là các ứng dụng multimedia (đa phương tiện ) cho phép các nhàthiết kế tạo ra các ứng dụng, các bản trình diễn, hoạt hình, website…với nội dung phongphú, hấp dẫn Các ứng dụng này được tạo bằng cách tích hợp ảnh, hình vẽ, âm thanh, video

và văn bản Tập tin kết xuất từ Flash hiển thị được trên hầu hết các hệ điều hành máy tính,thiết bị cầm tay, điên thoại và tivi Người dùng dễ dàng xem được Flash trên máy tính bởitrình thể hiện Flash Player

Qua từng phần , bạn sẽ thực hiện các thao tác tạo nút nhấn, liên kết, hoạt hình, định dạngvăn bản, tải dữ liệu vào ứng dụng …cho đến hoàn thành việc xây dựng một đoạn phim hoạthình,một website Điều này sẽ giúp bạn nắm được các đặc điểm và các công cụ chính trongFlash và trên cơ sở đó phát triển các kĩ năng cho riêng mình

Trong đây là những tìm hiểu của em về Macromedia Flash MX Mong rằng qua đây em

sẽ có cái nhìn tổng quan về Flash áp dụng được các ứmg dụng của công cụ này

Mục lục

Lời nói đầu

Phần 1:Giới thiệu về Flash

Phần 2: Tạo đồ họa

Phần 3: Sử dụng văn bản

Phần 4: Tạo và chỉnh sửa biểu tượng

Phần 5: Tạo hoạt hình

Phần 6: Bổ xung tương tác cơ bản

Phần 7: Bổ xung âm thanh và video

Phần 8: Sử dung Screen

Phần 9: Tạo biểu mẫu bằng cách dùng thành phần

Phần 10: Kết hợp dữ liệu động

Phần 11: Tối ưu nội dung Flash

Phần 12: Xuất bản hồ sơ Flash

Phần 1: Giới thiệu về Flash

Flashlà một ứng dụng được thiết kế tốt để xây dựng tập tin multimedia(đa phương tiện).

Bạn có thể đưa nhiều loại media vào trong Flash gồm :văn bản, đồ họa, video, các tập tinvector, PFD và âm thanh

Bạn có thể tải các tập tin SWF , hình ảnh văn bản và các tập tin videovào trong Flash khi

nó đang chạy với một trình thể hiện Flash Player.Trình thể hiện Flash Player cho phép bạnkết nối các tập tin SWF với cơ sở dữ liệu, tập tin XML hoặc với một Web Service

Công cụ đa dạng trong Flash cho phép bạn phát huy hết khả năng sáng tạo cửa mình Flash điều tiết và hợp nhất giữa thiết kế và phát triển

Tại sao Flash lại hữu dụng

Các tập tin SWF có thể được xem rộng rãi nhờ vào việc phân phối trình thể hiện

Trình thể hiện Flash Player dễ dàng tải xuống và cập nhật các phiên bản mới

Vùng làm việc của Flash

Vùng làm việc của Flash còn gọi là môi trường sáng tác , gồm một loạt các bảng điềukhiển được bố trí xung quanh Stage (vùng sáng tác)

Các tập tin Flash được dựa trên bảng tiến trình

• Menu :cũng giống như các menu trong các phần mềm khác ,gồm các lệnh phổ biến

như Save, Copy, Paste và Help với các lệnh riêng của phần mềm

• Bảng tiến trình : các tập tin SWF có thể được thể hiện trên một bảng tiến trình.

Một bảng tiến trình gồm một loạt các khung hình nằm trong một hàng Các khunghình có thể là trống, có thể chứa nội dung hoặc là một khung hình khóa Một contrỏ khung hình được để di chuyển qua lại trong bảng tiến trình và chọn khung hìnhkhi bạn làm việc

• Bảng điều khiển : giúp bạn kết hợp các hồ sơ Flash với nhau Bảng điều khiển

Tool chứa một số lớn công cụ để chọn , tạo hoặc chỉnh sửa nội dung trong hồ sơ

• Stage :là vùng trông thấy được trong ứng dụng của bạn Là nơi đặt các media

như :đồ họa, nút nhấn, hoạt hình và các trường tương tác trên biểu mẫu

• Các thẻ hồ sơ và thanh soạn thảo : các thẻ hồ sơ giúp bạn di chuyển qua lại giữa

các hồ sơ đã được mở trong Flash Thanh soạn thảo các thẻ hồ sơ giúp bạn dichuyển qua lại giữa các phần tử của tập tin

• Bảng kiểm soát Property : là bảng điều khiển theo ngữ cảnh, hiển thị các thông tin

và các thuộc tính có thể chỉnh sửa

Tạo hồ sơ Flash

• Mở Flash :nhấn đúp biểu tượng Flash

• Tạo hồ sơ Flash :nhấp vào lien kết Flash Document

• Khi bạn tạo ra một hồ sơ Flash mới , hồ sơ sẽ mở ra các thông số mặc định, bạncũng có thể thay đổi các thông số này

Làm việc với bảng điều khiển

Bảng điều khiển giúp bạn biết được những gì mà bạn có thể tạo ra và thao tác trongFlash Tùy từng bảng mà bạn có những chức năng khác nhau phục vụ cho công việc củamình

Thao tác trên bảng :

• Chọn file>Open và mở hồ sơ

• Chọn file>Save As và lưu lại một phiên bản mới

• Mở bảng điều khiển để them giao diện người dùng

• Gắn bảng điều khiển Color Mixervới vùng làm việc Flash bằng con trỏGripper

• Thu nhỏ bảng điều khiển Color Mixer

• Phóng to bảng điều khiển Component và xem menu Options của bảng

• Bổ xung thành phần Buttonvào hồ sơ tư bảng Component

hồ sơ Flash Các khung hình có thể đặt trồng lên nhau nếu bạn sử dụng nhiều lớp Phần lớn

hồ sơ Flash có nhiều bảng tiến trình

Thao tác trên bảng tiến trình:

• Chọn Window>Timeline mở bảng tiến trình

• Kéo dài vùng tên lớp để xem tên lớp

• Chọn một chế đọ thể hiện khung hình khác từ Menu pop-up

• Tạo ra một khung hình và khung hình khóa bằng chọnInsert>Timeline>Keyframe

• Chọn, di chuyển, xóa khung hình bằng sử dụng con trỏ chuột và phím Shifl

• Xóa thành phần Button và các khung hình

• Lưu lại các thay đổi bằng File>Save

• Chọn SaveAs và lưu lại phiên bản mới là bookstore3.fla

• Chọn lớp Background và kéo thành phần Button từ Component vào Stage

• Chọn Control>Test Movie từ menu chính để thử tập tin FLA

• Đóng môi trường thử nghiệm

• Chọn File>Publish để xuất bản tập tin FLA và tìm nó trên ổ cứng của bạn

• Nhấn đúp vào tập tin bookstore3.htlm và nhấn đúp vào tập tin

Thao tác với một lớp:

• Mở bảng tiến trình bằng chọn Window>Timeline từ menu chính

• Đặt lại tên lớp

• Thêm một lớp mới bằng chọn Insert Layer

• Thêm nhãn khung hình cho lớp

• Khóa khung hình bằng nút Lock Layer

• Tạo ra một thư mục mới bằng nút New layer Folder

• Tạo một lớp mới bằng công cụ Rectangle và Oval

• Tạo ra một định dạng trên lớp

• Thay đổi thứ tự của lớp

• Lưu lại các thay đổi

• Thay On Launch thành Last Documents Open và kiểm tra thông số thẻGeneral

• Thay đổi mức Undo thành 150 trong thẻ General

• Thay đổi cac thông số mặc định trong thẻ Editing

• Chọn Edit>Customize Tools Panel để tùy biến bảng điều khiển Tool

Bảng điều khiển Tool

Có bốn phần chính: Tool, View, Color, Options

Bảng điều khiển Tool chứa các công cụ chọn , thao tácđồ họa và thay đổi chế độ thể hiệncủa Stage

Các nút công cụ trong Tool cho phép bạn thao tác : tô, vẽ, chọn màu tô, vẽ, sử dụng hìnhảnh vector và bitmap

Tạo đồ họa với các công cụ vẽ

Sử dụng các công cụ vẽ cơ bản để tạo ra hình dạng trên Stage

Thao tác cơ bản:

• Mở tập tin

• Chọn màu tô, màu vẽ

• Thay đổi kích thước hình vẽ cho phù hợp

• Tạo đồ họa bằng công cụ Oval

• Lưu hồ sơ Flash

Tạo đồ họa mới

Một biểu tượng đồ họa là một hình ảnh tĩnh được sử dụng nhiều lần trong tập tin FLACác thao tác tạo ra một biểu tượng đồ họa:

• Mở tập tin

• Tạo biểu tượng mới bằng chọn Insert>New Symbol

• Phóng to Stage và thiết lập đường dẫn

• Tạo đường dẫn cách nhau 1pixel

• Tạo ra hình nền bằng công cụ Rectangle

• Lưu lại tập tin

Tạo và sử dụng mặt nạ

Mặt nạ cho phép bạn giấu và để lộ một số phần của Stage Bạn thấy những gì trong vùngmặt nạ che phủ còn những vùng chưa được che phủ sẽ bị ẩn các mặt nạ được tạo ra bằngcách thiết lậpmột lớp thành lớp mặt nạ - các mục bạn tạo trên lớp này sẽ trở thành mặt nạcho bất kì những gì nằm trong các lớp nằm phía dưới được gắn kết với nó

Thao tác tạo mặt nạ :

• Bổ xung các đường dẫn vào Stage chính bằng cách kéo các đường dẫn từcác thước đo nằm ngang và thẳng đứng

• Tạo một hình chữ nhật trên một lớp mới sau đó chuyển nó thành mặt nạ

• Khóa và ẩn lớp, sau đó xóa các đường dẫn

Bổ xung các nét vẽ

Có nhiều cách để thao tác nét vẽ bằng cách sử dụng Flash Hãy chọn một kiểu nét vẽtrong Menu và sau đó các menu thả xuống sẽ xuất hiện , cho phép bạn tùy biến nét vẽ.Thao tác bổ xung nét vẽ :

• Chèn một lớp mới và tạo một hình chữ nhật khác

• Thay đổi kích thước và vị trí của hình chữ nhật

• Thay đổi hình chữ nhật thành biểu tượng và khóa lớp

Sử dụng thư viện

Thư viện (library) chứa các biểu tượng và các mục mà bạn sử dụng trong tập tin FLA.Bạn có thể xem, đổi tên,hoặc chỉnh sửa các thuộc tính của các thành phần trong thư viện bạn cũng có thể bổ xung các mục mới vào Stage từ Library

Thao tác với Library và cách tạo thư mục để tổ chức các phần tử mà ta đưa vào hồ sơ:

• Chọn Window>Library ,mở bảng điều khiển

• Xóa thành phần Button ra khỏi Library

• Tạo thư mục Library mới,và đặt menubg_gr vào trong thư viện Graphics

• Mở menubg_gr từ Library

• Lưu lạ các thay đổi

Đưa vào và tối ưu hình ảnh Bitmap

Chúng ta đã có một số phần tử đồ họa trên Stage nhưng có một số hình ảnh khác cầnđược đưa vào để dùng cho các nút nhấn , logo, vùng tiêu đề Các hình ảnh này được tạo rabằng cách sử dụng một trình soạn thảo hình ảnh Như vậy ,đôi khi chúng ta cần sử dụngcác hiệu ứng và bộ lọc trong các chương trình khác và sau đó tích hợp đặc điểm này bằngcách đưa các tập tin vào trong Flash

Thao tác đưa tập tin bitmap trực tiếp vào Library ,kiểm tra thiết lập tối ưu cho hình ảnh:

• Chọn File>Import>Import to Library đưa vào 6 tập tin hình ảnh và tổ chứcchúng

• Kiểm tra thiết lập tối ưu cho hình ảnh đưa vào

• Đưa vào tập tin title.png từ CD và thay đổi thuộc tính nén của nó

• Đặt hình ảnh vào Stage và sử dụng bảng Property để nhập vào tọa độ đặthình ảnh

• Đưa hình ảnh logo vào trong Library và thay đổi thuộc tính của nó,đặt lênStage

Đưa vào các hình vẽ Vector

Bạn có thể đưa các hình vẽ vector phức tạp vào trong Flash Các hình ảnh vector co dãn

mà không làm mất đi chất lượng hình ảnh và không bị bóp méo khi thay đổi kích thước.Thao tác đưa vào hình ảnh vector :

• Tạo một hồ sơ Flash mới và thay đổi thuộc tính hồ sơ

• Đưa một tập tin vector tạo ra từ FreeHand vào trong tập tin Flash mới

• Canh các biểu tượng theo Stage

• Sao chép và dán biểu tượng vào một lớp mới

• Lưu lại tập tin và xuất bản tập tin

Thao tác đồ họa

Ngoài các thao tác trên ,ta còn có một số các thao tác để xoay, co giãn, nhuộm màu vàthay đổi độ trong suốt của các phần tử đồ họa

Thao tác đồ họa bằng cách sử dụng công cụ và bảng Property :

• Tạo một lớp mới bars và đưa biểu tượng bar_gr vào lớp này

• Kéo biểu tượng đồ họa bar_gr từ Library vào Stage và xoay nó

• Đặt biểu tượng bar_gr thứ 2 vào cuối Stage bằng bảng Align

• Thay đổi thuộc tính alpha và co dãn biểu tượmg glow_gr

• Dọn dẹp Library và khóa các lớp

• Lưu lại các thay đổi

Phần 3 : Sử dụng văn bản

Flash cho phép bạn có nhiều kiểm soát về loại văn bản mà bạn có thhể đưa vào một hồ sơ

và thiết lập các thuộc tính văn bản Ta sẽ xem xét bổ xung một số hiệu ứng cho trường vănbản tĩnh

Sử dụng công cụ Text

Trong Flash có ba dạng trường văn bản chính : văn bản tĩnh, động và nhập

Văn bản tĩnh tương tự như một hình ảnh hoặc đồ họa, nó hiển thị bất kì lọai văn bản nàotrên Stage và không thay đổi Trong đó văn bản động có thể thay đổi Văn bản nhập chophép người dùng nhập vào văn bản khi tập tin SWF đang chạy trong trình thể hiện FlashPlayer Có nhiều thuộc tính văn bản mà bạn có thể chỉnh sửa bằng cách sử dụng hộp kiểmsoát Property-nơi bạn có thể chọn phông chữ sử dụng , thiết lập màu ,kích thước và cácthuộc tính ảnh hưởng đến sự thể hiện của nó trên Stage

Tìm hiểu về văn tĩnh và phông chữ thiết bị

Khi bạn sử dụng văn bản tĩnh trong một tập tin FLA Flash sẽ tạo ra các đường nét củamỗi kí tự và sử dụng chúng để hiển thị văn bản Bạn cũng có thể chọn sử dụng phông chữthiết bị - sử dụng phông chữ thiết hệ thống cho văn bản thay vì dùng đường nét.Nhưng khi

sử dụng văn bản tĩnh ,nó sẽ làm tăng kích thước của tập tin SWF

Bổ xung văn bản vào hồ sơ

Bổ xung một số văn bản vào trong Stage Thao tác bổ xung một số văn bản tĩnh vào trongtập tin FLA :

• Mở tập tin từ thư mục và lưu lại nó với phiên bản mới

• Bổ xung một lớp cho văn bản tĩnh

• Tổ chức các lớp để tạo thành các trang của website

• Chọn Tool>Text để thay đổi các thuộc tính phông chữ trong bảng Property

• Bổ xung tên trang cho mỗi vùng của site bookstore bằng dùng văn bản tĩnh

• Thêm vào khẩu hiệu của website bằng văn bản tĩnh ở đầu vùng tiêu đề

• Bổ xung một trường văn bản Alias ở cuối Stage

• Canh trường văn bản trên Stage bằng cách dùng bảng điều khiển Align

• Bổ xung kiên kết cho địa chỉ thư điện tử bằng URL Linh trong bảngProperty

Sử dụng phông chữ nhúng

Bạn có thể chọn nhúng phông chữ nếu bạn muốn có nhiều kiểm soát về kích thước cũngnhư dạng thể hiện của văn bản động hoặc nhập Ngược với văn bản tĩnh , các trường vănbản động và nhập sử dụng phông chữ thiết bị theo mặc định , vì thế bất kì phông chữ nàobạn sử dụng cho trường văn bản cũng phải có trên hệ thống của người sử dụng bạn có thểgiải quyết vấn đề này bằng cách nhúng phông chữ vào trong tập tin SWF

Thao tác sử dụng phông chữ nhúng :

• Tạo trường văn bản động

• Mở hộp thoại Character Options

• Nhấp vào nút chọn lựa Specify Range

• Bỏ các chọn lựa phía dưới Specify Range và chỉ đưa vào các kí tự đặc biệt

• Nhấp nút Cancel và xóa trường văn bản

Các thuộc tính phông chữ

Trong Flash có rất nhiều tùy chọn về định dạng văn bản để làm thay đổi dạng thể hiệncủa nó Về cơ bản các phông chữ được chia thành hai nhóm chính : serif(phông chữ cóchân) và san-serif(phông chữ không chân)

Một số thuộc tính của phông chữ :

• Thiết lập thuộc tính cho văn bản địa chỉ thư điện tử trong bảng Property

• Nhập vào thông tin chứa và đặt nó lên Stage

• Định dạng các phần của thư điện tử trong bảng Property

• Chọn nút Alias text trong bảng Property

• Đảm bảo văn bản còn dễ đọc trên Stage

• Thay đổi thuộc tính cho tiêu đề trang bản đồ bằng bảng Property

• Nhập văn bản tiêu đề bản đồ và đặt nó lên Stage

• Thay đổi giá trị của Character Spacing thành 2

Bổ xung hiệu ứng Timeline Effect cho trường văn bản

Các hiệu ứng Timeline Effect cũng giống như các bộ lọc mà bạn có thể dùng để áp dụngcác hiệu ứng cho văn bản Một trong những hiệu ứng đó là hiệu ứng bong mờ cho trườngvăn bản tĩnh :

• Tạo ra một lớp và thư mục mới cho trang home

• Tạo ra một trường văn bản tĩnh

• Bổ xung hiệu ứng Timeline Effect cho trường văn bản

• Đặt tên lại cho lớp và lưu lại các thay đổi

Kiểm tra từ vựng cho hồ sơ

Công cụ kiểm tra từ vựng trong Flash cho phép bạn kiểm tra từ vựng trong tất cả các vănbản có trong tập tin FLA Thao tác kiểm tra từ vựng:

• Sử dụng hộp thoại Spelling Setup để chọn các thông số

• Kiểm tra từ vựng bằng hộp thoại Check Spelling

• Lưu lại phiên bản mới của tập tin

các thành phần dựa trên văn bản và trường văn bản động

Một trong những cách mà bạn sẽ sử dụng để đưa văn bản vào trong ứng dụng TechBookstore là sử dụng các thành phần văn bản

Các trường văn bản động và nhập hoàn toàn khác với trương văn bản tĩnh Các loạitrường văn bản này có thể xử lý việc thay đổi văn bản Chúng cũng có thể hiểu được cácvăn bản định dạng HTML

Phần 4 : Tạo và chỉnh sửa biểu tượng

Tìm hiểu về biểu tượng

Trong thực tế tất cả các biểu thư mục chứa trong Library về bản chất là các biểu tượng tàinguyên mà chúng ta có thể sử dụng lại trong Flash Flash có ba dạng biểu tượng mà chúng

ta có thể xây dựng trong môi trường sáng tác : đoạn phim, nút nhấn và đồ họa Đoạn phimkhá giống một ứng dụng mini , nó chứa một bảng tiến trình chạy độc lập với tiến trìnhchính Các nút nhấn là các biểu tượng chứa bốn trạng thái, kiểm soát cách thể hiện của nútnhấn và làm việc tương ứng với tác động của chuột

Các biểu tượng luôn nằm trong Library Khi bạn kéo một biểu tượng từ Library vào trongStage, nó được tham chiếu dưới dạng một phiên bản Các phiên bản có thể làm việc độc lập

và có thể áp dụng các hiệu ứng như thay đổi màu, kích thước Nếu bạn chỉnh sửa biểutượng trong Library ở chế độ soạn thảo biểu tượng , tất cả các phiên bản của biểu tượngtrong Stage sẽ bị ảnh hưởng Việc tái sử dụng các biểu tượng trong hồ sơ Flash sẽ giúp thugọn hích thước tập tin

Tạo và chỉnh sửa biểu tượng trên Stage

Có hai cách để tạo ra một biểu tượng mới : tạo từ một mục đã có trong Stage, tạo biểutượng bằng chế độ soạn thảo biểu tượng bạn cũng có thể chỉnh sửa biểu tượng “tại chỗ”.Bạn nên đổi bất kì hình vẽ vector nào bạn tạo ra trực tiếp trên Stage thành biểu tượng trướckhi xuất bản tập tin FLA

Xem xét các biểu tượng trong Library

Bạn có thể xem các biểu tượng trong Library Một biểu tượng và tên biểu thị cho mỗibiểu tượng Các phiên bản của biểu tượng nút nhấn và đoạn phim có thể được đặt trongbảng kiểm soát Property Các phiên bản được cung cấp một tên duy nhất Tên phiên bảnkhác với tên bạn cung cấp cho biểu tượng khi bạn tạo ra nó

Lồng biểu tượng và bảng tiến trình

Mỗi biểu tượng có một bảng tiến trình mà có thể lưu giữ các biểu tượng, văn bản, video,hoặc đồ họa khác Khác biệt lớn nhất giữa một biểu tượng đọan phim và biểu tượng đồ họa

là bạn không thể thao tác biểu tượng đồ họa bằng cách sử dụng ActionScrip Bạn có thểlồng một phiên bản phía trong một đối tượng khác nên bạn có nhiều lớp đoạn phim phíatrong một đoạn phim khác Nhưng nói chung bạn không nên lồng quá nhiều biểu tượngtrong các biểu tương khác

Tạo nút nhấn

Trong Flash nút nhấn tạo ra tương tác trong ứng dụng, các nút nhấn có thể được sử dụng

để gửi các biểu mẫu hoặc thực hiện mã lệnh ActionScript kiểm soát hồ sơ Flash Các nútnhấn cũng có các sự kiện được kích hoạt khi một điều gì đó sảy ra trong tập tin SWF Do

đó bạn có thể kích hoạt một sự kiện (viết bằng ActionScript) khi người dùng nhầp chuộtvào nút nhấn

Thao tác tạo nút nhấn :

• Mở tập tin và lưu dưới dạng phiên bản mới

• Chọn Insert>New Symbol để tạo ra nút nhấn có tên products_btn

• Mở Library và tìm hình ảnh bitmap mà bạn đã đặt vào trong thư mục media

• Chọn trạng thái Up và đưa hình ảnh products_up vào trong nút nhấn

• Đưa hình ảnh products_down.png vào trạng thái Over của biểu tượng nút

nhấn

• Thiết lập tọa độ X,Y của products_up.png, products_down.png thành 0,0

• Chọn khung hình Hit và nhấn F5

• Tạo thêm2nút nhấn để đưa vào trong Library để tổ chức các nút nhán khác

• Lưu lại các thay đổi

Đặt các nút nhấn vào trong Stage

Khi bạn đã có ba nút nhấn trong Library , bạn có thể đặt chúng lên Stage trước khi bổxung các phần tử khác vào Stage Thao tác đặt nút nhấn :

• Tạo một lớp mới có tên button

• Kéo 3 nút nhấn mà bạn đã tạo ra vào Stage

• Di chuyển 3 nút theo thứ tự và đặt đúng tọa độ bằng bảng Property

• Canh 3 nút theo phương ngang bằng bảng điều khiển Align

• Gom nhóm và canh 3nút,tách nhóm 3nút và khóa lớp button

• Lưu lại các thay đổi

Tạo nút nhấn văn bản

Một trong nhứng phần quan trọng nhất của việc tạo nút nhấn văn bản là việc định nghĩavùng chạm, là vùng mà người ta dùng có thể nhấp vào nút nhấn

Thao tác tạo nút nhấn văn bản:

• Chọn Text>Stage để tạo trường văn bản

• Chọn trường văn bản và nhấn F8 để đặt nó phía trong biểu tượng nút nhấn

• Mở biểu tượng catalog_btn và canh giữa trường văn bản trong biểu tượng

• Bổ xung trạng thái Over, Down và Hit cho nút nhấn

• Tạo vùng chạm cho nút nhấn bằng sử dụng một hình chữ nhật

• Tạo 5 nút cho menu : reviews, news, tour, peedback và map

• Lưu lại thay đổi

Tạo nút nhấn không thấy được

Nút nhấn không thấy được chỉ chứa vùng chạm và không có bất kì phần tử đồ họa nào,

nó rất giống với một điểm nóng khi bạn tạo ra các website bằng HTML Các nút nhấnkhông thấy được thực hiện vai trò tương tự trong tập tin SWF

Thao tác tạo nút nhấn không thấy được :

• Tạo một lớp mới với tên invisible button phía dưới lớp button

• Bổ xung 2 đường dẫn nằm ngang, tạo đường dẫn đứng thứ 3

• Vẽ hình chữ nhật ở góc trái Stage và một hình phía dưới đường dẫn

• Bổ xung 2 hình chữ nhật dưới biểu tượng bar_gr về phía trái, phải của 3 nút

nhấn

• Nhấp khung hình khóa trong lớp để chọn tất cả các hình

• Kéo các hình chữ nhật sang khung hình Hit

• Nhấp scene1 để về Stage chính,ẩn và khóa lớp invisible button

Tạo và sử dụng biểu tượng đoạn phim

Trong Flash các đoạn phim là biểu tượng được dùng nhiều nhất, nó là một ứng dụng thunhỏ Mỗi đoạn phim có một bảng tiến trình riêng làm việc độc lập với bảng tiến trình chính.Bạn không phải tạo các đoạn hoạt hình lặp lại kéo dài mà chỉ cần tạo vòng lặp cho đoạnphim vào trong Stage Bạn tạo ra các đoạn phim hoạt hình cũng như tạo ra các biểu tượng

đồ họa và nút nhấn

Thao tác tạo và sử dụng biểu tượng đoạn phim :

• Chọn biểu tượng logo và nhấn F8 đêr chèn một biểu tượng trong đoạn phimmới

• Nhấp đúp logo_mc, đặt lại tên lớp Layer1 và bổ xung lớp mới vào đoạnphim

• Dùng công cụ Line tạo một đường và nhấn F8 để đặt đường vào trong đoạnphim

• Đặt hình vẽ vào trong đoạn phim mới bằng cách nhấn F8

• Chèn vào một lớp mới trong logo_mc và chuyển nó xuống dưới cùng

• Khóa lớp logo, chọn lớp glow animation,sao chép nội dung của nó và đặtbiểu tượng glow vào sau đoạn phim logo_mc

• Lưu lại các thay đổi

• Mở đoạn phim products_mc ,tạo ra một đường thẳng đứng tại vị trí 11 pixel

• Tạo một đường thẳng đứng thứ 2 với màu trắng, cũng cao 11 pixel

• Di chuyển hai đường nằm sát nhau và chèn vào một biểu tượng đồ họa mới

là divider_gr, di chuyển biểu tượng vào tâm menubg_gr

• Đưa divider_gr vào nằm giữa các đoạn phim company_mc và contact_mc

• Mở Library và bổ xung các nút văn bản vào các menu

• Dọn dẹp Library và lưu lại tập tin FLA

Tạo các nút nhấn dạng đoạn phim

Trong Flash có thể tạo nút nhấn băng cách sử dụng các đoạn phim Chúng ta sử dụng nútnhấn dạng đoan phim khi muốn có thêm các trạng thái cho nút nhấn hoặc hoạt hình chúngtheo một cách thức riêng

Thao tác tạo nút nhấn dạng đoạn phim :

• Chọn lớp button trên bảng tiến trìnhvà chọn công cụ Rectangle trong bảng

Tool

• Tạo một hình chữ nhật và chuyển thành đoạn phim

• Mở đoạn phim, chọn nét vẽ và đặt nó vào một lớp tên là fill

• Sửa đổi nét vẽ và khóa lớp stroke

• Bổ xung văn bản sample chapter cho nút trên lớp text và khóa lớp này lại

• Chọn lớp fill, chọn vùng tô của hình dạng và chuyển đổi nó thành biểu

tượng đồ họa fill_gr sau đó khóa lớp này lại

• Bổ xung lớp labels và actions vào bảng tiến trình

• Nhấp vào khung hình 25 trên từng lớp và nhấn F5 để chèn vào các khunghình mới Sau đó chèn vào các khung hình khóa trên lớp labels tại khunghình 5 và 15

• Bổ xung các nhãn khung hình tại mỗi khung hình trên lớp labels

• Khóa lớp và lưu lại tập tin

•

Nhân bản biểu tượng và đưa vào trong Stage

Thay vì tạo lại một nút nhấn , bạn có thể nhân bản biểu tượng để tránh lặp lại các bướcvừa thực hiện Bằng cách nhân bản biểu tượng bạn có thể chỉnh sửa biểu tượng mà khôngcần phải tạo lại biểu tượng từ đầu

Thao tác nhân bản và đưa biểu tượng vào Stage :

• Mở Library tìm biểu tượng vừa tạo, nháp chuột phải, chọn Duplicate từ

menu

• Nhấp đúp vào biểu tượng toc_mc và thay đổi văn bản của đoạn phim

• Xóa đoạn phim samplechapter_mc trên Stage

• Canh ba menu với các nút ứng với chúng

• Dọn dẹp Library và lưu lại phiên bản mới của tập tin trong TechBookstore

Phần 5 : Tạo hoạt hình

Tìm hiểu về hoạt hình

Hình ảnh hoạt hình là một chuỗi các hình ảnh tạo ra ảo giác chuyển động khi được xemvới một sự nối tiếp nhanh Trong Flash , các hình ảnh này bởi các nội dung đặt trên cáckhung hình trên bảng tiến trình Bạn cũng có thể sử dụng các hình vẽ, ảnh chụp hoặc cácphần tử đồ họa được tạo bằng Actioncript để tạo một hoat hình hoặc một chuyển độngtrong tập tin FLA

Có một số cách để tạo ra các chuyển động hoặc hoạt hình tùy biến trong Flash Bạn cóthể tạo các biến hình chuyển động, biến hình hình dạng hoặc hoạt hình theo từng khunghình Biến hình đề cập đến các tính toán được thực hiện bởi Flash để làm hoạt hình hoặcchuyển động hoặc thay đổi thuộc tính hay hình dạng của một đối tượng trong một tập tinFLA Bạn tạo ra khung hình đầu tiên và cuối cùng cho một phép biến đổi đặc biệt bằngcách sử dụng các khung hình khóa Khi bạn áp dụng một phép biến hình chuyển động chomột tập khung hình khóa, Flash sẽ tự tạo ra chuyển động bằng cách điền vào các thay đổi

xảy ra giữa các khung hình khóa Các biến hình hình dạng được sử dụng để thay đổi mộtđường vector hoặc một hình dạng, chẳng hạn như di chuyển các đối tượng xung quanhStage, làm mờ hoặc làm rõ các đối tượng

Hoạt hình theo từng khung hình là cách truyền thống nhất trong việc tạo ra hoạt hình Thay vì để Flash tạo ra một biến hình bằng cách sử dụng các tính toán tự động , bạn sẽ vẽcác hình chuyển động bằng tay để có thể tạo ra các hiệu ứng phức tạp hơn, đặc biệt khi biếnhình chuyển động hoặc hình dạng không thể đáp ứng được yêu cầu của bạn Hoạt hìnhtheo từng khung hình phải tốn nhiều thời gian hơn và làm cho kích thước tập tin lớn

Thiết lập biến hình chuyển động

Các biến hình chuyển động được sử dụng để thay đổi các thuộc tính của một đối tượngtrên một số khung hình nhất định Bạn có thể thay đổi thuộc tính như vị trí , kích thước , độalpha, màu sắc hoặc xoay và thực hiện biến hình dọc theo một đường dẫn Bạn cần chuyểnđổi đối tượng thành một biểu tượng trước khi thực hiện việc biến hình chuyển động, điềunày giúp cho tập tin của bạn nhỏ khi xuất ra tập tin SWF Có một số cách để bạn có thể bổxung các biến hình chuyển động cho một tập tin FLA

Thao tác bổ xung một biến hình chuyển động cho menu bạn đã xây dựng :

• Mở tập tin và lưu lại phiên bản mới của tập tin

• Tìm products_mc trên Stage, nhấn F8 chuyển nó thành đoạn phim tên là

productsMenu_mc

• Nhấp đúp vào productsMenu_mc để chỉnh sửa nó trên Stage

• Chọn lớp Layer1 và đặt lại tên cho lớp là Menu tween, sau đó chèn vào một lớp mới với tên actions

• Bổ xung các khung hình vào lớp actions tại kung hình 11 và 20

• Bổ xung hành động stop vào bảng tiến trình để kiếm soát hoạt hình

• Chèn vào một lớp mới là labels Sau đó bổ xung các khung hình khóa mới

và nhãn cho các khung hình 2 và 12 Khóa lớp khi hoàn tất

• Chèn vào các khung hình khóa mới tại khung hình 12 và 20 trên lớp

Menutween

• Thay đổi vị trí của đoan phim products_mc tai khung hình 12

• Quay trở lại Stage chính và lặp lại các bước này cho 2 menu còn lại

• Lưu lại các thay đổi đã thực hiện

Bổ xung biến hình chuyển động

Bạn có thể sử dụng biến hình chuyển động để thay đổi vị trí, độ sáng , độ đục hoặc màusắc của một phiên bản đối tượng trên Stage Bạn đã thiết lập đoạn phim với các khung hìnhkhóa và đã có vị trí bắt đầu và kết thúc cho phiên bản đối tượng và giờ bạn có thể bổ xungcác biến hình chuyển động dùng để làm menu chuyển động

Thao tác bổ xung biến hình chuyển động :

• Trong Bookstore, nhấp đúp mở productsMenu_mc Chọn lớp Menutween

• Tạo một biến hình chuyển động giữa các khung hình 1 và 12 để làm chomenu trượt xuống dưới

• Bổ xung một biến hình thứ hai để làm menu trượt lên phía trên và xem quahoạt hình bằng cách di chuyển con trỏ khung hình trên bảng tiến trình

• Bổ xung hiệu ứng suy giảm cho biến hình chuyển động bằng cách sử dụngbảng kiểm soát Property

• Bổ xung một biến đổi độ sáng cho menu và sau đó thử hoạt hình bằng cáchkéo con trỏ khung hình

• Lặp lại từ bước 2 đến bước 5 cho hai menu còn lại trong tập tin FLA Kéocon trỏ khung hình để quan sát

• Quay trở về Stage chính

• Dọn dẹp Library và lưu lại hồ sơ FLA

Hoạt hình làm thay đổi độ đục và kích thước

Việc thay đổi độ đục của phiên bản đối tượng không khác nhiều so với việc làm chuyểnđộng phiên bản đây đó trong Stage và khá giống với việc biến hình làm thay đổi độ sángThao tác làm mờ hào quang phía sau logo và thay đổi kích thước phần tử đồ họa :

• Chọn glow_gr và chuyển đổi nó thành biểu tượng đoạn phim có tên

bookglow_mc Sau đó đặt lại tên cho lớp layer1 thành glow animation

• Tạo khung hình khóa trên khung 35 và70 của lớp glow animation

• Thay đổi kích thước glow_gr bằng công cụ Transform

• Thay đổi độ đục của glow_gr bằng bảng kiểm soát Property và biến hình

chuyển động

• Bổ xung các biến hình chuyển động để làm thay đổi kích thước của phần tử

đồ họa và di chuyển con trỏ khung hình để quan sát kết quả

• Di chuyển bookgloww_mc vào thư mục movie clips trong Library

• Lưu lại tập tin FLA

Hoạt hình nút nhấn dạng đoạn phim

Bạn làm hoạt hình nút nhấn dạng đoạn phim để vùng tô sẽ có một biến hình thay đổi độsáng khi người dùng di chuyển chuột lên phía trên nút nhấn Các nút nhấn dạng đoạn phim

sử dụng các nhãn khung hình đặc biệt để Flash biết cách xử lý từng khung hình khóa có ghinhãn như là một trạng thái của nút nhấn thay vì như một nhãn khung hình thông thường.Thao tác tạo hoạt hình nút nhấn dạng đoạn phim :

• Tìm biểu tượng samplechapter_mc trong Library

• Chon lớp fill và chèn vào một khung hình khóa tại khung hình over(khung

hình 14) và trên khung hình cuối cùng trong đoạn phim ( khung hình 25)

• Bổ xung hoạt hình chuyển động làm thay đổi độ sáng cho fill_gr và chèn

vào khung hình khóa tại khung hình 15

• Lặp lại các bước từ 1 đén 3 cho biểu tượng toc_mc

• Khóa lớp fillvà quay lại Stage chính

• Lưu lại các thay đổi

Tạo biến hình hình dạng

Biến hình hình dạng cho phép bạn thay đổi hình dạng trên một loạt khung hình Cho phépbạn thay đổi chiều dài của đường, uốn cong dường hoăc các thay đổi khác về hình dạng củahinh vẽ và tạo ramột số hiệu ứng lý thú Thay vì tạo từng thay đổi thủ công Flash sẽ thựchiện tính toán để tạo ra hoạt hình cho bạn bạn Bạn cũng có thể có nhiều biến hình hìnhdạng trên cùng một lớp Biến hình hình dạng thường tạo ra các kết quả không đoán trướcđược

Thao tác để tạo hiệu ứng lật trang trong logo của cuốn sách ở góc trên trái của website :

• Tìm page Turn_mc trong đoạn phim logo_mc trên Stage

• Nhấp đúp vào pageTurn_mc để mở đoạn phim ở chế độ soạn thảo biểu

tượng và phóng to

• Đặt lại tên lớp Layer1 thành animation

• Bổ xung một khung hình khóa tại khung hình 10 và sau đó chỉnh sửa khunghình này

• Chèn vào một biến hình hình dạng bằng cách dùng bảng kiểm soát Property

và quan sát hoạt hình

• Lưu lại các thay đổi

Tạo hoạt hình theo từng khung hình

Hoạt hình theo từng khung hình là dạng hoạt hình tốn nhiều thời gian nhất vì bạn phải tạo

ra từng khung hình một cách thủ công Tuy nhiên nó cho bạn nhiều kiểm sôắthn để tạo racác hiệu ứng hấp dẫn Hoạt hình theo từng khung hình rất thích hợp cho một chuỗi hoạthình phức tạp khi mà các ảnh cần phải khác nhau theo mỗi khung hình Nhưng cũng vì thếkích tước tập tin cũng tăng đáng kể

Thao tác tạo hoạt hình theo từng khung hình :

• Mở đoạn phim pageTurn_mc trong bookstore9.fla

• Chèn vào một khung hình khóa ở cuối biến hình hình dạng và sau đó bật chế

độ onion skin

• Chỉnh sửa khung hình khóa mà bạn tạo ra trong bước 2

• Chèn vào các khung hình khóa mới và chỉnh sửa hình ảnh trang cho đến khi

nó nằm phía bên kia bìa sách

• Chèn vào các khung hình trống ở cuối hoạt hình để tạo ra một khoảngngừng giữa các lần lật trang

• Chọn File>Save và nhập bookstore9_complete.fla vào trường FileName

Hoạt hình theo đường dẫn

Bạn cũng có thể sử dụng biến hình chuyển động để di chuyển một biểu tượng dọc theomột đường dẫn Bạn có thể tạo ra đường dẫn bằng công cụ Pencil, Pen hoặc Linevà sau đógắn biểu tượng vào một trong hai đầu mút của đường Đường dẫn phải đặt trên lớp dẫnchuyển động.

Thao tác sử dụng đường dẫn chuyển động để làm hoạt hình một biểu tương trên bản đồ

• Mở tập tin map_starter.fla và lưu vào thư mục Techbookstore

• Chọn lớp map và chèn vào một lớp mới là cả Sau đó mở Library và định vị

biểu tựơng car_gr và tree_gr trong thư mục graphics

• Kéo một phiên bản của car_gr vào lớp car và một phiên bản của tree_gr vào trong lớp map

• Tạo một lớp dẫn chuyển động và vẽ một đường dẫn

• Bổ xung một khung hình khóa trên lớp car tai khung hình 70, các khunghình dẫn trên lớp dẫn chuyển động , lớp map star và map tại khung hình 70

sau đó gắn car_gr với các đầu mút đường đẫn

• Chọn các khung hình trên lớp car và chèn vào một biến hình chuyển động

• Bổ xung hiệu ứng Easing ở cuối hoạt hình để chiếc xe sẽ tăng tốc đọ dần khi

nó di chuyển động từ đầu này sang đầu khác của Stage

• Kéo con trỏ khung hình để xem hoạt hình và sau đó thực hiện một chỉnh sửacho biến hình chuyển động

• Đặt một hành động stop vào khung hình cuối cùng trên lớp mới tên actions

• Lưu lại các thay đổi

Bổ xung hiệu ứng Timeline Effects cho hoạt hình

Bạn đã bổ xung một hiệu ứng bóng mờ cho văn bản Bóng mờ không hoạt hình mà đượcthêm vào theo cùng cách mà bạn bổ xung hiệu ứng hoạt hình Timeline Effects Hiệu ứngnày cho phép bạn bổ xung chuyển động cho hồ sơ Flash bằng cách nhấp nút nhấn và chọngiá trị

Thao tác sử dụng hiệu ứng Expand Timeline và cách kết hợp nó trong bản đồ của bạn :

• Mở tập tin map_starter.fla và chọn nhóm star

• Chuyển đổi ngôi sao trong nhóm thành biểu tượng đồ họa là star_gr

• Nhân bản biểu tượng star_gr trên lớp map star

• Chọn cả hai phiên bản của biểu tượng star_gr trên Stage và áp dụng hiệu

ứng Expand

• Tùy biến hiệu ứng bằng cách thay đổi các thiết lập trong hộp thoại Expand

• Chỉnh sửa các thông số độ dài, kiểu, độ dịch chuyển… của hiệu ứng

• Áp dụng hiệu ứng cho ngôi sao và chỉnh sửa một số thay đổi đã được thựchiện trong hồ sơ Flash

• Chọn File>Save và nhập map.fla vào trường File Name

• Xác nhận để ghi đè tập tin map.fla trong thư mục

• Xuất bản tập tin khi hoàn tất bằng File>Publish

Phần 6 : Bổ xung tương tác cơ bản

Tạo cho các hồ sơ Flash có tính tương tác

Có nhiều cách để làm cho hồ sơ Flash có tính tương tác Tương tác được thực hiện thôngqua các hành động và các Behavior mà bạn bổ xung vào cho tập tin FLA và thậm chí bạn

có thể làm cho tập tin SWF gắn với một máy chủ để bổ xung các tương tác dữ liệu cao cấp.Tương tác máy chủ kèm theo việc tạo ra một kết nối theo một cách nào đó Bạn có thểtương tác vói người dùng rất đơn giản bằng cách tải xuống các tập tin Bạn sẽ được học vềcác loại tương tác cơ bản mà có thể bổ xung cho website Tech Bookstore

Các nút nhấn có thể bổ xung tương tác rất đơn giản, bạn mhấp chuột vào một nút nhấn(một sự kiện) và một điều gì đó sẽ xảy ra Các trường văn bản cũng có thể bổ xung tươngtác nhưng phức tạp hơn

Bạn không cần phải viết ActionScript để bổ xung tính tương tác Behavior cho phép bổxung tính tương tác cho một tập tin SWF mà không cần viết mã lệnh Một Behavior đượcđưa vào bằng cách sử dụng bảng điều khiển Behaviors Bạn chỉ cần chọn một khung hìnhtrên bảng tiến trình hoặc một đối tượng trên Stage và sử dụng các điều khiển , tùy chọnmenu trong bảng điều khiển để bổ xung ActionScript Bạn có thể chỉnh sửa ActionScripttrong bảng điều khiển làm cho việc bổ xung mã lệnh rất nhanh và đơn giản và dễ dàng bổxung tương tác cho tập tin SWF

Sử dụng Behavior

Behavior cho phép bạn sử dụng các đoạn mã ActionScript trong tập tin FLA mà khôngcần phải học về ngôn ngữ hay nhập mã lệnh Behavior là các đoạn mã nhỏ được chứa trongFlash mà bạn có thể đưa vào tập tin FLA của mình,nó giúp bạn bổ xung các tính năng cơbản cho website của mình Behavior được sử dụng khi bạn bắt đầu sử dụng Screen để xâydựng các biểu mẫu hoặc các bản chiếu trình diễn bằng Flash

Bạn có thể bổ xung Behavior vào bảng tiến trình hoặc trực tiếp vào đối tượng Khi bạngắn một Behavior, nó sẽ đưa mã lệnh ActionSript vào cho đối tượng mà bạn gắn

Bạn có thể bổ xung Behavior vào bảng tiến trình để kiểm soát sự di chuyển của con trỏkhung hình và sử dụng Behavior để tải hình ảnh JPEG vào trong một phiên bản của mộtđoạn phim

Sử dụng Behavior để tải một hình ảnh JPEG

Việc tải các hình ảnh JPEG vào một tập tin SWF là một quá trình quan trọng , việc nàygiúp cho các nhà thiết kế và phát triển dễ dàng tạo ra các ứng động như website trưng bàyhình ảnh và tập tin nhỏ gọn.

Thao tác tải một hình ảnh JPEG:

• Mở tập tin bookstore9_complete.fla và lưu lại một phiên bản mới

• Sao chép logoMacromedia Press từ đĩa CD vào thư mục TechBookstore

• Chọn lớp home và tạo ra một hình chữ nhật

• Chuyển hình chữ nhật thành đoạn phim

• Bổ xung một lớp mới là actions các khung hình khóa cho mỗi trang

• Bổ xung Behavior bằng cách dùng menu Add(+) để tải mmpresslogo.jnp

vào trong SWF

• Lưu lại các thay đổi

Dùng Behavior để mở một trang web

Bạn có thể sử dụng một Behavior trong Flash để mmở một trang web trong một cửa sổduyệt trình Khi bạn bổ xung một Behavior trực tiếp cho một đối tượng thay vì cho khunghình trên bảng tiến trình được gọi là “ hành động theo đối tượng “

Thao tác dùng Behavior để mở một trang web :

• Đảm bảo bạn đang làm việc trong Stage chính và chọn khung hình 1 trên

lớp home

• Bổ xung một Behavior trực tiếp cho đoạn phim mmpresslogo_mc bằng cách

sử dụng bảng điều khiển Behavior

• Thiết lập URL cho Behavior trong hộp thoại go to URL

• Thay đổi hành vi của Behavior bằng cách dùng bảng điều khiển

• Điều chỉnh các thuộc tính của Behavior bằng bảng điều khiển Behaviorshoặc bảng điều khiển Actions

• Lưu lại các thay đổi

Xem mã lệnh của Behavior

Bạn có thể xem mã lệnh ActionScript mà Behavior tạo ra Bạn chỉ cần tìm nờilash đặt mãlệnh và mở bằng bảng điều khiển Actions bằng cách sử dụng hệ thống duyệt Script

Thao tác thực hiện xem mã lệnh :

• Trong tập tin bookstore10.fla ,chọn mmpreslogo_mc trên Stage và sau đó

mở bảng điều khiển Actions để xem mã lệnh

• Chọn khung hình 1 của lớp actions và xem mã lệnh của Behavior được đặt

trên bảng tiến trình

Cài đặt tương tác máy chủ bằng cách dùng thành phần