Với mục tiêu: “Phát huy tính tích cực, chủ động, sáng tạo của học sinh, bồi dưỡng phương pháp tự học, rèn luyện kỹ năng vận dụng kiến thức vào thực tiễn, tác động đến tình cảm , đem lại
Trang 1Cần Thơ, 2014
Trang 2LỜI CẢM ƠN
Em xin kính gửi tới Cô Bùi Lê Diễm (Bộ môn Toán - Trường Đại học Cần Thơ) lòng biết ơn sâu sắc nhất vì đã chỉ bảo và hướng dẫn tận tình cho em trong suốt quá trình thực hiện khoá luận này
Em xin kính gửi lời cảm ơn chân thành nhất tới Thầy Bùi Anh Tuấn (Bộ môn Toán - Trường Đại học Cần Thơ) đã chỉ bảo và định hướng cho em về đề tài luận văn này
Em xin gửi lời cảm ơn và biết ơn sâu sắc tới các thầy, cô đã dạy dỗ em trong suốt 4 năm học tập tại trường Đại học Cần Thơ Những kiến thức các thầy, cô dạy là
vô cùng quý báu và sẽ là hành trang để em vững bước vào đời
Và cuối cùng, con xin gửi lời cảm ơn và lòng biết ơn tới Cha Mẹ đã nuôi nấng, dạy dỗ và luôn động viên, làm chỗ dựa tinh thần cho con trong cuộc sống cũng như trong học tập
Xin chân thành cảm ơn!
Cần Thơ, ngày 22 tháng 04 năm 2014
Nguyễn Thị Hạnh Huệ
Trang 3MỤC LỤC
DANH MỤC CÁC HÌNH 6
PHẦN I: MỞ ĐẦU 7
PHẦN II: NỘI DUNG NGHIÊN CỨU 8
Chương 1: GIỚI THIỆU CÁC TIỆN ÍCH DÙNG ĐỂ THIẾT KẾ TRÒ CHƠI “DẮT NGỰA VỀ CHUỒNG” 8
1.1 ADOBE FLASH PROFESSIONAL CS5.5 8
1.1.1 Làm quen với giao diện Adobe Flash Professional CS5.5 8
1.1.2 Các vùng soạn thảo chính 10
a) Vùng Layer và TimeLine 10
b) Vùng thuộc tính Properties 11
c) Vùng thanh công cụ Tools 11
1.1.3 Các biểu tượng trong Flash CS5.5 14
a) Biểu tượng Graphic 14
b) Biểu tượng Button 15
c) Biểu tượng MovieClip 17
1.1.4 Tạo hoạt cảnh 18
a) Classic Tween 18
b) Shape Tween 19
c) Motion Tween 20
1.2 ACTIONSCRIPT 3.0 22
1.2.1 Sơ lược về ActionScript 22
a) ActionScript là gì? 22
b) ActionScript có thể làm những gì? 22
c) ActionScript có thể viết trên các đối tượng nào? 22
Trang 41.2.2 Kiểu dữ liệu mảng 23
1.2.3 Các cấu trúc lệnh điều khiển 24
a) Câu lệnh if 24
b) Câu lệnh lặp for 24
c) Câu lệnh lặp for in 25
d) Câu lệnh lặp for each in 25
e) Câu lệnh lặp while 25
f) Câu lệnh lặp do while 26
1.2.4 Hàm 26
1.2.5 Vùng chức năng Code Snippets 27
a) Actions 28
b)TimeLine Navigation 28
c) Animation 29
d) Load and Unload 29
e) Audio and Video 29
f) Event Handlers 29
g) Nhóm chức năng nâng cao hỗ trợ cho các dòng diện thoại thông minh chạy Android, iOS 30
Chương 2: CHƯƠNG TRÌNH TRÒ CHƠI “DẮT NGỰA VỀ CHUỒNG” 31
2.1 MÔ TẢ TRÒ CHƠI “DẮT NGỰA VỀ CHUỒNG” 31
2.2 TẠO CÁC CẢNH QUAY 31
2.2.1 Tạo cảnh khởi động của trò chơi 32
2.2.2 Tạo cảnh nơi diễn ra trò chơi 33
2.2.3 Tạo hướng dẫn cho trò chơi 34
2.3 LẬP TRÌNH TRÒ CHƠI 35
2.3.1 Lập trình cảnh 2 - Chơi trò chơi với máy 35
Trang 52.3.2 Lập trình cảnh 3 - Chơi trò chơi với người khác 43
2.3.3 Tạo chuyển động cho trò chơi 47
2.4 TỔ CHỨC TRÒ CHƠI “DẮT NGỰA VỀ CHUỒNG” TRONG DẠY HỌC TOÁN…… 49
2.4.1 Mục tiêu 49
a) Kiến thức 49
b) Thái độ 49
c) Kĩ năng sống 49
2.4.2 Tổ chức trò chơi 49
2.4.3 Kết luận 50
PHẦN III: KẾT LUẬN 51
TÀI LIỆU THAM KHẢO 52
Trang 6DANH MỤC CÁC HÌNH
Hình 1 - Màn hình chào đón của Flash CS5.5 8
Hình 2 - Cửa sổ ban đầu của Flash CS5.5 9
Hình 3 - Giao diện làm việc của Flash CS5.5 9
Hình 4 - Thanh TimeLine của Flash CS5.5 10
Hình 5 - Vùng thuộc tính Properties 11
Hình 6 - Thanh công cụ Tools 12
Hình 7 - Chuyển đổi sang biểu tượng Graphic 14
Hình 8 - Bảng thuộc tính của biểu tượng Graphic 15
Hình 9 - Chuyển đổi sang biểu tượng Button 16
Hình 10 - Bảng thuộc tính của biểu tượng Button 16
Hình 11 - Bảng thuộc tính của biểu tượng MovieClip 17
Hình 12 - Kĩ thuật Classic Tween 19
Hình 13 - Kĩ thuật Shape Tween 20
Hình 14 - Kĩ thuật Motion Tween 21
Hình 15 - Chức năng Motion Presets 21
Hình 16 - Hộp thoại Action Panel (đối tượng KeyFrame) 23
Hình 17 - Vùng chức năng Code Snippets 27
Hình 18 - Cảnh khởi động trò chơi “Dắt ngựa về chuồng” 32
Hình 19 - Cảnh 2 (chơi với máy) 34
Hình 20 - Cảnh 3 (chơi với người khác) 34
Hình 21 - Hướng dẫn trò chơi 35
Hình 22 - Hộp thoại Publish Settings 48
Trang 7PHẦN I: MỞ ĐẦU
Những năm gần đây việc ứng dụng công nghệ thông tin vào giáo dục đang được diễn ra rầm rộ nhằm đổi mới về hình thức và phương pháp giảng dạy, bên trong đó dạy học Toán cũng không ngoại lệ Với mục tiêu: “Phát huy tính tích cực, chủ động, sáng tạo của học sinh, bồi dưỡng phương pháp tự học, rèn luyện kỹ năng vận dụng kiến thức vào thực tiễn, tác động đến tình cảm , đem lại niềm vui, hứng thú học tập cho học sinh” [1] việc lập trình các trò chơi một cách hợp lý, lành mạnh
để học sinh tự tìm ra các kiến thức là điều cần thiết, đồng thời nếu các trò chơi mang tính học tập tạo được sự thu hút của các học sinh thì việc lạm dụng các trò chơi máy tính không lành mạnh trong bộ phận học sinh hiện nay sẽ được cải thiện Chính vì vậy, việc nghiên cứu lập trình trò chơi phục vụ dạy học là không thể
thiếu, cụ thể là trong dạy học toán Nên chúng tôi quyết định chọn đề tài “Nghiên cứu lập trình trò chơi “Dắt ngựa về chuồng” phục vụ dạy học Toán”
Trong luận văn này chúng tôi cố gắng vận dụng những kiến thức đã học và nghiên cứu được về phầm mềm Adobe Flash Professional CS5.5 với mục đích có thể lập trình trò chơi: “Dắt ngựa về chuồng” nhằm dạy học khái niệm phép đối xứng tâm để giúp học sinh tự mình khám phá ra được kiến thức và tự hình thành được nghĩa của kiến thức đó
Phần nội dung của luận văn bao gồm các chương sau:
- Chương I: Giới thiệu các tiện ích dùng để thiết kế trò chơi “Dắt ngựa về chuồng” gồm có:
+ Adobe Flash Professional CS5.5
+ ActionScrip 3.0
- Chương II: Chương trình trò chơi “Dắt ngựa về chuồng” gồm có:
+ Mô tả trò chơi “Dắt ngựa về chuồng”
+ Tạo các cảnh quay
+ Lập trình trò chơi
+ Tổ chức trò chơi “Dắt ngựa về chuồng” trong dạy học Toán
Trang 8PHẦN II: NỘI DUNG NGHIÊN CỨU
Chương 1
GIỚI THIỆU CÁC TIỆN ÍCH DÙNG ĐỂ THIẾT KẾ TRÒ CHƠI
“DẮT NGỰA VỀ CHUỒNG”
1.1 ADOBE FLASH PROFESSIONAL CS5.5
Flash là một kĩ thuật tạo các hiệu ứng động (24 hình/giây), các thước phim hoạt hình, thiết kế giao diện người dùng cho các ứng dụng web, lập trình các trò chơi từ đơn giản đến nâng cao, Flash sử dụng đồ hoạ vector có thể phóng to ảnh
mà không làm bể hạt nhưng vẫn đảm bảo kích thước tập tin flash nhỏ gọn và thường được truyền tải trên World Wide Web, thuận tiện cho người sử dụng tải về hay sử dụng trực tuyến bất cứ lúc nào Bên cạnh đó phần mềm Adobe Flash Professional CS5.5 có giao diện thân thiện với người dùng, có nhiều công cụ mới làm cho việc sáng tạo trở nên đơn giản hơn, đặc biệt có hiệu ứng script hổ trợ các dòng máy có màn hình cảm ứng và tập tin flash xuất ra có thể ở định dạng *.exe chạy ổn định trên mọi hệ điều hành
1.1.1 Làm quen với giao diện Adobe Flash Professional CS5.5
Khi khởi động Adobe Flash Professional CS5.5 (gọi tắt là Flash CS5.5), màn hình Splash - màn hình chào đón hiện ra:
Hình 1 - Màn hình chào đón của Flash CS5.5
Trang 9Sau khi hoàn thành quá trình khởi động, Flash sẽ hiện ra cửa sổ ban đầu:
Hình 2 - Cửa sổ ban đầu của Flash CS5.5
Ở phần Create New, nhấp chọn ActionScript 3.0 (trong luận văn này chúng tôi chỉ sử dụng ActionScript 3.0 và phần này sẽ được nói rõ hơn trong mục 1.2), giao diện chính thức để làm việc được hiên ra:
Hình 3 - Giao diện làm việc của Flash CS5.5
- Vùng hệ thống menu nằm trên cùng
- Vùng thanh công cụ nằm bên trái
- Vùng thuộc tính và thư viện nằm bên phải
- Vùng sáng tác là khung trắng ở trung tâm
- Vùng Layer và TimeLine nằm phía dưới cùng
Để phóng to hay thu nhỏ khung sáng tác sử dụng Ctrl + = hay Ctrl + - hoặc hiệu chỉnh trên khung hiển thị dấu % cạnh khung thuộc tính
Trang 101.1.2 Các vùng soạn thảo chính
a) Vùng Layer và TimeLine
Hình 4 - Thanh TimeLine của Flash CS5.5
Layer là các lớp được dùng trong việc sáng tác Mỗi một khung hình có thể có
nhiều layer khác nhau, mỗi một đối tượng thường được xây dựng trên mỗi layer
- Nhóm biểu tượng xoá và tạo layer (nằm dưới cùng bên góc trái hình 4): biểu tượng thứ nhất từ trái sang là tạo player, biểu tượng giữa là tạo mới một thư mục để chứa player và biểu tượng cuối cùng là xoá layer hoặc thư mục
- Nhóm biểu tượng tuỳ chỉnh layer (nằm bên góc phải của vùng layer): biểu tượng thứ nhất từ trái sang (hình con mắt) cho phép ẩn hay hiện layer được chọn, biểu tượng giữa khoá không cho phép chỉnh sửa đối tượng trên layer được chọn và biểu tượng cuối cùng hiển thị đường viền và màu nền hay chỉ hiển thị đường viền của đối tượng
TimeLine chứa nhiều Frame, khi tạo ra chuyển động các Frame lần lượt thay
thế cho nhau
- Frame (những ô nhỏ được đánh số như hình trên) là khung hình dùng trong
kĩ thuật tạo chuyển động
- Các chức năng hiển thị trên thanh TimeLine: Trong biểu tượng menu thả xuống nằm phía trên bên phải có các chức năng sau: Tiny (siêu nhỏ), Small (nhỏ), Normal (bình thường), Medium (trung bình), Large (lớn), Preview (xem rõ hình), Preview in Context (xem rõ hình theo ngữ cảnh)
- Các biểu tượng tuỳ chỉnh nằm phía dưới cùng:
+ Năm biểu tượng đầu dùng để di chuyển và chạy thử các Frame
+ Biểu tượng Center Frame: xác định Frame trung tâm
Trang 11+ Biểu tượng Onion Skin: cho phép hiển thị toàn bộ hình ảnh của đối tượng trên vùng Frame được chọn (toàn bộ đối tượng)
+ Biểu tượng Onion Skin Outlines: cho phép hiển thị viền của đối tượng trên vùng Frame được chọn
+ Biểu tượng Edit Multiple Frame: cho phép hiển thị đối tượng gốc trên toàn
bộ đối tượng hiển thị theo hai chức năng Onion Skin trên để dễ chỉnh sửa đối tượng
Publish gồm các tuỳ chỉnh Profile (quản lý các thông tin liên quan đến việc
xuất tập tin flash), Player (cho phép tập tin trình chiếu có thể hoạt động tốt trên phiên bản của Flash Player nào), Script (phiên bản ActionScript mà đoạn phim đang
sử dụng), Class (nhập tên lớp thể hiện để Flash khởi tạo cú pháp khai báo lớp nội
tại)
Properties chứa FPS (tốc độ trình chiếu - đo bằng frame trên mỗi giây Frames
Per Second), Size (kích thước của khung trình chiếu - đo bằng pixel), Stage (quản lý
màu nền của khung soạn thảo)
c) Vùng thanh công cụ (Tools)
Chứa các công cụ để tạo hình, hiệu chỉnh và tạo các hiệu ứng cho các đối tượng Có thể di chuyển nó và kéo thả nó ở một vị trí bất kỳ cho tiện làm việc
Trang 12Hình 6 - Thanh công cụ Tools
Khi di chuyển chuột đến công cụ nào thì sẽ xuất hiện tên của công cụ đó Bên cạnh một số công cụ có dấu tam giác nhỏ màu đen, khi nhấp chuột vào sẽ xuất hiện bảng chọn những công cụ khác Đồng thời khi chọn công cụ nào thì vùng Properties
sẽ hiển thị các thuộc tính tuỳ chỉnh cho đối tượng mà công cụ đó tạo ra
Pencil: dùng để vẽ các đối tượng bằng tay, có các thuộc tính sau:
+ Stroke color: màu sắc của nét vẽ
+ Stroke: kích thước của nét vẽ
+ Style: dạng thức của nét vẽ, nhấp dấu tam giác để chọn
+ Scale: độ kéo giãn của hình được vẽ, nó có thể là None (không kéo giãn), Normal (kéo giãn bình thường), Horizontal (kéo giãn theo chiều ngang) hoặc Vertical (kéo giãn theo chiều dọc)
+ Hinting: Giúp bảo vệ nét vẽ ở đường cong khỏi bị mờ
+ Cap: thiết lập dạng thức cho đường kết thúc
+ Join: xác định cách mà hai phân đoạn của đối tượng nối với nhau
+ Mitter: điều khiển độ sắc nét của Mitter, khi Cap được chọn là Mitter
Brush: cũng tương tự Pencil, Brush cũng được dùng để vẽ nhưng nét vẽ
không bao gồm viền chỉ có màu nền Brush có các thuộc tính sau:
+ Fill color: chọn màu cho nét vẽ brush
+ Smoothing: thiết đặt độ mềm dẻo cho nét vẽ
Erase: xoá các nét vẽ
Line: dùng để vẽ đường thẳng, có các thuộc tính như công cụ Pencil
Rectangle: dùng để vẽ hình chữ nhật và các dạng thể biến của nó (có thể là
hình vuông, hình bình hành, hình oval, ) thuộc tính tương tự như Pencil
Text: soạn thảo nội dung văn bản trong flash, có các thuộc tính sau:
Trang 13+ Text Tool có 3 tuỳ chọn: Static Text (văn bản cố định), Dynamic Text (văn bản có thể chọn, sao chép nhưng không thể thay đổi), Input Text (nội dung của văn
bản có thể thay đổi)
+ Character: Family (chọn loại phông chữ), Style (chọn dạng thức cho phông chữ), Size (chọn kích thước cho phông chữ), Letter Spacing (chọn độ rộng cho kí tự trắng giữa các chữ cái), Color (chọn màu chữ), Auto Kern (tự động co giãn), Anti- Alias (làm cho nét chữ trở nên mượt mà hơn)
+ Show Border around Text: hiển thị đường viền xung quanh văn bản
+ SubScript và SuperScript: tạo chỉ số dưới và chỉ số trên
+ Format: căn chỉnh vị trí văn bản
+ Spacing và Margin: hiệu chỉnh khoảng cách
+ Behavior: hiệu chỉnh tuỳ chọn hiển thị văn bản
+ Orientation: thay đổi chiều hiển thị của văn bản
Selection: có thể chọn toàn bộ hoặc một phần đối tượng bằng cách kích chuột
vào nó hoặc bôi đen một phần của nó Ngoài ra còn có thể kéo giãn hoặc uốn cong hình thể của đối tượng
Laso: tương tự như công cụ Selection nhưng có thể chọn đối tượng theo hình
dạng phức tạp
Paint Bucket: dùng để tô màu nền cho vật thể, có các thuộc tính sau:
+ Fill Color: đổ màu nền cho đối tượng
+ Alpha: độ trong suốt của đối tượng
Ink Bottle: dùng để tô màu viền của đối tượng, có các thuộc tính như Pencil EyeDropper: dùng để lấy thông số màu tại một vị trí trên đối tượng, chọn biểu
tượng, sau đó kích vào một vị trí nào đó trên bức ảnh (vị trí mà ta cần lấy thông số màu), khi đó thông số màu nền mặc định sẽ là màu của vị trí vừa kích chuột
Free Transform: dùng để hiệu chỉnh góc cạnh, xoay đối tượng, phóng to hay
thu nhỏ đối tượng, dịch chuyển tương đối các phần của đối tượng
Trang 14Gradient Transform: hiệu chỉnh các thông số khi tạo màu cầu vồng cho đối
tượng (tăng hay giảm kích thước vùng sáng, thay đổi tâm của vùng sáng, thay đổi vị trí vùng màu, )
Pen: dùng để vẽ các đường đa giác bằng cách tạo các điểm điều khiển, sau đó
tự động nối các điểm này lại với nhau Các thuộc tính của công cụ này hoàn toàn
tương tự công cụ Line
1.1.3 Các biểu tượng trong Flash CS5.5
a) Biểu tượng Graphic
Biểu tượng Graphic là một hình ảnh tĩnh có thể được tái sử dụng để tạo ra
chuyển động Bất kì một ảnh điểm, vector hay văn bản đều có thể chuyển đổi thành
Graphic Chúng chỉ có một Frame trên thanh TimeLine
Các bước sau nhằm tạo một Graphic:
- Chọn đối tượng cần chuyển đổi sang biểu tượng Graphic
- Nhấp chuột phải chọn Convert to Symbol (hoặc nhấn phím F8) Đặt tên cho biểu tượng sẽ được tạo trong ô Name, chọn loại biểu tượng cần tạo (Graphic)
Hình 7 - Chuyển đổi sang biểu tượng Graphic
- Nhấp OK, một biểu tượng Graphic sẽ được tạo và đưa vào thư viện
Các thuộc tính của biểu tượng Graphic
- Thanh tuỳ chọn thả xuống: cho phép chuyển đổi qua lại giữa các biểu tượng
- Instance of: khi kích chuột vào tuỳ chọn swap, có thể thay đổi biểu tượng của
đối tượng thể hiện được chọn
- Position and Size: cho phép hiệu chỉnh vị trí toạ độ của đối tượng đang thể hiện (x và y), và kích thước (w - width và h - height) Tuỳ chọn Lock width and
Trang 15height values together cho phép thay đổi kích thước chiều rộng và cao đồng thời
Biểu tượng Button dùng để bổ sung một tương tác với chương trình, đáp trả
các sự kiện kích chuột, ấn phím, kéo các thanh kéo và các hành động khác Một
biểu tượng Button sẽ có bốn Frame tương tác: Up, Down, Over và Hit Biểu tượng Button có thể được cài đặt và điều khiển bằng ActionScript
Các bước để tạo một Button:
Cách 1:
- Chọn đối tượng cần chuyển đổi sang Button
- Nhấp chuột phải chọn Convert to Symbol (hoặc nhấn phím F8) Đặt tên cho biểu tượng sẽ được tạo trong ô Name, chọn loại biểu tượng cần tạo (Button)
Trang 16Hình 9 - Chuyển đổi sang biểu tƣợng Button
- Nhấp OK để hoàn tất việc tạo Button
Cách 2: Sử dụng các Button đƣợc tạo sẵn bằng cách vào Windows Common Libraries Button
Cách 3: Sử dụng Commands bằng cách tạo một khối hình thể, nhấp chọn nó, sau đó vào Commands Make Button
Các thuộc tính của biểu tượng Button
Hình 10 - Bảng thuộc tính của biểu tƣợng Button
- Instance Name: tên hiển thị của biểu tƣợng Đƣợc dùng khi làm việc với
ActionScript
Trang 17- Thanh tuỳ chọn thả xuống: cho phép chuyển đổi qua lại giữa các biểu tượng
- Instance of: chọn swap để thay đổi biểu tượng cho đối tượng hiển thị
- Position and Size: thay đổi vị trí và kích thước cho đối tượng
- Color effect: chọn hiệu ứng màu sắc cho đối tượng, bao gồm Brightness, Tint, Advanced và Alpha
- Display: với thuộc tính Blending, cho phép ta chọn các chế độ pha trộn màu sắc cho Button
- Tracking: với Options gồm 2 tuỳ chọn Track as Button hoặc Track as MenuItem
- Filter: hoàn toàn tương tự Filter khi làm việc với công cụ Text
c) Biểu tượng MovieClip
Là một mẫu hoạt hình của Flash có thể được tái sử dụng Khác với Graphic và Button, MovieClip có riêng một TimeLine với vô số Frame có thể dùng để tạo hoạt hình Một MovieClip có thể bao gồm một hoặc nhiều biểu tượng Graphic, Button hoặc thậm chí là MovieClip Cũng tương tự như Button, có thể cài một tên hiển thị
cho nó để điều khiển nó bằng ActionScript
Các thuộc tính của MovieClip
Hình 11 - Bảng thuộc tính của biểu tượng MovieClip
Trang 18Bên cạnh một số thuộc tính quen thuộc tương đồng với Graphic và Button, MovieClip còn có một số thuộc tính nâng cao khác:
- 3D Position and View: hiệu chỉnh vị trí trong không gian và khung nhìn ba
chiều
- Perspective Angle: hiệu chỉnh góc phối cảnh theo độ xa gần
- Vanishing Point: hiệu chỉnh toạ độ của điểm triệt tiêu
1.1.4 Tạo hoạt cảnh
a) Classic Tween
Classic Tween là một kĩ thuật tạo chuyển động cho đối tượng Khi sử dụng Classic Tween, đối tượng sẽ được chuyển đổi thành hai biểu tượng Graphic (một biểu tượng cho KeyFrame đầu tiên và một biểu tượng cho KeyFrame kết thúc Không thể sử dụng các hiệu ứng ba chiều cho Classic Tween cũng như không thể sử dụng các chức năng swap symbol cho đối tượng thể hiện, nhưng Classic Tween cho phép chứa Frame ActionScript
Các bước sử dụng Classic Tween để tạo hiệu ứng động
Đây là một ví dụ tạo hình tròn chuyển động không theo một phương hướng nhất định nào
- Bước 1: Dùng công cụ Oval để tạo hình tròn (kết hợp với phím Shift), dùng công cụ Free Transform chọn hết cả hình tròn (bao gồm viền và nền), nhấn phím F8 chuyển hình tròn từ Shape thành MovieClip, đặt tên tuỳ ý
- Bước 2: Kích chuột vào Frame thứ 20, nhấn F6 để chèn KeyFrame kết thúc, thay đổi vị trí hình tròn tại Frame thứ 20 này, tiếp tục tạo các KeyFrame tại các vị trí Frame thứ 30, 40, 45, 55 và thay đổi vị trí của chúng ở các Frame này
- Bước 3: Nhấp chuột vào giữa các khoảng cách giữa KeyFrame mở đầu và KeyFrame kết thúc, nhấp phải chuột chọn Classic Tween Và làm tương tự cho các khoảng KeyFrame còn lại
- Bước 4: Nhấn Ctrl + Enter để kiểm tra
Nếu muốn điều chỉnh tốc độ của chuyển động thì thay đổi vị trí Frame (mặc định của Flash CS5.5 là 24 hình/giây)
Trang 19Hình 12 - Kĩ thuật Classic Tween Trong hình minh hoạ sử dụng hình tròn với nền trắng và dùng công cụ Onion Skin (đã được kéo hai đầu mút từ Frame 1 đến Frame 55) để mô tả chuyển động
b) Shape Tween
Chức năng chính của Shape Tween là “biến hình”, cũng tương tự như Classic Tween, phải tạo hai KeyFrame mở đầu và kết thúc để hình thành chuyển động, cơ chế của nó là nhờ vào thuật toán Transform, nghĩa là sẽ dịch chuyển các điểm được đánh dấu theo một chỉ số nào đó ở Frame đầu tiên đến vị trí được đánh dấu cùng chỉ
số trong Frame cuối cùng Shape Tween không hỗ trợ hiệu ứng ba chiều, cũng không hỗ trợ chức năng swap symbol
Các bước sử dụng Shape Tween để tạo hiệu ứng động
Đây là ví dụ đặc trưng của Shape Tween - tạo hiệu ứng biến đường thẳng thành đường cong, và ví dụ này không thể thực hiện ở Classic Tween và Motion Tween
- Bước 1: Dùng công cụ Line vẽ một đường thẳng trên khung sáng tác
- Bước 2: Dùng công cụ Selection, bấm chọn đường thẳng, kích chuột phải và chọn Create Shape Tween
- Bước 3: Chọn Frame thứ 50 nhấn F6 và Frame thứ 25 nhấn F6, tại Frame thứ 25 này dùng công cụ Add Anchor Point nhấp vào đường thẳng để bổ sung các điểm điều khiển, sau đó dùng công cụ Convert Anchor Point để tạo điểm uốn Khi
Trang 20thực hiện các thao tác trên có nghĩa là làm đường thẳng ở Frame 1 từ từ biến thành đường cong ở Frame 25 và đường cong này từ từ biến trở lại thành đường thẳng ở Frame 50, điều này giúp chuyển động trở nên mượt mà hơn
- Bước 4: Nhấn Ctrl + Enter để kiểm tra kết quả
Hình 13 - Kĩ thuật Shape Tween
c) Motion Tween
Kĩ thuật Motion Tween cũng được dùng để tạo chuyển động như hai Tween trên nhưng nó đơn giản hơn kĩ thuật Classic Tween nhiều Nó không đòi hỏi bạn phải tạo các KeyFrame, mà nó còn hổ trợ hiệu ứng ba chiều (Translation và Rotation) Với Motion Tween việc hiệu chỉnh đường dịch chuyển, toạ độ, góc xoay, Filter, Blending, là một việc rất đơn giản nhờ vào công cụ Selection và thuộc tính trong bảng Motion Editor
Các bước sử dụng Motion Tween để tạo hiệu ứng động
Đây là ví dụ tạo hình trái tim chuyển động theo đường cong bất kỳ
- Bước 1: Dùng công cụ Brush vẽ hình trái tim (hoặc một hình ảnh bất kì) trên
Trang 21được đánh dấu, khi trỏ chuột có dạng mũi tên hai chiều, hãy nhấp chuột và kéo sang trái hoặc sang phải
- Bước 3: Di chuyển hình vẽ sang vị trí mới, khi đó trên khung sáng tác sẽ xuất hiện một thanh mô tả chuyển động màu xanh lá, có thể sử dụng công cụ
Selection để thay đổi dạng thức của đường chuyển động
- Bước 4: Nhấn Ctrl + Enter để kiểm tra
Hình 14 - Kĩ thuật Motion Tween Tạo chuyển động nhờ vào Motion Presets
Chức năng Motion Presets này cung cấp rất nhiều hiệu ứng làm sẵn, đầu tiên
hãy tạo một đối tượng (dùng công cụ vẽ một hình bất kỳ trên khung sáng tác), mở
chức năng Motion Presets bằng cách vào Windows Motion Presets, sau đó chọn đối tượng và chọn hiệu ứng chuyển động tương ứng trong khung Motion Presets
vừa mới xuất hiện
Hình 15 - Chức năng Motion Presets
Trang 22bất cứ Frame nào, hay chạy ngược trở lại Frame nào, nhảy một số Frame rồi chơi
tiếp, không dừng lại ở đó ActionScript có thể làm cho các phim Flash biến thành một chương trình ứng dụng có sự tương tác của người dùng:
- Tạo những hoạt hình phức tạp: ví dụ như trái banh có thể chuyển động lên xuống xung quanh màn hình mà không bao giờ ngừng, và tuân theo các định luật vật lý như lực hút, lực ma sát, lực phản,
- Thu thập thông tin người dùng (User Input) và các nguồn khác nhau
- Thay đổi hình ảnh khi đang trình chiếu : ActionScript có thể thay đổi kích
thước , màu sắc, vị trí của MovieClip trong Flash, thêm hoặc xoá các MovieClip
- Điều khiển âm thanh trong Flash
c) ActionScript có thể viết trên các đối tượng nào?
- TimeLine: ActionScript có thể viết vào KeyFrame ở bất cứ TimeLine nào và
Flash sẽ thực hiện lệnh khi chạy tới KeyFrame đó Ví dụ lệnh stop() được đặt ở KeyFrame thứ 5 trên TimeLine thì khi Flash chạy tới KeyFrame 5 sẽ dừng lại cho
tới khi có lệnh khác
Trang 23- Button (nút): Nếu không có ActionScript đi kèm thì Button sẽ không có tác
dụng gì, ActionScript viết trên Button chỉ có thể hoạt động khi chuột hoặc bàn phím tác động lên Button đó mà thôi
- MovieClip: ActionScript viết trên MovieClip có thể điều khiển chính
MovieClip đó hay các MovieClip trong cùng một TimeLine hay các TimeLine ở
- Cách 1: var tenmang:Array = new Array (kích thước mảng);
- Cách 2: var tenmang:Array = new Array (các phần tử);
hoặc var tenmang:Array = [các phần tử];
Cách khai báo một thường dùng khi người lập trình chưa biết chính xác giá trị các phần tử cũng như kích thước các phần tử trong mảng, cũng trong cách khai báo này, tham số kích thước có thể không tồn tại, kích thước mảng có thể thay đổi, nó
Trang 24có thể tăng lên hoặc giảm xuống so với kích thước được cấp phát ban đầu Trong khi cách khai báo hai được dùng nếu kích thước hoặc giá trị của các phần tử đã được biết
Truy cập các phần tử của mảng
Mảng được truy cập theo chỉ số Chỉ số của mảng được đặt trong cặp dấu móc vuông: tenmang[chỉ số]
Bổ sung và loại bỏ phần tử của mảng
Khác với các ngôn ngữ lập trình khác, mảng trong ActionScript là một cấu trúc động có thể được sử dụng như danh sách liên kết và có thể thay đổi kích thước của mảng cũng như có thể thêm phần tử hoặc xoá bỏ một phần tử nào đó Để thêm mới một phần tử vào mảng (chỉ có thể thêm vào cuối mảng) có thể sử dụng phương
thức push Ngược lại, để loại bỏ một phần tử thì có thể sử dụng phương thức pop và
Trang 25Giải thích: lệnh sẽ được thực hiện với số lần lặp chính là số lần lặp của i (i = (bt.giới.hạn - bt.khởi.tạo)/bt.tăng +1
c) Câu lệnh lặp for in
Khi chỉ số của mảng không liên tục hoặc không tuân theo một quy tắc nào đó, thì cách sử dụng vòng lặp for ở trên không còn hiệu quả Để khắc phục nhược điểm
này, ActionScript bổ sung vòng lặp for in Bên cạnh đó, đối với Obiect, thì phần
đánh chỉ số có thể không đơn thuần là số mà có thể là kiểu dữ liệu bất kì Khi đó, ta bắt buộc phải sử dụng vòng lặp for in này (hoặc for each in sẽ được trình bày trong mục tiếp theo)
Cú pháp:
for (var index in Array/Object) {lệnh;}
Giải thích: Trong vòng lặp for in này, chỉ số index sẽ được vét trong tập chỉ
số của Array hoặc Object Tương ứng với chỉ số này, có thể thu được giá trị của các phần tử tương ứng
d) Câu lệnh lặp for each in
Tương tự như câu lệnh for in, câu lệnh for each in cũng có thể sử dụng cho mảng có chỉ số không liên tục hoặc Object Tuy nhiên, for each in truy cập đến các phần tử trực tiếp mà không cần thông qua chỉ số
Cú pháp:
for each(var item in Array/Object)
{lệnh;}
Giải thích: Khác với câu lệnh for in, biến item trong câu lệnh for each in sẽ
nhận giá trị của các phần tử của mảng chứ không phải là chỉ số và nó cũng được khai báo trực tiếp trong vòng lặp for
e) Câu lệnh lặp while
Cú pháp:
Trang 26while (biểu.thức.điều.kiện) {lệnh;}
Giải thích: Câu lệnh While luôn kiểm tra biểu thức điều kiện trước khi thực thi lệnh, nếu biểu thức điều kiện đúng thì thực thi lệnh (và tiếp tục lặp lại quá trình này), nếu biểu thức điều kiện sai ngay từ đầu thì lệnh sẽ không được thực thi
f) Câu lệnh lặp do while
Cú pháp:
do {lệnh;}
while (biểu.thức.điều.kiện);
Giải thích: Khác với câu lệnh while, khi sử dụng lệnh do while thì lệnh sẽ được thực thi trước, sau đó kiểm tra biểu thức điều kiện, nếu biểu thức điều kiện còn đúng thì lệnh sẽ tiếp tục được thực hiện, cũng có nghĩa là lệnh bên trong do while được thực hiện ít nhất một lần
cơ chế truyền tham số, giúp cho chương trình trở nên gọn gàng hơn Có thể hiểu hàm trong ActionScript giống với các hàm toán học
Cú pháp khai báo hàm:
function tên.hàm (ds.tham.số):kiểu.dữ.liệu.trả.về {thân.hàm;}