Lokacin da kuka shigar da na'ura mai sarrafawa, kuna maɓallin maɓallan, matsar da sandunan, ja abubuwan jan hankali… kuma a matsayin mai haɓakawa, ba ku ganin ko ɗaya. Mai binciken yana ɗauka, tabbas, amma sai dai idan kuna shiga lambobi a cikin na'ura wasan bidiyo, ba a gani. Wannan shine ciwon kai tare da Gamepad API. Ya kasance a kusa da shekaru, kuma hakika yana da iko sosai. Kuna iya karanta maɓallai, sanduna, faɗakarwa, ayyukan. Amma yawancin mutane ba sa taɓa shi. Me yasa? Domin babu ra'ayi. Babu panel a cikin kayan aikin haɓakawa. Babu bayyanannen hanya don sanin ko mai sarrafa yana yin abin da kuke tunani. Ji yake kamar ya tashi makaho. Wannan ya buge ni isa don gina ƙaramin kayan aiki: Gamepad Cascade Debugger. Maimakon kallon fitarwar na'ura wasan bidiyo, kuna samun ra'ayi mai rai, mai mu'amala na mai sarrafawa. Danna wani abu kuma yana maida martani akan allon. Kuma tare da CSS Cascade Layers, salon yana kasancewa cikin tsari, don haka ya fi tsafta don yin kuskure. A cikin wannan sakon, zan nuna muku dalilin da ya sa masu kula da gyaran kurakurai ke da zafi, yadda CSS ke taimakawa tsaftace shi, da kuma yadda za ku iya gina wani abu mai mahimmanci na gani don ayyukanku.
Ko da kuna iya shigar da su duka, za ku ƙare da sauri tare da spam na wasan bidiyo da ba za a iya karantawa ba. Misali: [0,0,1,0,0,0.5,0,...] [0,0,0,0,1,0,0,...] [0,0,1,0,0,0,0,...]
Za a iya gaya wanne maɓalli aka danna? Watakila, amma sai bayan ƙulla idanunku da rasa wasu bayanai kaɗan. Don haka, a'a, gyara ba ya zuwa cikin sauƙi idan ana maganar abubuwan da aka karanta. Matsala Ta Uku: Rashin Tsari Ko da kun jefa tare da saurin gani mai sauri, salo na iya yin rikici da sauri. Jihohin tsoho, masu aiki, da kuma cire kurakurai na iya haɗuwa, kuma ba tare da fayyace tsari ba, CSS ɗin ku ya zama gagararre da wuya a tsawaita. CSS Cascade Layers na iya taimakawa. Suna haɗa nau'ikan nau'ikan nau'ikan "yadudduka" waɗanda aka ba da odarsu ta fifiko, don haka ku daina faɗa da ƙayyadaddun ƙayyadaddun bayanai da zato, "Me yasa salon gyara kuskure na baya nunawa?" Madadin haka, kuna kiyaye damuwa daban-daban:
Tushe: Matsayin mai sarrafawa, bayyanar farko. Aiki: Haskaka don maɓallan maɓalli da sanduna masu motsi. Debug: overlays don masu haɓakawa (misali, karatun lambobi, jagorori, da sauransu).
Idan za mu ayyana yadudduka a cikin CSS bisa ga wannan, muna da: /* mafi ƙasƙanci zuwa mafi fifiko */ @Layer base, mai aiki, gyara kuskure;
@Layer base { /*...*/ }
@Layer aiki { /*...*/ }
@Layer debug { /*...*/ }
Domin kowane Layer yana tarawa da tsinkaya, koyaushe kuna san waɗanne dokoki ne suka yi nasara. Wannan tsinkaya yana sa gyara ba kawai sauƙi ba, amma a zahiri ana iya sarrafa shi. Mun rufe matsalar (ba a ganuwa, shigarwar da ba ta dace ba) da kuma tsarin (mai gyara na gani da aka gina tare da Cascade Layers). Yanzu za mu yi tafiya ta hanyar mataki-mataki-mataki don gina mai lalata. Ma'anar Maɓalli Hanya mafi sauƙi don sa shigar da ɓoyayye a bayyane ita ce kawai zana ta akan allon. Wannan shine abin da mai gyara kuskuren yake yi. Maɓalli, abubuwan jan hankali, da joysticks duk suna samun gani.
Latsa A: Da'irar tana haskakawa. Nudge sandar: Da'irar tana zamewa. Ja da fararwa rabin hanya: mashaya ya cika rabin hanya.
Yanzu ba kuna kallon 0s da 1s ba, amma a zahiri kallon mai sarrafa yana amsawa kai tsaye. Tabbas, da zarar ka fara tarawa a kan jihohi kamar tsoho, dannawa, bayanan gyara kuskure, watakila ma yanayin rikodi, CSS yana fara girma da ƙari. Wannan shine inda yadudduka cascade ke zuwa da amfani. Ga misalan da aka cire: @Layer base { .button { bango: #222; iyaka-radius: 50%; nisa: 40px; tsawo: 40px; } }
@Layer aiki { .button.latsa { baya: #0f0; /* kore mai haske */ } }
@Layer debug { .button::bayan { abun ciki: attr (darajar bayanai); girman font: 12px; launi: #ff; } }
Tsarin tsari yana da mahimmanci: tushe → aiki → gyara kuskure.
tushe yana zana mai sarrafawa. m iyawa guga man jihohi. debug yana jefa kan overlays.
Rarraba shi kamar wannan yana nufin ba ku yin yaƙe-yaƙe na musamman. Kowane Layer yana da wurinsa, kuma koyaushe kuna san abin da ya ci nasara. Gina Shi Fitar Bari mu fara samun wani abu akan allo. Ba ya buƙatar ya yi kyau - kawai yana buƙatar zama don haka muna da abin da za mu yi aiki da shi.
Gamepad Cascade Debugger
Wannan a zahiri kwalaye ne kawai. Ba mai ban sha'awa ba tukuna, amma yana ba mu iyawa don kamawa daga baya tare da CSS da JavaScript. Da kyau, Ina amfani da yadudduka na cascade a nan saboda yana tsara abubuwa da zarar kun ƙara ƙarin jihohi. Ga fasinja mara kyau:
/* ============================= KASADA SAITA Abubuwan oda: tushe → aiki → gyara kuskure =============================
/* Ƙayyade oda a gaba */ @Layer base, mai aiki, gyara kuskure;
/* Layer 1: Tsarin tushe - bayyanar tsoho */ @Layer base { .button { bango: # 333; iyaka-radius: 50%; nisa: 70px; tsawo: 70px; nuni: sassauƙa; gaskata-abun ciki: tsakiya; daidaita-kayan: tsakiya; }
.dakata { nisa: 20px; tsawo: 70px; bango: # 333; nuni: shingen layi; } }
/* Layer 2: Jihohi masu aiki - suna amfani da maɓallan da aka danna */ @Layer aiki { .button.aiki { baya: #0f0; /* Koren haske idan an danna */ canza: sikelin (1.1); /* Dan ƙara girman maɓallin */ }
.dakata.aiki { baya: #0f0; canza: sikelin (1.1); /* Yana mikewa a tsaye idan an danna */ } }
/* Layer 3: Debug overlays - bayanin mai haɓakawa */ @Layer debug { .button::bayan { abun ciki: attr (darajar bayanai); /* Yana nuna ƙimar lamba */ girman font: 12px; launi: #ff; } }
Kyakkyawan wannan hanyar ita ce kowane Layer yana da maƙasudin manufa. Tushen tushe ba zai taɓa ƙetare mai aiki ba, kuma mai aiki ba zai taɓa ƙetare gyara kuskure ba, ba tare da la'akari da ƙayyadaddun bayanai ba. Wannan yana kawar da takamaiman yaƙe-yaƙe na CSS waɗanda galibi ke addabar kayan aikin gyara matsala. Yanzu ga alama wasu gungu suna zaune akan bangon duhu. Gaskiya, ba ma muni ba ne.
Ƙara JavaScript Lokacin JavaScript. Wannan shine inda mai sarrafawa a zahiri yayi wani abu. Za mu gina wannan mataki-mataki. Mataki 1: Saita Gudanar da Jiha Da farko, muna buƙatar masu canji don bin diddigin yanayin mai gyara: // ================================ // GUDANAR DA JIHA // ================================
bari gudu = ƙarya; // Bin sawun ko mai gyara yana aiki da rafId; // Ajiye buƙatun AnimationFrame ID don sokewa
Waɗannan masu canji suna sarrafa madauki mai motsi wanda ke ci gaba da karanta shigarwar gamepad. Mataki 2: Ɗauki Bayanan DOM Bayan haka, muna samun nassoshi ga duk abubuwan HTML da za mu ɗaukaka su: // ================================ // HUKUNCIN HUKUNCIN DOM // ================================
const btnA = document.getElementById("btn-a"); const btnB = document.getElementById("btn-b"); const btnX = document.getElementById("btn-x"); const pause1 = document.getElementById("dakata1"); const pause2 = document.getElementById("pause2"); matsayin const = document.getElementById("matsayin");
Adana waɗannan nassoshi a gaba ya fi inganci fiye da tambayar DOM akai-akai. Mataki 3: Ƙara Faɗuwar Allon madannai Don gwaji ba tare da mai sarrafa jiki ba, za mu yi taswirar maɓallan madannai zuwa maɓalli: // ================================ // KEYBOARD FALLBACK (don gwaji ba tare da mai sarrafawa ba) // ================================
maballin maɓalli = { "a": btnA, "b": btnB, "x": btnX, "p": [pause1, pause2] // 'p' key yana sarrafa sandunan dakatarwa };
Wannan yana ba mu damar gwada UI ta latsa maɓalli akan madannai. Mataki na 4: Ƙirƙiri Madaidaicin Madaidaicin Sabis Ga inda sihirin ke faruwa. Wannan aikin yana ci gaba da gudana kuma yana karanta yanayin gamepad: // ================================ // BABBAN GAMEPAD UPDATED // ================================
sabunta aikinGamepad() { // Samun duk abubuwan da aka haɗa gamepads const gamepads = navigator.getGamepads(); idan (! gamepads) ya dawo;
// Yi amfani da faifan gamepad na farko da aka haɗa const gp = gamepads[0];
idan (gp) { // Sabunta jihohin maɓallin ta hanyar jujjuya ajin "aiki". btnA.classList.toggle("active", gp.buttons[0].latsa); btnB.classList.toggle("active", gp.buttons[1].latsa); btnX.classList.toggle("active", gp.buttons[2].latsa);
// Maɓallin dakatarwa (maɓallin maɓalli na 9 akan yawancin masu sarrafawa) const pausePressed = gp.buttons[9].latsa; pause1.classList.toggle("aiki", dakatarwa); pause2.classList.toggle("aiki", dakatarwa);
// Gina jerin maɓallan da aka danna a halin yanzu don nunin matsayi bari a danna = []; gp.buttons.forKowa ((btn, i) => { idan (btn.latsa)danna ("Button" + i); });
// Sabunta rubutun matsayi idan an danna kowane maɓalli idan (danna. tsawon> 0) { status.textContent = "An danna:" + pressed.join(","); } }
// Ci gaba da madauki idan mai gyara yana gudana idan (gudu) { rafId = buƙatarAnimationFrame (sabuntawaGamepad); } }
Hanyar classList.toggle() tana ƙara ko cire aji mai aiki bisa ko an danna maballin, wanda ke haifar da salo na CSS ɗin mu. Mataki 5: Sarrafa Abubuwan Al'amuran Allon madannai Waɗannan masu sauraron taron suna sa faɗuwar madannai ta yi aiki: // ================================ // MASU HANYAR ABUBUWAN DA AKE BOARD // ================================
document.addEventListener ("keydown", (e) => { idan (keyMap[e.key]) { // Sarrafa guda ɗaya ko abubuwa da yawa idan (Array.isArray (keyMap[e.key])) { keyMap[e.key].donKowane(el => el.classList.add("active")); } da sauransu { keyMap[e.key].classList.add("active"); } status.textContent = "An danna maɓalli:" + e.key.toUpperCase(); } });
document.addEventListener ("keyup", (e) => { idan (keyMap[e.key]) { // Cire yanayin aiki lokacin da aka saki maɓalli idan (Array.isArray (keyMap[e.key])) { keyMap[e.key].don Kowa(el => el.classList.remove("active")); } da sauransu { keyMap[e.key].classList.remove("active"); } status.textContent = "An saki maɓalli:" + e.key.toUpperCase(); } });
Mataki 6: Ƙara Farawa / Tsaida Sarrafa A ƙarshe, muna buƙatar wata hanya don kunna da kashe mai gyara kuskure: // ================================ // KUNNA/KASHE MAI MAGANA // ================================
document.getElementById("juyawa").addEventListener("danna", () => { gudu = !gudu; // Juya yanayin gudu
idan (gudu) { status.textContent = "Mai gyara yana gudana..."; updateGamepad(); // Fara madauki sabuntawa } da sauransu { status.textContent = "Mai gyara ba ya aiki"; sokeAnimationFrame(rafId); // Dakatar da madauki } });
Don haka a, danna maballin kuma yana haskakawa. Tura sandar ya motsa. Shi ke nan. Wani abu guda: danyen dabi'u. Wani lokaci kuna son ganin lambobi kawai, ba fitilu ba.
A wannan mataki, ya kamata ku ga:
Mai sauƙin sarrafawa akan allo, Maɓallin da ke amsawa yayin da kuke hulɗa da su, da Wani zaɓi na gyara kuskure yana nuna alamun maɓalli da aka danna.
Don yin wannan ƙasa da ƙayyadaddun bayanai, ga saurin demo na mai sarrafa kan allo yana amsawa a ainihin lokacin:
Yanzu, danna Fara Rikodi yana rikodin komai har sai kun buga Tsaya Rikodi. 2. Ana Fitar da Bayanai zuwa CSV/JSON Da zarar mun sami log, za mu so mu ajiye shi.
Mataki 1: Ƙirƙiri Mai Taimakon Zazzagewa Da farko, muna buƙatar aikin mataimaki wanda ke sarrafa zazzagewar fayil a cikin mai lilo: // ================================ // SAUKAR DA MATAIMAKI // ================================
aikin downloadFile (sunan fayil, abun ciki, nau'in = "rubutu/ bayyananne") { // Ƙirƙiri ƙura daga abun ciki const blob = sabon Blob ([abun ciki], {nau'in}); const url = URL.createObjectURL(blob);
// Ƙirƙiri hanyar zazzagewar wucin gadi kuma danna shi const a = document.createElement("a"); a.href = url; a.download = filename; a. danna();
// Tsaftace URL ɗin abu bayan zazzagewa setTimeout(() => URL.revokeObjectURL(url), 100); }
Wannan aikin yana aiki ta hanyar ƙirƙirar Blob (babban abu na binary) daga bayanan ku, samar da URL na ɗan lokaci don shi, da danna hanyar haɗin yanar gizo ta hanyar shirye-shirye. Tsaftacewa yana tabbatar da cewa ba mu zubar da ƙwaƙwalwar ajiya ba. Mataki 2: Sarrafa JSON Export JSON cikakke ne don adana cikakken tsarin bayanai:
// ================================ // FITOWA AS JSON // ================================
document.getElementById("export-json").addEventListener("danna", () => { // Duba idan akwai wani abu don fitarwa idan (!frames.length) { console.warn ("Babu rikodin da za a iya fitarwa."); dawowa; }
// Ƙirƙiri nauyin kaya tare da metadata da firam kaya mai nauyi = { halittaAt: sabon Kwanan wata ().toISOString(), firam };
// Zazzage kamar yadda aka tsara JSON zazzage fayil ( "gamepad-log.json", JSON.stringify (nauyin kaya, banza, 2), "application/json" ); });
Tsarin JSON yana kiyaye duk abin da aka tsara da sauƙin sassauƙa, yana mai da shi manufa don lodawa zuwa kayan aikin dev ko rabawa tare da abokan aiki. Mataki 3: Sarrafa CSV Export Don fitar da CSV, muna buƙatar daidaita bayanan matsayi cikin layuka da ginshiƙai:
//=========================== // FITOWA AS CSV // ================================
document.getElementById("export-csv").addEventListener("danna", () => { // Duba idan akwai wani abu don fitarwa idan (!frames.length) { console.warn ("Babu rikodin da za a iya fitarwa."); dawowa; }
// Gina layi na kai na CSV (ginshiƙa don tambarin lokaci, duk maɓalli, duk gatari) const headerButts = firam[0].buttons.map((_, i) => btn${i}); const headerAxes = firam[0].axes.map((_, i) => axis${i}); const header = ["t", ...headerButts, ...headerAxes].haɗa(",") + "\n";
// Gina bayanan bayanan CSV layuka masu mahimmanci = frames.map (f => { const btnVals = f.buttons.map(b => b.darajar); dawo [f.t, ...btnVals, ...f.axes] shiga(","); }).hade("\n");
// Zazzagewa azaman CSV zazzage fayil ("gamepad-log.csv", taken + layuka, "rubutu/csv"); });
CSV yana da hazaka don nazarin bayanai saboda yana buɗewa kai tsaye a cikin Excel ko Google Sheets, yana ba ku damar ƙirƙirar sigogi, tace bayanai, ko alamu ta gani. Yanzu da maɓallin fitarwa ke ciki, zaku ga sabbin zaɓuɓɓuka guda biyu akan kwamitin: Fitar da JSON da Fitar da CSV. JSON yana da kyau idan kuna son sake jefar da ɗanyen log ɗin cikin kayan aikin dev ɗinku ko kuɗawa tsarin. CSV, a gefe guda, yana buɗewa kai tsaye cikin Excel ko Google Sheets don ku iya tsarawa, tacewa, ko kwatanta abubuwan da aka shigar. Hoto na gaba yana nuna yadda panel ɗin yake kama da waɗannan ƙarin abubuwan sarrafawa.
3. Tsarin hoto Wani lokaci ba kwa buƙatar cikakken rikodi, kawai “screenshot” mai sauri na jihohin shigarwa. A nan ne maɓallin Take Snapshot ke taimakawa.
Kuma JavaScript:
// ================================ // Ɗauki HOTO // ================================
document.getElementById("snapshot").addEventListener("danna", () => { // Samun duk abubuwan da aka haɗa gamepads const pads = navigator.getGamepads (); const activePads = [];
// Maɗaukaki kuma kama yanayin kowane gamepad da aka haɗa don (const gp na pads) { idan (!gp) ya ci gaba; // Tsallake ramummuka marasa komai
ActivePads.push({ id: gp.id, // Sunan mai sarrafawa/model timestamp: performance.now(), maɓalli: gp.buttons.map(b => ({ danna: b.matsa, daraja: b.daraja })), gatari: [...gp.axes] }); }
// Bincika ko an sami wani pad gamepads idan (!activePads.length) { console.warn ("Babu kayan aikin wasan da aka haɗa don ɗaukar hoto."); faɗakarwa ("Ba a gano mai sarrafawa ba!"); dawowa; }
// Shiga kuma sanar da mai amfani console.log ("Snapshot:", activatingPads); faɗakarwa (ɗaukar hoto! An ƙwace ${activePads.length} mai sarrafa(s).); });
Hotunan daukar hoto suna daskare ainihin yanayin mai sarrafa ku a lokaci guda. 4. Maimaita Shigar Fatalwa Yanzu don jin daɗi: sake kunna shigar da fatalwa. Wannan yana ɗaukar log ɗin yana kunna shi a gani kamar mai kunna fatalwa yana amfani da mai sarrafawa.
JavaScript don sake kunnawa: // ================================ // SAKAWA GHOST // ================================
document.getElementById("sake kunnawa").addEventListener("danna", () => { // Tabbatar cewa muna da rikodin don sake kunnawa idan (!frames.length) { faɗakarwa ("Babu rikodin don sake kunnawa!"); dawowa; }
console.log ("Farawa fatalwa sake kunnawa...");
// Bibiyar lokaci don sake kunnawa daidaitawa bari startTime = aiki.yanzu (); bari frameIndex = 0;
// Sake kunna madauki mai motsi mataki mataki() { const now = aiki.yanzu(); const elapsed = yanzu - startTime;
// Tsara duk firam ɗin da yakamata ya faru a yanzu
yayin da (frameIndex // Sabunta UI tare da jihohin maɓallin da aka yi rikodi
btnA.classList.toggle("active", frame.buttons[0].latsa);
btnB.classList.toggle("active", frame.buttons[1].latsa);
btnX.classList.toggle("active", frame.buttons[2].latsa); // Nunin halin sabuntawa
bari a danna = [];
frame.buttons.forKowa ((btn, i) => {
idan (btn.latsa) danna.push ("Button" + i);
});
idan (danna. tsawon> 0) {
status.textContent = "Ghost:" + pressed.join(",");
} firamIndex++;
} // Ci gaba da madauki idan akwai ƙarin firam
idan (frameIndex // Fara sake kunnawa
mataki();
}); Don yin gyara na ɗan ƙaramin hannu, na ƙara sake kunna fatalwa. Da zarar kun yi rikodin zaman, za ku iya buga sake kunnawa kuma ku kalli UI ɗin yana aiki da shi, kusan kamar ɗan wasan fatalwa yana gudanar da kushin. Wani sabon maɓallin Replay Ghost yana nunawa a cikin kwamitin don wannan. Buga Rikodi, rikici tare da mai sarrafawa kaɗan, tsayawa, sannan sake kunnawa. UI kawai yana maimaita duk abin da kuka yi, kamar fatalwa yana bin abubuwan shigar ku.
Me yasa kuke damuwa da waɗannan ƙarin? Rikodi/fitarwa yana sauƙaƙa wa masu gwadawa don nuna ainihin abin da ya faru.
Hotunan hotuna suna daskare ɗan lokaci, suna da fa'ida sosai lokacin da kuke bin manyan kwari.
Maimaita fatalwa yana da kyau don koyawa, duba damar shiga, ko kawai kwatanta saitin sarrafawa gefe da gefe. A wannan gaba, ba kawai ingantaccen demo ba ne, amma wani abu da zaku iya sakawa a zahiri.
Abubuwan Amfani na Gaskiya na Duniya
Yanzu muna da wannan mai gyara wanda zai iya yin abubuwa da yawa. Yana nuna shigarwar kai tsaye, rikodin rajistan ayyukan, fitar da su, har ma da sake kunna kaya. Amma ainihin tambayar ita ce: wa ya damu da gaske? Wanene wannan yana da amfani?
Masu haɓaka Wasan
Masu sarrafawa suna cikin aikin, amma gyara su? Yawancin lokaci zafi. Ka yi tunanin kana gwada haɗakar wasan yaƙi, kamar ↓ →+ naushi. Maimakon yin addu'a, sai ka danna shi sau biyu, ka yi rikodin sau ɗaya, ka sake kunna shi. Anyi. Ko kuma ku musanya rajistan ayyukan JSON tare da abokin aiki don bincika ko lambar wasan ku da yawa ta amsa iri ɗaya akan injin su. Wannan babba ne.
Masu Aiwatarwa
Wannan yana kusa da zuciyata. Ba kowa ba ne ke wasa da mai kula da “misali”. Masu sarrafawa masu daidaitawa suna fitar da sigina masu ban mamaki wani lokaci. Tare da wannan kayan aiki, zaku iya ganin ainihin abin da ke faruwa. Malamai, masu bincike, ko wanene. Za su iya ɗaukar rajistan ayyukan, kwatanta su, ko sake kunna bayanai gefe-da-gefe. Nan da nan, abubuwan da ba a iya gani sun bayyana a fili.
Gwajin Tabbacin Inganci
Masu jarrabawa yawanci suna rubuta bayanin kula kamar "Na ƙwanƙwasa maɓallan nan kuma ya karye." Ba taimako sosai. Yanzu? Za su iya kama ainihin matsi, fitar da log ɗin, da aika shi. Babu zato.
Malamai
Idan kuna yin koyawa ko bidiyon YouTube, sake kunna fatalwa zinari ne. Kuna iya cewa a zahiri, "Ga abin da na yi tare da mai sarrafawa," yayin da UI ya nuna yana faruwa. Yana ba da bayani a sarari.
Bayan Wasanni
Kuma eh, wannan ba game da wasanni ba ne kawai. Mutane sun yi amfani da masu kula da mutum-mutumi, ayyukan fasaha, da hanyoyin samun dama. Batu iri ɗaya kowane lokaci: menene ainihin mai bincike ke gani? Tare da wannan, ba dole ba ne ku yi tsammani.
Kammalawa
Gyara shigarwar mai sarrafawa koyaushe yana jin kamar makaho mai tashi. Ba kamar DOM ko CSS ba, babu wani ginannen infeto na gamepads; lambobi ne kawai a cikin na'ura wasan bidiyo, a sauƙaƙe a cikin surutu.
Tare da ƴan layukan ɗari na HTML, CSS, da JavaScript, mun gina wani abu dabam: Mai gyara kuskuren gani wanda ke sa abubuwan da ba a iya gani suke gani.
Tsarin CSS mai shimfiɗaɗɗen da ke kiyaye UI mai tsafta da zazzagewa.
Saitin kayan haɓakawa (rikodi, fitarwa, hotuna, sake kunna fatalwa) waɗanda ke ɗaga shi daga demo zuwa kayan aikin haɓakawa. Wannan aikin yana nuna nisan da zaku iya tafiya ta hanyar haɗa ikon Dandalin Gidan Yanar Gizo tare da ɗan ƙirƙira a cikin CSS Cascade Layers.
Kayan aikin da na yi bayani gabaɗayan sa buɗaɗɗen tushe ne. Kuna iya rufe GitHub repo kuma gwada shi da kanku.
Amma mafi mahimmanci, zaka iya yin shi naka. Ƙara naku yadudduka. Gina dabaru na sake kunnawa. Haɗa shi da samfurin wasan ku. Ko ma amfani da shi ta hanyoyin da ban yi zato ba. Don koyarwa, samun dama, ko nazarin bayanai.
A ƙarshen rana, wannan ba kawai game da zamewa gamepads ba ne. Yana da game da haskaka haske akan abubuwan da aka ɓoye, da ba wa masu haɓaka kwarin gwiwa don yin aiki da kayan aikin da gidan yanar gizon har yanzu bai yarda da shi ba.
Don haka, toshe mai sarrafa ku, buɗe editan ku, sannan fara gwaji. Kuna iya mamakin abin da burauzar ku da CSS ɗin ku za su iya cim ma da gaske.
