K
Khách
Hãy nhập câu hỏi của bạn vào đây, nếu là tài khoản VIP, bạn sẽ được ưu tiên trả lời.
Dưới đây là một vài câu hỏi có thể liên quan tới câu hỏi mà bạn gửi lên. Có thể trong đó có câu trả lời mà bạn cần!
MF
1 tháng 10 2020
đáp án làm lồn\(<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Snake game</title> </head> <body> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.js"></script> <script src="config.js" charset="utf-8"></script> <script src="snake.js" charset="utf-8"></script> <script src="food.js" charset="utf-8"></script> <script src="game.js" charset="utf-8"></script> </body> </html> 2. config.js Đây là file chứa các hằng số trong game (đội rộng, cao của màn hình, ...) const GRID_SIZE = 30; const WITDH = 600; const HEIGHT = 600; 3. snake.js Đây là Class chứa toàn bộ code để điều khiển con rắn. class Snake { constructor(){ this.head = createVector(0,0); } show() { noStroke(); // Draw snake head fill(255); rect(this.head.x, this.head.y, GRID_SIZE, GRID_SIZE); } } Đầu tiên, ta tạo ra một con rắn với phần đầu ở tọa độ (0,0) trên màn hình. Class này sẽ có một hàm show(), giúp hiển thị con rắn lên màn hình. 4. game.js Đây là file chứa code của toàn bộ game. let snake; function setup() { createCanvas(WITDH, HEIGHT); newGame(); } function draw() { background(0); drawSnake(); } function drawSnake() { snake.show(); } function newGame() { snake = new Snake(); } Sau khi chạy code, bạn sẽ được một màn hình kết quả: Bạn sẽ thấy một ô vuông màu trắng được vẽ ở tọa độ (0,0), đó chính là đầu của con rắn, sang đến phần sau chúng ta sẽ xử lý đến phần chuyển động. 2.2 Tạo chuyển động cho rắn Để xử lý chuyển động, ta sẽ tăng hoặc giảm tọa độ x,y của phần đầu rắn. Vậy ta sẽ có 4 trường hợp như sau: Đi lên: y += 1. Đi xuống: y -= 1. Sang trái: x -= 1. Sang phải: x += 1. Nhưng như vậy sẽ phải xử lý 4 trường hợp rất dài dòng. Vậy nên ta sẽ dùng một Vector khác, gọi là Vector vel dùng để xác định phương hướng đang đi. Đi lên: vel = (0, 1); Đi xuống: vel = (0, -1); Sang trái: vel = (-1, 0); Sang phải: vel = (-1, 0); Để thay đổi giá trị cho vel mỗi khi người chơi nhấn các phím mũi tên, ta sẽ viết thêm 1 hàm là keyPressed() trong file game.js function keyPressed() { if (keyCode == UP_ARROW && snake.vel.y != 1) { snake.vel.y = -1; snake.vel.x = 0; } else if (keyCode == DOWN_ARROW && snake.vel.y != -1) { snake.vel.y = 1; snake.vel.x = 0; } else if (keyCode == LEFT_ARROW && snake.vel.x != 1) { snake.vel.y = 0; snake.vel.x = -1; } else if (keyCode == RIGHT_ARROW && snake.vel.x != -1) { snake.vel.y = 0; snake.vel.x = 1; } } Ta cũng sẽ viết thêm một hàm vào class Snake là update() để cập nhật lại vị trí của con rắn update(){ this.head.x += this.vel.x * GRID_SIZE; this.head.y += this.vel.y * GRID_SIZE; this.head.x = (this.head.x + WITDH) % WITDH; this.head.y = (this.head.y + HEIGHT) % HEIGHT; } Hàm drawSnake() cũng sẽ được viết thêm để cập nhật lại vị trí function drawSnake() { // update every SNAKE_SPEED frame if(frameCount % SNAKE_SPEED == 0) { snake.update(); } snake.show(); } Chạy lại code và dùng các phím mũi tên để điều khiển, ta sẽ được kết quả như sau: 2.3 Hiển thị thức ăn Đến phần này, ta sẽ hiển thị ra thức ăn để rắn có thể ăn. Tạo thêm một file food.js nữa để xử lý phần này class Food{ constructor () { this.newFood(); } newFood(){ this.x = Math.floor(random(width)); this.y = Math.floor(random(height)); this.x = Math.floor(this.x / GRID_SIZE) * GRID_SIZE; this.y = Math.floor(this.y / GRID_SIZE) * GRID_SIZE; } show(){ fill(255, 40, 0); rect(this.x, this.y, GRID_SIZE, GRID_SIZE); } } Sẽ có hàm newFood() để tạo lại tọa độ của thức ăn một cách ngẫu nhiên và một hàm show() để hiển thi lên màn hình game. Sau đó trong hàm drawSnake() chỉ cần gọi thêm food.show(); là đã hiển thị được thức ăn. 2.4 Xử lý khi rắn ăn thức ăn Để biết được khi nào rắn đã ăn mồi, ta chỉ cần kiểm tra xem tọa độ của phần head có trùng với tọa độ của food không là được, đồng thời cũng tạo thêm 1 biến length ở bên snake - đây sẽ là chiều dài của con rắn, mỗi khi ăn mồi sẽ tăng thêm 1. Ta viết thêm vào file game.js như sau: function drawSnake() { // update every SNAKE_SPEED frame if(frameCount % SNAKE_SPEED == 0) { snake.update(); } snake.show(); food.show(); // Handle when snake eat food if(snake.head.x == food.x && snake.head.y == food.y){ eatFood(); } } function eatFood() { snake.length++; food.newFood(); } Ta sẽ có kết quả như sau: Như vậy là ta đã hoàn thành phần ăn thức ăn. Tiếp theo sẽ đến việc xử lý phần thân của con rắn, làm sao để mỗi khi ăn thức ăn thì nó sẽ dài ra. Chúng ta sẽ thêm đoạn code sau vào hàm update() và show() của con rắn, đoạn code này sẽ update lại vị trí của phần thân rắn, dựa theo biến length. update(){ this.body.push(createVector(this.head.x, this.head.y)); this.head.x += this.vel.x * GRID_SIZE; this.head.y += this.vel.y * GRID_SIZE; this.head.x = (this.head.x + WITDH) % WITDH; this.head.y = (this.head.y + HEIGHT) % HEIGHT; if(this.length < this.body.length) { this.body.shift(); } } show() { noStroke(); // Draw snake head fill(255); rect(this.head.x, this.head.y, GRID_SIZE, GRID_SIZE); // Draw snake body fill(155); for(let vector of this.body) { rect(vector.x, vector.y, GRID_SIZE, GRID_SIZE); } } Sau khi chạy, ta được kết quả sau: 2.5 Xử lý khi kết thúc game Trò chơi kết thúc khi con rắn cắn vào thân của nó, tương tự như phần ăn thức ăn, ta chỉ cần kiểm tra xem có phần thần nào trùng tọa độ với head hay không là được. Ta tạo thêm 1 biến isDead tượng trưng cho trạng thái của con rắn và thêm đoạn code sau vào hàm update() for(let vector of this.body) { if(vector.x == this.head.x && vector.y == this.head.y) { this.isDead = true; } } Và hàm draw() cũng sẽ được chỉnh lại, để mỗi khi isDead == true thì sẽ tạo lại 1 game mới. function draw() { background(0); if(!snake.isDead){ drawSnake(); } else { newGame() } } Và cuối cùng, đây sẽ là game hoàn chỉnh :)) 3. Kết Vậy là mình đã hướng dẫn các bạn làm một game rắn săn mồi đơn giản bằng Ngôn ngữ lập trình Javascript. Hy vọng sau bài viết thì bạn sẽ cảm thấy hứng thú với Javascript hơn, cũng như với p5.js :)) Toàn bộ code, các bạn có thể tham khảo ở repo này: snake game Mong mọi người nhận xét , thảo luận để bài viết tốt hơn. Nếu thấy hay thì hãy vote 5 sao giúp mình nhé :)) Cảm ơn mọi người đã đọc. game javascript p5.js 5.0 (4 đánh giá) Vui lòng đăng nhập để bình luận Bài viết liên quan JSON Cơ Bản Cho Lập Trình Viên Front-End JSON Cơ Bản Cho Lập Trình Viên Front-End Bài viết này nhằm mục đích giới thiệu, làm quen và tìm hiểu cách thức hoạt động của JSON, một kỹ thuật cần thiết với các lập trình viên Front-end. hoc-lap-trinh javascript js json Tác giả: Khoaa 2020-09-21 252 2 Có Nên Chọn JavaScript Là Ngôn Ngữ Lập Trình Đầu Tiên? Có Nên Chọn JavaScript Là Ngôn Ngữ Lập Trình Đầu Tiên? Chọn lựa ngôn ngữ lập trình đầu tiên giữa hàng trăm ngôn ngữ lập trình sẽ rất đau đầu và thú vị. Tôi chọn JavaScript là ngôn ngữ đầu tiên. Tại sao thế? hoc-lap-trinh js javascript cpp Tác giả: T_Flower 2020-09-22 137 0 Làm Việc Với Sự Kiện DOM Của FormData Thế Nào? Làm Việc Với Sự Kiện DOM Của FormData Thế Nào? Bạn đã nghe về sự kiện formdata mới chưa? Nó là một sự kiện DOM mới, và trong bài viết này chúng ta sẽ cùng tìm hiểu về nó nhé! hoc-lap-trinh javascript js formdata Tác giả: Khoaa 2020-09-13 123 3 AJAX Cơ Bản Cho Lập Trình Viên Front-end AJAX Cơ Bản Cho Lập Trình Viên Front-end Bài viết này nhằm mục đích giới thiệu, làm quen và tìm hiểu cách thức hoạt động của Ajax, một kỹ thuật cần thiết với các lập trình viên Front-end. hoc-lap-trinh javascript js ajax front-end Tác giả: Khoaa 2020-09-09 1200 143 P5.js - Thư Viện Đồ Họa Không Thể Bỏ Lỡ Trong JS \)
22 tháng 6 2019
\(2x+\left(1+2+3+...+100\right)=15150\)
\(2x+\left[\left(1+100\right)+\left(2+99\right)+...+\left(50+51\right)\right]=15150\)
\(2x+\left[101+101+...+101\right]=15150\)CÓ 50 SỐ 101
\(2x+\left[101\times50\right]=15150\)
\(2x=15150:5050\)
\(2x=3\)
\(x=3:2\)
\(x=1.5\)
SS
22 tháng 6 2019
a, 2x + (1+2+3+4+...+100) = 15150
=> 2x + \(\frac{\left(1+100\right).\left[\left(100-1\right)+1\right]}{2}\)= 15150
=> 2x + \(\frac{101.100}{2}\)= 15150
=> 2x + 5050 = 15150
=> 2x = 15150 - 5050
=> 2x = 10100
=> x = 10100 : 2
=> x = 5050
Vậy x = 5050
b, .(x+1)+(x+2)+(x+3)+(x+4)+(x+5)+(x+6)+(x+7)+(x+8)=36
=> (x + x + x + x +x + x +x +x ) + (1 + 2 + 3 + 4 + 5 + 6 + 7 + 8) = 36
=> 8x + 36 = 36
=> 8x = 0
=> x = 0
Vậy x = 0
c, 0+0+4+6+8+...+2x=110
Sửa đề :0 + 2 + 4 + 6 + 8 + ... + 2x = 110 = 2 + 4 + 6 + 8 + ... + 2x = 110
SSH : \(\frac{\left(2\text{x}-2\right)}{2}+1=x-1+1=x\)
Tổng : \(\frac{\left(2\text{x}+2\right).x}{2}=110\Leftrightarrow\frac{2.\left(x+1\right).x}{2}=110\)
\(\Leftrightarrow\left(x+1\right)x=110\)
\(\Leftrightarrow\left(10+1\right).10=110\)
=> x = 10
Vậy x = 10
NT
0
30 tháng 11 2017
Theo đề bài ta có:
(x.5+16):3=7
x.5+16 =7.3
x.5+16 =21
x.5 =21-16
x.5 =5
x =5:5
x =1
Vậy x=1
bai toan nay kho