Bài giảng Tin học cơ sở - Bài 2: Tạo hoạt ảnh trong flash
Bạn đang xem 20 trang mẫu của tài liệu "Bài giảng Tin học cơ sở - Bài 2: Tạo hoạt ảnh trong flash", để tải tài liệu gốc về máy bạn click vào nút DOWNLOAD ở trên
Tài liệu đính kèm:
- bai_giang_tin_hoc_co_so_bai_2_tao_hoat_anh_trong_flash.ppt
Nội dung text: Bài giảng Tin học cơ sở - Bài 2: Tạo hoạt ảnh trong flash
- BÀI 2: TẠO HOẠT ẢNH TRONG FLASH KHOA CÔNG NGHỆ THÔNG TIN TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI Bài giảng tin học cơ sở
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 2
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 3
- 1. Giới thiệu về hoạt ảnh ❖ Là quá trình các đối tượng xuất hiện, di chuyển theo một chuyển động nhịp nhàng và đều đặn ❖ Thực ra là chuỗi các ảnh tĩnh trong đó mỗi hình ảnh (khung hình - frame) chỉ thay đổi một chút so với hình ảnh trước đó, mỗi hình ảnh chỉ được thể hiện trong một khoảng thời gian ngắn Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 4
- 1. Giới thiệu về hoạt ảnh (2) ❖ Khung hình (Frame) ▪ Biểu diễn một lần thể hiện của phim Flash ở mỗi thời điểm cụ thể trong suốt quá trình phát lại ▪ Sau khi dịch và chạy, chương trình được thực hiện từ khung hình đầu đến khung hình cuối ❖ Tốc độ khung hình ▪ Số lượng các hình ảnh riêng biệt (khung hình) xuất hiện trong một giây. ▪ Càng cao thì càng có nhiều khung hình trong một đơn vị thời gian phát lại → tăng kích thước tệp tin ▪ Flash mặc định và thường dùng là 12 fps Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 5
- 1. Giới thiệu về hoạt ảnh (3) ❖ Flash đơn giản hóa hoạt ảnh ▪ Chỉ cần tạo ra hình ảnh bắt đầu và hình ảnh kết thúc ▪ Flash tự tạo mọi thứ nằm giữa hai hình ảnh này để tạo ra hoạt ảnh → Biến đổi (Transformation) ❖ Flash có 2 loại biến đổi ▪ Biến đổi chuyển động (Motion Transformation) ▪ Biến đổi hình dạng (Shape Transformation) Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 6
- 1. Giới thiệu về hoạt ảnh (4) ❖Biến đổi chuyển động ▪ Thay đổi vị trí, kích thước, màu sắc ▪ Xoay, xô nghiêng đối tượng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 7
- 1. Giới thiệu về hoạt ảnh (5) ❖ Biến đổi hình dạng ▪ Thay đổi hình dạng của đối tượng. Ví dụ chuyển từ hình tròn thành hình vuông ▪ Có thể thay đổi màu sắc, vị trí của đối tượng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 8
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 9
- 2. Timeline (đường thời gian/bảng tiến trình) ❖Là nơi các hoạt ảnh diễn ra Menu của timeline Khung hình đang được chọn Tên lớp Khung hình Số khung hình Thời gian phát lại Tên thư mục Tốc độ khung hình Số khung hình hiện tại Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 10
- 2. Timeline (2) ❖ Chứa các chế độ thể hiện trên vùng thiết kế Sửa đổi nhiều khung nhìn Căn giữa khung nhìn Chế độ thể hiện Onion Skin Chế độ thể hiện đường nét Onion Skin Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 11
- 2. Timeline (3) ❖ Center Frame ▪ Căn giữa timeline sao cho khung nhìn được chọn ở chính giữa (?) ❖ Onion Skin ▪ Cho phép xem nhiều khung nhìn một lúc ▪ Hiển thị các khung hình trước và sau khung hình hiện tại dưới dạng bóng mờ ❖ Onion Skin Outlines ▪ Giống Onion Frame nhưng chỉ theo dạng đường nét/khung (outline) ❖ Edit Multiple Frames ▪ Cho phép sửa nhiều khung nhìn trong Onion Skin Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 12
- 2. Timeline (4) ❖ Chứa các nút để quản lý layer (lớp), frame (khung hình), folder (thư mục) Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 13
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 14
- 3. Layer (lớp) ❖ Layer (lớp) ▪ Chứa các đối tượng ▪ Độc lập với nhau ▪ Có thể có nhiều lớp Layer được chọn • Nên đặt tên lớp theo tính gợi nhớ nào đó hoặc theo ý nghĩa của các đối tượng thuộc về lớp ❖ Chọn 1 layer: ▪ Các đối tượng của layer được chọn theo trong vùng thiết kế ▪ Timeline tương ứng của layer (dùng để điều khiển và kiểm soát các đối tượng thuộc lớp đó) cũng hiển thị bên cạnh Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 15
- 3.1. Các thao tác với lớp ❖ Tạo mới layer , xóa ❖ Khóa layer: ▪ Nhấn vào cột bên cạnh layer muốn khóa ▪ Không tác động được các đối tượng trong lớp bị khóa ❖ Ẩn layer: ▪ Nhấn vào cột bên cạnh layer muốn ẩn (sau khi ẩn thì bên cạnh layer là ) ▪ Ẩn/hiện lớp trong giai đoạn thiết kế để dễ quan sát và thao tác với các lớp khác chứ không có tác dụng khi chạy Các layer Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 16
- 3.2. Tổ chức lớp ❖Một chương trình có thể gồm rất nhiều lớp →Khó quản lý →Dùng thư mục để tổ chức và quản lý lớp →Gom các lớp có đặc điểm chung (về chức năng, ) vào thành một thư mục ❖Có thể tạo mới hoặc xóa thư mục Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 17
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 18
- 4. Frame (khung hình) ❖ Biểu diễn một lần thể hiện của phim Flash ở mỗi thời điểm cụ thể trong suốt quá trình phát lại ❖ Tùy theo chức năng mà Frame có hình dạng, màu sắc và tên gọi khác nhau Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 19
- 4.1. Phân loại khung hình ❖ KeyFrame ▪ Biểu thị sự thay đổi trên lớp đó ▪ Chọn menu Insert → Timeline → KeyFrame hoặc F6 ❖ Blank KeyFrame ▪ Là một KeyFrame trắng, chưa có gì ▪ Chọn menu Insert → Timeline → Blank KeyFrame hoặc F7 ❖ Frame ▪ Có thể chứa dữ liệu nhưng không có sự thay đổi so với khung hình trước ▪ Frame luôn luôn phải đi sau KeyFrame ▪ Chọn menu Insert → Timeline → Frame hoặc F5 Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 20
- 4.1. Phân loại khung hình (2) ❖ Flash đặt một chữ cái a trong KeyFrame có chứa các câu lệnh ActionScript ❖ KeyFrame luôn có một chấm tròn trong nó. ▪ Là rỗng nếu đây là một Blank KeyFrame ▪ Được tô nếu chứa một số nội dung nào đó ❖ Khung nhìn 1 luôn là KeyFrame → Nếu thêm các đối tượng vào các khung hình phía sau mà trước đó không tạo ra KeyFrame cho chúng thì Flash sẽ đặt các đối tượng này vào khung hình 1 Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 21
- 4.2. Các thao tác với khung hình ❖ Tạo mới một Frame (F5) hoặc tạo mới một KeyFrame (F6) đều tạo ra một khung hình mới có nội dung kế thừa từ frame phía trước nhưng: ▪ Frame: Khi thêm vào nó thì frame phía trước cũng có ▪ KeyFrame: Khi thêm vào nó thì frame phía trước không có ❖ Xóa bỏ các khung hình được chọn ra khỏi bảng tiến trình: ▪ Nhấn chuột phải → Remove Frames ▪ Shift + F5 ❖ Chuyển đổi KeyFrame thành Frame ▪ Nhấn chuột phải → Clear KeyFrame ▪ Shift + F6 Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 22
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 23
- 5. Biến đổi chuyển động ❖Chỉ được áp dụng với các dạng đối tượng ▪ Các đối tượng được gom nhóm ▪ Thể hiện của biểu tượng (Symbol Instance) (học sau) Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 24
- 5.1. Biến đổi chuyển động thẳng ❖Bước 1: Vẽ/chèn đối tượng cho biến đổi ❖Bước 2: Gom nhóm các đối tượng cần biến đổi (nếu cần) ❖Bước 3: Chuẩn bị Timeline cho biến đổi ❖Bước 4: Áp dụng biến đổi chuyển động Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 25
- 5.1. Biến đổi chuyển động thẳng – Bước 1 ❖ Có thể vẽ đối tượng chuyển động bằng các công cụ trong thanh công cụ của Flash ❖ Có thể chèn (import) đối tượng từ thư viện hoặc từ bên ngoài vào vùng thiết kế ❖ VD: ▪ Vẽ hình người bao gồm một hình elip và một số đoạn thẳng ▪ Đây là các đối tượng riêng rẽ Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 26
- 5.1. Biến đổi chuyển động thẳng – Bước 2 ❖Gom nhóm các đối tượng cần biến đổi ❖VD: ▪ Chọn tất các đối tượng vừa vẽ có giữ phím Shift hoặc gõ Ctrl+A để chọn tất cả ▪ Chọn menu Modify → Group hoặc Ctrl+G ▪ Lúc này các đối tượng riêng lẻ trở thành một đối tượng nhóm thống nhất ▪ Kéo đối tượng nhóm này lên góc trên cùng bên trái và giảm kích thước đối tượng sử dụng công cụ Free Transform hoặc Transform Panel (Chú ý giữ Shift nếu muốn giữ ràng buộc giữa chiều cao và chiều rộng) Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 27
- 5.1. Biến đổi chuyển động thẳng – Bước 3 ❖ Chuẩn bị Timeline cho biến đổi ▪ Xác định thời gian của hoạt hình: • Xác định nơi đặt KeyFrame thứ 2 • VD: Đặt KeyFrame ở khung hình 36 cho một hoạt ảnh bắt đầu ở đầu của phim và kéo dài trong 3s ▪ Nhấn chọn khung hình mà bạn chọn là KeyFrame kết thúc, chọn menu Insert → KeyFrame hoặc F6 để tạo 1 KeyFrame ▪ Với KeyFrame kết thúc đang được chọn, di chuyển đối tượng đến vị trí mà nó cần đến khi kết thúc. Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 28
- 5.1. Biến đổi chuyển động thẳng – Bước 3 (2) ❖Ví dụ ▪ Chọn đến khung hình 36 ▪ Nhấn F6 → Một KeyFrame được tạo ra Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 29
- 5.1. Biến đổi chuyển động thẳng – Bước 4 (2) ❖ Ví dụ (tiếp) ▪ Tại frame 36 (KeyFrame kết thúc) • Chọn đối tượng hình người • Kéo xuống phía dưới cùng, bên phải Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 30
- 5.1. Biến đổi chuyển động thẳng – Bước 4 ❖Bước 4: Áp dụng biến đổi chuyển động ▪ Nhấn vào timeline tại các khung nhìn nằm trong khoảng giữa của KeyFrame bắt đầu và kết thúc ▪ Nhấn chuột phải chọn Create Motion Tween hoặc Chọn menu Insert → Create Motion Tween ▪ Chọn lệnh Control → Test Movie hoặc Ctrl + Enter để xem kết quả hoặc xem trong chế độ Onion Skin Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 31
- 5.1. Biến đổi chuyển động thẳng – Bước 4 (3) ❖ Ví dụ ▪ Chọn Frame thứ 18 ▪ Nhấn chuột phải chọn Create Motion Tween Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 32
- 5.1. Biến đổi chuyển động thẳng – Bước 4 (4) ❖Ví dụ (tiếp) ▪ Nhấn Ctrl + Enter để kiểm tra kết quả Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 33
- Quay – Rotate khi Create Motion Tween ❖ Khi Create Motion Tween (hoặc chọn khung hình giữa đã tạo Motion Tween), mở bảng Properties, chọn Rotate: • None: Không quay • Auto: Tự động quay theo KeyFrame đầu và cuối • CW (Clockwise): Quay theo chiều kim đồng hồ • CCW (Counter Clockwise): Quay ngược chiều kim đồng hồ Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 34
- Ví dụ - Rotate CW – 1 times Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 35
- Ví dụ - Rotate CCW – 2 times Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 36
- Sử dụng Easing ❖ Thay đổi độ dài thời gian các khung hình xuất hiện (tốc độ thay đổi khung hình) → Chọn Ease trong bảng Properties ▪ Không đổi: 0 ▪ Chậm rồi tăng dần về cuối: -100 → -1 ▪ Nhanh rồi chậm dần về cuối: 1→ 100 Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 37
- Ví dụ Ease = -80 – Nhanh dần đều Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 38
- Ví dụ Ease = 80 – Chậm dần đều Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 39
- 5.2. Biến đổi chuyển động theo quỹ đạo ❖Bước 1: Thực hiện các bước để tạo biến đổi chuyển động thẳng ❖Bước 3: Tạo lớp chứa quỹ đạo (lớp dẫn) ❖Bước 2: Vẽ quỹ đạo/đường dẫn ❖Bước 4: Gắn đối tượng với quỹ đạo ❖Bước 5: Thiết lập và chỉnh đối tượng hướng theo quỹ đạo và chạy thử Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 40
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 1 ❖ Thực hiện các bước giống như biến đổi chuyển động thẳng để thu được hình người chuyển động thẳng từ góc trái trên cùng xuống góc phải dưới cùng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 41
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 2 ❖ Lớp dẫn (Guide Layer) là một loại lớp đặc biệt, chứa quỹ đạo/đường dẫn ❖ Cần tạo một lớp dẫn cho từng biến đổi chuyển động riêng biệt ❖ Cách tạo ▪ Chọn lớp chứa các đối tượng cần chuyển động theo quỹ đạo ▪ Nhấn vào biểu tượng (Add Motion Guide) hoặc chọn menu Insert → Motion Guide ▪ Đặt tên cho lớp dẫn nếu muốn Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 42
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 3 ❖ Vẽ quỹ đạo/đường dẫn bằng bất cứ một công cụ tạo đường vẽ nào (Line, Oval, Pen, Pencil, Retangle, Brush ) ❖ Ví dụ: Vẽ đường bậc thang sử dụng công cụ Line Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 43
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 4 ❖Gắn đối tượng với quỹ đạo/đường dẫn ▪ Frame đầu: Gắn tâm đối tượng vào đầu quỹ đạo/đường dẫn ▪ Frame cuối: Gắn tâm đối tượng vào cuối quỹ đạo/đường dẫn Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 44
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 4 (2) ❖ Ví dụ ▪ Frame 1: Kéo hình người sao cho tâm của của nó trùng với điểm đầu của đường bậc thang ▪ Frame 36: Kéo hình người sao cho tâm của của nó trùng với điểm cuối của đường bậc thang Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 45
- Chạy thử → Hình người không hướng theo quỹ đạo Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 46
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 5 ❖ Chọn ô Orient to Path để hình hướng theo đường dẫn ❖ Chỉnh sửa Frame đầu tiên và Frame cuối nếu cần để hình hướng theo đường dẫn Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 47
- 5.2. Biến đổi chuyển động theo quỹ đạo – Bước 5 (2) ❖Nhấn Ctrl + Enter để xem kết quả Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 48
- Nội dung 1. Giới thiệu về hoạt ảnh 2. Timeline (đường thời gian/bảng tiến trình) 3. Lớp (Layer) 4. Khung hình (Frame) 5. Biến đổi chuyển động 6. Biến đổi hình dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 49
- 6. Biến đổi hình dạng ❖Bị giới hạn cho một số dạng đối tượng, không thể áp dụng cho: ▪ Các đối tượng được gom nhóm ▪ Thể hiện của biểu tượng (symbol instance) ▪ Khối văn bản hoặc một hình ảnh bitmap ❖Để áp dụng cho đối tượng không được phép, ta có thể chọn menu Modify → Break Apart để phân tách đối tượng này thành các dạng đơn giản Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 50
- 6. Biến đổi hình dạng – Các bước ❖Bước 1: Vẽ/chèn đối tượng cho biến đổi ❖Bước 2: Chuẩn bị Timeline cho biến đổi ❖Bước 3: Áp dụng biến đổi biến dạng Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 51
- 6. Biến đổi hình dạng – Bước 1 ❖ Bước 1: Vẽ/chèn đối tượng cho biến đổi ▪ Có thể vẽ bằng các công cụ trong Toolbar ▪ Có thể chèn (import) đối tượng từ thư viện hoặc từ bên ngoài vào vùng thiết kế ▪ Phân tách đối tượng phức tạp nếu cần (chọn menu Modify → Break Apart) ▪ Ví dụ: • Vẽ đã giác đều 5 cạnh (Polystar) • Chọn menu Modify → Break Apart Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 52
- 6. Biến đổi hình dạng – Bước 2 ❖ Chuẩn bị Timeline cho biến đổi ▪ Xác định thời gian của hoạt hình ▪ Chọn khung hình mà bạn chọn là KeyFrame kết thúc ▪ Chọn menu Insert → Blank KeyFrame hoặc F7 để đặt 1 Blank KeyFrame vào khung hình được chọn ▪ Với Blank KeyFrame kết thúc đang được chọn, tạo ra đối tượng khác cần biến thành (thường có hình dạng khác với đối tượng ban đầu) ▪ Ví dụ • Chọn frame 48, nhấn F7 • Tại frame 48, tạo một văn bản là chữ BK – Font: 80, màu đỏ, đậm và kiểu chữ là Lucida Calligraphy • Nhấn Ctrl + B 2 lần để tách văn bản thành các phần rời nhau Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 53
- 6. Biến đổi hình dạng – Bước 3 ❖ Áp dụng biến đổi biến dạng ▪ Nhấn vào timeline tại các khung nhìn nằm trong khoảng giữa của KeyFrame bắt đầu và kết thúc • Ví dụ: Chọn frame 24 ▪ Vào bảng Properties, chọn Shape từ hộp danh sách Tween ▪ Chọn lệnh Control → Test Movie hoặc Ctrl + Enter để xem kết quả hoặc xem trong chế độ Onion Skin Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 54
- 6. Biến đổi hình dạng – Bước 3 (2) ❖Ví dụ ▪ Nhấn Ctrl + Enter xem kết quả Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 55
- Thông tin giảng viên để liên hệ ❖Họ và tên: Nguyễn Thị Thu Trang ❖Điện thoại: ❖Email: trangntt-fit@mail.hut.edu.vn hoặc trangntt.it@gmail.com ❖Địa chỉ: Bộ môn Công nghệ phần mềm, P.327-C1, Khoa Công nghệ thông tin, trường Đại học Bách Khoa Hà Nội, số 1 Đại Cồ Việt, Hà Nội. Bài giảng Tin học cơ sở - Khoa Công nghệ thông tin - Trường Đại học Bách Khoa Hà Nội 56