Sadržaj:

Ugrađeni upravitelj prozora: 10 koraka
Ugrađeni upravitelj prozora: 10 koraka

Video: Ugrađeni upravitelj prozora: 10 koraka

Video: Ugrađeni upravitelj prozora: 10 koraka
Video: 🟡 POCO X5 PRO - САМЫЙ ДЕТАЛЬНЫЙ ОБЗОР и ТЕСТЫ 2024, Juli
Anonim
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora
Ugrađeni upravitelj prozora

Ovaj projekt pokazuje kako implementirati upravitelja prozora s pomičnim preklopljenim prozorima na ugrađenom mikrokontroleru sa LCD panelom i ekranom osjetljivim na dodir. Postoje komercijalno dostupni softverski paketi za to, ali koštaju novac i zatvorenog su izvora. Ovaj, nazvan MiniWin, besplatan je i otvorenog koda. Napisano je u potpuno usklađenom C99 i može se koristiti u C ili C ++ aplikaciji. Ciljevi MiniWina su jednostavni za upotrebu, laki za modifikaciju, proširivi, prenosivi na širok raspon hardvera i ne traže previše resursa.

Osim što nudi kôd za upravljanje vašim prozorima, MiniWin ima i kolekciju kontrola korisničkog interfejsa - dugmad, klizače, trake napretka, stabla itd. Možete imati više prozora različitih tipova ili više instanci istog tipa. Windows se može pomicati, mijenjati veličinu, povećavati, smanjivati, zatvarati - sve uobičajene stvari koje radite s prozorima u većim upraviteljima prozora. TrueType fontovi sa kerningom i anti-aliasingom (čini tekst glatkim i glatkim) takođe su podržani za atraktivno iscrtavanje teksta.

U svakom prozoru imate područje klijenta (vaš prostor unutar ivice i ispod gornje trake). Na ovo možete dodati kontrole za stvaranje dijaloga ili možete koristiti ugrađenu grafičku biblioteku za crtanje svega što želite. Sve funkcije biblioteke grafike su svjesne prozora. Ne morate brinuti o tome gdje se nalazi vaš prozor, šta ga preklapa ili je li minimiziran.

Uz izradu vlastitih prozora, uključeni su i neki standardni dijalozi koji se vrlo lako pokreću - na primjer dijalozi za potvrdu (samo tipke U redu ili Da/Ne), postavljači vremena/datuma, birači datoteka, birači boja itd.

MiniWin koristi standardni sistem redova poruka za dizajn dizajna Windows menadžera. Windows može komunicirati međusobno i sa upraviteljem prozora putem poruka. Ne pozivate funkcije da rade stvari izravno, dodajete poruku u red i upravitelj prozora će to učiniti umjesto vas.

MiniWin je prenesen na standardne razvojne ploče sa ekranima osetljivim na dodir proizvođača mikrokontrolera ST, NXP i Renesas. Za sve ove uređaje postoje upravljački programi za hardver i primjeri projekata. Osim toga, MiniWin se može izgraditi za Windows ili Linux tako da možete simulirati kôd korisničkog sučelja prije nego nabavite ugrađeni hardver.

MiniWin ima generator kodova. Možete navesti svoje prozore i kontrole u jednostavnoj za kreiranje čitljivoj JSON datoteci, a generator koda analizira datoteku i kreira kôd za vas (postoji mnogo primjera koje treba slijediti). On stvara kompletne simulacijske aplikacije za Windows ili Linux koje se mogu samo izgraditi, a tu je i vaš simulirani LCD ekran s vašim prozorima MiniWin koji rade. Možete uzeti potpuno isti generirani kôd i staviti ga u ugrađeni projekt i imati isti kôd koji prikazuje iste prozore i kontrole trenutaka kasnije na vašem ugrađenom hardveru.

MiniWin ne zahtijeva operativnu podršku na ugrađenom uređaju. Sve radi u jednoj niti. MiniWin se može integrirati s RTOS -om koji radi na ugrađenom procesoru, a postoje primjeri koji integriraju MiniWin sa FreeRTOS -om.

Ovo uputstvo pokazuje kako pokrenuti i pokrenuti MiniWin na STM32 M4 procesoru pomoću jeftine ploče STM32F429 Discovery koja dolazi s već pričvršćenim QVGA ekranom osjetljivim na dodir. Oni su lako dostupni kod vašeg dobavljača elektroničkih komponenti.

MiniWin radi na mikro kontrolerima srednje klase i novijim.

Supplies

STM32F429I-DISC1 razvojna ploča i mikro USB kabel

STM32CubeIDE preuzimanje koje je besplatno.

Korak 1: Dobivanje koda

Dobivanje koda
Dobivanje koda

Prije svega trebate instalirati STM32CubeIDE. To možete saznati sa web stranice ST. Morate se registrirati i potrebno je neko vrijeme za preuzimanje i instaliranje. Sve je besplatno.

Dok se instalira, preuzmite izvor MiniWin i raspakirajte ga. Velika je, ali ćete koristiti samo njen mali dio. Ovdje kliknite zeleno dugme "Kloniraj ili preuzmi" …

github.com/miniwinwm/miniwinwm

zatim odaberite Download Zip. Raspakirajte sadržaj.

Korak 2: Izrada primjera projekta

Izrada primjera projekta
Izrada primjera projekta
Izrada primjera projekta
Izrada primjera projekta

Prvo napravimo jedan od primjera projekata. Dobar se zove MiniWinSimple. Pokrenite STM32CubeIDE, a zatim učinite sljedeće:

  1. Odaberite Datoteka | Uvezi…
  2. Otvorite Općenito i odaberite Postojeći projekt u radni prostor. Sljedeći.
  3. Kliknite Pregledaj i idite do mjesta na kojem ste raspakirali MiniWin. Zatim idite u fasciklu STM32CubeIDE / MiniWinSimple / STM32F429. Kliknite Odaberi mapu.
  4. U projektu: označite MiniWinSimple_STM32F429, a zatim kliknite Završi.
  5. Projekt MiniWinSimple_STM32F429 će se pojaviti u vašem Project Exploreru. Odaberite ga, a zatim ga sastavite pomoću Project | Build Project.
  6. Sada priključite USB kabel na ploču i računalo i pokrenite ga pomoću Run | Debug, a kada se preuzme, odaberite Run | Resume. Prvi put ćete dobiti ekran za kalibraciju ekrana, pa dodirnite središte tri križa na LCD ekranu. Sada možete komunicirati s prozorom na ekranu.

Za pomicanje prozora povucite ga prema naslovnoj traci. Za promjenu veličine prozora upotrijebite ikonu bijelog trokuta s lijeve strane naslovne trake. Veličina prozora MiniWin ne može se promijeniti povlačenjem ivica jer su ekrani na kojima se koristi MiniWin premali. Da biste smanjili, povećali ili zatvorili prozor, upotrijebite ikone s desne strane naslovne trake (zatvaranje može biti onemogućeno). Kada je prozor minimiziran, ne možete pomicati smanjene ikone. Grade se odozdo slijeva nadesno.

Korak 3: Pokretanje Generatora koda

Pokretanje Generatora koda
Pokretanje Generatora koda

Sada ćemo promijeniti primjer projekta generiranjem vlastitih prozora i ispuštanjem novog koda. Da bismo to učinili, pokrenut ćemo generator koda.

  1. Otvorite naredbeni redak i idite u mapu u kojoj ste raspakirali MiniWin, a zatim u mapu Alati / CodeGen.
  2. Izvršna datoteka za Windows CodeGen.exe već je dostupna. Za Linux morate ga izgraditi upisivanjem make. (Možete ga izgraditi i iz izvornog koda za Windows ako ste zabrinuti da pokrećete preuzetu izvršnu datoteku, ali trebate instalirano kompajler i razvojno okruženje. Detalje potražite u dokumentaciji MiniWin u fascikli docs).
  3. U ovoj mapi su neki primjeri JSON datoteka. Koristit ćemo example_empty.json. Morate ga prvo urediti da biste ga postavili za Windows ili Linux. Otvorite ga u uređivaču i na vrhu gdje ćete pronaći "TargetType" promijenite vrijednost "Linux" ili "Windows" na ono na čemu pokrećete generator koda.
  4. Sada u naredbeni redak upišite codegen example_empty.json.
  5. Idite na svoj projekat u STM32CubeIDE i otvorite fasciklu MiniWinSimple_Common. Izbrišite sve datoteke tamo.
  6. Ostavili smo "TargetName" u JSON datoteci kao zadanu na "MiniWinGen" tako da je to naziv naše mape generiranog koda. Idite u mapu u kojoj ste raspakirali MiniWin, a zatim u mapu MiniWinGen_Common. Sada odaberite sve ove datoteke i povucite i ispustite, a zatim u STM32CubeIDE u mapi MiniWinSimple_Common vašeg projekta.
  7. Sada ponovo izgradite i ponovno izvedite projekt u STM32CubeIDE i pojavit će se vaš novi prozor za dizajn. Dugme u prozoru je nestalo jer example_empty.json ne definira nijedan.

Korak 4: Dodavanje prozora

Dodavanje prozora
Dodavanje prozora

Sada ćemo dodati drugi prozor u JSON konfiguracijsku datoteku i regenerirati kod.

1. Otvorite example_empty.json u uređivaču teksta.

2. U odjeljku "Windows" nalazi se niz definicija prozora koji trenutno ima samo jedan prozor. Kopiraj sve ovo …

{

"Name": "W1", "Title": "Window 1", "X": 10, "Y": 15, "Width": 200, "Height": 180, "Border": true, "TitleBar": true, "Visible": true, "Minimized": false}

i ponovo ga zalijepite zarezom koji razdvaja 2 definicije.

3. Promijenite "W1" u "W2" i "Window 1" u "Window 2". Promijenite "X", "Y", "Width" i "Height" na neke različite vrijednosti imajući na umu da je rezolucija ekrana 240 široka do 320 visoka.

4. Sačuvajte datoteku i ponovo pokrenite generator koda.

5. Kopirajte datoteke kao u prethodnom koraku, ponovo napravite i ponovo pokrenite. Sada ćete imati 2 prozora na ekranu.

Korak 5: Dodavanje kontrole

Dodavanje kontrole
Dodavanje kontrole

Sada ćemo dodati neke kontrole u vaš novi prozor. Uredite istu datoteku kao u prethodnom koraku.

1. U specifikaciji za prozor W1 dodajte zarez nakon posljednje postavke ("Minimized": false), a zatim dodajte ovaj tekst

"MenuBar": istina, "MenuBarEnabled": true, "MenuItems": ["Fred", "Bert", "Pete", "Alf", "Ian"], "Buttons": [{"Name": "B1", "Label": "Button1", "X": 10, "Y": 10, "Enabled": true, "Visible": true}]

Ovaj odjeljak dodaje traku izbornika s 5 stavki i omogućava je (trake izbornika mogu se globalno onemogućiti, pokušajte). Takođe dodaje dugme koje je omogućeno i vidljivo (mogu se stvoriti nevidljivim i kasnije učiniti vidljivim u kodu).

2. Ponovno generirajte kôd, prekopirajte ga, ponovo izradite, ponovo pokrenite kao i prije.

Korak 6: Prisilite kontrole da učine nešto

Prisiljavanje kontrola da učine nešto
Prisiljavanje kontrola da učine nešto

Sada imamo osnovno korisničko sučelje koje nam je potrebno da bismo ga učinili. U ovom primjeru pojavit će se dijaloški okvir za odabir boje kada se pritisne dugme u prozoru 1.

Idite na svoj projekt u STM32CubeIDE i otvorite fasciklu MiniWinSimple_Common, a zatim otvorite datoteku W1.c (naziv ove datoteke odgovara prozoru "Ime" prozora u JSON datoteci kada je kôd generiran).

U ovoj datoteci ćete pronaći funkciju window_W1_message_function (). To izgleda ovako:

void window_W1_message_function (const mw_message_t *message) {MW_ASSERT (message! = (void *) 0, "Parametar nultog pokazivača"); / * Sljedeći red zaustavlja upozorenja kompajlera jer se varijabla trenutno ne koristi */ (void) window_W1_data; switch (poruka-> poruka_id) {slučaj MW_WINDOW_CREATED_MESSAGE: / * Ovdje dodajte bilo koji inicijalizacijski kod prozora * / break; slučaj MW_MENU_BAR_ITEM_PRESSED_MESSAGE: / * Dodajte kod za rukovanje izbornikom prozora ovdje * / break; slučaj MW_BUTTON_PRESSED_MESSAGE: if (poruka-> sender_handle == button_B1_handle) { / * Dodajte svoj kôd rukovaoca za ovu kontrolu ovdje * /} break; zadano: / * Neka MISRA bude sretna * / break; }}

Upravitelj prozora poziva ovaj prozor svaki put kad upravitelj prozora mora obavijestiti prozor da se nešto dogodilo. U ovom slučaju zanima nas da je pritisnuto jedino dugme prozora. U naredbi switch za vrste poruka vidjet ćete futrolu za MW_BUTTON_PRESSED_MESSAGE. Ovaj kôd se pokreće kada je dugme pritisnuto. U ovom prozoru postoji samo jedno dugme, ali moglo bi ih biti više, pa se provjerava koje je to dugme. U ovom slučaju to može biti samo dugme B1 (naziv ponovo odgovara imenu dugmeta u JSON datoteci).

Dakle, nakon ove oznake slučaja dodajte kôd da se pojavi dijalog za odabir boje, a to je sljedeće:

mw_create_window_dialog_colour_chooser (10, 10, "Boja", MW_HAL_LCD_RED, lažno, poruka-> primalac_rukvica);

Parametri su sljedeći:

  • 10, 10 je lokacija na ekranu dijaloga
  • "Boja" je naslov dijaloga
  • MW_HAL_LCD_RED je zadana boja s kojom će dijalog početi
  • lažno znači da ne pokazuju veliku veličinu (pokušajte ga postaviti na true i vidjeti razliku)
  • poruka-> primatelj ručice je vlasnik ovog dijaloga, u ovom slučaju to je ovaj prozor. Ručka prozora nalazi se u parametru poruke funkcije. Ovo je prozor na koji će se poslati odgovor dijaloga.

Da bi saznao vrijednost boje koju je korisnik odabrao, upravitelj prozora će našem prozoru poslati poruku s odabranom bojom kada korisnik pritisne dugme U redu u dijalogu. Stoga moramo i ovu poruku presresti drugim slučajem u naredbi switch koja izgleda ovako:

slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE:

{mw_hal_lcd_colour_t selected_colour = message-> message_data; (praznina) selected_colour; } break;

Još ne radimo ništa s odabranom bojom, pa je samo premještamo na void kako bismo spriječili upozorenje kompajlera. Konačni kod ove funkcije sada izgleda ovako:

void window_W1_message_function (const mw_message_t *poruka)

{MW_ASSERT (poruka! = (Void*) 0, "Parametar nultog pokazivača"); / * Sljedeći red zaustavlja upozorenja kompajlera jer se varijabla trenutno ne koristi */ (void) window_W1_data; switch (poruka-> poruka_id) {slučaj MW_WINDOW_CREATED_MESSAGE: / * Ovdje dodajte bilo koji inicijalizacijski kod prozora * / break; slučaj MW_MENU_BAR_ITEM_PRESSED_MESSAGE: / * Dodajte kod za rukovanje izbornikom prozora ovdje * / break; slučaj MW_BUTTON_PRESSED_MESSAGE: if (message-> sender_handle == button_B1_handle) { / * Dodajte svoj kôd rukovaoca za ovu kontrolu ovdje / / mw_create_window_dialog_colour_chooser (10, 10, "Boja", MW_HAL_LCD_RED_), poruka je pogrešna } break; slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE: {mw_hal_lcd_colour_t selected_colour = message-> message_data; (void) selected_colour; } break; zadano: / * Neka MISRA bude sretna * / break; }}

Pokretanje koda prikazano je na gornjoj slici. Možda ćete primijetiti da kada se dijalog prikazuje morate odgovoriti na njega i odbaciti ga prije nego učinite bilo što drugo. To se naziva modalno ponašanje. Dijalozi u MiniWinu i svi uvijek globalno modalni i možete imati samo jedno prikazivanje odjednom. Ovde postoji još objašnjenja…

en.wikipedia.org/wiki/Modal_window

Korak 7: Crtanje u prozoru

Crtanje u prozoru
Crtanje u prozoru

Do sada smo koristili samo kontrole, a one se same crtaju. Vrijeme je da nacrtamo neki prilagođeni crtež na našem prozoru. Dio na koji možete crtati nalazi se unutar ivica (ako ih ima, oni su izborni), unutar traka za pomicanje (ako su definirane, također izborne) i ispod naslovne trake (ako postoji, to je također neobavezno). U terminologiji prozora to se naziva područje klijenta.

U MiniWinu postoji biblioteka grafičkih naredbi koje možete koristiti. Svi su oni svjesni prozora. To znači da ne morate brinuti o tome je li prozor vidljiv, djelomično zaklonjen drugim prozorima, uključen, djelomično isključen ili potpuno izvan ekrana ili je koordinata mjesta na kojem crtate na području klijenta ili izvan njega. Za vas je sve sređeno. Ne možete crtati izvan područja klijenta.

Crtanje na klijentskim područjima u terminologiji prozora naziva se slikanje i svaki prozor ima funkciju bojenja na kojoj crtate. Ne pozivate svoju funkciju boje, upravitelj prozora to radi umjesto vas. To je potrebno pri pomicanju prozora ili promjeni položaja ili vidljivosti drugog prozora na vrhu. Ako vam je potrebno prefarbavanje prozora jer su se promijenili neki podaci o kojima ovisi sadržaj prozora (tj. Znate da je potrebno ponovno bojenje umjesto da to zna upravitelj prozora), tada upravitelju prozora kažete da je potrebno ponovno bojenje i on poziva svoju funkciju bojenja. Ne nazivaš to sam. (Sve je to prikazano u sljedećem odjeljku).

Prvo morate pronaći svoju funkciju bojenja. Generator koda kreira ga za vas i nalazi se odmah iznad funkcije rukovatelja porukama izmijenjene u prethodnom odjeljku. Idite na svoj projekat i ponovo otvorite datoteku W1.c.

U ovoj datoteci ćete pronaći funkciju window_W1_paint_function (). To izgleda ovako:

void window_W1_paint_function (mw_handle_t window_handle, const mw_gl_draw_info_t *draw_info)

{MW_ASSERT (draw_info! = (Void*) 0, "Parametar nultog pokazivača"); / * Popunite područje klijenta prozora punom belom bojom */ mw_gl_set_fill (MW_GL_FILL); mw_gl_set_solid_fill_colour (MW_HAL_LCD_WHITE); mw_gl_set_border (MW_GL_BORDER_OFF); mw_gl_clear_pattern (); mw_gl_rectangle (draw_info, 0, 0, mw_get_window_client_rect (window_handle).width, mw_get_window_client_rect (window_handle).height); / * Ovdje dodajte kôd za slikanje prozora */}

Ovo je goli generirani kôd i sve što čini je ispunjavanje područja klijenta bijelom bojom. Nacrtajmo žuti ispunjeni krug na području klijenta. Prvo moramo razumjeti koncept grafičkog konteksta (još jedna stvar sa Windowsima). Parametre crtanja postavljamo u grafički kontekst, a zatim pozivamo generičku rutinu crtanja krugova. Ono što moramo postaviti u ovom primjeru je da li krug ima obrub, stil granične linije, boju obruba, je li krug ispunjen, boja ispune i uzorak ispune. Gore možete vidjeti kôd koji čini nešto slično za popunjavanje područja klijenta bijelim pravokutnikom ispunjenim obrubom. Vrijednosti u grafičkom kontekstu se ne pamte između svakog poziva funkcije paint pa morate postaviti vrijednosti svaki put (ipak se pamte s funkcijom paint).

U gornjem kodu možete vidjeti da je popunjavanje uključeno, a uzorak ispune isključen, pa ih ne moramo ponovno postavljati. Moramo postaviti rub, stil granične linije na čvrstu, boja prednjeg plana na crnu, a boju ispune na žutu ovako:

mw_gl_set_fg_colour (MW_HAL_LCD_BLACK);

mw_gl_set_solid_fill_colour (MW_HAL_LCD_YELLOW); mw_gl_set_line (MW_GL_SOLID_LINE); mw_gl_set_border (MW_GL_BORDER_ON); mw_gl_circle (draw_info, window_simple_data.circle_x, window_simple_data.circle_y, 25);

Dodajte ovaj kôd na komentar u ovoj funkciji gdje piše da dodate svoj kôd. Zatim moramo nacrtati krug koji se radi ovako:

mw_gl_circle (draw_info, 30, 30, 15);

Ovo iscrtava krug na koordinatama 30, 30 s radijusom 15. Ponovno izgradite kôd i ponovno ga pokrenite i vidjet ćete krug u prozoru kao što je prikazano gore. Primijetićete da se krug i dugme preklapaju, ali je dugme na vrhu. Ovo je po dizajnu. Kontrole su uvijek iznad svega što nacrtate na području klijenta.

Korak 8: Podaci prozora

Podaci prozora
Podaci prozora

Do sada smo implementirali vlastiti kôd u funkciju poruke u prozoru 1 (za rukovanje dolaznim porukama) i njegovu funkciju boje (za crtanje po klijentskom području prozora). Sada je vrijeme da to dvoje povežemo. Omogućimo ispunjavanje kruga iscrtanog u funkciji boje bojom koju korisnik odabere odabirom boje kada je dugme pritisnuto. Zapamtite da mi ne zovemo funkciju boje, to radi upravitelj prozora, tako da naša funkcija poruke (koja zna odabranu boju) ne može sama pozvati funkciju boje. Umjesto toga moramo keširati podatke i obavijestiti upravitelja prozora da je potrebno ponovno bojenje. Upravitelj prozora tada će pozvati funkciju boje koja može koristiti keširane podatke.

Na vrhu W1.c vidjet ćete praznu strukturu podataka i objekt ovog tipa koji je deklarirao generator koda ovako:

typedef struct

{ / * Dodajte svoje članove podataka ovdje * / char dummy; /* Neki kompajleri se žale na prazne strukture; uklonite ovo kada dodate svoje članove */} window_W1_data_t; statički window_W1_data_t window_W1_data;

Ovdje keširamo naše podatke tako da se čuvaju u pozivima i poznati su kao prozorski podaci. Ovdje trebamo pohraniti samo odabranu boju, ovako:

typedef struct

{ / * Dodajte svoje članove podataka ovdje * / mw_hal_lcd_colour_t selected_colour; } window_W1_data_t; statički prozor_W1_data_t prozor_W1_data = {MW_HAL_LCD_YELLOW};

Daćemo mu početnu boju žutu. Sada ćemo u funkciji poruke malo promijeniti kôd kako bismo odabranu boju spremili ovako:

slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE:

{window_W1_data.chosen_colour = message-> message_data; } break;

Zatim ćemo promijeniti funkciju boje tako da koristi ovu vrijednost kada crta krug ovako:

mw_gl_set_solid_fill_colour (window_W1_data.chosen_colour);

Sada smo promijenili podatke o kojima ovisi sadržaj prozora, pa moramo obavijestiti upravitelja prozora da prozor treba prefarbati. To radimo u funkciji poruke kada se primi poruka OK dijaloga, na sljedeći način:

mw_paint_window_client (poruka-> ručica primaoca);

Ovo ne dovodi do direktnog farbanja prozora. To je pomoćna funkcija koja šalje poruku upravitelju prozora da se prozor mora prefarbati (ako uđete u njega, možete vidjeti kako se to događa). Prozor koji u ovom slučaju treba prefarbati je sam, a rukohvat prozora nalazi se u parametru poruke u funkciji rukovatelja porukama.

Cijela datoteka sada izgleda ovako ako niste sigurni gdje idu neki od gore navedenih isječaka koda:

#include

#include "miniwin.h" #include "miniwin_user.h" #include "W1.h" typedef struct { / * Dodajte svoje članove podataka ovdje * / mw_hal_lcd_colour_t selected_colour; } window_W1_data_t; statički prozor_W1_data_t prozor_W1_data = {MW_HAL_LCD_YELLOW}; void window_W1_paint_function (mw_handle_t window_handle, const mw_gl_draw_info_t *draw_info) {MW_ASSERT (draw_info! = (void *) 0, "Parametar nultog pokazivača"); / * Popunite područje klijenta prozora punom belom bojom */ mw_gl_set_fill (MW_GL_FILL); mw_gl_set_solid_fill_colour (MW_HAL_LCD_WHITE); mw_gl_set_border (MW_GL_BORDER_OFF); mw_gl_clear_pattern (); mw_gl_rectangle (draw_info, 0, 0, mw_get_window_client_rect (window_handle).width, mw_get_window_client_rect (window_handle).height); / * Dodajte kod za farbanje prozora ovde */ mw_gl_set_fg_colour (MW_HAL_LCD_BLACK); mw_gl_set_solid_fill_colour (window_W1_data.chosen_colour); mw_gl_set_line (MW_GL_SOLID_LINE); mw_gl_set_border (MW_GL_BORDER_ON); mw_gl_circle (draw_info, 30, 30, 15); } void window_W1_message_function (const mw_message_t *message) {MW_ASSERT (message! = (void *) 0, "Parametar nultog pokazivača"); / * Sljedeći red zaustavlja upozorenja kompajlera jer se varijabla trenutno ne koristi */ (void) window_W1_data; switch (poruka-> poruka_id) {slučaj MW_WINDOW_CREATED_MESSAGE: / * Ovdje dodajte bilo koji inicijalizacijski kod prozora * / break; slučaj MW_MENU_BAR_ITEM_PRESSED_MESSAGE: / * Dodajte kod za rukovanje izbornikom prozora ovdje * / break; slučaj MW_BUTTON_PRESSED_MESSAGE: if (message-> sender_handle == button_B1_handle) { / * Dodajte svoj kôd rukovaoca za ovu kontrolu ovdje / / mw_create_window_dialog_colour_chooser (10, 10, "Boja", MW_HAL_LCD_RED_), poruka je pogrešna } break; slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE: {window_W1_data.chosen_colour = message-> message_data; mw_paint_window_client (poruka-> ručica primaoca); } break; zadano: / * Neka MISRA bude sretna * / break; }}

Izgradite i pokrenite ponovo i trebali biste moći postaviti boju ispune kruga.

Ovaj primjer prozorskih podataka koristi podatke koji su pohranjeni u statičkoj strukturi podataka na vrhu izvorne datoteke. Ovo je u redu ako imate samo jednu instancu prozora, kao što radimo u ovom primjeru, ali ako imate više od jedne instance, svi će dijeliti istu strukturu podataka. Moguće je imati podatke po instanci tako da više instanci istog tipa prozora ima svoje podatke. To je objašnjeno u dokumentaciji MiniWin koja se nalazi u direktoriju docs. Primjer datoteke koristi ga za prikaz više slika u istom tipu prozora (kao što se vidi na glavnoj slici na samom vrhu ove upute).

Korak 9: Završna zabava fontova

Nekoliko zabavnih fontova
Nekoliko zabavnih fontova

MiniWin podržava iscrtavanje fontova TrueType. Ako postoji nešto zbog čega vaše korisničko sučelje izgleda dobro, to su atraktivni fontovi. Ovaj posljednji korak pokazuje kako iscrtati TrueType font u prozoru MiniWin.

Postoje dva načina prikazivanja TrueType fontova. Jedan je da ih nacrtate izravno na području klijenta, kao što je to ranije učinjeno za krug, a drugi je da dodate kontrolu okvira za tekst u prozor. Radimo ovo drugo jer je lakše.

Sada ćemo dodati kontrolu okvira za tekst u našu JSON konfiguracijsku datoteku. Dodajte ga u definiciju Windowsa 2 tako da izgleda ovako:

Volim ovo:

{

"Name": "W2", "Title": "Window 2", "X": 50, "Y": 65, "Width": 100, "Height": 80, "Border": true, "TitleBar": true, "Visible": true, "Minimized": false, "TextBoxes": [{"Name": "TB1", "X": 0, "Y": 0, "Width": 115, "Height": 50, "Opravdanje": "Centar", "Pozadinska boja": "MW_HAL_LCD_YELLOW", "Prednja boja": "MW_HAL_LCD_BLACK", "Font": "mf_rlefont_BLKCHCRY16", "Omogućeno": tačno, "Vidljivo": tačno}]}

Kratka riječ o TrueType fontovima u MiniWinu. Fontovi dolaze u.ttf datotekama. U upraviteljima prozora na većim računarima oni se prikazuju na ekranu kada su potrebni. Ovo zahtijeva puno procesorske snage i memorije i nije prikladno za male uređaje. U MiniWinu se unaprijed obrađuju u bitmape i povezuju u vrijeme kompajliranja s fiksnom veličinom i stilom fonta (podebljano, kurziv itd.), Tj. Morate odlučiti koje fontove koje veličine i stila ćete koristiti u vrijeme kompajliranja. Ovo je učinjeno za vas za dva primjera fontova u MiniWin zip datoteci koju ste preuzeli. Ako želite koristiti druge fontove drugih veličina i stilova, pogledajte dokumentaciju MiniWin u mapi docs. U MiniWin-u za Windows i Linux postoje alati za prethodnu obradu.ttf datoteka u datoteke izvornog koda koje možete staviti u svoj projekt.

I druga kratka riječ - većina fontova je zaštićena autorskim pravima, uključujući i one koje ćete pronaći u Microsoft Windows -u. Koristite ih po vlastitoj volji za ličnu upotrebu, ali sve što objavite morate osigurati da dozvola s kojom su fontovi objavljeni to dopušta, kao što je slučaj za 2 fontova uključena u MiniWin, ali ne i za Microsoft fontove!

Nazad na kod! Generirajte, ispustite datoteke, sastavite i ponovo pokrenite kao i prije i vidjet ćete da prozor 2 sada ima zadani tekst na žutoj podlozi u otkačenom fontu. Promijenimo tekst uređivanjem izvorne datoteke Window 2 W2.c.

Moramo komunicirati s okvirom za tekst koji smo upravo stvorili, a način na koji to radite kao i svaka komunikacija u MiniWinu je da mu pošaljete poruku. Želimo postaviti tekst u kontroli prilikom kreiranja prozora, ali prije nego što se prikaže, pa dodajemo kôd u rukovatelj poruka u slučaju MW_WINDOW_CREATED_MESSAGE. To se prima kodom prozora neposredno prije prikaza prozora i namijenjeno je ovakvim inicijalizacijama. Generator koda stvorio je držač mjesta koji izgleda ovako u funkciji rukovatelja porukama:

slučaj MW_WINDOW_CREATED_MESSAGE:

/ * Dodajte bilo koji inicijalizacijski kod prozora ovdje */ break;

Ovdje ćemo postaviti poruku u kontrolu okvira za tekst koja će joj reći koji tekst želimo da prikaže pomoću funkcije mw_post_message ovako:

slučaj MW_WINDOW_CREATED_MESSAGE:

/ * Ovdje dodajte bilo koji kôd za inicijalizaciju prozora */ mw_post_message (MW_TEXT_BOX_SET_TEXT_MESSAGE, poruka-> primateljska_ruka, tekstualna_kutija_TB1_ruka, 0UL, "Bila je mračna i olujna noć …", MW_CONTROL_MESSAGE); break;

Ovo su parametri:

  • MW_TEXT_BOX_SET_TEXT_MESSAGE - Ovo je tip poruke koju šaljemo kontroli. Oni su navedeni u miniwin.h i dokumentovani u dokumentaciji.
  • poruka-> primalac_rukod - Odatle je poruka - ovaj prozor - čiji je rukohvat u parametru poruke proslijeđen funkciji rukovatelja porukama.
  • text_box_TB1_handle - Kome šaljemo poruku - ručica kontrole okvira za tekst. Oni su navedeni u generiranoj datoteci miniwin_user.h.
  • 0UL - Vrijednost podataka, u ovom slučaju ništa.
  • "Bila je mračna i olujna noć …" - Vrijednost pokazivača - novi tekst.
  • MW_CONTROL_MESSAGE - Tip primaoca koji je kontrola.

To je to. Ponovno izgradite i ponovo pokrenite kao i obično i prikazat će se okvir za tekst kao na gornjoj slici.

Objavljivanje poruka je fundamentalno za MiniWin (kao i za sve upravitelje prozora). Za više primjera pogledajte primjere projekata u zip datoteci, a za opsežno objašnjenje pročitajte odjeljak o porukama MiniWin u dokumentaciji.

Korak 10: Idite dalje

Image
Image

To je sve za ovaj osnovni uvod u MiniWin. MiniWin može učiniti mnogo više nego što je ovdje prikazano. Na primjer, ekran na ploči koji se koristi u ovom uputstvu je mali, a kontrole su male i trebaju se koristiti s diberom. Međutim, drugi primjeri i hardver koriste veće kontrole (postoje 2 veličine) na većim ekranima i njima se može upravljati prstima.

Postoje mnoge druge vrste kontrole od ovdje prikazanih. Za daljnje kontrole pogledajte različite primjere JSON datoteka u mapi za generiranje koda. U ovim primjerima obuhvaćeni su svi tipovi upravljanja.

Windows ima mnogo opcija. Obrub, naslovna traka i ikone mogu se konfigurirati. Možete imati trake za pomicanje i klizna područja prozora za pomicanje, više instanci istog tipa prozora i prozori mogu biti goli (samo područje klijenta, bez obruba ili naslovne trake) što znači da su fiksirani u vrijeme kompajliranja na mjestu na ekranu (pogledajte sliku u ovom odjeljku s velikim ikonama veličine - ovo je zapravo 6 golih prozora).

MiniWin ne koristi dinamičku memoriju. To ga čini pogodnim za male ograničene uređaje i zahtjev je za neke ugrađene projekte. MiniWin i kôd koji generiše također je u potpunosti usklađen s MISRA 2012 do 'potrebnog' nivoa.

Za dodatne informacije potražite dokumentaciju u mapi docs, kao i ostale primjere aplikacija u zip datoteci. Ovdje postoje primjeri koji pokazuju kako koristiti sve značajke MiniWina i kako integrirati MiniWin s FatFS -om i FreeRTOS -om.

Preporučuje se: