Talim vazirligi buxoro muhandislik-texnologiya instituti

Web HMI Grafika uchun bosqichni sozlash
Birinchi qadam - kerakli skriptlar kutubxonasi ma'lumotnomalari va konfiguratsiyalari bilan HTML-sahifa yaratish. Asosiy veb-HMI sahifasini o'rnatish haqida ko'proq bilish uchun ushbu qo'llanmani ko'ring.
Asosiy sahifani tuzgandan so'ng, siz HTML elementiga CSS uslublar jadvalini bo'limini qo'shasiz, bu biz elementlarning joylashuvi va joylashishini belgilaydigan joy bo'ladi. Bu shunday bo'lishi kerak:

//usta_hasan
// script references go here…




#Bkg_image yozuvi "bkg_image" identifikatori bo'lgan elementga ishora qiladi. Bu vana tasviri uchun idish bo'ladi va uning ichida fon tasviri o'rnatilgan bo'ladi. Fon - bu tizimning jismoniy joylashuvi.
# Valve1 yozuvi "valve1" identifikatori bo'lgan elementni anglatadi, bu valfning o'zi tasviri bo'ladi. Yuqorida aytib o'tilganidek, bu mutlaq joylashishni aniqlashdan foydalanadi, ammo konteynerga nisbatan bo'ladi.

CSS haqida ko'proq ma'lumot

Agar siz CSS bilan tanish bo'lmagan bo'lsangiz, pozitsiyani nisbiy qilib belgilash, tarkibidagi barcha narsalar konteynerning o'ziga nisbatan joylashishini anglatadi. Shunday qilib, agar biz uning ichidagi har qanday narsa uchun koordinatani o'rnatadigan bo'lsak, ular har doim fon rasmiga nisbatan bo'ladi. Kenglik, balandlik va fon sozlamalari juda sodda. Agar CSS haqida ko'proq bilmoqchi bo'lsangiz, tashrif buyurishingiz mumkin

Elementlarni sahifaga qo'shish
Keyingi qadam - fonga va valf elementlarini sahifaga qo'shish. Sizning HTML quyidagi ko'rinishga ega bo'lishi kerak:


//usta_hasan

oas-tag-src='{"type":"group",
"group":[
{"tag":"WPF.New Tanks Demo.Tank1 Inlet Valve.Value","config":"images/new_tanks/ValveTopLeft_Green.png"}
],
"all_f":"images/new_tanks/ValveTopLeft_Red.png",
"bad_q":"images/new_tanks/ValveTopLeft_Yellow.png"
}'
/>