tailieunhanh - Lập trình game 2D trên HTML5, Phần 2: Đồ họa và ảnh động

Đồ họa và hình ảnh động là những khía cạnh cơ bản nhất của bất kỳ trò chơi nào, vì vậy trong bài này, tôi bắt đầu bằng một tổng quan ngắn gọn về API 2D Canvas (Canvas 2D API), tiếp theo là một thảo luận về việc thực hiện hình ảnh động trung tâm của Snail Bait. Trong bài này, bạn sẽ học cách: | Lập trình game 2D trên HTML5 Phần 2 Đồ họa và ảnh động Đồ họa và hình ảnh động là những khía cạnh cơ bản nhất của bất kỳ trò chơi nào vì vậy trong bài này tôi bắt đầu bằng một tổng quan ngắn gọn về API 2D Canvas Canvas 2D API tiếp theo là một thảo luận về việc thực hiện hình ảnh động trung tâm của Snail Bait. Trong bài này bạn sẽ học cách Vẽ các hình ảnh và các hình khối đồ họa thô sơ vào một canvas khung nền ảnh . Tạo các hình ảnh động mượt mà không bị giật. Thực hiện vòng lặp trong trò chơi. Theo dõi tốc độ hình ảnh động tính theo số khung hình mỗi giây Cuộn background khi di chuyển trong trò chơi. Sử dụng thị sai để mô phỏng ba chiều. Thực hiện chuyển động theo thời gian. Kết quả cuối cùng của mã được thảo luận trong bài này được thể hiện trong Hình 1 lình 1. Cuộn background khi di chuyến và theo dõi tốc độ khung hình Background và các bậc thềm cuộn theo chiều ngang. Các bậc thềm ở phía trước do đó chúng di chuyển nhanh hơn đáng kể hơn so với nền sau tạo ra một hiệu ứng thị sai nhẹ. Khi trò chơi bắt đầu background cuộn từ phải sang trái. Đến cuối màn background và bậc thềm đảo chiều chuyển động. Ở giai đoạn phát triển nhân vật trong trò chơi không di chuyển. Ngoài ra trò chơi còn chưa có phát hiện va chạm do đó nhân vật lơ lửng giữa không trung khi không có bậc thềm nào ở dưới. Cuối cùng các biểu tượng ở phía trên và sang bên trái khung nền ảnh của trò chơi sẽ cho biết số mạng sống còn lại của nhân vật như thể hiện trong Hình 1 trong bài viết đầu tiên của loạt bài này . Tạm thời lúc này trò chơi hiển thị tốc độ hình ảnh động theo số khung hình trên mỗi giây ở vị trí đó. Đồ họa trong chế độ hiển thị ngay lập tức Canvas Khung nền ảnh là một hệ thống đồ họa trong chế độ hiển thị ngay lập tức có nghĩa là nó vẽ ngay lập tức những gì bạn quy định và sau đó quên ngay lập tức. Các hệ thống đồ họa khác chẳng hạn như Scalable Vector Graphics SVG - Đồ họa Vectơ có thể điều chỉnh quy mô thực hiện đồ họa trong chế độ-giữ lại có nghĩa là chúng duy trì một danh sách các đối .