Espruino:Примеры/Игра Flappy Bird: различия между версиями
Материал из Онлайн справочника
Перейти к навигацииПерейти к поиску
Myagkij (обсуждение | вклад) (Новая страница: «{{Espruino/Панель перехода}} {{Перевод от Сubewriter}} {{Myagkij-редактор}} =<ref>[ www.espruino.com - ]</ref>= <syntaxhighlight...») |
Myagkij (обсуждение | вклад) Нет описания правки |
||
Строка 3: | Строка 3: | ||
{{Myagkij-редактор}} | {{Myagkij-редактор}} | ||
=<ref>[ www.espruino.com - ]</ref>= | =Игра Flappy Bird<ref>[https://www.espruino.com/Pico+Flappy+Bird+Game www.espruino.com - Flappy Bird Game]</ref>= | ||
[https://www.youtube.com/watch?v=OvQdiNA2YhM&feature=emb_title Make a portable Flappy Bird game from scratch!] | |||
В этом руководстве мы создадим упрощённую версию [https://ru.wikipedia.org/wiki/Flappy_Bird Flappy Bird] (сразу с монитором). Для тех, кто не в курсе – суть этой игры заключается в том, чтобы не дать управляемой вами птичке упасть или врезаться в препятствия. | |||
Более подробное описание процесса смотрите в видео выше. | |||
== Нам понадобятся == | |||
* Плата [https://www.espruino.com/Pico Espruino Pico] | |||
* [https://www.espruino.com/PCD8544 LCD-дисплей Nokia 5110] | |||
* [https://www.espruino.com/Breadboard Макетная плата] | |||
Или: | |||
* Espruino [https://www.espruino.com/Pixl.js Pixl.js] | |||
== Код == | |||
Более подробно то, что происходит в коде, рассказывается в видео выше, но если вам нужен лишь код – безо всяких объяснений – то вот он: | |||
=== Для Espruino Pico и PCD8544 === | |||
<syntaxhighlight lang="javascript" enclose="div"> | |||
// Для Pico и LCD-дисплея: | |||
A5.write(0); // контакт GND | |||
A7.write(1); // контакт VCC | |||
var BUTTON = B3; | |||
pinMode(BUTTON,"input_pulldown"); | |||
var g; | |||
var SPEED = 0.5; | |||
// В Espruino v2.00 изображения можно добавлять вот так: | |||
var BIRDIMG = Graphics.createImage(` | |||
#### | |||
# # | |||
# ### # | |||
# # # | |||
# # | |||
#### | |||
`); | |||
BIRDIMG.transparent=0; | |||
/* В ранних версиях Espruino нужно было делать вот так: | |||
var BIRDIMG = { | |||
width : 8, height : 8, bpp : 1, | |||
transparent : 0, | |||
buffer : new Uint8Array([ | |||
0b00000000, | |||
0b01111000, | |||
0b10000100, | |||
0b10111010, | |||
0b10100100, | |||
0b10000100, | |||
0b01111000, | |||
0b00000000, | |||
]).buffer | |||
}; | |||
*/ | |||
var birdy, birdvy; | |||
var wasPressed = false; | |||
var running = false; | |||
var barriers; | |||
var score; | |||
function newBarrier(x) { | |||
barriers.push({ | |||
x1 : x-5, | |||
x2 : x+5, | |||
y : 10+Math.random()*28, | |||
gap : 8 | |||
}); | |||
} | |||
function gameStart() { | |||
running = true; | |||
birdy = 48/2; | |||
birdvy = 0; | |||
barriers = []; | |||
for (var i=42;i<g.getWidth();i+=42) | |||
newBarrier(i); | |||
score = 0; | |||
} | |||
function gameStop() { | |||
running = false; | |||
} | |||
function draw() { | |||
var buttonState = BUTTON.read(); | |||
g.clear(); | |||
if (!running) { | |||
g.drawString("Конец игры!",25,10); | |||
g.drawString("Очки",10,20); | |||
g.drawString(score,10,26); | |||
g.flip(); | |||
if (buttonState && !wasPressed) | |||
gameStart(); | |||
wasPressed = buttonState; | |||
return; | |||
} | |||
if (buttonState && !wasPressed) | |||
birdvy -= 2; | |||
wasPressed = buttonState; | |||
score++; | |||
birdvy += 0.2; | |||
birdvy *= 0.8; | |||
birdy += birdvy; | |||
if (birdy > g.getHeight()) | |||
gameStop(); | |||
// Рисуем птицу: | |||
//g.fillRect(0,birdy-3,6,birdy+3); | |||
g.drawImage(BIRDIMG, 0,birdy-4); | |||
// Рисуем препятствия: | |||
barriers.forEach(function(b) { | |||
b.x1-=SPEED; | |||
b.x2-=SPEED; | |||
var btop = b.y-b.gap; | |||
var bbot = b.y+b.gap; | |||
g.drawRect(b.x1+1, -1, b.x2-2, btop-5); | |||
g.drawRect(b.x1, btop-5, b.x2, btop); | |||
g.drawRect(b.x1, bbot, b.x2, bbot+5); | |||
g.drawRect(b.x1+1, bbot+5, b.x2-1, g.getHeight()); | |||
if (b.x1<6 && (birdy-3<btop || birdy+3>bbot)) | |||
gameStop(); | |||
}); | |||
while (barriers.length && barriers[0].x2<=0) { | |||
barriers.shift(); | |||
newBarrier(g.getWidth()); | |||
} | |||
g.flip(); | |||
} | |||
// Для Pico и LCD-дисплея: | |||
function onInit() { | |||
// Настраиваем SPI: | |||
var spi = new SPI(); | |||
spi.setup({ sck:B1, mosi:B10 }); | |||
// Инициализируем LCD-дисплей: | |||
g = require("PCD8544").connect(spi,B13,B14,B15, function() { | |||
//g.setContrast(0.43); | |||
gameStart(); | |||
setInterval(draw, 50); | |||
}); | |||
} | |||
// Наконец, запускаем игру: | |||
onInit(); | |||
</syntaxhighlight> | |||
=== Для Pixl.js === | |||
<syntaxhighlight lang="javascript" enclose="div"> | <syntaxhighlight lang="javascript" enclose="div"> | ||
var BUTTON = BTN1; | |||
var SPEED = 0.5; | |||
var BIRDIMG = { | |||
width : 8, height : 8, bpp : 1, | |||
transparent : 0, | |||
buffer : new Uint8Array([ | |||
0b00000000, | |||
0b01111000, | |||
0b10000100, | |||
0b10111010, | |||
0b10100100, | |||
0b10000100, | |||
0b01111000, | |||
0b00000000, | |||
]).buffer | |||
}; | |||
var birdy, birdvy; | |||
var wasPressed = false; | |||
var running = false; | |||
var barriers; | |||
var score; | |||
function newBarrier(x) { | |||
barriers.push({ | |||
x1 : x-5, | |||
x2 : x+5, | |||
y : 10+Math.random()*28, | |||
gap : 8 | |||
}); | |||
} | |||
function gameStart() { | |||
running = true; | |||
birdy = 48/2; | |||
birdvy = 0; | |||
barriers = []; | |||
for (var i=42;i<g.getWidth();i+=42) | |||
newBarrier(i); | |||
score = 0; | |||
} | |||
function gameStop() { | |||
running = false; | |||
} | |||
function draw() { | |||
var buttonState = BUTTON.read(); | |||
g.clear(); | |||
if (!running) { | |||
g.drawString("Конец игры!",25,10); | |||
g.drawString("Очки",10,20); | |||
g.drawString(score,10,26); | |||
g.flip(); | |||
if (buttonState && !wasPressed) | |||
gameStart(); | |||
wasPressed = buttonState; | |||
return; | |||
} | |||
if (buttonState && !wasPressed) | |||
birdvy -= 2; | |||
wasPressed = buttonState; | |||
score++; | |||
birdvy += 0.2; | |||
birdvy *= 0.8; | |||
birdy += birdvy; | |||
if (birdy > g.getHeight()) | |||
gameStop(); | |||
// Рисуем птицу: | |||
//g.fillRect(0,birdy-3,6,birdy+3); | |||
g.drawImage(BIRDIMG, 0,birdy-4); | |||
// Рисуем препятствия: | |||
barriers.forEach(function(b) { | |||
b.x1-=SPEED; | |||
b.x2-=SPEED; | |||
var btop = b.y-b.gap; | |||
var bbot = b.y+b.gap; | |||
g.drawRect(b.x1+1, -1, b.x2-2, btop-5); | |||
g.drawRect(b.x1, btop-5, b.x2, btop); | |||
g.drawRect(b.x1, bbot, b.x2, bbot+5); | |||
g.drawRect(b.x1+1, bbot+5, b.x2-1, g.getHeight()); | |||
if (b.x1<6 && (birdy-3<btop || birdy+3>bbot)) | |||
gameStop(); | |||
}); | |||
while (barriers.length && barriers[0].x2<=0) { | |||
barriers.shift(); | |||
newBarrier(g.getWidth()); | |||
} | |||
g.flip(); | |||
} | |||
function onInit() { | |||
gameStart(); | |||
setInterval(draw, 50); | |||
} | |||
// Наконец, запускаем игру: | |||
onInit(); | |||
</syntaxhighlight> | |||
=См.также= | =См.также= |
Версия от 20:02, 18 марта 2021
Перевод: Максим Кузьмин
Проверка/Оформление/Редактирование: Мякишев Е.А.
Игра Flappy Bird[1]
Make a portable Flappy Bird game from scratch!
В этом руководстве мы создадим упрощённую версию Flappy Bird (сразу с монитором). Для тех, кто не в курсе – суть этой игры заключается в том, чтобы не дать управляемой вами птичке упасть или врезаться в препятствия.
Более подробное описание процесса смотрите в видео выше.
Нам понадобятся
Или:
- Espruino Pixl.js
Код
Более подробно то, что происходит в коде, рассказывается в видео выше, но если вам нужен лишь код – безо всяких объяснений – то вот он:
Для Espruino Pico и PCD8544
// Для Pico и LCD-дисплея:
A5.write(0); // контакт GND
A7.write(1); // контакт VCC
var BUTTON = B3;
pinMode(BUTTON,"input_pulldown");
var g;
var SPEED = 0.5;
// В Espruino v2.00 изображения можно добавлять вот так:
var BIRDIMG = Graphics.createImage(`
####
# #
# ### #
# # #
# #
####
`);
BIRDIMG.transparent=0;
/* В ранних версиях Espruino нужно было делать вот так:
var BIRDIMG = {
width : 8, height : 8, bpp : 1,
transparent : 0,
buffer : new Uint8Array([
0b00000000,
0b01111000,
0b10000100,
0b10111010,
0b10100100,
0b10000100,
0b01111000,
0b00000000,
]).buffer
};
*/
var birdy, birdvy;
var wasPressed = false;
var running = false;
var barriers;
var score;
function newBarrier(x) {
barriers.push({
x1 : x-5,
x2 : x+5,
y : 10+Math.random()*28,
gap : 8
});
}
function gameStart() {
running = true;
birdy = 48/2;
birdvy = 0;
barriers = [];
for (var i=42;i<g.getWidth();i+=42)
newBarrier(i);
score = 0;
}
function gameStop() {
running = false;
}
function draw() {
var buttonState = BUTTON.read();
g.clear();
if (!running) {
g.drawString("Конец игры!",25,10);
g.drawString("Очки",10,20);
g.drawString(score,10,26);
g.flip();
if (buttonState && !wasPressed)
gameStart();
wasPressed = buttonState;
return;
}
if (buttonState && !wasPressed)
birdvy -= 2;
wasPressed = buttonState;
score++;
birdvy += 0.2;
birdvy *= 0.8;
birdy += birdvy;
if (birdy > g.getHeight())
gameStop();
// Рисуем птицу:
//g.fillRect(0,birdy-3,6,birdy+3);
g.drawImage(BIRDIMG, 0,birdy-4);
// Рисуем препятствия:
barriers.forEach(function(b) {
b.x1-=SPEED;
b.x2-=SPEED;
var btop = b.y-b.gap;
var bbot = b.y+b.gap;
g.drawRect(b.x1+1, -1, b.x2-2, btop-5);
g.drawRect(b.x1, btop-5, b.x2, btop);
g.drawRect(b.x1, bbot, b.x2, bbot+5);
g.drawRect(b.x1+1, bbot+5, b.x2-1, g.getHeight());
if (b.x1<6 && (birdy-3<btop || birdy+3>bbot))
gameStop();
});
while (barriers.length && barriers[0].x2<=0) {
barriers.shift();
newBarrier(g.getWidth());
}
g.flip();
}
// Для Pico и LCD-дисплея:
function onInit() {
// Настраиваем SPI:
var spi = new SPI();
spi.setup({ sck:B1, mosi:B10 });
// Инициализируем LCD-дисплей:
g = require("PCD8544").connect(spi,B13,B14,B15, function() {
//g.setContrast(0.43);
gameStart();
setInterval(draw, 50);
});
}
// Наконец, запускаем игру:
onInit();
Для Pixl.js
var BUTTON = BTN1;
var SPEED = 0.5;
var BIRDIMG = {
width : 8, height : 8, bpp : 1,
transparent : 0,
buffer : new Uint8Array([
0b00000000,
0b01111000,
0b10000100,
0b10111010,
0b10100100,
0b10000100,
0b01111000,
0b00000000,
]).buffer
};
var birdy, birdvy;
var wasPressed = false;
var running = false;
var barriers;
var score;
function newBarrier(x) {
barriers.push({
x1 : x-5,
x2 : x+5,
y : 10+Math.random()*28,
gap : 8
});
}
function gameStart() {
running = true;
birdy = 48/2;
birdvy = 0;
barriers = [];
for (var i=42;i<g.getWidth();i+=42)
newBarrier(i);
score = 0;
}
function gameStop() {
running = false;
}
function draw() {
var buttonState = BUTTON.read();
g.clear();
if (!running) {
g.drawString("Конец игры!",25,10);
g.drawString("Очки",10,20);
g.drawString(score,10,26);
g.flip();
if (buttonState && !wasPressed)
gameStart();
wasPressed = buttonState;
return;
}
if (buttonState && !wasPressed)
birdvy -= 2;
wasPressed = buttonState;
score++;
birdvy += 0.2;
birdvy *= 0.8;
birdy += birdvy;
if (birdy > g.getHeight())
gameStop();
// Рисуем птицу:
//g.fillRect(0,birdy-3,6,birdy+3);
g.drawImage(BIRDIMG, 0,birdy-4);
// Рисуем препятствия:
barriers.forEach(function(b) {
b.x1-=SPEED;
b.x2-=SPEED;
var btop = b.y-b.gap;
var bbot = b.y+b.gap;
g.drawRect(b.x1+1, -1, b.x2-2, btop-5);
g.drawRect(b.x1, btop-5, b.x2, btop);
g.drawRect(b.x1, bbot, b.x2, bbot+5);
g.drawRect(b.x1+1, bbot+5, b.x2-1, g.getHeight());
if (b.x1<6 && (birdy-3<btop || birdy+3>bbot))
gameStop();
});
while (barriers.length && barriers[0].x2<=0) {
barriers.shift();
newBarrier(g.getWidth());
}
g.flip();
}
function onInit() {
gameStart();
setInterval(draw, 50);
}
// Наконец, запускаем игру:
onInit();
См.также
Внешние ссылки