Turinys:

Paprasta interaktyvi vartotojo sąsaja mokymui ir vertinimui: 11 žingsnių
Paprasta interaktyvi vartotojo sąsaja mokymui ir vertinimui: 11 žingsnių

Video: Paprasta interaktyvi vartotojo sąsaja mokymui ir vertinimui: 11 žingsnių

Video: Paprasta interaktyvi vartotojo sąsaja mokymui ir vertinimui: 11 žingsnių
Video: Lituanistikos programų sąmatose – pinigai kyšiams? || R.I.T.A.|| S01E36 2024, Liepa
Anonim
Image
Image

Šis projektas buvo sukurtas kaip universiteto pamokos dalis, tikslas buvo sukurti interaktyvią sistemą, skirtą mokyti ir vertinti tam tikrą temą. Tam naudojome sąsajos apdorojimą asmeniniame kompiuteryje ir „Arduino NANO“, skirtą pasažo mygtukui ir šviesos diodams, todėl tai gana paprasta. Mokyti siūloma sąsaja, kurioje rodomas modelis ir vartotojas gali spustelėti kiekvieną iš komponentų gauti tekstinį jo aprašymą. Tačiau norėdamas įvertinti vartotoją, jis siūlo į galvosūkį panašią problemą, kai vartotojas turi nuvilkti kiekvieną dalį, kad sukurtų atitinkamą modelį, ir paspausti mygtuką, kad patvirtintų savo atsakymą, tada mygtuko šviesos diodai pasakys vartotojui jei atsakymas teisingas ar ne.

Dažniausia problema, su kuria susidūrėme kurdami šį projektą, buvo ryšys tarp „Processing“ir „Arduino“, nes ryšio vėlavimas tarp kompiuterių gali skirtis, o tai trukdo perkelti įrenginį. Be to, kiekvieną kartą turite apibrėžti prievadą, prie kurio yra prijungtas „Arduino“, nes kiekvienas prijungtas USB įrenginys yra svarbus, todėl turite patikrinti, koks tai COM.

1 žingsnis: sąsajos programavimas apdorojant (sąranka)

Apdorojimo sąsajos programavimas (sąranka)
Apdorojimo sąsajos programavimas (sąranka)

Mes nustatėme kintamuosius, kurie bus naudojami, visų dalių padėtį kaip x ir y koordinačių masyvus, taip pat kiekvienos dalies vaizdų masyvus, skirtus meniu „Mokyti“(„imgA“) ir „Įvertinti“(img), masyvas, skirtas patikrinti, ar atsakymai teisingi, ir blokų bei užraktų masyvai, kurie nustatys, ar pelė yra virš gabalų ir ar ji bando juos pasiimti. Tada pradėkite juos inicijuoti ir atidarykite prievadą, iš kurio sąsaja ketina bendrauti su „Arduino“.

2 veiksmas: sąsajos programavimas apdorojant (pagrindinis meniu)

Apdorojimo sąsajos programavimas (pagrindinis meniu)
Apdorojimo sąsajos programavimas (pagrindinis meniu)
Apdorojimo sąsajos programavimas (pagrindinis meniu)
Apdorojimo sąsajos programavimas (pagrindinis meniu)

Pirma, pagrindiniame meniu bus rodomi du mygtukai, o kai vienas iš jų bus paspaustas, programa įkelia meniu „Mokyti“arba „Įvertinti“.

Taigi, kai pelė paspaudžiama ir yra virš vieno iš mygtukų, ji siunčia visų dalių, kurių reikia naujam meniu, pozicijas ir įkelia kitą meniu.

3 žingsnis: sąsajos programavimas apdorojant (meniu „Mokyti“)

Apdorojimo sąsajos programavimas
Apdorojimo sąsajos programavimas
Apdorojimo sąsajos programavimas
Apdorojimo sąsajos programavimas

Čia, jei pelė perkelia vieną iš dalių, ji suaktyvins atitinkamą užraktą, kuris, paspaudus pelę, suaktyvins atitinkamą tekstą ir parodys jį ekrane.

4 žingsnis: sąsajos programavimas apdorojant (meniu „Įvertinti“)

Apdorojimo sąsajos programavimas
Apdorojimo sąsajos programavimas
Apdorojimo sąsajos programavimas
Apdorojimo sąsajos programavimas

Čia yra tas pats, jis suaktyvintų užraktus, kurie, paspaudus pelę, suaktyvintų užraktus, tačiau šį kartą vietoj teksto rodymo jis vilktų pasirinktą dalį. (Tai buvo paremta „processing.js“„Vilkite, numeskite ir užveskite pelę“.)

5 žingsnis: paspaudus pelę

Paspaudus pelę
Paspaudus pelę

Kaip minėta anksčiau, paspaudus pelę ir užvedus „tiesa“, ji suaktyvintų atitinkamą užrakintą.

6 veiksmas: kai pelė tempiama

Kai pelė traukiama
Kai pelė traukiama

Jei pelė velkama, tikrasis meniu yra vertinimo meniu, o viena iš užrakinimų yra „tiesa“, ji vilktų atitinkamą dalį kartu su pele.

7 žingsnis: kai pelė paleidžiama

Kai pelė paleidžiama
Kai pelė paleidžiama
Kai pelė paleidžiama
Kai pelė paleidžiama

Taigi, jei pelė atleista ir vis dar yra meniu „Įvertinti“, ji tempiamą dalį padėtų toje vietoje, kur reikia sukurti modelį, jei jis yra pakankamai arti, ir patikrintų, ar jūsų atsakymas teisingas. Tada visi užraktai ir tekstai atstatomi į „klaidingus“.

8 žingsnis: Bendravimas su „Arduino“

Bendravimas su „Arduino“
Bendravimas su „Arduino“

Taigi dabar, jei paspausite „Arduino“mygtuką, jis patikrins, ar įdėjote visas tinkamas dalis, ir pasakys, ar tai teisinga, ar ne, tada siunčia „1“, jei tai teisinga, arba „2“, jei jis neteisingas Arduino.

9 veiksmas: „Arduino“nustatymas (schema)

„Arduino“nustatymas (schema)
„Arduino“nustatymas (schema)
„Arduino“nustatymas (schema)
„Arduino“nustatymas (schema)

Tai buvo schema, naudojama arduino, bet su Arkados mygtuku, todėl žalia viela, einanti prie mygtuko, eis į apatinę mygtuko jungtį (COM), o raudona viela - į vidurinę (NE). Šviesos diodams buvo naudojamas 220Ω rezistorius, mygtukui - 1 kΩ.

10 žingsnis: „Arduino“programavimas

„Arduino“programavimas
„Arduino“programavimas

Dabar jis sukonfigūruoja mygtuką kaip Įvestis 2 skaitmeniniame kaištyje, o šviesos diodai kaip OUTPUT 4, 6 ir 8. Tada sukonfigūruoja prievadą ir jį skaito, jei jis gauna „1“(teisingas atsakymas), jis užsidegs 3 Šviesos diodai po vieną, jei gaus „2“(neteisingas atsakymas), užsidegs tik vienas iš jų. Be to, paspaudus mygtuką, į sąsają būtų siunčiamas „e“.

11 žingsnis: viskas, linksminkitės

Štai šiam projektui naudojami kodai:

Rekomenduojamas: