Obniz সঙ্গে গ্রাফিকাল রুলেট: 5 ধাপ

2024 লেখক: John Day | [email protected]. সর্বশেষ পরিবর্তিত: 2024-01-30 08:01

আমি একটি গ্রাফিকাল রুলেট তৈরি করেছি। আপনি যদি বোতাম টিপেন, রুলেট ঘুরতে শুরু করে। আপনি যদি আবার টিপেন, রুলেট ঘোরানো বন্ধ করে এবং বীপ বাজায়!

ধাপ 1: সার্কিট

আমরা কেবল একটি তারযুক্ত স্পিকার এবং একটি বোতাম ব্যবহার করি।

প্রোগ্রামে তারের পিন নম্বর লেখা আছে।

button = obniz.wired ("Button", {signal: 6, gnd: 7}); স্পিকার = obniz.wired ("স্পিকার", {signal: 0, gnd: 1});

ধাপ 2: রুলেট ইমেজ ঘোরান

এইচটিএমএলে, আপনি "সিএসএস ট্রান্সফর্ম" ব্যবহার করতে পারেন। উদাহরণস্বরূপ, এটি 90 ডিগ্রী ঘোরানো চিত্রের কোড।

document.getElementById ("রুলেট")। style = "transform: rotate (90deg);";

আস্তে আস্তে ঘোরানো শুরু এবং বন্ধ করার জন্য, প্রতি ফ্রেম ঘোরানোর ডিগ্রির জন্য একটি var গতি যোগ করুন।

যাক গতি = 0; যাক deg = 0; ফাংশন ঘোরান () {ডিগ্রি = = গতি; document.getElementById ("রুলেট")। style = "transform: rotate ("+deg+"deg);";

}

setInterval (ঘোরান, 10);

ধাপ 3: বিপ

আপনি কোন পরিবর্তন রুলেট উপর বীপ করতে চান? এর সাহায্যে আপনি 440Hz 10ms এ বীপ করতে পারেন।

স্পিকার প্লে (440); অপেক্ষা করুন obniz.wait (10); স্পিকার স্টপ ();

এইভাবে রুলেট নং পরিবর্তন সম্পর্কে জানতে হবে।

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

সুতরাং, এটি ঘোরানো এবং বিপ এর কোড।

যাক গতি = 0; যাক deg = 0; ফাংশন রোটেট () {// পরিবর্তন মানের উপর যদি } ডিগ্রি += গতি; document.getElementById ("রুলেট")। style = "transform: rotate ("+deg+"deg);";

}

setInterval (ঘোরান, 10);

async ফাংশন onRouletteChange () {

যদি (! স্পিকার) {return;} speaker.play (440); অপেক্ষা করুন obniz.wait (10); স্পিকার স্টপ (); }

ধাপ 4: বোতাম পুশ করা শুরু করুন।

বোতামের অবস্থা জানতে, var buttonState যোগ করুন এবং বর্তমান বোতামের অবস্থা নির্ধারণ করুন।

button.onchange = function (চাপা) {buttonState = pressed; };

এবং 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 = PHASE_ROTATE; }}

রুলেটের গতি বাড়ানোর জন্য, var গতি পরিবর্তন করুন।

যদি (ফেজ == PHASE_ROTATE) {গতি = গতি+0.5; }

রুলেটের গতি বাড়ানোর জন্য, var গতি পরিবর্তন করুন।

:

যদি (ফেজ == PHASE_STOPPING) {speed = speed-0.2; }

এগুলি রুলেটের উপাদান। এটা তৈরি করা যাক!

ধাপ 5: প্রোগ্রাম

প্রোগ্রামের জন্য এখানে পড়ুন