Grafisk roulette med Obniz: 5 trin

2024 Forfatter: John Day | [email protected]. Sidst ændret: 2024-01-30 08:29

Jeg har lavet en grafisk roulette. Hvis du trykker på knappen, begynder roulette at rotere. Hvis du trykker igen, stopper roulette med at rotere og bipper!

Trin 1: Kredsløb

Vi bruger kun en kablet højttaler og en knap.

Pin -numrene på kablet er skrevet på programmet.

knap = obniz.wired ("Knap", {signal: 6, gnd: 7}); højttaler = obniz.wired ("Højttaler", {signal: 0, gnd: 1});

Trin 2: Roter Rulette -billede

I HTML kan du bruge "CSS -transformation". For eksempel er dette koden for roter billede 90 grader.

document.getElementById ("roulette"). style = "transform: roter (90deg);";

For at starte og stoppe med at rotere langsomt, tilføj en var -hastighed for rotationsgrad pr. Ramme.

lad hastighed = 0; lad deg = 0; funktion roter () {deg += hastighed; document.getElementById ("roulette"). style = "transform: roter ("+deg+"deg);";

}

setInterval (roter, 10);

Trin 3: Bip

Vil du bippe på roulette uden ændringer? Med dette kan du bippe på 440Hz 10ms.

højttaler.spil (440); afvente obniz.wait (10); speaker.stop ();

Sådan kan du vide om ændring af roulette no.

hvis (Math.floor ((deg + hastighed) / (360 / 7.0)) - Math.floor (deg / (360 / 7.0))> = 1) {onRouletteChange (); }

Så dette er koden for roter og bip.

lad hastighed = 0; lad deg = 0; funktion roter () {// ved ændringsværdi hvis (Math.floor ((deg + hastighed) /(360 /7.0)) - Math.floor (deg /(360 /7.0))> = 1) {onRouletteChange (); } deg += hastighed; document.getElementById ("roulette"). style = "transform: roter ("+deg+"deg);";

}

setInterval (roter, 10);

asynkroniseringsfunktion onRouletteChange () {

hvis (! højttaler) {return;} speaker.play (440); afvente obniz.wait (10); speaker.stop (); }

Trin 4: Start på knappen skubbet

For at kende knaptilstand skal du tilføje var buttonStat og sætværdien for den aktuelle knaptilstand.

button.onchange = funktion (trykket) {buttonState = trykket; };

Og tilføj også var fase for den aktuelle tilstand af roulette.phase er indstillet en af dette.

const PHASE_WAIT_FOR_START = 0; const PHASE_ROTATE = 1; const PHASE_STOPPING = 2; const PHASE_STOPPED = 3;

For eksempel, når fase er PHASE_WAIT_FOR_START, og du vil til næste fase.

hvis (fase == PHASE_WAIT_FOR_START) {hastighed = 0; hvis (buttonState) {fase = PHASE_ROTATE; }}

For at fremskynde rulette skal du ændre var -hastigheden.

hvis (fase == PHASE_ROTATE) {hastighed = hastighed+0,5; }

For at fremskynde ruletten skal du ændre var -hastigheden.

:

hvis (fase == PHASE_STOPPING) {hastighed = hastighed-0,2; }

Disse er en del af roulette. Lad os klare det!

Trin 5: Programmer

Se venligst her for programmet