Video: Konsol admin Habr. Ngidini sampeyan ngatur karma, rating, lan nglarang pangguna.
TL; DR: Ing artikel iki, aku bakal nyoba nggawe panel kontrol Habr komik nggunakake lingkungan pangembangan antarmuka industri Webaccess / HMI Designer lan terminal WebOP.
Antarmuka manungsa-mesin (HMI) minangka sakumpulan sistem kanggo interaksi manungsa karo mesin sing dikontrol. Biasane istilah iki ditrapake kanggo sistem industri sing duwe operator lan panel kontrol.
WebOP - terminal industri otonom kanggo nggawe antarmuka manungsa-mesin. Digunakake kanggo nggawe panel kontrol produksi, sistem ngawasi, kamar kontrol, pengontrol omah cerdas, lsp. Ndhukung sambungan langsung menyang peralatan industri lan bisa digunakake minangka bagéan saka sistem SCADA.
Terminal WebOP - hardware
Terminal WebOP minangka komputer kurang daya adhedhasar prosesor ARM, ing kasus siji karo monitor lan layar demek, dirancang kanggo mbukak program kanthi antarmuka grafis sing digawe ing HMI Designer. Gumantung ing model, terminal duwe macem-macem antarmuka industri ing Papan: RS-232/422/485, BISA bis kanggo nyambungake menyang sistem otomotif, port USB Host kanggo nyambungake peripheral tambahan, port Klien USB kanggo nyambungake terminal menyang komputer, audio. input lan output audio , maca kertu MicroSD kanggo memori non-molah malih lan transfer setelan.
Piranti kasebut dipanggonke minangka panggantos anggaran kanggo PC kabeh-ing-siji, kanggo tugas sing ora mbutuhake prosesor sing kuat lan sumber daya komputer desktop sing lengkap. WebOP bisa digunakake minangka terminal mandiri kanggo kontrol lan input / output data, dipasangake karo WebOP liyane, utawa minangka bagéan saka sistem SCADA.
Terminal WebOP bisa nyambung langsung menyang piranti industri
Pendinginan pasif lan proteksi IP66
Amarga boros panas sing sithik, sawetara model WebOP dirancang kanthi lengkap tanpa pendinginan udara aktif. Iki ngidini piranti bisa dipasang ing wilayah sing sensitif marang tingkat gangguan lan nyuda jumlah bledug sing mlebu ing omah.
Panel ngarep digawe tanpa celah utawa sendi, nduweni tingkat perlindungan IP66, lan ngidini banyu langsung mlebu ing tekanan.
Panel mburi terminal WOP-3100T
Memori sing ora molah malih
Kanggo nyegah mundhut data, WebOP nduweni memori non-molah malih 128KB, sing bisa digarap kanthi cara sing padha karo RAM. Bisa nyimpen maca meter lan data kritis liyane. Yen ana kegagalan daya, data bakal disimpen lan dibalekake sawise urip maneh.
Nganyari remot
Program sing mlaku ing terminal bisa dianyari mbatalake liwat jaringan Ethernet utawa liwat antarmuka serial RS-232/485. Iki nyederhanakake pangopènan, amarga ora perlu pindhah menyang kabeh terminal kanggo nganyari piranti lunak.
Model WebOP
- piranti sing paling terjangkau sing dibangun adhedhasar sistem operasi wektu nyata HMI RTOS. Seri kasebut diwakili dening WebOP-///, karo layar diagonals 4,3 inci, 7 inci, 8 inci lan 10.1 inci, mungguh.
- model luwih maju adhedhasar sistem operasi Windows CE. Padha beda-beda saka seri 2000T ing nomer akeh antarmuka hardware lan duwe antarmuka CAN ing Papan. Piranti operate ing sawetara suhu lengkap (-20 ~ 60 ° C) lan duwe pangayoman antistatic (Air: 15KV/Kontak: 8KV). Garis kasebut nyukupi syarat standar IEC-61000, sing ngidini piranti kasebut digunakake ing manufaktur semikonduktor sing ana masalah discharge statis. Seri kasebut diwakili dening WebOP-//, karo layar diagonals 7 inci, 10.1 inci lan 12.1 inci, mungguh.
Lingkungan pangembangan WebAccess/HMI Designer
Metu saka kothak, terminal WebOP mung komputer ARM-daya kurang sing sampeyan bisa mbukak sembarang piranti lunak, nanging kabeh titik saka solusi iki WebAcess / HMI lingkungan pangembangan antarmuka industri proprietary. Sistem kasebut kasusun saka rong komponen:
- HMI Designer - lingkungan kanggo ngembangake antarmuka lan logika pemrograman. Mlaku ing Windows ing komputer programmer. Program pungkasan dikompilasi dadi siji file lan ditransfer menyang terminal kanggo eksekusi nalika runtime. Program kasebut kasedhiya ing basa Rusia.
- HMI Runtime - runtime kanggo mbukak program kompilasi ing terminal final. Bisa digunakake ora mung ing terminal WebOP, nanging uga ing Advantech UNO, MIC, lan komputer desktop biasa. Ana versi runtime kanggo Linux, Windows, Windows CE.
Hello donya - nggawe proyek
Ayo dadi miwiti nggawe antarmuka test kanggo panel kontrol Habr kita. Aku bakal mbukak program ing terminal mlaku WinCE. Pisanan, ayo nggawe proyek anyar ing HMI Designer. Kanggo mbukak program ing WebOP, penting kanggo milih model sing bener; format file final bakal gumantung ing iki. Ing langkah iki, sampeyan uga bisa milih arsitektur desktop, banjur file final bakal disusun kanggo runtime X86.
Nggawe proyek anyar lan milih arsitektur
Milih protokol komunikasi ing ngendi program sing dikompilasi bakal dimuat menyang WebOP. Ing langkah iki, sampeyan bisa milih antarmuka serial, utawa nemtokake alamat IP terminal.
Antarmuka nggawe proyek. Ing sisih kiwa ana diagram wit komponen saka program mangsa. Saiki, kita mung kasengsem ing item Layar, iki langsung layar kanthi unsur antarmuka grafis sing bakal ditampilake ing terminal.
Pisanan, ayo nggawe rong layar kanthi teks "Hello World" lan kemampuan kanggo ngalih ing antarane nggunakake tombol. Kanggo nindakake iki, kita bakal nambah layar anyar, Layar # 2, lan ing saben layar kita bakal nambah unsur teks lan rong tombol kanggo ngalih antarane layar (Tombol Layar). Ayo dadi ngatur saben tombol kanggo ngalih menyang layar sabanjuré.
Antarmuka kanggo nyetel tombol kanggo ngalih ing antarane layar
Program Hello World wis siyap, saiki sampeyan bisa ngumpulake lan mbukak. Ing tataran kompilasi bisa uga ana kesalahan yen ana variabel utawa alamat sing salah. Sembarang kesalahan dianggep fatal; program bakal dikompilasi mung yen ora ana kesalahan.
Lingkungan menehi kemampuan kanggo simulasi terminal supaya sampeyan bisa debug program ing komputer lokal. Ana rong jinis simulasi:
- Simulasi online - kabeh sumber data eksternal sing ditemtokake ing program bakal digunakake. Iki bisa dadi USO utawa piranti sing disambungake liwat antarmuka serial utawa Modbus TCP.
- simulasi offline - simulasi tanpa nggunakake piranti njaba.
Nalika kita ora duwe data eksternal, kita nggunakake simulasi offline, sadurunge wis nyawiji program. Program pungkasan bakal ana ing folder proyek, kanthi jeneng ProjectName_ProgramName.px3
Program sing mlaku ing simulasi bisa dikontrol nganggo kursor mouse kanthi cara sing padha kaya ing layar demek terminal WebOP. Kita ndeleng manawa kabeh bisa ditindakake. Agung.
Kanggo ndownload program menyang terminal fisik, mung klik tombol Download. Nanging amarga aku ora ngatur sambungan terminal menyang lingkungan pangembangan, sampeyan mung bisa nransfer file nggunakake USB flash drive utawa kertu memori MicroSD.
Antarmuka program intuisi, aku ora bakal ngliwati saben blok grafis. Nggawe latar mburi, wangun, lan teks bakal jelas kanggo sapa wae sing wis nggunakake program sing padha karo Word. Kanggo nggawe antarmuka grafis, ora mbutuhake katrampilan pemrograman; kabeh unsur ditambahake kanthi nyeret mouse menyang formulir kasebut.
Nggarap memori
Saiki wis ngerti carane nggawe unsur grafis, ayo sinau babagan cara nggarap konten dinamis lan basa skrip. Ayo nggawe grafik bar sing nampilake data saka variabel U $ 100. Ing setelan grafik, pilih jinis data: integer 16-bit, lan kisaran nilai grafik: saka 0 nganti 10.
Program iki ndhukung nulis skrip ing telung basa: VBScript, JavaScript lan basa dhewe. Aku bakal nggunakake pilihan katelu amarga ana conto ing dokumentasi lan bantuan sintaks otomatis tengen ing editor.
Ayo nambah makro anyar:
Ayo nulis sawetara kode prasaja kanggo nambah data ing variabel sing bisa dilacak ing grafik. Kita bakal nambah 10 menyang variabel, lan ngreset menyang nol nalika luwih saka 100.
$U100=$U100+10
IF $U100>100
$U100=0
ENDIF
Kanggo nglakokake skrip ing daur ulang, setel ing setelan Persiyapan Umum minangka Makro Utama, kanthi interval eksekusi 250ms.
Ayo ngumpulake lan mbukak program ing simulator:
Ing tahap iki, kita wis sinau kanggo ngapusi data ing memori lan nampilake kanthi visual. Iki wis cukup kanggo nggawe sistem ngawasi sing prasaja, nampa data saka piranti eksternal (sensor, pengontrol) lan ngrekam ing memori. Macem-macem blok tampilan data kasedhiya ing HMI Designer: ing wangun dial bunder kanthi panah, macem-macem grafik, lan grafik. Nggunakake skrip JavaScript, sampeyan bisa ngundhuh data saka sumber eksternal liwat HTTP.
Panel kontrol Habr
Nggunakake katrampilan sing dipikolehi, kita bakal nggawe antarmuka komik kanggo konsol admin Habr.
Remot kontrol kita kudu bisa:
- Ngalih profil pangguna
- Nyimpen data karma lan rating
- Ngganti nilai karma lan rating nggunakake slider
- Nalika sampeyan ngeklik tombol "larang", profil kasebut kudu ditandhani minangka dilarang, avatar kudu diganti dadi nyabrang.
Kita bakal nampilake saben profil ing kaca sing kapisah, supaya kita bakal nggawe kaca kanggo saben profil. Kita bakal nyimpen karma lan rating ing variabel lokal ing memori, sing bakal diwiwiti nggunakake Setup Macro nalika program diwiwiti.
Gambar kasebut bisa diklik
Nyetel karma lan rating
Kanggo nyetel karma kita bakal nggunakake slider (Slide Switch). Kita nemtokake variabel sing diinisialisasi ing Setup Macro minangka alamat rekaman. Ayo matesi sawetara nilai panggeser saka 0 nganti 1500. Saiki, nalika slider obah, data anyar bakal ditulis ing memori. Ing kasus iki, negara wiwitan slider bakal cocog karo nilai variabel ing memori.
Kanggo nampilake nilai numerik saka karma lan rating, kita bakal nggunakake unsur tampilan Numerik. Prinsip operasine padha karo diagram saka conto program "Hello World", kita mung nuduhake alamat variabel ing Alamat Monitor.
Tombol larangan
Tombol "larangan" dileksanakake nggunakake unsur Toggle Switch. Prinsip panyimpenan data padha karo conto ing ndhuwur. Ing setelan, sampeyan bisa milih teks beda, werna utawa gambar, gumantung ing negara tombol.
Nalika tombol dipencet, avatar kudu nyabrang metu abang. Iki gampang dileksanakake nggunakake blok Tampilan Gambar. Ngidini sampeyan nemtokake macem-macem gambar sing ana gandhengane karo kahanan tombol Ngalih. Kanggo nindakake iki, blok kasebut diwenehi alamat sing padha karo blok kanthi tombol lan nomer negara. Gambar kanthi papan jeneng ing sangisore avatar disetel kanthi cara sing padha.
kesimpulan
Sakabèhé, aku disenengi produk. Sadurunge, aku duwe pengalaman nggunakake tablet Android kanggo tugas sing padha, nanging ngembangake antarmuka luwih angel, lan API browser ora ngidini akses lengkap menyang peripheral. Siji terminal WebOP bisa ngganti kombinasi tablet Android, komputer lan controller.
Desainer HMI, sanajan desain kuno, cukup maju. Tanpa katrampilan program khusus, sampeyan bisa nggawe sketsa antarmuka sing bisa digunakake kanthi cepet. Artikel kasebut ora mbahas kabeh blok grafis, sing ana akeh: pipa animasi, silinder, grafik, switch toggle. Ndhukung akeh pengontrol industri populer metu saka kothak lan ngemot konektor database.
referensi
Lingkungan pangembangan WebAccess/HMI Designer lan Runtime bisa didownload
→
Source: www.habr.com