Làm thế nào để Thêm Drift Effects vào Trò chơi HTML5 của bạn - núm vú

Bạn có thể sử dụng vector lực một cách thú vị trong trò chơi HTML5 của bạn. Nhiều trò chơi đua xe bao gồm cơ chế trật bánh hoặc trôi. Bắt hành vi này chính xác đòi hỏi phải có toán học rất tinh vi, nhưng bạn có thể làm cho một sự ước lượng hợp lý của hành vi này mà không cần quá nhiều nỗ lực.

Hình ảnh này không đủ. Bạn thực sự cần phải xem đây là một chương trình làm việc bởi vì nó thực sự mát mẻ. Khi bạn di chuyển chiếc thuyền xung quanh trên màn hình, thuyền trôi dạt và trượt. Nó thực sự thú vị để chơi với.

Kỹ thuật này là sự thỏa hiệp giữa chuyển động dựa trên không gian (nơi vector lực chỉ được thêm vào khi máy gia tốc được nhấn) và hành vi của xe tiêu chuẩn (nơi mà hướng di chuyển luôn luôn theo sau mũi xe). Mỗi khung có một chút của mỗi hành vi.

Đây là đoạn code:

drift. trò chơi html var; var thuyền; chức năng Boat () {tBoat = mới Sprite (trò chơi, "thuyền. png", 100, 50); tBoat. checkKeys = function () {console. log (tốc độ này); if (keysDown [K_LEFT]) {this. changeImgAngleBy (-5);} if (keysDown [K_RIGHT]) {this. changeImgAngleBy (5);} if (keysDown [K_UP]) {this. addVector (this.getImgAngle (), 2);}

điều này. addVector (this.getImgAngle (), (tốc độ / 20));

} // end checkKeys tBoat. checkDrag = function () {speed = this. getSpeed ​​(); tốc độ * =. 95; điều này. setSpeed ​​(speed);} return tBoat;} init chức năng () {game = new Scene (); trò chơi. setBG ("# 000066"); thuyền = new Boat (); trò chơi. bắt đầu ();) / / end init update chức năng () {game. thông thoáng(); thuyền. checkKeys (); thuyền. checkDrag (); thuyền. cập nhật ();} Làm thế nào để thêm drift vào sprites trò chơi của bạn

Đó là một thủ tục rất đơn giản.

Xây dựng một mô hình xe tiêu chuẩn.

Hãy xem xét làm thuyền, chỉ để thay đổi.

1. Sử dụng một vector lực để gia tốc.

   Một lần nữa, bạn đang tự kiểm soát tốc độ, do đó, các addVector () cơ chế cung cấp cho bạn sức mạnh tuyệt vời. Các vector lực gia tốc (được sử dụng trong nhấn phím mũi tên lên) có thể là một giá trị chữ, nhưng nó không cần phải là rất lớn. Bởi vì bạn đang thực sự được thêm một vector lực thứ hai, bạn có thể muốn giai điệu xuống vector tăng tốc.

2. Thêm một vector lực nhỏ mỗi khung.

   Vectơ lực chính xảy ra chỉ khi bạn tăng tốc, nhưng một vector nhỏ hơn thứ cấp được thêm vào mỗi khung. Vòng này đi theo hướng mà thuyền đang phải đối mặt.Vectơ chuyển động nhỏ này sẽ mô phỏng đà. Điều quan trọng là vector lực này là một tỷ lệ phần trăm của tốc độ chứ không phải là một giá trị văn chương. Nếu bạn luôn di chuyển về phía trước một pixel, ví dụ, thuyền sẽ không bao giờ dừng lại.