Roulette ya Picha na Obniz: Hatua 5

2024 Mwandishi: John Day | [email protected]. Mwisho uliobadilishwa: 2024-01-30 12:53

Nimefanya mazungumzo ya picha. Ukibonyeza kitufe, mazungumzo huanza kuzunguka. Ikiwa unasisitiza tena, mazungumzo huacha kuzunguka na beeps!

Hatua ya 1: Mzunguko

Tunatumia spika ya waya na kifungo tu.

Nambari za siri za waya zimeandikwa kwenye programu.

kifungo = obniz.wired ("Button", {signal: 6, gnd: 7}); speaker = obniz.wired ("Spika", {signal: 0, gnd: 1});

Hatua ya 2: Zungusha Picha ya Rulette

Katika HTML, unaweza kutumia "CSS change". Kwa mfano, hii ndio nambari ya kuzungusha picha 90 digrii.

hati.getElementById ("mazungumzo"). style = "transform: rotate (90deg);";

Kuanza na kuacha kuzunguka polepole, ongeza kasi ya var kwa digrii ya kuzunguka kwa fremu.

basi kasi = 0; basi dig = 0; kazi zungusha () {deg + = kasi; hati.getElementById ("mazungumzo"). style = "transform: rotate (" + deg + "deg);";

}

setInterval (zunguka, 10);

Hatua ya 3: Beep

Je! Unataka kulia kwenye mazungumzo hakuna mabadiliko? Na hii, unaweza kulia juu ya 440Hz 10ms.

spika.wacheza (440); subiri obniz. subiri (10); mzungumzaji.acha ();

Hii ndio njia ya kujua juu ya mabadiliko ya mazungumzo hakuna.

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

Kwa hivyo, hii ndio nambari ya kuzungusha na beep.

basi kasi = 0; basi dig = 0; kazi zungusha () {// juu ya mabadiliko ya thamani ikiwa (Math.floor ((deg + speed) / (360 / 7.0)) - Math.floor (deg / (360 / 7.0))> = 1) {onRouletteChange (); } deg + = kasi; hati.getElementById ("mazungumzo"). style = "transform: rotate (" + deg + "deg);";

}

setInterval (zunguka, 10);

kazi ya async kwenyeRouletteChange () {

ikiwa (! spika) {kurudi;} spika.cheza (440); subiri obniz. subiri (10); mzungumzaji.acha (); }

Hatua ya 4: Anza kwenye Kitufe kilichosukumwa

Ili kujua hali ya kifungo, ongeza var buttonStateand set value of state of button state.

kifungo.onchange = kazi (taabu) {buttonState = taabu; };

Na pia ongeza awamu ya var kwa hali ya sasa ya mazungumzo.phase imewekwa moja ya hii.

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

Kwa mfano, wakati awamu ni PHASE_WAIT_FOR_START na unataka awamu inayofuata.

ikiwa (awamu == PHASE_WAIT_FOR_START) {kasi = 0; ikiwa (buttonState) {phase = PHASE_ROTATE; }}

Ili kuharakisha utawala, badilisha kasi ya var.

ikiwa (phase == PHASE_ROTATE) {kasi = kasi + 0.5; }

Ili kuharakisha sheria, badilisha kasi ya var.

:

ikiwa (awamu == PHASE_STOPPING) {kasi = kasi-0.2; }

Hizo ni sehemu ya mazungumzo. Wacha tuifanye!

Hatua ya 5: Programu

Tafadhali rejelea hapa kwa mpango