1. Trang chủ
  2. » Giáo Dục - Đào Tạo

Giáo trình macromedia flash (nghề ứng dụng phần mềm trình độ cao đẳng)

53 5 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Giáo trình Macromedia Flash
Tác giả Lê Hoàng Phúc, Giang Tuấn Nguyên
Trường học Cao đẳng
Chuyên ngành Ứng dụng phần mềm
Thể loại Giáo trình
Năm xuất bản 2017
Thành phố Cần Thơ
Định dạng
Số trang 53
Dung lượng 1,45 MB

Cấu trúc

  • II. MỤC TIÊU MÔ ĐUN (6)
  • III. NỘI DUNG MÔ ĐUN (6)
    • 1. Giới thiệu làm phim (0)
    • 2. Phần mềm Flash và các bước cài đặt (7)
    • 3. Các định dạng ảnh tĩnh và động trên Web (11)
  • BÀI 1: GIỚI THIỆU PHẦN MỀM FLASH VÀ THIẾT KẾ VẼ CƠ BẢN (2)
    • 1. Giới thiệu ứng dụng FLASH (12)
      • 1.1 Các tính năng của ứng dụng (12)
      • 1.2 Giao diện làm việc (12)
      • 1.3 Thiết lập môi trường làm việc (13)
    • 2. Các đối tượng cơ bản (0)
      • 2.1 Các đối tượng trong trang hoạt hình (16)
      • 2.2 Khả năng thiết kế các hoạt cảnh (17)
      • 2.3 Quản lý các đối tượng bằng cửa sổ Library (19)
    • 3. Phân cảnh (20)
      • 3.1 Khái niệm phân cảnh (20)
      • 3.2 Cách tạo phân cảnh (20)
      • 3.3 Sắp xếp và hiệu chỉnh phân cảnh (0)
    • 4. Thực hành (21)
      • 4.1 Thao tác các công cụ vẽ và thiết lập môi trường vẽ (21)
      • 4.2 Xây dựng 3 đối tượng trên 3 lớp (21)
      • 4.3 Xây dựng 5 phân cảnh cho 3 đối tượng (22)
    • 5. Kiểm Tra (23)
  • BÀI 2 TẠO CHUYỂN ĐỘNG (2)
    • 1. Thiết kế hoạt hình (24)
      • 1.1 Các đối tượng đoạn (24)
      • 1.2 Các đối tượng nút (24)
      • 1.3 Gán hành động bằng Timeline (24)
    • 2. Biến đổi vị trí hình vẽ (0)
      • 2.1 Tạo các hình vẽ (25)
      • 2.2 Biến đổi theo Tweening (26)
      • 2.3 Trình tự các bước biến đổi (27)
      • 2.4 Ví dụ ứng dụng (28)
    • 3. Sự biến đổi hình dạng hình vẽ (28)
      • 3.1 Các yêu cầu của biến đổi hình vẽ (28)
      • 3.2 Biến đổi theo Shape (28)
      • 3.3 Trình tự các bước biến đổi (0)
      • 3.4 Ví dụ ứng dụng (29)
    • 4. Phép xoay hình (30)
      • 4.1 Cách tạo phép xoay hình (30)
      • 4.2 Trình tự phép xoay hình (31)
      • 4.3 Ví dụ ứng dụng (31)
    • 5. Thực hành (0)
      • 5.1 Xây dựng các Frame, KeyFrame, BlankKeyFrame (0)
      • 5.2 Thiết kế hoạt cảnh quả bóng di chuyển trên màn hình (0)
      • 5.3 Vẽ và thiết kế mô phỏng sự chuyển động của một mạch điện bất kỳ (0)
      • 5.4 Vẽ và thiết kế chuyển động mô phỏng quá trình xử lý dữ liệu trên máy tính cá nhân (35)
  • BÀI 3: LÀM VIỆC VỚI LỚP (2)
    • 1. Lớp và thiết lập lớp (36)
      • 1.1 ý nghĩa của lớp (36)
      • 1.2 Thiết lập lớp (36)
      • 1.3 Hiệu chỉnh lớp (37)
    • 2. Lớp mặt nạ (38)
      • 2.1 ứng dụng lớp mặt nạ (38)
      • 2.2 Cách tạo lớp mặt nạ (38)
      • 2.3 Hiệu chỉnh lớp mặt nạ (39)
    • 3. Lớp đường dẫn (39)
      • 3.1 ứng dụng lớp đường dẫn (39)
      • 3.2 Cách tạo lớp đường dẫn (39)
      • 3.3 Hiệu chỉnh lớp đường dẫn (40)
      • 4.1 Thiết lập các lớp trên cửa sổ Timeline (40)
  • BÀI 4 XÂY DỰNG CÁC ACTION (2)
    • 1. Làm việc với nút (45)
      • 1.1 Cách tạo nút (45)
      • 1.2 Các tính năng của nút (46)
      • 1.3 Gán Action cho nút (46)
    • 2. Xây dựng hoạt hình bằng Action (46)
      • 2.1 Làm việc với cửa sổ Action (46)
      • 2.2 Gán Action lên các Frame (46)
      • 2.3 Các cấu trúc Action cơ bản (47)
    • 3. Thư viện Action (47)
      • 3.1 Nhóm Autoplay (47)
      • 3.2 Nhóm KeyPress (48)
      • 3.3 Nhóm Goto (48)
      • 4.1 Tạo các nút và xây dựng Action trên nút (48)
      • 4.2 Dùng Action mô phỏng hiện tượng tuyết rơi (49)
    • 5. Kiểm tra (43)
  • TÀI LIỆU THAM KHẢO (0)

Nội dung

MỤC TIÊU MÔ ĐUN

 Trình bày được cách tạo các đối tượng, các cảnh trong phim

 Nêu được trình tự xây dựng phim hoạt hình bằng Flash

 Nêu được các cách thiết lập chuyển động và cách hiệu chỉnh chuyển động trong Flash

 Vận dụng thành thạo cách tạo các đối tượng vẽ và gán hành động cho đối tượng vẽ Ứng dụng được vào thực tiễn

 Có phẩm chất đạo đức, kỷ luật tốt, tích cực nghiên cứu học hỏi nâng cao trình độ.

NỘI DUNG MÔ ĐUN

Phần mềm Flash và các bước cài đặt

Macromedia Flash là phần mềm đồ họa chuyên nghiệp, cho phép người dùng tạo ra các sản phẩm và nội dung tương tác hấp dẫn trên nền tảng trực tuyến Với bộ công cụ đơn giản, Macromedia Flash hỗ trợ thiết kế hiệu ứng đồ họa, văn bản, video và nội dung cho thiết bị di động một cách hiệu quả.

Vào thưmục cài đặt, click đúp vào file Setup.exe để tiến hành cài đặt.

Chương trình cài đặt tiến hành kiểm tra thông tin cấu hình máy tính

Nhập mã đăng ký hoặc chọn cài đặt dùng thử sản phẩm, sau đó nhấn Next Tiếp theo, chọn đường dẫn cài đặt và các ứng dụng đi kèm, rồi click Install để bắt đầu quá trình cài đặt.

- Quá trình cài đặt bắt đầu Đăng ký thông tin cá nhân

Click exit để hoàn tất quá trình cài đặt.

GIỚI THIỆU PHẦN MỀM FLASH VÀ THIẾT KẾ VẼ CƠ BẢN

Giới thiệu ứng dụng FLASH

1.1 Các tính năng của ứng dụng

Flash là công cụ phát triển ứng dụng, đặc biệt trong thiết kế phần mềm mô phỏng, sử dụng ngôn ngữ lập trình ActionScript để tạo ra các tương tác và hoạt cảnh trong phim Điểm mạnh của Flash là khả năng nhúng âm thanh và hình ảnh động, cho phép lập trình viên tạo ra các điều hướng linh hoạt cho chương trình Ngoài ra, Flash có khả năng xuất bản đa dạng các định dạng file như HTML, EXE, và JPG, phù hợp với nhiều ứng dụng khác nhau trên Web và CD.

Kỹ thuật Flash cho phép tích hợp vào trang web hoặc hoạt động như một ứng dụng Internet độc lập, với khả năng thực thi tệp tin swf mà không cần phần mềm bổ sung, ngay cả khi không có kết nối Internet Flash thường được sử dụng cho các nội dung "Rich Media" và "Motion Design", mang lại trải nghiệm tương tác phong phú cho người dùng.

- Tạo trang Web hoặc trò chơi

- Tạo ra các hướng dẫn

- Tạo các Video truyền hình hoặc điện ảnh

- Truyền chiếu Video qua Internet

Ngoài ra, ứng dụng Flash còn dùng trong nhiểu các phần mềm và định dạng khác, ví dụ:

- Flash Video với đuôi mở rộng flv

- FlashPaper, định dạng tương tự Acrobat PDF

Khả năng truy cập (Accessibility)

Việc xây dựng một trang web bằng Flash với tính truy cập cao yêu cầu nhiều tối ưu hóa và phải đối mặt với các áp lực kỹ thuật, tương tự như khi xây dựng trang web bằng XHTML hay HTML.

- Menu: Gồm nhiều chức năng, có nhiệm vụ điều khiển tổng quát cho file flash

- Thanh công cụ: dùng để thiết kế các đối tượng, gồm có 4 phần:

+ Tool: nhóm công cụ dùng để thiết kế

+ View: nhóm công cụ hỗ trợ việc quan sát

+ Color: nhóm màu hỗ trợ cho các công cụ;

+ Options: mở rộng, bổ sung thêm các chức năng cho các công cụ trong tool

1.3 Thiết lập môi trường làm việc

- Thay đổi kích thước Stage

Kích thước của Stage xác định kích thước phim Flash

+ Thiết lập các thông số kích thước Stage rồi OK

- Phóng to –thu nhỏ Stage

- Tắt – mở thước đo (Ruler)

C1: Vào View \ Grid \ Show Grid

Hiệu chỉnh lưới: Edit Grid

Các đối tượng cơ bản

2.1 Các đối tượng trong trang hoạt hình

Đối tượng Graphic là hình ảnh tĩnh có thể tái sử dụng để tạo ra chuyển động, bao gồm ảnh điểm, vector và văn bản, tất cả đều có thể được chuyển đổi thành các yếu tố động.

Graphic Chúng chỉ có 1 frame trên thanh TimeLine Đối tượng Graphic củng không hổ trợ Action Script

- Để tạo một Graphic ta làm như sau:

+ Chọn đối tượng cần chuyển đổi sang Graphic

+ Nhấn phím F8 ( hoặc kích chuột phải chọn Convert to symbol)

Đối tượng Button là một thành phần quan trọng trong việc tương tác với phim, cho phép người dùng phản hồi các sự kiện như nhấp chuột, nhấn phím, kéo thanh trượt và thực hiện các hành động khác Mỗi đối tượng button sẽ có các thuộc tính và chức năng riêng biệt để cải thiện trải nghiệm người dùng.

Trong Flash, có bốn khung tương tác: Up, Down, Over, và Hit, cho phép điều khiển đối tượng Button thông qua Action Script Điều này khác biệt so với đối tượng Graphic Cần lưu ý rằng Flash có hai loại đối tượng Button: Simble button và button Simble button là loại button do người dùng thiết kế và có thể được chuyển đổi thành symbol, trong khi button nằm trong thư viện fl.Controls, được sử dụng để thiết kế giao diện GUI cho các ứng dụng Mặc dù chúng có nhiều điểm tương đồng, nhưng hai loại đối tượng này hoàn toàn khác biệt.

MovieClip là một mẫu hoạt hình Flash có thể tái sử dụng, khác với Button và Graphic, MovieClip sở hữu một TimeLine với nhiều Frame để tạo hoạt hình Nó có thể bao gồm nhiều biểu tượng Graphic, Button hoặc thậm chí các MovieClip khác Tương tự như Button, MovieClip có thể được điều khiển bằng Action Script.

2.2 Khả năng thiết kế các hoạt cảnh

To access the Document Properties dialog, select Modify from the Menu and then Document, or use the shortcut Ctrl + J, or right-click and choose Document Properties To display the color palette, click on Background Color.

Để làm mềm các cạnh của hình dạng trên khung làm việc, bạn cần chọn nhiều hình dạng (không thuộc nhóm) Sau đó, vào menu Modify, chọn Shape và nhấn vào Soften Fill Edges Hộp thoại sẽ xuất hiện cho phép bạn điều chỉnh các thông số theo ý muốn.

-Distance: Khoảng cách giữa đường biên mềm và đường biên ngoài tính trên Pixel

Số bước từ đường biên đầu đến kết thúc đường biên mềm không nên vượt quá 10, vì việc sử dụng quá nhiều bước sẽ làm tăng khối lượng tính toán của máy mỗi khi thực hiện một cử động flash.

-Derection: Chọn hướng đểđường biên mềm tạo ra bên ngoài (Expand) hoặc trong (Insert) hình dạng

Gióng hàng các đối tượng :

Nhấn Ctrl + K để sử dụng chức năng này Với các tham số :

Align left edge: canh trái đều các đối tượng

Align horizontal center: canh giữa theo hàng dọc các đối tượng

Align right edge: canh phải đều các đối tượng

Align top edge: canh trên đều các đối tượng

Align vertical center: canh giữa theo hàng ngang các đối tượng

Align bottom edge: canh dưới đều các đối tượng

Distribute top edge: canh trên đều cho các hàng đối tượng

Distribute vertical center: canh giữa theo hàng ngang cho các dòng đối tượng

Distribute bottom edge: canh dưới đều cho các hàng đối tượng

Distribute left edge: canh trái đều cho các hàng đối tượng

Distribute horizontal center: canh giữa theo hàng dọc cho các dòng đối tượng

Distribute right edge: canh phải đều cho các hàng đối tượng

Match width: canh đều trái và phải tất cả đối tượng

Match height: canh đều trên và dưới tất cảđối tượng

Match width and height: kết hợp hai thứ trên

Space evenly vertically: khoảng cách đều giữa các đối tượng theo hàng ngang

Space evenly horizontally: khoảng cách đều giữa các đối tượng theo hàng dọc

Khi làm việc với Flash, đôi khi cần lật hoặc quay đối tượng theo một góc nhất định hoặc lật ngược đối tượng Vì vậy, việc sử dụng các tính năng Flip là rất quan trọng Tất cả các tính năng này được tập hợp lại khi bạn chọn đối tượng và truy cập vào Modify > Transform.

-Free Transform: tại đây bạn có thể quay một góc bất kỳ , tăng giảm kích thước , thay đổi góc độ cho một phần đối tượng

-Distort: thay đổi góc độ cho một phần đối tượng từ một điểm

-Envelope: tương tự như distort nhưng giữa các điểm vuông sẽthêm vào các điểm tròn , các điểm tròn này có nhiệm vụ bo tròn các góc nhọn

-Scale: Chỉ có tác dụng thay đổi kích thước , nếu xài chức năng này thì tốt hơn là xài Free Transform

-Rotate and Skew: quay đối tượng bằng chuột và dời đối tượng

-Scale and Rotate: thay đổi kích thước đối tượng (%) và góc xoay tự nhập

-Rotate 90' CC: quay đối tượng một góc 90' từ bên trái lên trên

-Rotate 90' CCW: quay đối tượng một góc 90' từ bên phải lên trên

-Flip Vertical: lật ngược đối tượng theo chiều ngang

-Flip Horizontal: lật ngược đối tượng theo chiều dọc

-Remove Transform: bỏ chọn Transform

2.3 Quản lý các đối tượng bằng cửa sổ Library

Thư viện (Library) là nơi quản lý các đối tượng được nhập và chuyển đổi Để chuyển đổi một đối tượng, bạn chỉ cần nhấp chuột phải vào đối tượng và chọn "Convert to Symbol" Biểu tượng này sẽ xuất hiện trong thư viện, chỉ bao gồm các đối tượng được sử dụng trong phim (Movie) Để nhập một đối tượng từ bên ngoài vào thư viện, bạn chọn "File" > "Import" > "Import to Library", sau đó các đối tượng được chọn sẽ được thêm vào thư viện.

Phân cảnh

Một bộ phim không chỉ xoay quanh một cảnh mà là sự kết hợp của nhiều cảnh quay ở các không gian khác nhau Trong lĩnh vực phim ảnh, khái niệm "scene" trong Flash trở nên đặc biệt quan trọng, đặc biệt với các nhà phát triển game hoặc phần mềm Đối với game, mỗi scene tương ứng với một màn chơi khác nhau, trong khi đối với lập trình viên, đó là những phần ẩn nằm trong cùng một form.

Window \ Other Panels \ Scene hoặc nhấn Shift + F2

3.2Sắp xếp và hiệu chỉnh phân cảnh Để hiển thị hộp quản lý Scene bạn chọn từ menu Window/Design

Panels/Scene (hoặc nhấn Shift + F2), hộp thoại sau sẽ hiển thị:

Khung hình trên sẽ hiển thị tất cả các scene trong dự án của bạn, và hộp thoại liệt kê cho phép bạn thực hiện các thao tác cần thiết.

+ Sử đổi tên phân cảnh: việc làm này rất có ích, lợi ích rơ ràng nhất mà ta có muốn

+ Xếp lại thứ tự phân cảnh: chọn phân cảnh muốn đổi chỗ, sau đó nhấn và giữ chuột phải, di chuyển phân cảnh đến vị trí mà bạn muốn

Nhân đôi phân cảnh là một tính năng hữu ích trong công việc thiết kế, giúp bạn tạo ra hai phân cảnh hoàn toàn giống nhau mà không tốn quá nhiều thời gian Thay vì phải thiết kế lại từ đầu với nhiều layer và khung hình lồng ghép phức tạp, bạn có thể sử dụng chức năng nhân đôi của Macromedia để tiết kiệm công sức và nâng cao hiệu quả làm việc.

Để nhân đôi một phân cảnh, bạn chỉ cần chọn phân cảnh muốn nhân đôi trong danh sách liệt kê, sau đó nhấn vào biểu tượng đầu tiên (duplicate scene) ở cuối hành động Chức năng này tương tự như tính năng duplicate layer trong Photoshop.

Để thêm một phân cảnh, bạn chỉ cần nhấn vào biểu tượng thứ hai có hình dấu cộng, chức năng này tương tự như việc bạn tạo phân cảnh mà tôi đã đề cập trước đó.

+ Xóa một phân cảnh: không nói hơn đó là biểu tượng hình thùng rác.

Thực hành

4.1 Thao tác các công cụ vẽ và thiết lập môi trường vẽ

4.2 Xây d ựng 3 đối tượ ng trên 3 l ớ p

- Vào Insert/ TimeLine/ Layer tạo thêm 2 lớp.

- Chọn vào Layer 1 để vẽ đối tượng hình tròn băng Oval Tool

- Chọn vào Layer 2 để vẽ đối tượng hình chử nhật bằng Rectangle Tool

- Chọn Layer 3 và vẽ tương tự

4.3 Xây d ự ng 5 phân c ảnh cho 3 đối tượ ng

- Chọn Insert/ Scene tạo thêm 4 scene

- Chọn scene 1 vẽ đối tượng thứ 1 và tiến hành vẽ đối tượng.

- Các Scene sau cũng vẽ tương tự.

TẠO CHUYỂN ĐỘNG

Thiết kế hoạt hình

1.2 Các đối tượ ng nút

1.3 Gán hành độ ng b ằ ng Timeline

Sử dụng khung nối tiếp cho phép bạn đặt các phần tử khác nhau trong từng khung hoặc đoạn khung, sau đó kết hợp chúng lại như một đoạn phim Phương pháp này dễ thực hiện và cung cấp nhiều điều khiển hơn, nhưng đồng thời cũng tốn nhiều thời gian hơn.

Sử dụng khung biến đổi tự động trong Flash giúp tiết kiệm thời gian và công sức, vì chúng ta chỉ cần chỉ định điểm đầu và điểm cuối Ví dụ, nếu chọn hình vuông làm điểm bắt đầu và hình tròn làm điểm kết thúc trong 24 khung hình, Flash sẽ tự động tính toán và biến đổi hình vuông thành hình tròn trong 2 giây, với các cạnh ngày càng bo tròn.

Chúng ta sẽ bắt đầu với việc tìm hiểu chức năng của các thành phần trên khung Sau đây sẽ là những phần mà các bạn cần quan tâm :

Tính từ trái qua thì lần lượt là :

Nút canh giữa khung hình giúp bạn nhanh chóng quay lại vị trí đã chọn trong đoạn flash Ví dụ, nếu bạn đang ở vị trí 300 trong số 2000 khung hình và cuộn đến vị trí 1500, việc nhấp vào nút canh giữa sẽ đưa bạn trở lại vị trí 300 một cách dễ dàng.

Nút Onion Skin cho phép người dùng xem và chỉnh sửa nhiều khung hình cùng lúc Khi bạn ở một vị trí trên thanh tiến trình và chọn nút này, nó sẽ gom toàn bộ nội dung của khung hình giữa hai điểm được đánh dấu Điều này giúp bạn dễ dàng chỉnh sửa nội dung của đoạn khung hình đang được chọn.

Biến đổi vị trí hình vẽ

- Nút Modify Onion Markers :khi nhấp vào nút này thì một bành sẽ hiện ra :

Bảng này có nhiệm vụ thay đổi các điểm đánh dấu của Onion Skin với các thông số sau :

+ Always Show Marker: làm cho các điểm đánh dấu Onion Skin hiển thị hay không hiển thị cho dù bạn có hay không có chọn tính năng Onion Skin

+ Anchor Onion: giữ lại hay khóa các điểm được đánh dấu chọn Onion Skin tại vị trí mà chúng đang hiện diện

+ Onion 2: Thiết lập các điểm đánh dấu bằng Onion Skin ở vị trí hai khung hình nằm trước và sau vị trí thanh thực hiện

+ Onion 5: giống như Onion 2 nhưng thay vào 2 là 5 khung hình trước và sau

+ Onion All: thực hiện chức năng Onion skin với tất cả các khung hình trong cảnh hiện tại

2 Biến đổi vị trí hình vẽ

- Vẽ đường thẳng với Line

B1: Nhấp vào công cụ Line

B2: Di chuyển con trỏ chuột lên Stage

B1: Nhấp vào công cụ Oval

B2: Di chuyển con trỏ lên Stage

B1: Nhấp vào công cụ Rectangle

B2: Di chuyển con trỏ chuột lên Stage

-Vẽ hình đa giác nhiều cạnh

B1: Nhấp vào công cụ Rectangle

B2: Nhấp vào Nút Options trên bảng Properties Xuất hiện hộp thoại Tool Settings

2.2 Bi ến đổ i theo Tweening

Bạn chọn keyframe đầu của Tween Property Inspector sẽ cung cấp các tùy chọn dưới đây

Auto: tự động xoay đối tượng theo góc xoay được bạn thực hiện thông qua công cụ Free Transform Tool

Để xoay đối tượng theo chiều kim đồng hồ, bạn có thể xác định số vòng xoay bằng cách nhập số vào ô bên phải Ngoài ra, bạn cũng có thể rê chuột đến khi con trỏ chuyển thành bàn tay có mũi tên hai chiều, sau đó nhấn và kéo chuột để thay đổi số vòng xoay.

CCW: (counterclockwise) xoay đối tượng ngược chiều kim đồng hồ Bạn xác lập số vòng xoay tương tự như trường hợp CW.

Mục Snap cho phép đối tượng di chuyển theo đường dẫn đã vẽ, còn gọi là motion guide Mặc định, mục này đã được chọn sẵn, nhưng nếu đối tượng không di chuyển theo đường dẫn, bạn cần tự chọn mục này để đảm bảo chức năng hoạt động đúng cách.

Mục "Hướng theo đường dẫn" cho phép đối tượng luôn xoay theo hướng của đường dẫn, tạo cảm giác chuyển động tự nhiên hơn Để đạt được hiệu ứng này, bạn cần điều chỉnh góc xoay của đối tượng tại keyframe đầu tiên và keyframe cuối cùng sao cho phù hợp với hướng của đường dẫn.

Mục Sync: chọn mục này để đồng bộ hóa Timeline của graphic symbol với Timeline chính (Xem các bài thực hành tiếp theo)

Mục Scale cho phép đối tượng co dãn liên tục trong quá trình chuyển động nếu kích thước ở keyframe đầu và keyframe cuối khác nhau Nếu không chọn mục này, đối tượng sẽ giữ nguyên kích thước ban đầu và chỉ thay đổi kích thước khi đến keyframe cuối.

2.3 Trình t ự các bướ c bi ến đổ i

Bước 1: Sử dụng công cụ vẽ để tạo đối tượng bạn muốn trên khung sáng tác Bước 2: Chọn một Frame bất kỳ, nhấn F6 để chèn KeyFrame kết thúc, sau đó thay đổi vị trí của đối tượng tại Frame kết thúc.

Bước 3 Bấm chuột vào khoảng cách giửa các KeyFrame mở đầu và KeyFrame kết thúc, kích chuột phải vàchọn Classic Tween

Bược 4: nhấn Ctrl + Enter để kiểm tra kết quả

- Các bước sử dụng Classic Tween để tạo hiệu ứng động của quả bóng chuyền:

Bước 1 Trên khung sáng tác, bạn hãy sử dụng công cụ Oval để tạo một hình quả bóng và trang trí nó theo hình quả bóng chuyền

Để tạo hoạt ảnh cho quả bóng, hãy nhấp chuột vào Frame thứ 10 và nhấn F6 để chèn KeyFrame kết thúc, sau đó di chuyển quả bóng đến vị trí chạm mặt đất Tiếp theo, tại Frame thứ 20, nhấn F6 để chèn KeyFrame mới và thay đổi vị trí của quả bóng để nó nảy lên Tiếp tục quy trình này cho đến khi bạn đạt được thời điểm mà quả bóng dừng lại.

Bước 3: Nhấn chuột vào khoảng cách giữa các KeyFrame mở đầu và KeyFrame kết thúc, sau đó nhấn chuột phải và chọn Classic Tween Lặp lại thao tác này cho các khoảng KeyFrame còn lại.

Bược 4: nhấn Ctrl + Enter để kiểm tra kết quả.

Sự biến đổi hình dạng hình vẽ

3.1 Các yêu c ầ u c ủ a bi ến đổ i hình v ẽ

Shape tween chỉ áp dụng cho các đối tượng dạng shape, và khi bạn chọn một đối tượng shape, sẽ thấy các hạt li ti xuất hiện cùng với biểu tượng hình tròn và hình vuông cắt nhau trong Property Inspector Nếu đối tượng không phải là shape, Timeline sẽ hiển thị lỗi với các đường chấm chấm Lỗi này thường xảy ra khi bạn vô tình thêm đối tượng vào một tween đã có sẵn hoặc chuyển shape thành symbol.

3.2 Bi ến đổ i theo Shape

Shape Tween có những tính năng đặc biệt, chủ yếu dùng để biến hình, bên cạnh khả năng chuyển đổi màu sắc và hình dáng như các loại Tween khác Để tạo hiệu ứng biến hình, bạn cần thiết lập hai KeyFrame mở đầu và kết thúc Tuy nhiên, Shape Tween không hỗ trợ hiệu ứng 3D và chức năng swap symbol để thay đổi biểu tượng nguồn của đối tượng Khi thực hiện Shape Tween, đối tượng sẽ chuyển đổi thành hai đối tượng Graphic tương ứng với hai KeyFrame Cơ chế hoạt động của Shape Tween dựa trên thuật toán Transform, áp dụng cho các loại symbol như movie clip symbol và button symbol trên sân khấu.

Bước 2: Sử dụng công cụ Shape Tween, bạn có thể tạo Tween trước hoặc sau khi chèn KeyFrame Trong ví dụ này, chúng ta sẽ minh họa cách tạo Tween trước Để thực hiện, hãy sử dụng công cụ Selection, chọn đối tượng, nhấn chuột phải và chọn Create Shape Tween.

Bước 3: Chọn một Frame trên TimeLine và nhấn phím F6 để chèn KeyFrame kết thúc Sử dụng công cụ Add anchor point để thêm điểm điều khiển tại vị trí giữa đường thẳng Tiếp theo, chọn công cụ Convert Anchor Point để tạo điểm uốn Cuối cùng, chọn điểm vừa tạo và điều chỉnh biến hình theo ý muốn.

- Bước 4: nhấp tổ hợp Ctrl + Enter để kiểm tra sản phẩm

-Ví dụ biến đường thẳng thành đường cong:

- Bước 1: Dùng công cụ Line vẽ một đường thẳng trên khung sáng tác

Để tạo Tween bằng công cụ Shape Tween, bạn có thể thực hiện trước hoặc sau khi chèn KeyFrame Trong bài viết này, chúng ta sẽ minh họa cách tạo Tween trước khi chèn KeyFrame Đầu tiên, hãy sử dụng công cụ Selection để chọn đối tượng, sau đó nhấn chuột phải và chọn Create Shape Tween.

Để tạo điểm uốn cho đường thẳng trong Timeline, bạn hãy chọn Frame 30 và nhấn phím F6 để chèn KeyFrame kết thúc Sau đó, sử dụng công cụ Add anchor point để thêm điểm điều khiển ở giữa đường thẳng Tiếp theo, chọn công cụ Convert Anchor Point và nhấn vào điểm vừa tạo để uốn đường thẳng thành đường cong.

- Bước 3: nhấp tổ hợp Ctrl + Enter để kiểm tra sản phẩm.

Thực hành

Macromedia Flash là phần mềm chuyên nghiệp cho việc tạo hoạt hình, trò chơi và thiết kế giao diện web, đóng vai trò quan trọng trong Internet và công nghệ giải trí Mặc dù có nhiều công nghệ mới cạnh tranh, Flash vẫn giữ vững thị phần lớn Tuy nhiên, không phải ai cũng thành thạo trong việc sử dụng Flash Để giúp người dùng nắm vững kiến thức cơ bản về Flash, chúng tôi đã biên soạn giáo trình Macromedia Flash, chia thành các bài học cụ thể.

• BÀI 1: GIỚI THIỆU PHẦN MỀM FLASH VÀ THIẾT KẾ VẼ CƠ BẢN

LÀM VIỆC VỚI LỚP

Lớp và thiết lập lớp

Lớp trong thiết kế có thể được hình dung như những tờ giấy trong suốt chồng lên nhau, giúp bạn tổ chức tác phẩm một cách dễ dàng Bạn có khả năng vẽ và chỉnh sửa trên từng lớp mà không làm ảnh hưởng đến các lớp khác Nếu một lớp không chứa đối tượng nào, bạn có thể nhìn xuyên qua nó để thấy những lớp bên dưới.

Bạn có thể tạo ra nhiều Layer để sắp xếp ảnh, ảnh chuyển động và các thành phần khác trong đoạn phim mà không làm ảnh hưởng đến các đối tượng trong những Layer khác Khi không có đối tượng trên Layer đầu tiên, bạn có thể thấy xuyên qua Layer bên dưới Số lượng Layer không giới hạn, phụ thuộc vào bộ nhớ máy tính và không làm tăng kích thước file khi xuất đoạn phim Bạn có thể ẩn, khóa hoặc hiển thị nội dung của Layer, cũng như thay đổi trật tự các Layer Thêm vào đó, các Guide Layer giúp việc vẽ và hiệu chỉnh dễ dàng hơn, trong khi các Mask Layer cho phép tạo ra các hiệu ứng phức tạp.

- Tạo lớp bằng cách Insert/ Timeline/ Layer hay click phải

- Chọn lớp cần thiết lập Modify\ Timeline\ Layer Propetries

- Tiến hành thiết lập theo ý muốn

Khi làm việc với các Layer, bạn có thể dễ dàng hiển thị hoặc ẩn chúng Một dấu X đỏ bên cạnh tên Layer cho biết Layer đó đang bị ẩn, nhưng các Layer ẩn vẫn được giữ lại khi xuất phim Để phân biệt các đối tượng trong từng Layer, bạn có thể hiển thị chúng với đường viền màu, và có thể thay đổi màu viền cho mỗi Layer theo ý muốn.

Để ẩn một Layer, hãy nhấp vào cột có biểu tượng con mắt bên phải tên Layer Để hiển thị lại Layer đó, chỉ cần nhấp thêm một lần nữa.

Nhấp chuột vào cột Outline bên cạnh tên của Layer để hiển thị tất cả các đường viền của đối tượng trong Layer Nhấp một lần nữa để tắt chế độ hiển thị các đường viền.

Lớp mặt nạ

2.1 ứng dụng lớp mặt nạ

Hiệu ứng mặt nạ (Masking) cho phép người dùng thiết lập vùng hiển thị tùy ý cho các hình ảnh ở các lớp bị che (Masked layer) nằm dưới lớp mặt nạ (Mask Layer) ở trên Kỹ thuật này thường bao gồm cấu trúc với lớp mặt nạ ở trên cùng và một hoặc nhiều lớp bị che ở dưới, chứa hình ảnh nền cần hiển thị.

Bằng cách áp dụng các chuyển động cho lớp mask hoặc các lớp bị che, chúng ta có thể tạo ra nhiều hiệu ứng hấp dẫn như hiệu ứng đèn pha, kính lúp và chụp X-quang.

2.2 Cách tạo lớp mặt nạ

2.3 Hiệu chỉnh lớp mặt nạ

Thêm bớt các lớp bị che (Masked layer ) bằng cách Drag các layer vào hoặc ra khỏi layer mask

Chỉnh sửa lớp mask và các lớp bị che: bỏ khoá layer, chọn outline để dễ quan sát phần bị che trong khi chỉnh sửa

XÂY DỰNG CÁC ACTION

Làm việc với nút

Vào Insert \ New Symbol \ Button

Up: Trạng thái bình thường của button

Over: Khi rê chuột lên button

Down: Khi click chuột lên button

- Sử dụng button tạo sẳn vào Window/ Common Libraries/ Button

1.2 Các tính năng củ a nút

Khi ta nhấn vào nút sẽ thực hiện các hành động nào đó cho một sự kiện

Gán lệnh cho button: Có 2 cách

- Gán trực tiếp vào button: lệnh được đặt trong button

Nhập lệnh trực tiếp vào button (Event in button):

Click chọn button và gõ lệnh trong action panel

- Gán thông qua tên instance của nó: Lệnh được đặt trong timeline của button đó. Gán lệnh qua tên instance của button (Event in keyframe)

Click chọn keyframe có button đó rồi gõ lệnh trong action panel

Xây dựng hoạt hình bằng Action

Mở bảng điều khiển Action.

2.2 Gán Action lên các Frame

Ta click phải vào Frame cần gán Action chọn Action

- Khung Action hiện ra ta tiến hành gõ lệnh

2.3 Các c ấ u trúc Acti on cơ bả n

- Cấu trúc của một câu lệnh Action gồm 3 phần chính

Tạm dịch là : Từ khóa ( Sự kiện) { Hành động } ;

Một câu lệnh thường kết thúc bằng dấu (;) Nếu bạn thấy một câu nào đó nằm sau dấu // thì nó được xem là phần chú thích

Action trên TimeLine cho phép bạn ra lệnh trực tiếp cho TimeLine thực hiện hành động tại một Frame cụ thể mà bạn mong muốn, mà không cần phải sử dụng từ khóa hay sự kiện nào khác.

Đối với Action trên nút, câu lệnh thường được sử dụng là on(Sự kiện) { hành động }; nghĩa là khi xảy ra sự kiện nào đó, hành động được định nghĩa trong dấu {} sẽ được thực hiện.

+ Đối với Action trên Movie Clip thì ta thường có câu lệnh dạng: onClipEvent ( Sự kiện) { Hành động} ;

Kiểm tra

1 Tạo một mạch điện: Sau 3 giây khóa K đóng thì đèn cháy sáng Cháy trong

5 giây thì đèn lại tắt

2 Tạo chuyển động quay cho kim đồng hồ Trong vòng 12 giây phải quay được 1 vòng.

3 Tạo chuyển động của xe tải chạy trong thành phố trong đó bánh xe quay khi xe chuyển động (chú y chỉ tạo l lớp xe và 1 lớp background)

4 Tạo biểu tượng electron chuyển động trên quỹ đạo (dùng lớp dẫn)

5 Tạo cảnh tảng đá lăn từ trên đồi xuống chân đống rơm rồi dừng hẳn

- Thiết kế bức tranh đồng quê (đồi, nhà, cây, đống rơm, mây,….).

- Tạo lớp dẫn chuyển động

6 Dùng kĩ thuật lớp dẫn diễn tả cảnh đua xe lạng lách.

7 Dùng kĩ thuật lớp dẫn diễn tả cảnh bong bóng bay

- Trình bày các Action trong Flash;

- Vận dụng vào thiết kế các đối tượng hoạt hình;

- Hình thành tác phong làm việc công nghiệp, tập thể

Vào Insert \ New Symbol \ Button

Up: Trạng thái bình thường của button

Over: Khi rê chuột lên button

Down: Khi click chuột lên button

- Sử dụng button tạo sẳn vào Window/ Common Libraries/ Button

1.2 Các tính năng củ a nút

Khi ta nhấn vào nút sẽ thực hiện các hành động nào đó cho một sự kiện

Gán lệnh cho button: Có 2 cách

- Gán trực tiếp vào button: lệnh được đặt trong button

Nhập lệnh trực tiếp vào button (Event in button):

Click chọn button và gõ lệnh trong action panel

- Gán thông qua tên instance của nó: Lệnh được đặt trong timeline của button đó. Gán lệnh qua tên instance của button (Event in keyframe)

Click chọn keyframe có button đó rồi gõ lệnh trong action panel

2 Xây d ự ng ho ạ t hình b ằ ng Action

Mở bảng điều khiển Action.

2.2 Gán Action lên các Frame

Ta click phải vào Frame cần gán Action chọn Action

- Khung Action hiện ra ta tiến hành gõ lệnh

2.3 Các c ấ u trúc Acti on cơ bả n

- Cấu trúc của một câu lệnh Action gồm 3 phần chính

Tạm dịch là : Từ khóa ( Sự kiện) { Hành động } ;

Một câu lệnh thường kết thúc bằng dấu (;) Nếu bạn thấy một câu nào đó nằm sau dấu // thì nó được xem là phần chú thích

Action trên TimeLine cho phép bạn ra lệnh trực tiếp để thực hiện một hành động tại một Frame cụ thể mà bạn mong muốn, mà không cần phải thông qua từ khóa hay sự kiện nào khác.

Đối với hành động trên nút, chúng ta thường sử dụng câu lệnh theo dạng on(Sự kiện) {hành động}; nghĩa là khi xảy ra sự kiện nào đó, hành động trong dấu ngoặc nhọn sẽ được thực hiện.

+ Đối với Action trên Movie Clip thì ta thường có câu lệnh dạng: onClipEvent ( Sự kiện) { Hành động} ;

3.1 Nhóm Autoplay nextFrame: đến khung hình tiếp theo và chạy từ đó prevFrame: quay lại khung hình sau và chạy từ đó Nếu khung hình hiện tại là khung hình 1 thì không làm gì cả nextScene(): đến khung hình 1 của cảnh tiếp theo và chạy từ đó. prevScene(): đến khung hình 1 của cảnh trước và chạy từ đó.

Play(): chạy tiếp từ frame hiện tại

Stop(): dừng lại ở frame hiện tại.

Lệnh Key Press kích hoạt action khi nhấn phím xác định Nếu bạn chọn tùy chọn này, bạn hãy nhập vào tên phím trong hộp ký tự

3.3 Nhóm Goto gotoAndPlay ( frame): đến khung hình frame và chạy tiếp từ khung hình này. gotoAndPlay (scene, frame): đến khung hình frame của scene và chạy tiếp từ đó gotoAndStop (frame): đến khung hình frame và dừng lại. gotoAndStop (scene, frame): đến khung hình frame cảnh scene và dừng lại

4.1 T ạ o các nút và xây d ự ng Action trên nút

Vào Insert \ New Symbol \ Button

Up: Trạng thái bình thường của button

Over: Khi rê chuột lên button

Down: Khi click chuột lên button

- Sử dụng button tạo sẳn vào Window/ Common Libraries/ Button

Sau khi tạo xong nút ta click phải vào nút chon Action để tiến hành viết code

4.2 Dùng Action mô ph ỏ ng hi ện tượ ng tuy ết rơi

To create a new Flash file, press Ctrl + J to access Document Properties and set the dimensions to match your background image Choose a dark background color and set the frame rate to 27 before clicking OK Finally, insert the background image into your Flash file.

Chọn công cụ Oval Tool (O) và khóa màu Stroke trong phần Colors của Tool Panel bằng cách nhấp vào biểu tượng bút chì nhỏ, sau đó chọn hình vuông có đường chéo đỏ Thiết lập màu Fill color thành màu trắng và tiến hành vẽ hình.

Trong khi vẫn chọn hình vừa vẽ, nhấn phím F8 (Convert to Symbol) để chuyển hình tròn vừa vẽ sang dạng Movie Clip Symbol

While selecting the newly created Movie Clip, navigate to the Properties Panel located at the bottom of the workspace In the left section, enter the instance name "snow" for the Movie Clip.

To select the Movie Clip, use the Selection Tool (V) and click once on the circular icon Next, open the Action Script Panel (F9) and input the following code: onClipEvent (load) { movieWidth = 350; movieHeight = 263; i = 1 + Math.random() * 2; k = -Math.PI + Math.random() * Math.PI; this._xscale = this._yscaleP + Math.random() * 100; this._alpha = 75 + Math.random() * 100; this._x = -10 + Math.random() * movieWidth; this._y = -10 + Math.random() * movieHeight; }.

} onClipEvent (enterFrame) { rad += (k/180)*Math.PI; this._x -= Math.cos(rad); this._y += i; if (this._y>=movieHeight) { this._y = -5;

Chọn frame đầu tiên, vào lại phần Action Script Panel (F9) và nhập vào mã sau: for (k=0; k

Ngày đăng: 23/12/2023, 10:41

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN