สารบัญ:

JeuTropFacile - WayTooEasyGame: 3 ขั้นตอน
JeuTropFacile - WayTooEasyGame: 3 ขั้นตอน

วีดีโอ: JeuTropFacile - WayTooEasyGame: 3 ขั้นตอน

วีดีโอ: JeuTropFacile - WayTooEasyGame: 3 ขั้นตอน
วีดีโอ: 3 Signs You’re WAY Too Available With Men (The Opposite of "Playing Hard to Get") 2024, พฤศจิกายน
Anonim
JeuTropFacile - WayTooEasyGame
JeuTropFacile - WayTooEasyGame

เกมนี้สร้างด้วย HTML และ JavaScript ทั้งหมดด้วยไลบรารี P5js มี 2 ไฟล์ชื่อ index.html และ sketch.js ฉันเป็นผู้เริ่มต้นในรหัสดังนั้นฉันขอโทษถ้ามันไม่ชัดเจน

คุณสามารถเล่นเกมด้วยลิงค์นี้

คุณควบคุมลูกบอลสีขาวด้วยปุ่มลูกศร และคุณต้องหลีกเลี่ยงลูกบอลสีแดง (ขณะนี้ มีเพียงลูกเดียวเท่านั้น)

ฉันสร้างตัวแปร 2 ตัว: posX = 200 และ posY = 200

ใน sketch.js ฉันสร้าง canva ในการตั้งค่าฟังก์ชันด้วย 640x x 480y โดยมีพื้นหลังสีเทาในการวาดฟังก์ชัน จากนั้นจึงสร้างวงกลมสีขาวที่มีตำแหน่งบน posX, posY, 75, 75

ขั้นตอนที่ 1: ย้ายวงกลม

ย้ายวงกลม
ย้ายวงกลม

อย่างที่บอกไปก่อนหน้านี้ คุณสามารถใช้ปุ่มลูกศรเพื่อย้ายวงกลมได้

ในการทำเช่นนั้น ฉันได้สร้างฟังก์ชัน updatePositionEllipse()

ฉันใช้เงื่อนไขนี้เพื่อให้ใช้งานได้: if (keyIsDown(DOWN_ARROW)) {

ตำแหน่ง += 5;

}

เมื่อกดปุ่มลง วงกลมจะเลื่อนลง

ฉันใช้มันกับปุ่มอื่นๆ เพื่อให้คุณสามารถเลื่อนไปทางซ้าย ขวา ขึ้นและลงได้

ขั้นตอนที่ 2: การสร้างขอบเขตจำกัด

การสร้างขอบเขตจำกัด
การสร้างขอบเขตจำกัด

ในการทำให้ลูกบอลสีขาวหยุดที่ส่วนท้ายของ canva ฉันใช้ฟังก์ชัน testOutOfScreen

ข้างในนั้นฉันใช้เงื่อนไข if (posX > 600) {

posX = 600; สโตรกเวท(6); จังหวะ ('สีน้ำเงิน'); บรรทัด (637, 0, 637, 480); }

ถ้าตำแหน่งของ x เหนือกว่า 600: มันบล็อกลูกบอลและลากเส้นสีน้ำเงินที่มีเส้นขอบ 6 วางไว้ทางด้านขวาของผืนผ้าใบ

ฉันทำเช่นนี้สำหรับทุกพรมแดน

แนะนำ: