Bai tap chuong trinh flash

Bước 3: Tạo hoat hình ở Scene1► Bố trí các layer như hình sau:... Bước 5: Tạo hoạt hình ở Scene3► Bố trí các layer như hình sau:... Bước 6: Tạo hoạt hình ở Scene4► Bố trí các layer như h

CÂY BÚT CHÌ

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Tạo Graphic symbol

► Insert > New Symbol

► vẽ cây bút chì.

Bước 4: Tạo Button symbol

► Insert > New Symbol

► Vẽ một nút

Bước 5: Layer Background

► Kéo thả gp_background vào vùng thiết kế Rồi canh chỉnh lại

Bước 6: Layer Text

► Tạo chữ Pencil Rồi Ctrl+B hai lần để phân rả thành shape

► Tạo keyframe (phím F6), rồi dùng eraser tool xóa bớt phần chữ từ phía phải.

► Thực hiện tiếp tục cho đến hết chữ pencil Kết thúc ở phía trái

► Chọn chuỗi frame Pencil rồi Reverse Frames

Bước 7: Layer Pencil

► Kéo thả gp_pencil vào vùng thiết kế Rồi chỉnh kích thước sao cho phù hợp

► Tại Frame 1: đặt đầu bút chì đến vị trí của chữ

► Tại Frame 2: phím F6 tạo keyframe, rồi đặt đầu bút chì đến vị trí của chữ Tiếp tục như thế cho các Frame kế tiếp

► Sau đó cứ khoảng 5 frame, ta xoay bút chì quanh đầu bút một góc nhỏ để cây bút chuyển động

có vẻ tự nhiên hơn

Bước 8: Layer Button

► Tạo layer button Rồi ở frame cuối của layer button, phím F6, rồi đặt nút vào vùng thiết kế

Bước 9: Action script

► Tạo layer action

► Ở Frame cuối: Phím F6, rồi Phím F9 Rồi gõ lệnh tại frame cuối này _root.stop();

► Ở nút Replay: Phím F9 Rồi gõ lệnh cho nút replay_btn:

on (release) { _root.gotoAndPlay(1); }

Bước 10: Kết quả:

Download: Pencil.fla

Thực hành: Cây cọ vẽ

Hướng dẫn:

► Layer Background: ảnh nền gp_cahier

► Layer Text: chữ Brush (font Brush Script Std) Phân rã chữ thành Shape Dùng Brush tool vẽ thêm nét gạch dưới

► Layer Mask: Dùng Brush tool tô lên chữ từng vùng nhỏ (nhớ phím F6 để tạo keyframe)

► Click phải vào Layer mask > Mask

► Layer Brush: đặt gp_brush (phím F6 tạo Keyframe, rồi đặt đầu cọ đến vùng tô chữ)

► Cứ khoảng cách 5 frame: Xoay cọ quanh đầu cọ một góc nhỏ để chuyển động có vẻ tự nhiên

► Layer Button: đặt nút btn_replay ở frame cuối Viết lệnh ngay frame cuối này :

replay_btn.onRelease=function() { _root.gotoAndPlay(1); }

Nhớ đặt tên cho phiên bản nút là replay_btn

► Layer Action: F6 tai Frame cuối Viết lệnh ngay frame cuối này:

_root.stop();

Kết quả:

Download: brush.fla

CHẬU HOA

Bước 1: Tạo tài liệu mới

Bước 2: Nhập các hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Tạo Graphic symbol

► Tạo các Graphic symbol:

Bước 4: Layer Background

► Kéo thả gp_buctranh vào vùng thiết kế Rồi canh chỉnh lại

Bước 5: Layer Khung hình

► Kéo thả gp_khunghinh vào vùng thiết kế rồi xoay 90 độ

Bước 6: Tạo thêm các layer

► Layer chân đế: chứa gp_chande

► Layer chậu hoa: chứa gp_chauhoa

► Layer hoa: vẽ các trạng thái hình hoa (frame by frame)

► layer bướm: vẽ các trạng thái hình con bướm bay (frame by frame)

► Layer nút: chứa nút Replay Viết action script cho nút: on (release) { _root.gotoAndPlay(1); }

► Layer action: viết as cho frame cuối: _root.stop();

Bước 7: Kết quả:

Download: chauhoa.fla

XE 4 CHỖ

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

QUẢNG CÁO

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Bố trí lên timeline

► Layer Bground: ảnh nền (gp_bground)

► Layder Mouse1: movieclip mc_mouse1

► Layer Mouse2: movieclip mc_mouse2

► Layer Text: movieclip mc_quangcao

Bước 4: Tạo movieclip symbol

► Tạo movieclip mc_quangcao

Bước 5: Kết quả:

Download: quangcao.fla

Bước 3: Tạo movieclip symbol

► Tạo movieclip mc_car

Bước 4: Bố trí lên timeline

► Layer Clouds: ảnh đám mây (gp_clouds) Tạo Classic tween

► Layder Bground: ảnh nền (gp_bground)

► Layer Car: đặt chiếc xe (mc_car) Tạo Classic Tween

► Layer Bird: đặt mc_bird.Tạo Classic Tween

► Layer Guide: vẽ đường chim bay

► Layer Text: chữ Quảng cáo

► Layer Text2: chữ 300 x 250

► Layer Button: đặt nút Replay

► Layer Action: viết as cho timeline chính.

Bước 5: Kết quả:

Download: xe4cho.fla

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Bố trí lên timeline

► Layder Clouds: hình mây (gp_clouds), hoạt hình Motion tween

► Layer Bground: ảnh nền (gp_bground)

► Layer Car: hình xe (gp_car), hoạt hình Motion tween Nhớ chỉnh vị trí tại các frame tùy chỉnh để chuyển động uốn theo đường dịch chuyển

► Layer Bear: hình con gấu (mc_bear), hoạt hình motion tween

► Layer Plane: hình máy bay (mc_plane), hoạt hình motion tween

► Layer Animation: chữ animation (mc_animation)

► Layer Button: nút điều khiển.

► Layer Action: để viết as

Bước 4: Tạo điều khiển.

Bước 5: Kết quả:

Download: animation.fla

MẶT NẠ

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Tạo hoat hình ở Scene1

► Bố trí các layer như hình sau:

Bước 4: Tạo hoạt hình ở Scene2

► Bố trí các layer như hình sau:

Bước 5: Tạo hoạt hình ở Scene3

► Bố trí các layer như hình sau:

Bước 6: Tạo hoạt hình ở Scene4

► Bố trí các layer như hình sau:

Bước 7: Action script

► AS ở frame cuối các cảnh: gotoAndPlay("Scene#", 1);

► AS ở nút phải: on (release) { nextScene(); play();}

► AS ở nút trái: on (release) { prevScene(); play();}

Bước 8: Kết quả:

Download: mask.fla

► Trong Library: Duplicate btn_black, rồi đổi tên btn_red, rồi hiệu chỉnh:

► Thực hiện tương tự cho btn_green và btn_blue

Bước 3: Bố trí hoạt hình trên timeline

► Bố trí các layer như hình sau:

Bước 4: Gán lệnh as

► AS ở frame 1 của layer Action: stop();

► AS ở nút btn_black: on (release) { gotoAndStop("Black"); }

► AS ở nút btn_red: on (release) { gotoAndStop("Red"); }

► AS ở nút btn_green: on (release) { gotoAndStop("Green"); }

► AS ở nút btn_blue: on (release) { gotoAndStop("Blue"); }

Bước 5: Kết quả:

Download: interactivebutton.fla

Bước 2: lmport các hình vào thư viện

► Import các hình vào thư viện

Bước 3: Tạo các nút hình

► Lần lượt tạo các nút hình

► Tạo tất cả 5 nút hình

Bước 4: Bố trí trên timeline

► Bố trí các layer như hình sau:

Bước 5: Kết quả:

Bước 3: Tạo các movieclip symbol

► Tạo mc_bear từ các chuỗi hình

► Tạo mc_bird từ các chuỗi hình

► Tạo mc_butterfly từ các chuỗi hình

Bước 4: Tạo các button symbol

► Tạo btn_bear

► Tương tự tạo btn_butterfly và btn_bird

Bước 5: Bố trí lên timeline

► Lưu ý các movieclip mc_bearA, mc_butterflyA, mc_birdA là các hoạt hình cấp con.

Bước 6: Action Script cho các nút

► AS ở nút btn_bear:

► Tương tự cho các nút khác

Bước 7: Kết quả:

Download: controlbutton.fla

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Bố trí lên timeline

► layer1: đặt symbol1 bắt đầu tại vị trí 1

 Tạo các keyframe ở vị trí 1,10,60,70

 vị trí 1 và 70 chỉnh alpha=0

 tạo classic tween trong khoảng 1->10 và 60->70

► Layer 2: đặt symbol2 bắt đầu tại vị trí 60

Download: Slideshow.fla

PROPERTIES

Bước 1: Tạo tài liệu mới

Bước 2: Nhập hình vào Library.

► Chọn lệnh File > Import to Library

► Tạo các nút

Bước 3: Bố trí lên timeline

► Layder Bground: hình nền hồ cá

► Layer Button: bố trí các nút

► Layer Cá bơi: hoạt hình movie clip cá bơi trong hồ cá

► Layer cá nhỏ bơi: bố trí một đàn cá nhỏ bơi trong hồ cá

► Layer Bọt khí: bố trí bọt không khí thoát lên mặt hồ

► Layer Action: để viết as

Bước 4: Tạo điều khiển.

► Ở frame 1:

.► Ở nút btn_ca:

on (release) { i++; duplicateMovieClip(_root.ten,_root.ten+i,i); }

.► Ở nút btn_goup và btn_godown:

on(release){ y=getProperty(_root.ten,_y)-10; setProperty(_root.ten,_y,y); }

on(release){ y=getProperty(_root.ten,_y)+10; setProperty(_root.ten,_y,y); }

Bước 3: Tạo các movie clip

► Tạo tất cả 3 movie clip: mc_hanoi, mc_hue, mc_sg:

Bước 4: Bố trí trên timeline

► Bố trí các layer như hình sau:

Bước 5: Kết quả:

Bước 2: Save các hình ảnh sau đây vào folder tương ứng.

► Save các hình vào folder camera:

► Save các hình vào folder desktop:

► Save các hình vào folder plasma:

► Save các hình vào folder printer:

► Save các hình vào folder vaio:

Bước 3: Bố trí trên timeline

► Bố trí các layer như hình sau:

Bước 4: Viết action script cho frame1

Bước 2: Nhập các hình vào Library.

► Chọn lệnh File > Import to Library

Bước 3: Tạo layer background

► Vẽ một shape chữ nhật W=980px, H=300px, Fill=linear gradient Rồi Group

Bước 4: Tạo layer Grass

► Chọn layer grass, rồi Kéo symbol Grass từ thư viện thả lên vùng thiết kế

Bước 5: Tạo layer Bushes

► Chọn layer Bushes, rồi Kéo symbol Bushes từ thư viện thả lên vùng thiết kế.

Bước 6: Tạo layer Clouds

► Chọn layer Clouds, rồi Kéo symbol Clouds từ thư viện thả lên vùng thiết kế

Bước 7: Tạo Movie Clip mc_Clouds

► Vào lệnh Insert > New Symbol (Ctrl + F8)

► Trong vùng thiết kế movie clip:

 Tại keyframe ở vị trí 1: Kéo symbol Clouds thả vào vùng thiết kế

 Tạo một keyframe ở vị trí 500 Rồi di chuyển hình đám mây

 Click phải vào vùng timeline, rồi chọn lệnh Classic Tween

Bước 8: Tạo layer mc_Clouds

► Chọn layer mc_Clouds, rồi Kéo Movie Clip Clouds từ thư viện thả lên vùng thiết kế

Bước 9: Tạo layer Houses

► Chọn layer Houses, rồi Kéo symbol Houses và symbol Houses2 từ thư viện thả lên vùng thiết kế

Bước 10: Tạo layer Text

► Chọn layer Text, rồi nhập văn bản Chọn Filter - Drop Shadow

Bước 11: Tạo Movie Clip mc_Sun

► Vào lệnh Insert > New Symbol (Ctrl + F8)

► Keyframe ở vị trí 1: đặt hình symbol sun.

► Keyframe ở vị trí 500: đặt hình symbol sun

► Tạo Classic TweenType Chỉnh Rotate CW = 1 vòng

Bước 12: Tạo Layer mc_Sun

► Chọn layer mc_houses, rồi Kéo movie clip mc_sun thả vào vùng thiết kế

Bước 13: Tạo Movie Clip mc_Xe

► Vào lệnh Insert > New Symbol (Ctrl + F8)

► Symbol xe1:

 vị trí frame=1, color effect -> Alpha = 0

 vị trí frame=40, color effect -> Alpha = 0

 Classic tween từ frame 1 -> frame 10

 Classic tween từ frame 30 đến frame 40

► Symbol xe2

► Symbol xe3

► Symbol xe4

Bước 12: Tạo Layer mc_Xe

► Chọn layer mc_xe, rồi Kéo movie clip mc_xe thả vào vùng thiết kế

Bước 13: Tạo layer Mask

► Chọn layer Mask vẽ hình shape chữ nhật W=970px, H=290px, bo góc =10

► Click phải vào layer Mask, rồi chọn lệnh mask

► Kết quả:

Bước 14: Xuất file

► Lưu file banner.FLA

► Xuất file: File > Publish: banner.SWF

FORM LIÊN HỆ

► Tạo các form nhận thông tin và gửi lên server để dùng PHP hoặc ASP, ASP.Net nhận và xử lý thông tin mà người dùng gửi lên server

► Bước 1: Tạo tài liệu

 Tạo file mới (Action script 2.0) và Ctrl + J (Modify > Document) để định dạng tài liệu

► Bước 2: Nhập văn bản và các label field.

 Hiện panel Components, rồi chọn User Interface, rồi kéo rê Label đặt vào Stage Rồi ở panelProperties, Component Parameters, nhập text = Họ tên

 Kế tiếp kéo label từ Library, đặt vào Stage Rồi ở panel Properties, Component Parameters, nhập text = Email

 Kế tiếp kéo label từ Library, đặt vào Stage Rồi ở panel Properties, Component Parameters, nhập text = Ý kiến

► Bước 3: Tạo các Text Input field và Text Area field

 Ở panel Components, rồi chọn User Interface, rồi kéo rê TextInput đặt vào Stage Rồi ở panel Properties, nhập Instance Name = hoten

 Kế tiếp kéoTextInput từ Library, đặt vào Stage Rồi ở panel Properties, nhập Instance Name

= email

 Ở panel Components, rồi chọn User Interface, rồi kéo rê TextArea đặt vào Stage Rồi ở panel Properties, nhập Instance Name = ykien

► Bước 4: Tạo Button Reset

 Vào window > Common Library > Buttons để hiện panel Buttons

 Chọn một loại Button, rồi kéo vào Stage

 Double Click Button để hiệu chỉnh lại Text = Hủy bỏ

 Click chọn Button Hủy Bỏ, rồi F9 hiện panel Actions - Button, rồi gõ Code:

► Bước 5: Tạo Button Submit

 Vào window > Common Library > Buttons để hiện panel Buttons

 Chọn một loại Button, rồi kéo vào Stage

 Double Click Button để hiệu chỉnh lại Text = Gởi đi

 Click chọn Button Gởi đi, rồi F9 hiện panel Actions - Button, rồi gõ Code:

 Kết quả:

► Bước 6: Tạo file mail.php lưu ở server

SCROLL TEXT

► Tạo một textblock Dynamic

 Nhập nội dung text vào hộp textblock Và chọn Behavior = MultiLine

 Chọn lệnh Text > Scrollable để cho phép cuộn text

 Chọn lệnh View > Snapping > Snap to Object để thiết lập bắt dính vào đối tượng

► Mở panel Components Rồi chọn Users Interface Kéo rê UIScrollBar thả vào TextBlock

► Kết quả: Ctrl + Enter

Download: scrolltext01.fla

SỬ DỤNG SWF DECOMPILER

Giao diện

► Gồm có các vùng:

 Vùng Ribbon menu: dùng để chọn lệnh

 Vùng Explorer: để chọn file.SWF cần chuyển đổi

 Vùng Preview: để xem nội dung file.SWF

 Vùng Playback Control: dùng để điều khiển xem phim hoạt hình

 Vùng Status bar: hiển thị tình trạng

 Vùng Export: liệt kê các Object, image, ,,, đã sử dụng trong file.SWF

 Click nút Export to FLA / FLEX

Chuyển đổi SWF -> FLA.

► Đơn giản chỉ cần thực hiện 4 bước:

 Trong panel Explorer: click chọn file SWF Trong Panel Preview: Xem thấy hoạt hình Và điều khiển hoạt hình như Play, Stop

 Trong Panel Export: Mở rộng danh mục các tài nguyên của phim hoạt hình Và click chọn các chi tiết này

 Click chọn Single SWF File Hoặc Thêm nhiều Files tới Multiple File trong panel Export

 Click nút Export FLA / FLEX để chuyển đổi file SWF thành FLA Rồi chọn nơi lưu trữ

Chuyển đổi SWF -> HTML5.

Export các file Resource