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, Studeni
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 upravitelj prozora s pomičnim preklopljenim prozorima na ugrađenom mikrokontroleru s LCD zaslonom i zaslonom 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. Napisana je u potpuno usklađenom C99 i može se koristiti u C ili C ++ aplikaciji. Ciljevi MiniWina su jednostavni za korištenje, jednostavni za izmjenu, 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 zbirku kontrola korisničkog sučelja - gumbe, klizače, trake napretka, stabla itd. Možete imati više prozora različitih vrsta ili više instanci iste vrste. 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 s kerningom i anti-aliasingom (čini tekst glatkim i glatkim) također su podržani za atraktivno iscrtavanje teksta.

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

Osim izrade vlastitih prozora, uključeni su i neki standardni dijalozi koji se vrlo lako pokreću - na primjer dijalozi za potvrdu (samo gumbi OK ili Da/Ne), postavljači vremena/datuma, odabir datoteka, odabir boja itd.

MiniWin koristi standardni sustav čekanja poruka za dizajn dizajna upravitelja sustava Windows. Windows može komunicirati međusobno i upravitelj prozora putem poruka. Ne pozivate funkcije za izravno obavljanje poslova, dodajete poruku u red i upravitelj prozora će to učiniti umjesto vas.

MiniWin je prenijet na standardne razvojne ploče s zaslonima osjetljivim 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 što nabavite ugrađeni hardver.

MiniWin ima generator kodova. Možete odrediti svoje prozore i kontrole u jednostavnoj za kreiranje čitljivoj JSON datoteci, a generator koda raščlanjuje datoteku i stvara kôd za vas (postoji mnogo primjera koje trebate slijediti). On stvara potpune simulacijske aplikacije za Windows ili Linux koje se mogu samo izgraditi, a tu je i vaš simulirani LCD zaslon 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 to radi u jednoj niti. MiniWin se može integrirati s RTOS -om koji radi na ugrađenom procesoru, a postoje primjeri koji integriraju MiniWin s FreeRTOS -om.

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

MiniWin radi na mikro kontrolerima srednje klase i novijim.

Pribor

Razvojna ploča STM32F429I-DISC1 i mikro USB kabel

STM32CubeIDE preuzimanje koje je besplatno.

Korak 1: Dohvaćanje koda

Dobivanje koda
Dobivanje koda

Prije svega trebate instalirati STM32CubeIDE. To možete pronaći na web stranici ST. Morate se registrirati i potrebno je neko vrijeme za preuzimanje i instaliranje. Sve je besplatno.

Tijekom instaliranja preuzmite izvor MiniWin i raspakirajte ga. Velika je, ali ćete koristiti samo njen mali dio. Ovdje kliknite zeleni gumb "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 | Uvoz …
  2. Otvorite Općenito i odaberite Postojeći projekt u radni prostor. Sljedeći.
  3. Pritisnite Pregledaj i dođite do mjesta gdje ste raspakirali MiniWin. Zatim idite u mapu STM32CubeIDE / MiniWinSimple / STM32F429. Pritisnite Odaberi mapu.
  4. U projektu: označite MiniWinSimple_STM32F429, a zatim kliknite Završi.
  5. Projekt MiniWinSimple_STM32F429 pojavit će se 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 zaslon za kalibraciju zaslona pa dodirnite središte tri križa na LCD zaslonu. Sada možete komunicirati s prozorom na zaslonu.

Za pomicanje prozora povucite ga prema naslovnoj traci. Za promjenu veličine prozora upotrijebite ikonu bijelog trokuta lijevo od naslovne trake. Veličina prozora MiniWin ne može se promijeniti povlačenjem ivica jer su zasloni 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). Kad 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. (Također ga možete izgraditi iz izvora za Windows ako ste zabrinuti zbog pokretanja preuzete izvršne datoteke, ali trebate instalirati prevoditelj i razvojno okruženje. Pojedinosti potražite u dokumentaciji MiniWin u mapi docs).
  3. U ovoj mapi nalaze se 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 projekt u STM32CubeIDE i otvorite mapu 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 obnovite i ponovno izvedite projekt u STM32CubeIDE i pojavit će se vaš novi prozor za dizajn. Gumb u prozoru je nestao 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 kôd.

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 zalijepite ga ponovo zarezom koji razdvaja dvije definicije.

3. Promijenite "W1" u "W2" i "Window 1" u "Window 2". Promijenite "X", "Y", "Širina" i "Visina" na neke različite vrijednosti imajući na umu da je razlučivost zaslona široka 240 do 320 visoka.

4. Spremite datoteku i ponovno pokrenite generator koda.

5. Kopirajte datoteke kao u prethodnom koraku, ponovo ih izradite i ponovno izvedite. Sada ćete imati 2 prozora na zaslonu.

Korak 5: Dodavanje kontrole

Dodavanje kontrole
Dodavanje kontrole

Sada ćemo vašem novom prozoru dodati neke kontrole. 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ćuje je (trake izbornika mogu se globalno onemogućiti, pokušajte). Također dodaje gumb koji je omogućen i vidljiv (mogu se stvoriti nevidljivim, a zatim kasnije učiniti vidljivim u kodu).

2. Ponovno generirajte kôd, kopirajte ga, ponovno izradite, ponovno pokrenite kao i prije.

Korak 6: Učinite da kontrole učine nešto

Učiniti da kontrole učine nešto
Učiniti da kontrole 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 gumb u prozoru 1.

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

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

void window_W1_message_function (const mw_message_t *message) {MW_ASSERT (poruka! = (void *) 0, "Parametar nultog pokazivača"); / * Sljedeći redak zaustavlja upozorenja prevoditelja jer se varijabla trenutno ne koristi */ (void) window_W1_data; switch (message-> message_id) {case MW_WINDOW_CREATED_MESSAGE: / * Ovdje dodajte bilo koji kôd za inicijalizaciju 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) { / * Ovdje dodajte kôd rukovatelja za ovu kontrolu * /} break; zadano: / * Neka MISRA bude sretna * / break; }}

Upravitelj prozora poziva ovaj prozor kad god upravitelj prozora mora obavijestiti prozor da se nešto dogodilo. U ovom slučaju želimo znati 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 nakon pritiska na tipku. U ovom prozoru postoji samo jedan gumb, ali moglo bi ih biti više pa se provjerava o kojem se gumbu radi. U ovom slučaju to bi mogao biti samo gumb B1 (naziv ponovno odgovara nazivu gumba u JSON datoteci).

Dakle, nakon ove oznake slučaja dodajte kôd za pojavljivanje dijaloga za odabir boje, a to je sljedeće:

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

Parametri su sljedeći:

  • 10, 10 je mjesto na ekranu dijaloga
  • "Boja" je naslov dijaloga
  • MW_HAL_LCD_RED zadana je 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 u koji će se poslati odgovor dijaloga.

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

slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE:

{mw_hal_lcd_colour_t selected_colour = message-> message_data; (ništavno) selected_colour; } pauza;

Ne radimo još ništa s odabranom bojom, pa je samo preusmjeravamo na void kako bismo spriječili upozorenje prevoditelja. 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 redak zaustavlja upozorenja prevoditelja jer se varijabla trenutno ne koristi */ (void) window_W1_data; switch (message-> message_id) {case MW_WINDOW_CREATED_MESSAGE: / * Ovdje dodajte bilo koji inicijalizacijski kod prozora * / break; slučaj MW_MENU_BAR_ITEM_PRESSED_MESSAGE: / * Ovdje dodajte kod za rukovanje izbornikom prozora * / break; slučaj MW_BUTTON_PRESSED_MESSAGE: if (message-> sender_handle == button_B1_handle) { / * Dodajte svoj kôd rukovatelja za ovu kontrolu ovdje * / mw_create_window_dialog_colour_chooser (10, 10, "Boja", MW_HAL_LCD_RED_; poruka primatelja, false, poruka primatelja> false) } pauza; slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE: {mw_hal_lcd_colour_t selected_colour = message-> message_data; (ništavno) selected_colour; } pauza; 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, a možete imati samo jedno prikazivanje odjednom. Ovdje 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 kojem možete crtati nalazi se unutar granica (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 zaslona, ili je koordinata mjesta na kojem crtate na području klijenta ili izvan njega. Za vas je sve riješeno. Ne možete crtati izvan područja svog klijenta.

Crtanje na područjima klijenata u terminologiji prozora naziva se slikanje i svaki prozor ima funkciju bojenja na kojoj crtate. Ne zovete svoju funkciju boje, upravitelj prozora to radi umjesto vas. To je potrebno pri premještanju prozora ili promjeni položaja ili vidljivosti drugog prozora na vrhu. Ako trebate prefarbavanje prozora jer su se promijenili neki podaci o kojima ovisi sadržaj prozora (tj. Znate da je potrebno ponovno bojenje, a da upravitelj prozora ne zna), 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 stvara ga za vas i nalazi se neposredno iznad funkcije rukovatelja porukama izmijenjene u prethodnom odjeljku. Idite na svoj projekt i ponovno otvorite datoteku W1.c.

U ovoj datoteci ćete pronaći funkciju window_W1_paint_function (). 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"); / * Ispunite područje klijenta prozora punom bijelom 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 jest ispuniti područje klijenta bijelom bojom. Nacrtajmo žuti krug ispunjen na području klijenta. Prvo moramo razumjeti koncept grafičkog konteksta (još jedna stvar s Windowsima). Parametre crtanja postavljamo u grafički kontekst, a zatim pozivamo generičku rutinu crtanja krugova. U ovom primjeru moramo postaviti ima li krug obrub, stil obruba, 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 ne pamte se 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 ispuna uključena, 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 u 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 crta 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. Primijetit ćete da se krug i gumb preklapaju, ali gumb je na vrhu. Ovo je prema 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 njenu funkciju boje (za crtanje po klijentskom području prozora). Sada je vrijeme da povežete to dvoje. Ispunjavamo krug iscrtan u funkciji boje bojom koju korisnik odabere odabirom boje kada je gumb pritisnut. Upamtite da mi ne zovemo funkciju boje, to radi upravitelj prozora, pa naša funkcija poruke (koja poznaje 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 bojenja koja može koristiti predmemorirane podatke.

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

typedef struct

{ / * Ovdje dodajte svoje članove podataka * / char dummy; /* Neki se prevoditelji žale na prazne strukture; uklonite ovo kad dodate svoje članove */} window_W1_data_t; statički prozor_W1_data_t window_W1_data;

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

typedef struct

{ / * Ovdje dodajte svoje članove podataka * / mw_hal_lcd_colour_t selected_colour; } window_W1_data_t; statički prozor_W1_data_t window_W1_data = {MW_HAL_LCD_YELLOW};

Dat ćemo mu početnu žutu boju. 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-> poruka_data; } pauza;

Zatim ćemo promijeniti boju 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 upravitelju prozora dati do znanja da prozor treba prefarbati. To radimo u funkciji poruke kada se primi poruka OK u dijaloškom okviru, ovako:

mw_paint_window_client (poruka-> ručica primatelja);

To ne uzrokuje izravno bojanje prozora. To je pomoćna funkcija koja šalje poruku upravitelju prozora da se prozor mora prefarbati (ako zakoračite u njega, možete vidjeti kako se to događa). Prozor koji je potrebno prefarbati u ovom slučaju je sam, a ručica 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:

#uključi

#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 window_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"); / * Ispunite područje klijenta prozora punom bijelom 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 kod za slikanje prozora */ 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 redak zaustavlja upozorenja prevoditelja jer se varijabla trenutno ne koristi */ (void) window_W1_data; switch (message-> message_id) {case MW_WINDOW_CREATED_MESSAGE: / * Ovdje dodajte bilo koji inicijalizacijski kod prozora * / break; slučaj MW_MENU_BAR_ITEM_PRESSED_MESSAGE: / * Ovdje dodajte kod za rukovanje izbornikom prozora * / break; slučaj MW_BUTTON_PRESSED_MESSAGE: if (message-> sender_handle == button_B1_handle) { / * Dodajte svoj kôd rukovatelja za ovu kontrolu ovdje * / mw_create_window_dialog_colour_chooser (10, 10, "Boja", MW_HAL_LCD_RED_; poruka primatelja, false, poruka primatelja> false) } pauza; slučaj MW_DIALOG_COLOUR_CHOOSER_OK_MESSAGE: {window_W1_data.chosen_colour = message-> message_data; mw_paint_window_client (poruka-> ručica primatelja); } pauza; zadano: / * Neka MISRA bude sretna * / break; }}

Izgradite i pokrenite ponovno 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. To 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 iste vrste 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 istoj vrsti 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 privlačni fontovi. Ovaj posljednji korak prikazuje 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:

kao 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, "Justification": "Center", "BackgroundColour": "MW_HAL_LCD_YELLOW", "ForegroundColour": "MW_HAL_LCD_BLACK", "Font": "mf_rlefont_BLKCHCRY16", "Enabled": true, "Visible": true}]

Kratka riječ o fontovima TrueType u MiniWinu. Fontovi dolaze u.ttf datotekama. U upraviteljima prozora na većim računalima oni se iscrtavaju na vašem zaslonu kada su potrebni. To zahtijeva puno procesorske snage i memorije i nije prikladno za male uređaje. U MiniWinu oni su unaprijed obrađeni u bitmape i povezani u vrijeme sastavljanja s fiksnom veličinom i stilom fonta (podebljani, kurziv itd.), Tj. Morate odlučiti koje fontove koje veličine i stila ćete koristiti u vrijeme kompajliranja. To ste učinili 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 MiniWinu 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 zaštićena je autorskim pravima, uključujući i one koje ćete pronaći u sustavu Microsoft Windows. Koristite ih prema vlastitoj volji za osobnu upotrebu, ali sve što objavite morate osigurati da dozvola s kojom su fontovi objavljeni dopušta to, kao što je slučaj s 2 fontova uključena u MiniWin, ali ne i s Microsoftovim fontovima!

Natrag na kôd! Generirajte, ispustite datoteke, sastavite i ponovno 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 tekstualnim okvirom 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 kontrolu prilikom stvaranja 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:

/ * Ovdje dodajte bilo koji kôd za inicijalizaciju prozora */ break;

Ovdje ćemo postaviti poruku u kontrolu okvira za tekst koja će joj reći koji tekst želimo prikazati 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, message-> primatelj_ruka, text_box_TB1_handle, 0UL, "Bila je mračna i olujna noć …", MW_CONTROL_MESSAGE); pauza;

Ovo su parametri:

  • MW_TEXT_BOX_SET_TEXT_MESSAGE - Ovo je vrsta poruke koju šaljemo kontroli. Navedeni su u miniwin.h i dokumentirani u dokumentaciji.
  • poruka-> primateljska_ruka - Odatle je poruka - ovaj prozor - čija je ručka u parametru poruke proslijeđena funkciji rukovatelja porukama.
  • text_box_TB1_handle - Kome šaljemo poruku - ručka 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 - Vrsta primatelja koja je kontrola.

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

Objavljivanje poruka temelj je MiniWina (kao i svih upravitelja 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 to za ovaj osnovni uvod u MiniWin. MiniWin može učiniti mnogo više nego što je ovdje prikazano. Na primjer, zaslon na ploči koji se koristi u ovom uputstvu je mali, a kontrole su male i potrebno ih je koristiti s diberom. Međutim, drugi primjeri i hardver koriste veće kontrole (postoje 2 veličine) na većim zaslonima i njima se može upravljati prstom.

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 iste vrste prozora i prozori mogu biti goli (samo područje klijenta, bez obruba ili naslovne trake) što znači da su fiksni u vrijeme sastavljanja na mjestu na zaslonu (pogledajte sliku u ovom odjeljku s velikim ikonama veličine - to je zapravo 6 golih prozora).

MiniWin ne koristi dinamičku memoriju. To ga čini prikladnim za male ograničene uređaje i uvjet je za neke ugrađene projekte. MiniWin i kôd koji generira također je u potpunosti usklađen s MISRA 2012 do 'potrebne' razine.

Za dodatne informacije potražite dokumentaciju u mapi docs 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čeni: