Obniz көмегімен графикалық рулетка: 5 қадам

2024 Автор: John Day | [email protected]. Соңғы өзгертілген: 2024-01-30 10:26

Мен графикалық рулетка жасадым. Егер сіз түймені бассаңыз, рулетка айнала бастайды. Егер сіз қайтадан бассаңыз, рулетка айналуды тоқтатады және дыбыстық сигнал береді!

1 -қадам: Схема

Біз тек сымды динамик пен түймені қолданамыз.

Бағдарламада сымның пин нөмірлері жазылған.

button = obniz.wired («Түйме», {сигнал: 6, gnd: 7}); динамик = obniz.wired («Динамик», {сигнал: 0, gnd: 1});

2 -қадам: Рулетка кескінін айналдыру

HTML -де «CSS түрлендіруді» қолдануға болады. Мысалы, бұл кескінді 90 градусқа бұру коды.

document.getElementById («рулетка»). style = «түрлендіру: бұру (90 градус);»;

Баяу айналуды бастау және тоқтату үшін кадрға айналу дәрежесі үшін var жылдамдығын қосыңыз.

жылдамдық = 0 болсын; deg = 0 болсын; функция rotate () {deg += жылдамдық; document.getElementById («рулетка»). style = «түрлендіру: бұру (»+deg+«deg);»;

}

setInterval (айналдыру, 10);

3 -қадам: Дыбыстық сигнал

Сіз рулеткаға дыбыстық сигнал бергіңіз келеді ме? Бұл жағдайда сіз 440 Гц 10 мс дыбыстық сигнал бере аласыз.

динамик.ойнату (440); күтіңіз obniz.wait (10); Speaker.stop ();

Бұл рулетканың өзгеруі туралы білуге болады.

if (Math.floor ((deg + жылдамдық) / (360 / 7.0)) - Math.floor (deg / (360 / 7.0))> = 1) {onRouletteChange (); }

Сонымен, бұл бұру мен дыбыстық сигнал коды.

жылдамдық = 0 болсын; deg = 0 болсын; функция rotate () {// мәнді өзгерту бойынша, егер (Math.floor ((deg + жылдамдық) /(360 /7.0)) - Math.floor (deg /(360 /7.0))> = 1) {onRouletteChange (); } deg += жылдамдық; document.getElementById («рулетка»). style = «түрлендіру: бұру (»+deg+«deg);»;

}

setInterval (айналдыру, 10);

onRouletteChange () синхрондау функциясы

if (! баяндамашы) {қайтару;} баяндамашы.ойнату (440); күтіңіз obniz.wait (10); Speaker.stop (); }

4 -қадам: Басылған батырмадан бастаңыз

Түймешік күйін білу үшін var buttonState қосыңыз және ағымдағы түймешік күйінің мәнін орнатыңыз.

button.onchange = функция (басылды) {buttonState = басылды; };

Сонымен қатар roulette.phase ағымдағы күйі үшін var фазасын қосыңыз, осының бірі орнатылады.

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

Мысалы, фаза PHASE_WAIT_FOR_START болғанда және келесі кезеңге өткіңіз келеді.

егер (фаза == PHASE_WAIT_FOR_START) {жылдамдық = 0; егер (buttonState) {фаза = PHASE_ROTATE; }}

Рулетті жылдамдату үшін var жылдамдығын өзгертіңіз.

егер (фаза == PHASE_ROTATE) {жылдамдық = жылдамдық+0,5; }

Рулетті төмендету үшін var жылдамдығын өзгертіңіз.

:

егер (фаза == PHASE_STOPPING) {жылдамдық = жылдамдық-0,2; }

Бұл рулетканың құрамдас бөлігі. Жетейік!

5 -қадам: Бағдарлама

Бағдарламаны мына жерден қараңыз