7. Előadás Grafikus felhasználói felületek. Salamon Júlia Előadás I. éves mérnök hallgatók számára
Felhasználói felületek készítése
Parancs ablakból >>f=figure; >>set(f,’Name’,’Ez a minta ablak’); >>set(f,’Position’,[0 0 600 400]); >>h=uicontrol(f,’Style’,’pushbutton’,’Position’,[10 10 100 300], … ’String’,’Nyomj meg!’,’Callback’,’disp(“Hello!”)’);
Guide parancs segítségével
2007.12.14.
VII. eloadas
2
GUI Layout Editor - segítségével létrehozhatunk egy grafikus ablakot - elsősorban az objektumok elhelyezésére szolgál - a felhasználói felület bármikor futtatható a Run gomb lenyomásával
2007.12.14.
VII. eloadas
3
Matlab grafikus objektumai
2007.12.14.
Push Button
gomb
Slider
gördülő sáv
Radio Button
rádió gomb
Check Box
kijelölő doboz
Edit Text
szöveg mező
Static Text
címke
Popup menu
legördülő menü
Listbox
lista
Toggle Button
gomb (ki be lehet kapcsolni)
Axis
ábra
Panel/Frame
panel
Button Group
panel gomboknak (rádió gomb) VII. eloadas
4
Alignment Tool Objektumok vagy objektum csoportok egymáshoz való igazítására használjuk
2007.12.14.
VII. eloadas
5
Property Inspector Segítséget nyújt az objektumok tulajdonságainak interaktív beállítására
2007.12.14.
VII. eloadas
6
Főbb tuljdonságok BackgroundColor
Az objektum háttérszínét állíthatjuk be. Értékei lehetnek: white, black, red, blue, yellow, green vagy az RGB komponensek például [1 0 0] a piros.
FontSize
A betűk nagyságát adja meg. Értékei számok.
FontWeight
A betűk stílusát állíthatjuk be. Értékei lehetnek: light, normal, demi, bold.
ForegroundColor
Esetek többségében a betűk színe állítható vele.
HorizontalAlignment Szöveg igazítását teszi lehetővé. Értékei lehetnek: left, center, right. String
Az objektumon található szöveget tudjuk megadni.
Tag
Segítségével egy objektumra tudunk hivatkozni. Érdemes beszédes nevet adni.
Value
A popup menü esetén megadja, hogy hányadik elem van kijelölve a listából.
Visible
Segítségével egy objektumot, elrejthetünk a ablakon. Értékei lehetnek: on vagy off.
2007.12.14.
VII. eloadas
7
Menu Editor A Matlab alkalmazások menüinek és kontextus menüinek interaktív létrehozását támogatja
2007.12.14.
VII. eloadas
8
Object Browser Grafikus objektumainknak az objektumhierarchiában való elhelyezkedését tanulmányozhatjuk.
Tab Order Editor A Tab billentyű nyomkodásával a grafikus objektumok között választani lehet. Itt megadhatjuk az objektumok sorrendjét
2007.12.14.
VII. eloadas
9
Eseményvezérelt programozás A felhasználó a grafikus felhasználói felülettel a billentyűzeten keresztül vagy az egér segítségével kommunikál. A Matlab a következő – felhasználó által kiváltott- események bekövetkezéséhez tud aktivitásokat rendelni • • • • • •
Egérgomb megnyomása Egérgomb felengedése Az egér mozgatása grafikus ablak felett Egy billentyű lenyomása aktív grafikus ablakban Grafikus ablak átméretezése Grafikus ablak bezárása
Ha több objektum helyezkedik el egymáson, akkor az egér mindig a legfelső objektumot veszi észre, hacsak nem tettük számára átlátszóvá a HitTest tulajdonság segítségével Grafikus függvényhez akciót úgy rendelhetünk, hogy az objektum megfelelő tulajdonságát a kívánt függvényhívással töltjük fel. A guide képes automatikusan egy keretrendszert generálni, amelyben a felhasználónak csak a feladat végrehajtása szempontjából fontos parancsokat kell begépelni. A keret rendszer egy M-fájlban jön létre és tartalmazza a felhasználó által kívánt eseményekhez rendelt kezelőfüggvények vázait.
2007.12.14.
VII. eloadas
10
Grafikus objektumokhoz rendelhető akciótulajdonságok Callback – az egérgomb lenyomáshoz hozzárendelt aktivitásokat hajtja végre ha az objektum Enable tulajdonsága On-ra van állítva. ButtonDownFcn tulajdonság által definiált függvény inaktív uicontrol objektumra, uicontrol közelébe kattintva hívódik meg. CreateFcn illetve DeleteFcn hívások a grafikus objektumok létrehozásakor, illetve megszüntetésekor hajtódnak végre KeyPressFcn segítségével az aktív objektumon belüli billentyű leütést kezelhetjük
2007.12.14.
VII. eloadas
11
Ablakhoz rendelhető akció-tulajdonságok WindowButtonDownFcn, a WindowButtonMotionFcn, illetve a WindowButtonUpFcn tulajdonságok által meghatározott függvények mindig meghívódnak, amennyiben egy ablakban az egér gombját lenyomjuk, az egeret mozgatjuk, illetve az egér gombját felengedjük. CloseRequestFcn tulajdonságokhoz rendelt függvény akkor hajtódik végre, amikor az ablakozó rendszeren keresztül az ablak bezárását kérjük. ResizeFcn tulajdonságokhoz rendelt függvény akkor hajtódik végre, amikor az ablakot a felhasználó átméretezi.
2007.12.14.
VII. eloadas
12
Általános objektumkezelő függvények A get és set utasítások, segítségükkel lekérdezhetjük az objektumok paramétereinek aktuális beállítását és meg is változtathatjuk azok értékét get(h)
Kiírja a h azonosítójú objektum összes paraméterét és azok aktuális értékét. get(h,tuld) Megadja a tuld paraméter aktuális beállításának értékét. set(h) Kilistázza a h azonosítójú objektum összes állítható paraméterét, valamint azok lehetséges értékét és zárójelbe téve jelzi azok alapértelmezését. set(h,tuld) Kiírja a h azonosítójú objektum tuld paraméterének az aktuális beállítását. set(h,tuld, val,...) a h azonosítójú objektum tuld paraméterét a val értékre állítja. findobj(tuld, val,...) Megadja mindazon objektumok listáját, amelyeknek a tuld paramétere a megadott val értékre van beállítva clf Törli az aktuális grafikus ablakot. cla Törli az aktuális rajzot. close(h) Lezárja a h azonosítójú ablakot. reset(h) A h objektum paramétereit az alapértékekre állítja vissza. delete(h) Törli a h objektumot 2007.12.14.
VII. eloadas
13
Grafikus objektumok azonosítója gcf - Az aktuális figure objektum, grafikus ablak azonosítóját adja meg. gca - Az aktuális axis objektum, rajz azonosítóját adja meg. gco – Annak az objektumnak az azonosítóját adja meg, amelyikre a legutóljára kattintottunk az egérrel. Általánosan handles.tagazon utasítással hivatkozhatunk egy objektum azonosítójára, ahol a tagazon az objektum Tag tulajdonságának az értéke. Ezért érdemes a Tag tulajdonságnak beszédes neveket adni. Példa s=get(gcf, 'CurrentCharacter'); set(handles.text1, 'String', s);
2007.12.14.
VII. eloadas
14
Példaprogramok 1.Egy gombra kattintva, a gombon véletlenszerűen generált számok jelenjenek meg. Megoldás Objektum
Tulajdonság Érték
Pushbutton1 String Tag
Veletlen szam g
Veletlen szam gomb/Callback s=num2str(rand*100); set(handles.g,'String',s)
2007.12.14.
VII. eloadas
15
2. Rajzoljuk ki a szinusz függvényt egy bekért intervallumon. Megoldás Objektum
Tulajdonság
Érték
Static text1
String
a=
Static text2
String
b=
Edit text1
String
0
Tag
a
String
1
Tag
b
String
Rajzol
Edit text2 Pushbutton1 Axis1
Rajzol gomb/Callback k=str2num(get(handles.a,'string')); v=str2num(get(handles.b,'string')); x=k:0.01:v; y=sin(x); plot(x,y) 2007.12.14.
VII. eloadas
16
3. Olvass be 3 számot. Írasd ki a legnagyobbikat. Megoldás Objektum
Tulajdonság Érték
Static text1
String
Edit text1
String Tag
Edit text2
a
String Tag
Edit text3
Kerek harom szamot:
b
String Tag
c
Pushbutton1
String
Szamol
Static text2
String
Legnagyobbik:
Edit text4
String
2007.12.14.
Tag
e
Enable
off
VII. eloadas
Szamol gomb/callback x=str2num(get(handles.a,'string')); y=str2num(get(handles.b,'string')); z=str2num(get(handles.c,'string')); m=x; if y>m m=y; end if z>m m=z; end set(handles.e,'string',m); 17
4. Helyezz el az ablakba egy szöveget, ahol a szöveg igazítását lehessen változtatni egy popup menü segítségével. Megoldás Objektum
Tulajdonság
Érték
Edit text1
String
Szoveg
Tag
sz
String
Kozepre Elore Hatra
Tag
m
Popupmenu1
Popup menu/callback x=get(handles.m,'Value'); if x==1 s='center'; end if x==2 s='left'; end if x==3 s='right'; end set(handles.sz,'HorizontalAlignment',s);
2007.12.14.
VII. eloadas
18
5. Helyezz el az ablakba egy szövegmezőt, amely szövegének a színét és a méretét menüből lehet változtatni. Megoldás Objektum
Tulajdonság
Érték
Edit text1
String
Szoveg
Tag
sz
Létre hozzuk a köv. menürendszert: Szin Piros Fekete Meret Piros menü/callback set(handles.sz,'Foregroundcolor','red') Fekete menü/callback set(handles.sz,'Foregroundcolor','black') Meret menü/callback set(handles.sz,'Fontsize',fix(rand*40)+4); 2007.12.14.
VII. eloadas
19
6. Készíts egy animációt (avi fájlba). Egy körön mozogjon egy pont. Objektum Tulajdonság
Érték
Axis1
DoubleBuffer
on
NextPlot
replace
String
Rajzol
Pushbutton1
Rajzol gomb/callback mov = avifile('e4.avi') x = -pi:.1:pi; for k=1:length(x) plot(cos(x),sin(x)); hold on plot(cos(x(k)),sin(x(k)),'*r'); hold off axis([-2 2 -2 2]); F = getframe(gca); mov = addframe(mov,F); end mov = close(mov); 2007.12.14.
VII. eloadas
20
7. Készíts egy animációt (gif állományba). Egy körön mozogjon egy pont. Objektum Tulajdonság
Érték
Axis1
DoubleBuffer
on
NextPlot
replace
String
Rajzol
Pushbutton1
Rajzol gomb/callback x = -pi:.1:pi; for k=1:length(x) plot(cos(x),sin(x)); hold on plot(cos(x(k)),sin(x(k)),'*r'); hold off axis([-2 2 -2 2]); F = getframe(gca); nev=strcat('fnev',num2str(k+1000),'.jpg'); imwrite(F.cdata,nev); end Az aktuális könyvtárba létrehozza a jpg állományokat. Letöltesz az internet-ről egy gif animátort (www.gif-animator.com), és legenerálod a gif állományodat. 2007.12.14.
VII. eloadas
21
Zárthelyi dolgozat felépítése 1. Függvény megadása 2. Adatfeldolgozás 3. Kétdimenziós grafika 4. Háromdimenziós grafika 5. Grafikus felhasználói felület Jelenlét
2007.12.14.
VII. eloadas
2p 1,5p 2p 1,5p 2p 1p
22
