3-8 Hoạt hình

Những Object hình ảnh được tạo ra bởi Class [Image] thì có được trang bị thêm chức năng hoạt hình (Animation). Tại phần này tôi sẽ giải thích về chức năng hoạt hình này

Chuẩn bị hình ảnh

Hình 3-17 Hình ảnh 3 nút số

Tôi có chuẩn bị một hình ảnh [animation.bmp] trong folder [samples] trong địa CD-ROM được đính kèm. Hình ảnh này có kích thước [100x100] pixel cho mỗi hộp số nhỏ. Sự hoạt động đổi chỗ của 3 hộp số này tạo nên hiệu ứng hoạt hình đối với hình ảnh. Chương trình tiếp theo đây chỉ là chương trình gọi hiển thị hình ảnh.

animation00.rb

require 'mygame/boot'
img = Image.new("animation.bmp")
main_loop do
  img.render
end

Hiện thị ra trên màn hình chỉ là Object hình ảnh bằng cách đặt lệnh [Image.new] thôi. Dưới đây tôi sẽ hướng dẫn phương pháp để biểu thị hiệu ứng hoạt hình của Object hình ảnh.

Xác lập kích cỡ hình ảnh

Kích cỡ từng hình ảnh là [100x100] pixel nên chún ta cũng đặt size hình ảnh là [100x100]

animation01.rb

require 'mygame/boot'
img = Image.new("animation.bmp", :x => 100, :y => 100)
  main_loop do
  img.render
end

1-18 Kết quả thực hiện lệnh

Sau đó chúng ta chỉ cần chuyển đổi các hình ảnh thì có thể tái hiện hoạt hình được.

Thiết lập hoạt hình

Để sử dụng được chức năng hoạt hình thì chúng ta cần thiết phải lưu hình ảnh chuỗi số kia vào Object hình ảnh.

img.add_animation(:roll => [20, [0,1,2]])

[:roll] chính là tên của hoạt hình. Tên của hoạt hình được chỉ định bằng kí hiệu (Về kí hiệu chúng ta sẽ tham khảo thêm ở phần Kí hiệu thêm sau này). Tại đây tôi đặt là [:roll], nhưng ta có thể đặt tên là [:aaa] hay [:hello], đặt bằng tên mình thích cũng được. Đằng sau đó chính là thời gian các hộp đổi cho nhau và thứ tự xuất hiện. Về format các bước animation thì phải tuân theo quy luật dưới đây.

[thời gian chuyển bước[bước 1, bước 2, bước 3,...], Jump place(có thể giản lược được)]

Những bước hình thành hoạt hình được lưu lại theo những bước trên đây. Chúng ta cũng có thể viết được tên hiệu ứng hoạt hình muốn chạy tiếp sau khi hiệu ứng hoạt hình này chạy hết vào jump place. Nếu chúng ta không viết gì vào nơi nay có nghĩa chúng ta chỉ muốn trình chiếu lại hình ảnh trước. Về cơ bản.

:roll => [20[0,1,2]]

Nếu ta viết như trên thì sẽ mang một số ý nghĩa dưới đây.

• Lưu tên của cuộn hoạt hình :roll
• Thời gian trình chiếu hoạt hình là 20
• Sẽ trình chiếu theo thứ tự 0 -> 1 ->2
• Vì jump place được giản lược nên coi đây như một chuỗi kết quả vô hạn

Symbol

Dãy chữ đằng sau [:] thì người ta gọi là symbol. Những chữ được sử dụng trong symbol là những chữ được sử dụng khi phát lệnh hay đặt tên biến số :hello :abc :XYZ :a0123 :ABC [symbol] cũng giống như dãy chữ nhưng không phải [Object dãy chữ]. Nếu ta dùng lệnh [to_s] đối với [symbol] thì nó sẽ chuyển thành [Object dãy chữ].

p :hello.to_s	# => "hello"

Hoặc nếu muốn chuyển dãy chữ về [symbol] thì ta có lệnh [to_sym].

p "hello".to_sym	# => :hello

Bắt đầu hiệu ứng hoạt hình

require 'mygame/boot'
img = Image.new("animation.bmp", :w => 100, :h =>100)
img.add_animation :abc =>[20, [0,1, 2]]
img.start_animation :abc
main_loop do
  img.update
  img.render
end

Trong trường hợp sử dụng chức năng animation thì chúng ta cần thiết phải dùng lệnh [update]. ==Nếu không sử dụng lệnh [update] thì kể cả ta có [start_animation] thì cũng không thể chạy được.==

Lưu những hình ảnh hoạt hình phức tạp khác

Khi sử dụng lệnh ghi [add_animation] thì chúng ta cũng có thể đồng thời ghi thêm những hình ảnh hoạt hình khác nữa.

animation03.rb

require 'mygame/boot'
img = Image.new("animation.bmp"; :h => 100; :w => 100)
img.add_animation :abc => [20,[0,1,2]],
                  :cba => [20,[2,1,0]],
                  :bc => [20,[1,2]]
img.start_animation :cba
main_loop do
  img.update
  img.render
end

Chúng ta hãy dùng dấu [,] giữa những chuỗi như vậy để phân biệt.

Jump của animation

Đây là ví dụ ta muốn phát lệnh phát tiếp hiệu ứng hoạt hình nào sau hiệu ứng nào, đây là ví dụ

animation04.rb

require 'mygame/boot'
img = Image.new("animation.bmp"; :h => 100; :w => 100)
img.add_animation :abc => [20,[0,1,2]],
                  :cba => [20,[2,1,0], :bc],
                  :bc => [20,[1,2]]
img.start_animation :cba
main_loop do
  img.update
  img.render
end

Tại khu vực jump như vậy ta chỉ cần thêm symbol chỉ tên của hiệu ứng hoạt hình. Nếu chúng ta cho tên của hiệu ứng hoạt hình không tồn tại (chưa được lưu) thì chương trình sẽ trở thành error.

Chuyển hướng của nhân vật

Chúng ta thử tạo hiệu ứng hoạt hình cho nhân vật quay 4 hướng nhé. Hình ảnh của nhân vật, chúng ta sẽ dùng hình ảnh dưới đây.

Hình 3-20 Hình ảnh nhân vật [punya01.png]

Hình ảnh dưới đây đã trang bị hình ảnh nhân vật quay 4 hướng. Mỗi lần quay 1 hướng thì sẽ có 3 hình ảnh để miêu tả hình ảnh quay.

Các hình ảnh được đánh số 0~11 theo thứ tự từ trái qua phải, từ trên xuống dưới. Đây là chương trình để tạo hiệu ứng hoạt hình cho nhân vật quay 4 hướng

animation05.rb

require 'mygame/boot"
punya = TransparentImage.new("punya01.png",:x => 100, :y => 100, :w => 64,:h => 64 )
punya.add_animation (:down => [10,[0,1,2,0]],
                     :up => [10, [3,4,5,4]],
                     :right => [10,[6,7,8,7]],
                     :left [10,[9,10,11,10]])
punya.start_animation :down
main_loop do
  if key_pressed?(Key::RIGHT)
    punya.x += 3
    punya.start_animation :right
  if key_pressed?(Key::LEFT)
    punya.x -= 3
    punya.start_animation :left
  if key_pressed?(Key::UP)
    punya.y -= 3
    punya.start_animation :up
  if key_pressed? (Key::DOWN)
    punya.y += 3
    punya.start_animation :down
  end
  punya.update
  punya.render
end

Cứ mỗi lần nhấn mũi tên đi hướng nào thì nhân vật sẽ hướng về hướng đó. Lúc này, cứ mỗi lần nhấn phút thì có sự kết hợp giữa việc tiến và chuyển động hoạt hình.