Grafické objekty a uživatelská rozhraní

Grafické objekty a uživatelská rozhraní
Systém Handle graphics. Funkce: get, set Doporučená literatura: K. Zaplatílek, B. Doňar, (2004), Matlab, tvorba uživatelských aplikací. Grafické objekty a jejich hierarchie Pro efektivní práci s grafikou je v rámci Matlabu implementovaná objektově orientovaná hierarchie Root Figure Axes Uicontrol Uimenu Uicontexmenu Image Light Line Patch Rect Surface Text

Systém Handle graphics. Funkce: get, set Grafický objekt Význam Root Vrchol hierarchie grafických objektů, obrazovka počítače Figure Okno, ve kterém se zobrazuje grafika a uživ. interface Axes Souřadný systém pro zobrazení grafů v okně Figure Uicontrol Uživ. grafické rozhraní (tlačítka, textová pole, ...) Uimenu Uživatelem definované menu v horní části okna figure. Uicontextmenu Klasické (pop-up) menu, využitelné kdekoliv v Root Image 2D bitový obrázek Light Zdroj světelného osvětlení v obrázku Line Objekt čáry používaný při kreslení grafu Patch Vyplněný polygon s hranami Rectangle 2D tvar s možností změny od čtvercového po oválný Surface 3D reprezentace maticových dat Text Psaní textových řetězců v rámci definované grafiky

Vytvoření objektu Figure, pojem Handle
Grafické objekty a uživatelská rozhraní Systém Handle graphics. Funkce: get, set h=gcf - vytvoří handle k aktiv. objektu Figure h=gca – vytvoří handle k aktiv. objektu Axes h=plot(.....) - vytvoří handle ke grafu Vytvoření objektu Figure, pojem Handle h=figure – vytvoří prázdný objekt Figure. h (může mít jakékoli jméno) je tzv handle (ukazatel) na daný objekt. Handle může mít jakýkoliv objekt. get(h) – vypíše všechny vlastnosti, které lze u daného objektu na něhož handle ukazuje měnit v=get(h,'PropertyName') – vrátí hodnotu aktuální vlastnosti. set(h,'PropertyName',PropertyValue) – změní vlastnost objektu na který ukazuje handle h. Objekt Root je vždy označen číslem 0. s=get(0,’ScreenSize’) – zjistí rozměr obrazovky. Běžně je velikost obrazovky udávána v pixelech. Jednotky Units je možné volit mezi: inches, sentimeters, normalized, points, {pixels}, characters.Výhodné jsou zejména jednotky normalised, které jsou Vázané na velikost nadřazeného objektu a jsou vždy od 0 do 1. Umístění Figure na obrazovce se udává pomocí příkazu set(h,’Position’,[pozX pozY sirka vyska]) v levem dolnim rohu je pozX=pozY=1 pixel.

Systém Handle graphics. Funkce: get, set Vykresleme graf funkce Obrázek umístěmě tak aby zabíral horní polovinu obrazovky. Upravme barvu pozadí obrázku na bílou, změňme tloušťku čáry na 2pt, velikost popisků os na 12pt.... h=figure; s=get(0,'ScreenSize'); set(h,'Position',[1 s(4)/2-70 s(3) s(4)/2]) g=plot(0:0.1:4*pi,sin(0:0.1:4*pi)) a=gca set(a,'XLim',[0 4*pi]) set(a,'YLim',[ ]) set(a,'XTick',0:pi/2:4*pi) set(a,'XTickLabel',{'0','pi/2','pi','3pi/2','2pi','5pi/2','3pi','7pi/2','4pi'}) xlabel('\itx'),ylabel('\ity\rm=sin(\itx\rm)') set(g,'Color','r') set(h,'Color',[1 1 1]) set(g,'LineWidth',2) grid

Systém Handle graphics. Funkce: get, set Je zřejmé, že alternativou k programové úpravě grafu je využití interaktivního rozhraní obrázku a jeho editace pomocí klávesnice a myši

Systém Handle graphics. Funkce: get, set Vytvořme program pro animaci šikmého vrhu function hodviz(alpha,v,xmax) %hodviz(alpha,v,xmax) %vizualizace drahy sikmeho hodu %alpha - uhel hodu ve stupnich %v - rychlost hodu %xmax - pozorovana vzdalenost g=9.81; alpha=alpha*pi/180; tmax=2*v*sin(alpha)/g; t=0:tmax/100:tmax; %vypocet trajektorie x=v*cos(alpha)*t; y=v*sin(alpha)*t-1/2*g*t.^2; if nargin<3 xmax=max(x); end %vykresleni hodu f=figure h = plot(x(1),y(1),'o'); axis([0 xmax 0 1.1*max(y)]) set(h,'EraseMode','xor'); for m=2:length(x) set(h,'XData',x(m),'YData',y(m)); pause(tmax/50) %aby nebyl moc rychly end plot(x,y,':');

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Zatím jsme si ukázali jak pomocí funkcí get a set měnit atributy grafů, tedy objektů (Root), Figure a Axes. Analogickým způsobem je možné definovat a měnit další objekty a jejich atributy, zejména Uicontrol a Uimenu tak abychom vytvořily uživatelské rozhraní pro ovládání našich programů, tzv. GUI (Graphical User Interface), viz. Zaplatílek a Doňar (2004). Efektivnější a více user-friendly alternativa pro vytváření GUI je použítí nástroje GUIDE (Graphical User Interface Development Environment). Spuštění Guide a) z menu Matlabu, položkou File – New – GUI b) pomocí příkazu guide Poté se objeví okno Guide Quick Start, kde zvolíme, zda chceme vytvořit nový GUI, nebo otevřít a editovat starý.

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Po otevření Blank GUI se otevře prostředí pro vytvoření GUI Ikony pro úpravu a správu GUI Plocha pro vkládání komponent Paleta komponent

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Komponenty se pomocí myši přenesou a rozmístí na ploše GUI. Kromě grafické úpravy komponent, GUIDE vytváří tzv. callbacks, pomocí nichž je tvořena zpětná programová vazba komponent. K souboru grafického rozhraní typu fig (např gui.fig) GUIDE také vytváří soubor typu m (se stejným názvem - např. gui.m) ve kterém lze pomocí callbacků GUI oživit, tedy přiřadit jednotlivým komponentám GUI akce.

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Property inspector Slouží k editaci komponent. Otevře se po dvojkliku na danou komponentu. Kromě vzhledových vlastností komponenty – popisek s volbou fontu, barevného pozadí obsahuje Property inspector následující dvě důležité položky: Tag – slouží k identifikaci komponenty, každá komponenta musí mít v rámci GUI jiný tag. Callback – definuje akci která se má vykonat po aktivaci komponenty. Při vytváření komponenty se v Callbacku vytvoří kód, který volá příslušnou subfunkci, která se automaticky vytvoří v doprovodném m-souboru (gui.m). V podstatě je ale možné zadat do Callbacku jakýkoli jiný příkaz.

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Komponenty GUI Push Button – tlačítko (s pružinkou - po uvolnění se vrátí do původní polohy) Toggle Button – tlačítko (bez pružinky – po uvolnění zůstane v dané poloze. Do původní se vrátí až po dalším kliknutí). Radio Button – zaklikávací tlačítko Tlačítka, je možné sloučit do skupiny tak, že se umístí na komponentu Button Group. Všechny tlačítka jsou poté vázána, např. svou polohou, na komponentu Button Group, která umožňuje např. barevně odlišit danou oblast, či v rámci které se může rozhodovat o akci. V případě použití v kombinaci s Toggle nebo Radio Button, dovolí stlační pouze jednoho tlačítka.

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Checkbox – indikace akce zatržením boxu Slider Gain – umožní zadání hodnoty změnou polohy jezdce Static text – popisky a zobrazení needitovatelných výsledků programu Edit Text – umožňuje zadávaní proměnných uživatelem (jsou typu string) List Box – zobrazení seznamu s možností volby označením Pop-up Menu – zobrazení rozbalovacího menu s možností volby označením Axes – vložení grafu pro zobrazení výsledků

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Po vytvoření grafického rozhraní exportujeme vzniklé GUI do souboru fig, kliknutím na zelenou šipku v ikonkovém menu, nebo z menu pomocí položky Tools-Run. Tím se nám také vytvoří jménem odpovídající m-soubor, pomocí kterého budeme GUI oživovat. Na začátek m-souboru je provedena inicializace funkce GUI a jsou zjištěny handly všech komponent. Tyto jsou uchovány v strukturované proměnné handles. Na konkrétní komponenty se pak odkazujeme pomocí proměnné handles.tag kde tag samozřejme odpovídá položce tag komponenty, definované v Property Inspector. Jednotlivé vlastnosti komponent pak měníme pomocí příkazů get a set. Jestliže nedefinujeme jinak přemazáním automatic v položce Callback Property Inspectoru, ke každé aktivní komponentě je v m-souboru vytvořena příslušná subfunkce volaná callbackem komponenty s názvem tag_Callback, kam můžeme vložit příslušný kód k provedení nějaké operace.

GUIDE – nástroj pro interaktivní tvorbu grafického rozhraní Užitečné příkazy pro provázání grafického rozhraní a přidruženého m-souboru: h=gcbo – vrátí handle aktivního objektu h=gcbf – vrátí handle aktivního callback figure, tedy figure na kterém se nachází aktivní objekt h=findobj(gcbf,'Tag', 'edit1') – přiřadí do proměnné h handle komponenty s příslušným tagem, zde Tag=edit1 guidata(h, data) – uloží data do položky application data (jakási schránka dat pro ukládání a předávání dat mezi objekty) příslušného figure jehož handle je h (h může být i handle komponenty, která se nachází na figure). Takto je možné předávat data mezi jednotlivými položkami GUI. data=guidata(h) – zapíše do data dříve uložená data ze schránky dat .

Vytvořme GUI pro vykreslení přímky kde úhel se zadá pomocí komponenty Slider a hodnota y0 se zadá do komponenty Edit text. Hodnota z posuvníku se má též vypisovat do komponenty Static Text. Přímka se vykresluje do komponenty Axes. GUI se zavře po kliknutí na tlačítko Close. Edit text Static text Nejprve nataháme na plochu jednotlivé komponenty a nastavíme jejich grafickou podobu pomocí Property Inspectoru. Poté kliknutím na zelenou šipku vygenerujeme příslušné soubory primka.fig a primka.m Vytvořené GUI oživíme editací souboru primka.m Slider Axes Push buton

Vygenerované soubory gui figure primka.fig a m-funkce primka.m Soubor primka.m je m-funkce s proměnným počtem vstupů a výstupů, která je volána jednak při otevření GUI a jednak při aktivaci jakékoli komponenty s Callbackem - není-li uživatelem definováno jinak (v položce Callback Property Inspectoru dané komponenty).

Na začátku vygenerované m-funkce je část kódu, která zabezpečuje interakci mezi funkcí a figure Gui. Z této části funkce se volají příslušné subfunkce odpovídající Callbackům aktivních komponent. V této části programu se také vytvoří strukturovaná proměnná handles s jejíž pomocí se odkazujeme na jednotlivé komponenty pomocí tečkové notace handle.tag. Tato část kódu není určena pro editaci uživatelem!

Dále následují jednotlivé subfunkce. První z nich je primka_OpeningFcn která je aktivována při otevření Gui primka. Zde dochází jednak k updatu proměnné handles a jejímu uločení do schránky dat pomocí příkazu guidata. Do těla této subfunkce se píše kód který se má vykonat po otevření Gui.

Jestliže uživatel nedefinuje jinak, je při generování GUI v Property Inspectoru automaticky vyplněna položka Callback a je vytvořena příslušná subfunkce v souboru primka.m. Na horním obr. je Callback komponenty edit1 (s položkou Tag edit1). Jméno subfunkce je v synaxi tag_Callback (zde edit1_Callback) se třemi proměnnými hObject – handle aktivního objektu (zde handle edit1), eventdata – prázdná položka (pro budoucí verze Matlabu) a strukt. proměnná handles. Jak je patrné, Callbackem je volána funkce primka, jejímž parametrem je jednak název volané subfunkce, zde ‘edit1_Callback’, gcbo vrátí handle aktivního objektu (který je následně předán do hObject), prázdné pole (které je předáno do eventdata), guidata(gcbo) vyjme ze schránky dat proměnnou handles a pošle ji jako parametr do subfunkce. O volání subfunkce s příslušnou syntaxí se stará kód na začátku funkce primka, viz slide 17. Do těla subfunkce vkládáme kód který se má vykonat po aktivaci dané komponenty.

V Gui primka se nachází dvě komponenty s Callbackem, a sice komponenta edit text (edit1) a slider (slider1), kterým odpovídají příslušné subfunkce. Při každé aktivaci jedné z těchto komponent, a stejně tak i při spouštění Gui, je třeba Gui updatovat a provézt příslušné akce. Jelikož je při všech uvedených akcích nutné provézt tytéž operace, je na konec souboru primka vložena subfunkce fprimka realizující potřebné operace. Tato subfunkce se pomocí directivy fprimka(handles) volá z těla subfunkcí edit1_Callback slider1_Callback a inicializační subfunkce primka_OpeningFce. Výsledné soubory lze nalézt na web stránce předmětu

Výpis proměnná handles – každé komponentě Gui primka odpovídá jedna položka strukturované proměnné handles V prvém řádku subfunkce fprimka je zjištěna poloha jezdce komponenty slider. Tato se nachází ve vlastnosti ‘Value’ a získáme jí pomocí příkazu get, s odkazem na handle komponenty slider – handles.slider1. V druhém řádku tuto hodnotu zapíšeme do vlastnosti ‘String’ textového pole s tagem text5 pomocí příkazu set. Obdobně pracujeme i s druhou zadávanou hodnotou y0 která se zadává do komponenty edit1. Vykreslení přímky do komponenty axes1 realizujeme pomocí příkazu plot tak, že jako jeho první vstupní proměnnou zadáme handle komopenty, zde handles.axes1. teprve potom následují hodnoty x a y. K>> handles handles = figure1: pushbutton1: axes1: text5: text4: text3: text2: slider1: text1: edit1: output:

Grafické objekty a uživatelská rozhraní

Podobné prezentace

Prezentace na téma: "Grafické objekty a uživatelská rozhraní"— Transkript prezentace:

Podobné prezentace

O projektu

Kontaktní formulář

Přihlásit se

Přihlásit se přes sociální síť:

Grafické objekty a uživatelská rozhraní

Podobné prezentace

Prezentace na téma: "Grafické objekty a uživatelská rozhraní"— Transkript prezentace:

Podobné prezentace

O projektu

Kontaktní formulář