Upload
chandra-kurniawan
View
960
Download
36
Embed Size (px)
Citation preview
MEMBANGUN GUI DENGAN M-FILE
1
MEMBANGUN GUI DENGAN MMEMBANGUN GUI DENGAN MMEMBANGUN GUI DENGAN MMEMBANGUN GUI DENGAN M----FILEFILEFILEFILE
MATLAB TUTORIALMATLAB TUTORIALMATLAB TUTORIALMATLAB TUTORIAL
CHANDRA KURNIAWANCHANDRA KURNIAWANCHANDRA KURNIAWANCHANDRA KURNIAWAN
[email protected]@[email protected]@gmail.com
MEMBANGUN GUI DENGAN M-FILE
2
PENDAHULUAN
Graphical User Interface (GUI) merupakan antar muka pengguna yang
memungkinkan suatu metode interaksi secara grafis antara manusia dan komputer.
GUI menjadi salah satu faktor kemudahan dalam penggunaan komputer. Dalam
bahasa pemrograman MATLAB (Matrix Labolatory), membangun suatu user
interface dapat dilakukan dengan dua cara, yaitu :
• Melalui perintah GUIDE (GUI Designer), dimana perintah ini akan
menampilkan GUI Layout Editor untuk membuat suatu file baru
berekstensi .fig.
• Membangun GUI melalui rutin-rutin program yang diimplementasikan di
dalam M-file
Untuk pembahasan kali ini, penulis akan menggunakan alternatif kedua, yaitu
membangun GUI melalui M-file.
Langkah pertama yang dapat dikerjakan adalah membuat suatu M-file
baru dengan cara pilih File – New – M-File (Ctrl + N). Sebuah Editor baru akan
ditampilkan pada jendela MATLAB seperti gambar di bawah ini.
Gambar 1. Editor M-File
Selanjutnya, suatu GUI dapat dibangun dengan mendefinisikan suatu
fungsi terlebih dahulu. Nama fungsi dapat ditentukan sendiri dengan syarat tidak
boleh mengandung spasi maupun keyword pada MATLAB. Seperti yang telah
diketahui bersama, bahwa nama M-file yang akan disimpan harus sama dengan
nama fungsi yang telah dibuat. Fungsi yang dibuat memiliki suatu argumen
MEMBANGUN GUI DENGAN M-FILE
3
masukan, dalam hal ini nama argumen juga dapat ditentukan sendiri. Berikut di
bawah ini syntax dan contoh penamaan fungsi yang akan dibuat.
Setelah fungsi yang dibuat disimpan dengan ekstensi M-file, maka pada
langkah selanjutnya dapat didefinisikan terlebih dahulu suatu variabel global.
Tujuan dari pendefinisian suatu variabel global adalah agar variabel tersebut dapat
digunakan pada seluruh sub-sub rutin yang terdapat di dalam fungsi tersebut.
Berikut di bawah ini syntax dan contoh pendeklarasian variabel global.
Pada tahap selanjutnya, diperlukan suatu sub rutin yang mampu
menangani berbagai nilai ekspresi yang mungkin diberikan oleh argumen inputan
action. Struktur penanganan kondisi yang dapat digunakan untuk kasus ini adalah
model switch-case. Pada bagian selanjutnya, perancangan antar muka akan
dikerjakan pada bagian ‘initialize’.
Pada saat fungsi yang telah dibuat dieksekusi (pada MATLAB running
menggunakan F5) secara langsung, maka argumen masukan action belum
memiliki nilai ekspresi yang akan digunakan pada bagian penanganan switch-
case. Untuk menangani permasalahan tersebut, maka argument action dapat
diberikan nilai ekspresi ‘initialize’, dimana jika jumlah argumen masukkan
switch action
case 'initialize'
otherwise
end
Syntax : global namavariabel;
Contoh : global P;
Syntax : function namafungsi(argumen)
Contoh : function GUIdenganMFILE(action)
MEMBANGUN GUI DENGAN M-FILE
4
bernilai nol, maka program akan menjalankan sekumpulan perintah pada bagian
‘initialize’.
Secara lengkap mulai dari awal pembahasan hingga bagian ini, source
code yang dapat dituliskan dapat dilihat seperti pada gambar di bawah ini.
Gambar 2. Source code program
MENGENAL KOMPONEN GUI
Sebelum dapat menggunakan komponen-komponen GUI dengan benar,
maka diperlukan pemahaman konsep mengenai Pemrograman Berbasis Objek
(PBO) di MATLAB dengan benar. Pada Pemrograman Berbasis Objek, setiap
komponen diartikan sebagi objek yang dapat diberikan pekerjaan maupun
melakukan pekerjaan tertentu. Dalam konteks pemrograman MATLAB sendiri,
setiap objek tersebut memiliki hirarki objek yang dijabarkan dalam konsep
parent-children. Berikut adalah diagramnya.
if nargin == 0
action = 'initialize';
end
MEMBANGUN GUI DENGAN M-FILE
5
Gambar 3. Diagram hirarki objek
Root adalah objek grafik yang berhubungan dengan screen komputer. Root
tidak memiliki parent, tetapi memiliki children yaitu figure. Selanjutnya, figure
adalah suatu jendela yang dapat digunakan untuk menampilkan keluaran-keluaran
grafis. Figure memiliki children yang dapat terdiri dari axes maupun uiobject.
Uiobject sendiri merupakan kontrol-kontrol yang dapat diletakkan pada figure.
FIGURE WINDOW
Perintah figure digunakan untuk membuat suatu jendela yang di dalamnya
dapat diletakkan berbagai uiobject nantinya. Contoh source code pembuatan
figure adalah :
Figure1 = figure('unit',Figure1 = figure('unit',Figure1 = figure('unit',Figure1 = figure('unit', 'pixel','pixel','pixel','pixel', 'position','position','position','position', [250 100 800 600],[250 100 800 600],[250 100 800 600],[250 100 800 600], 'color','color','color','color', [0.1 0.2 0.3],[0.1 0.2 0.3],[0.1 0.2 0.3],[0.1 0.2 0.3],
'menubar','menubar','menubar','menubar', 'none','none','none','none', name',name',name',name', 'GUIdenganMFILE','GUIdenganMFILE','GUIdenganMFILE','GUIdenganMFILE', 'numbertitle','numbertitle','numbertitle','numbertitle', 'off','off','off','off',
'resize','resize','resize','resize', 'off','off','off','off', 'toolbar','toolbar','toolbar','toolbar', 'none');'none');'none');'none');
Penjelasan :
• Properti unit merupakan suatu properti yang digunakan untuk menentukan
skala pengukuran yang digunakan pada properti position. Nilai pixel
dipilih berarti penempatan posisi dan penskalaan figure pada screen akan
digunakan skala pixel.
RRRRootootootoot
FigureFigureFigureFigure
UiobjectUiobjectUiobjectUiobject AxesAxesAxesAxes
MEMBANGUN GUI DENGAN M-FILE
6
• Properti position digunakan untuk menentukan posisi figure pada screen.
Nilai properti adalah empat buah elemen vektor, yang masing-masing
[left, bottom, width, height]
• Properti color digunakan untuk menentukan warna figure. Nilai properti
adalah tiga buah elemen vektor, yang masing-masing [red, green, blue].
Warna figure akan ditentukan oleh percampuran dari ketiga komponen
warna tersebut. Sedangkan skala yang dapat diberikan antara 0 hingga 1.
• Properti menubar merupakan properti yang mengatur apakah menubar
standar pada figure ditampilkan atau tidak. Nilai properti dapat bernilai
‘none’ atau ‘figure’, dimana ‘none’ berarti menubar tidak ditampilkan.
• Properti name merupakan properti yang menentukan caption dari title bar
pada figure.
• Properti numbertitle merupakan properti yang mengatur penomoran figure
berdasarkan urutan kemunculannya. Jika nilai ‘on’ diberikan, maka
penomoran pada title bar akan ditampilkan.
• Properti resize merupakan properti yang mengatur apakah figure dapat
diatur ulang ukurannya. Jika nilai ‘off’, maka pengubahan ukuran dengan
mouse maupun dengan button maximize tidak dapat dilakukan
• Properti toolbar merupakan properti yang digunakan untuk mengatur
apakah toolbar standar pada figure diampilkan atau tidak. Nilai properti
bisa ‘none’ atau ‘figure’, dimana ‘none’ berarti toolbar tidak ditampilkan.
MEMBANGUN GUI DENGAN M-FILE
7
Masukkan source code tersebut pada bagian ‘initialize’ seperti pada
gambar di bawah ini :
Gambar 4. Source code pembuatan figure
Maka, setelah file dieksekusi (pada MATLAB dengan menekan tombol
F5) akan menghasilkan keluaran seperti pada gambar di bawah ini :
Gambar 5. Figure hasil running source code
MEMBANGUN GUI DENGAN M-FILE
8
UIOBJECT
Uiobject merupakan kontrol-kontrol yang dapat diletakkan di dalam
jendela figure. Komponen atau kontrol ini bisa beragam, seperti menu,
pushbutton, text, listbox dan lain sebagainya. Selanjutnya komponen-komponen
ini diperlukan untuk berinteraksi dengan program. Secara umum, uiobject dapat
terdiri dari :
• Uicontrol
• Uimenu
• Uitoolbar
• Uipanel
• Uipushtool
• Uicontextmenu
• Uibuttongroup
1. UICONTROL
Uicontrol merupakan objek yang paling dibutuhkan untuk
berinteraksi dengan program. Uicontrol berisi komponen-komponen yang
dibutuhkan untuk mendesain form sebagai media interaksi. Uicontrol
memiliki beberapa tipe dan properti. Properti-properti yang dimiliki oleh
suatu uicontrol secara umum dapat dilihat pada tabel di bawah ini.
Tabel 1. Properti-properti pada uicontrol
Properti Deskripsi Nilai
backgroundcolor warna latar belakang kontrol [R G B]
cdata citra berwarna yang ditampilkan
pada kontrol
matriks
foregroundcolor warna teks pada kontrol [R G B]
string teks yang akan ditampilkan
pada kontrol
string
MEMBANGUN GUI DENGAN M-FILE
9
visible visibilitas kontrol on, off
enable kemampuan suatu kontrol untuk
digunakan
on, off
parent menyatakan objek yang menjadi
parent dari kontrol.
figure, uipanel
style menyatakan tipe/model dari
uicontrol
pushbutton,
radiobutton,
checkbox, edit,
text, slider,
listbox,
popupmenu
tooltipstring berisi komentar tooltip dari
kontrol
string
position menyatakan posisi dari control
dalam figure
[left, bottom,
width, height]
unit bagian untuk menentukan skala
pengukuran yang digunakan
untuk meletakkan posisi dan
menentukkan ukuran control
dalam figure (berkaitan dengan
position)
pixel, inches,
centimeters,
points
fontname menyatakan jenis/nama font
yang digunakan teks pada
kontrol
“Times New
Roman”
fontsize menyatakan ukuran font ukuran font
fontweight menyatakan ketebalan dari
karakter teks
light, normal,
bold
callback menyatakan aksi yang dilakukan
oleh kontrol
fungsi
MEMBANGUN GUI DENGAN M-FILE
10
A. PUSH BUTTON
Button adalah suatu kontrol yang mengerjakan suatu aksi melalui
pemanggilan suatu prosedur atau fungsi. Contoh source code untuk
membuat push button adalah sebagai berikut :
Button1Button1Button1Button1 ==== uicontrol('unit',uicontrol('unit',uicontrol('unit',uicontrol('unit', 'pixel','pixel','pixel','pixel', 'position','position','position','position', [100 150 200 50],[100 150 200 50],[100 150 200 50],[100 150 200 50],
'foregroundcolor','foregroundcolor','foregroundcolor','foregroundcolor', [0 0 0],[0 0 0],[0 0 0],[0 0 0], 'backgroundcolor','backgroundcolor','backgroundcolor','backgroundcolor', [1 1 [1 1 [1 1 [1 1
1],1],1],1], 'style','style','style','style', 'pushbutton','pushbutton','pushbutton','pushbutton', 'fontsize','fontsize','fontsize','fontsize', 12,12,12,12, 'fontname','fontname','fontname','fontname',
'Agency FB', 'Agency FB', 'Agency FB', 'Agency FB', 'fontweight','fontweight','fontweight','fontweight', 'bol'bol'bol'bold',d',d',d', 'string','string','string','string', 'BUTTON','BUTTON','BUTTON','BUTTON',
'callback','callback','callback','callback', 'GUIdenganMFILE(1)');'GUIdenganMFILE(1)');'GUIdenganMFILE(1)');'GUIdenganMFILE(1)');
Gambar 6. Source code membuat button
Button tersebut memiliki aksi mencetak kalimat ‘CONTOH
BUTTON’ ketika dieksekusi. Dalam hal ini, button tersebut memanggil
suatu fungsi, yaitu fungsi GUIdenganMFILE dengan argumen masukan 1
(case 1).
Gambar 7. Hasil running pada command window
MEMBANGUN GUI DENGAN M-FILE
11
Gambar 8. Contoh kontrol push button
B. RADIO BUTTON
Radio button merupakan kontrol yang bekerja dengan properti
value sebagai penanda apakah suatu alternatif dipilih atau tidak. Contoh
source code untuk membuat radio button adalah sebagai berikut :
Gambar 9. Source code membuat radio button
Suatu kontrol pada MATLAB dapat dibuat menjadi objek
berindeks seperti pada bahasa pemrograman lainnya. Sehingga apabila
MEMBANGUN GUI DENGAN M-FILE
12
ingin dibuat sejumlah kontrol dengan tipe yang sama, tidak perlu
menuliskan source code program yang berulang-ulang.
Gambar 10. Contoh kontrol radio button
Gambar 11. Hasil running pada command window
C. CHECK BOX
Check box merupakan kontrol yang bekerja hampir mirip dengan
radio button. Hanya saja, sekelompok kontrol check box yang terhubung
mampu memilih lebih dari satu alternatif pada saat yang bersamaan.
Gambar 12. Contoh kontrol check box
MEMBANGUN GUI DENGAN M-FILE
13
Gambar 13. Source code membuat check box
D. EDIT
Edit merupakan kontrol yang dapat dipergunakan untuk
memberikan inputan kepada program. Pada kotak edit dapat dimasukkan
sebuah teks (string) yang selanjutnya akan diolah oleh program. Contoh
source code untuk membuat Edit adalah sebagai berikut :
Gambar 14. Source code membuat edit
MEMBANGUN GUI DENGAN M-FILE
14
Gambar 15. Contoh kontrol edit
E. TEXT
Berbeda dengan edit, text adalah kontrol yang dapat digunakan
untuk menampilkan suatu teks. Karakter atau string di dalam text tidak
dapat diubah oleh pengguna, melainkan hanya dapat ditentukan melalui
properti string.
Gambar 16. Source code membuat text
Gambar 17. Contoh kontrol text
MEMBANGUN GUI DENGAN M-FILE
15
F. SLIDER
Slider merupakan kontrol yang digunakan untuk menambah atau
mengurangi nilai suatu variabel tertentu. Kontrol slider memiliki properti
yang berbeda dengan kontrol-kontrol sebelumnya :
• min : merupakan batasan nilai terendah dari slider
• max : merupakan batasan nilai tertinggi dari slider
• value : merupakan nilai saat ini dari slider
• slider step : merupakan ukuran dari besarnya nilai pada tiap kali
slider digeser
Gambar 18. Source code membuat slider
Gambar 19. Contoh kontrol slider
MEMBANGUN GUI DENGAN M-FILE
16
G. LISTBOX
Listbox merupakan kontrol yang digunakan untuk menampung
sejumlah pilihan atau variabel nilai yang akan digunakan untuk menset
nilai sesuatu. Properti value pada listbox tidak hanya bernilai nol dan satu
saja seperti radio button maupun checkbox, melainkan memungkinkan
lebih dari satu sesuai jumlah alternatif di dalam listbox itu sendiri.
Gambar 20. Source code membuat listbox
Gambar 21. Contoh kontrol listbox
H. POPUPMENU
Popupmenu merupakan kontrol bekerja mirip dengan listbox.
Kontrol popupmenu menampilkan daftar alternatif. Popupmenu sangat
MEMBANGUN GUI DENGAN M-FILE
17
tepat bila pengguna menginginkan sejumlah alternatif ditampilkan tetapi
keberadaan kontrol di dalam figure tidak menyita banyak tempat.
Gambar 22. Source code membuat popupmenu
Gambar 23. Contoh kontrol popupmenu
MEMBANGUN GUI DENGAN M-FILE
18
2. UIMENU
MATLAB juga menyediakan fasilitas untuk membuat menu di
dalam perancangan user interface. Menu memiliki children yang disebut
dengan sub-sub menu. Sub-sub menu ini tidak akan ditampilkan sebelum
menu induk dipanggil.
Tabel 2. Properti-properti pada uimenu
Properti Deskripsi Nilai
checked indicator menu check on, off
label label menu string
foregroundcolor warna teks pada menu [R G B]
separator menambahkan mode garis
separator (pemisah)
on, off
visible visibilitas menu on, off
enable kemampuan suatu menu untuk
digunakan
on, off
parent menyatakan objek yang menjadi
parent dari menu
handel
accelerator shortcut (kombinasi penekanan
tombol) pada keyboard
karakter
callback menyatakan aksi yang dilakukan
oleh menu
fungsi
Selanjutnya, kita dapat langsung bereksperimen dengan source
code di bawah ini. Pada percobaan kali ini, source code pada pembahasan
sebelumnya dapat dihapus dari M-file atau dengan menjadikannya sebagai
komentar yang tidak akan dieksekusi oleh program. Pada MATLAB,
pemberian komentar dapat dilakukan dengan menambahkan tanda % di
depan kalimat yang akan dijadikan komentar.
% ini adalah baris komentar
% disp(‘ini adalah komentar’)
MEMBANGUN GUI DENGAN M-FILE
19
Tambahkan source code ini di bawah source code program yang
sebelumnya.
Gambar 24. Source code pembuatan uimenu bagian I
Gambar 25. Contoh uimenu pada figure
Pada bagian di atas, kita hanya sekedar mencoba untuk membuat
tampilan menu tanpa adanya pemanggilan aksi di dalamnya. Pada bagian
selanjutnya, kita akan mencoba bagaimana memberikan aksi pada
komponen sub menu, yaitu dengan menggunakan properti ‘callback’.
Selanjutnya, tambahkan source code ini di bawah source code
program yang sebelumnya.
MEMBANGUN GUI DENGAN M-FILE
20
Gambar 26. Source code pembuatan uimenu bagian II
Gambar 27. Contoh pemanggilan aksi pada menu
3. UITOOLBAR
Uitoolbar merupakan bagian dari uiobject yang berfungsi untuk
meletakkan komponen-komponen children yang juga merupakan bagian
dari uiobject, yaitu uipushtool. Parent dari uitoolbar sendiri adalah figure
window.
Selanjutnya, tambahkan source code berikut ini pada program.
MEMBANGUN GUI DENGAN M-FILE
21
Gambar 28. Source code pembuatan toolbar
Gambar 29. Sebuah toolbar baru telah ditambahkan
Toolbar baru yang telah ditambahkan ke dalam figure ini belum
memiliki komponen-komponen di dalamnya. Oleh karena itu, pada
pembahasan selanjutnya akan dibahas mengenai uipushtool yang
merupakan komponen-komponen yang dapat ditambahkan ke dalam
toolbar tersebut.
4. UIPUSHTOOL
Seperti yang telah dibahas pada bagian sebelumnya, uipushtool
merupakan komponen-komponen yang dapat diletakkan pada toolbar.
Uipushtool memiliki parent suatu toolbar.
MEMBANGUN GUI DENGAN M-FILE
22
Tabel 3. Properti-properti pada uipushtool
Properti Deskripsi Nilai
cdata citra berwarna yang ditampilkan
pada uipushtool
array m×n×3
separator menambahkan mode garis
separator (pemisah)
on, off
visible visibilitas uipushtool on, off
enable kemampuan suatu uipushtool
untuk digunakan
on, off
parent menyatakan objek yang menjadi
parent dari uipushtool
uitoolbar
tooltipstring berisi komentar tooltip dari
uipushtool
string
clickedcallback menyatakan aksi yang dilakukan
oleh uipushtool
fungsi handel
Source code di bawah ini akan menambahkan tiga uipushtool baru
ke dalam toolbar. Oleh karena itu, P.toolbar diset sebagai parent dari
ketiganya.
Gambar 30. Source code pembuatan uipushtool
MEMBANGUN GUI DENGAN M-FILE
23
Gambar 31. Tiga buah uipushtool ditambahkan ke toolbar
Perlu diingat bahwa icon yang ditampilkan pada uipushtool tidak
serta merta muncul begitu saja. Oleh karena itu, kita harus terlebih dahulu
membuat citra berektensi .png. Untuk ukuran citra bisa diset 25×25 pixel.
Apabila ukuran yang dipakai lebih besar, maka uipushtool hanya akan
menampilkan sebagian area saja dari citra.
Gambar 32. Tiga buah citra berekstensi .png
Pada bagian sebelumnya, uipushtool yang dibuat belum memuat
aksi yang mampu mengerjakan sekumpulan perintah program. Pada
pembahasan ini, akan dibuat sekumpulan uipushtool yang akan melakukan
aksi mencetak isi dari tooltipstring ke layar berdasarkan indeksnya.
MEMBANGUN GUI DENGAN M-FILE
24
Komponen pushtool yang dibuat merupakan obyek berindeks.
Fungsi gcbo disini adalah mengembalikan kendali objek mana yang
sedang mengeksekusi properti callback. Selanjutnya, tambahkan source
code berikut ini ke dalam program.
Gambar 33. Contoh pemanggilan aksi yang dilakukan uipushtool
Gambar 34. Tampilan uipushtool yang dibuat
Ketika salah satu dari sekumpulan pushtool ditekan, maka pada
command window akan dicetak properti tooltip komponen tersebut.
tooltiptooltiptooltiptooltip
MEMBANGUN GUI DENGAN M-FILE
25
Gambar 35. Tampilan command window saat runtime
5. UIPANEL
Uipanel digunakan untuk mengelompokkan sejumlah komponen-
komponen yang terdapat di dalamnya. Parent dari uipanel umumnya
adalah figure atau uipanel sendiri. Apabila parent dari suatu uipanel adalah
uipanel, maka uipanel tersebut bisa dikatakan merupakan sub panel dari
main panel yang berlaku sebagai parentnya.
Tabel 4. Properti-properti pada uipanel
Properti Deskripsi Nilai
backgroundcolor Merupakan warna latar
belakang dari uipanel
[R G B]
bordertype jenis border yang mengelilingi
uipanel
none, etchedin,
etchedout,
beveledin,
beveledout,
line
borderwidth nilai ketebalan dari border integer
foregroundcolor menyatakan warna teks pada
uipanel
[R G B]
shadowcolor menyatakan warna bayangan
border pada frame 3D
[R G B]
highlightcolor menyatakan warna border pada
frame 3D
[R G B]
parent menyatakan objek yang menjadi figure, uipanel
MEMBANGUN GUI DENGAN M-FILE
26
parent dari uipanel
position menyatakan posisi dari uipanel
pada objek parent
[left bottom
width height]
unit menyatakan penskalaan pada
properti position
pixel, inches,
centimeters,
points,
normalized
fontname menyatakan jenis font string
fontsize menyatakan ukuran font integer
fontweight menyatakan ketebalan font light, normal,
demi, bold
title menyatakan judul/caption pada
uipanel
string
titleposition menyatakan penempatan posisi
judul uipanel
lefttop,
centertop,
righttop,
leftbottom,
centerbottom,
rightbottom
Selanjutnya, tambahkan source code di bawah ini.
Gambar 36. Source code uipanel
MEMBANGUN GUI DENGAN M-FILE
27
Gambar 37. Hasil running program
6. UIBUTTONGROUP
Uibuttongroup digunakan untuk mengelompokkan komponen-
komponen dan mengatur seleksi yang bersifat eksklusif seperti yang
terdapat pada komponen radio button. Uibuttongroup mampu menampung
komponen-komponen lain seperti axes, uipanel, uibuttongroup.
Tabel 5. Properti-properti pada uibuttongroup
Properti Deskripsi Nilai
backgroundcolor merupakan warna latar belakang
dari uibuttongroup
[R G B]
bordertype jenis border yang mengelilingi
uibuttongroup
none, etchedin,
etchedout,
beveledin,
beveledout,
line
borderwidth nilai ketebalan dari border integer
foregroundcolor menyatakan warna teks pada
uibuttongroup
[R G B]
shadowcolor menyatakan warna bayangan
border pada frame 3D
[R G B]
highlightcolor menyatakan warna border pada [R G B]
MEMBANGUN GUI DENGAN M-FILE
28
frame 3D
parent menyatakan objek yang menjadi
parent dari uibuttongroup
figure, uipanel,
uibuttongroup
position menyatakan posisi dari
uibuttongroup pada objek
parent
[left bottom
width height]
unit menyatakan penskalaan pada
properti position
pixel, inches,
centimeters,
points,
normalized
fontname menyatakan jenis font string
fontsize menyatakan ukuran font integer
fontweight menyatakan ketebalan font light, normal,
demi, bold
title menyatakan judul/caption pada
uibuttongroup
string
Selanjutnya, tambahkan source code di bawah ini.
Gambar 38. Source code penggunaan uibuttongroup
MEMBANGUN GUI DENGAN M-FILE
29
Gambar 39. Hasil running penggunaan uibuttongroup
Bandingkan hasil running penggunaan kontrol radiobutton dengan
uibuttongroup dengan yang tanpa uibuttongroup. Penggunaan
uibuttongroup mampu menangani seleksi yang bersifat eksklusif, artinya
tidak akan terjadi pemilihan lebih dari satu alternatif pada radio button
yang terkoneksi.
Pemberian aksi juga tidak lagi ditempatkan pada kontrol
radiobutton lewat properti callback seperti biasanya, melainkan melalui
properti SelectionChangeFcn pada uibuttongroup.
7. UICONTEXTMENU
Uicontextmenu merupakan komponen yang digunakan untuk
membuat menu konteks. Menu konteks merupakan menu yang
ditampilkan pada saat user melakukan klik kanan pada objek yang
dimaksud.
Tabel 6. Properti-properti pada uicontextmenu
Properti Deskripsi Nilai
visible visibilitas uicontextmenu on, off
parent menyatakan objek yang menjadi
parent dari uicontextmenu
figure, uipanel,
uibuttongroup
MEMBANGUN GUI DENGAN M-FILE
30
position menyatakan lokasi
uicontextmenu pada saat
ditampilkan.
[0 0]
callback aksi yang dilakukan
uicontextmenu
fungsi
Selanjutnya, tambahkan source code di bawah ini.
Gambar 40. Source code penggunaan uicontextmenu
Gambar 41. Hasil running penggunaan uicontextmenu
MEMBANGUN GUI DENGAN M-FILE
31
AXES
Perintah axes di dalam MATLAB digunakan untuk menciptakan sumbu
dari objek-objek grafis. Dalam penggunaannya, axes selalu berhubungan dengan
grafis, baik 2D maupun 3D.
Tabel 8. Properti-properti pada axes
Properti Deskripsi Nilai
box menyatakan apakah mode box
pada axis ditampilan atau tidak
on, off
gridlinestyle menyatakan model garis yang
digunakan untuk menggambar
grid-grid pada axis
- , -- , : , -. ,
none
linewidth menyatakan nilai ketebalan dari
garis axis (penskalaan dalam
point)
0.5
visible menyatakan visibilitas axis on, off
xgrid, ygrid, zgrid menyatakan apakah garis-garis
grid pada axis ditampilkan atau
tidak
on, off
parent menyatakan objek yang menjadi
parent dari axis
figure, uipanel
position menyatakan posisi dari axis
pada objek parent
[left bottom
width height]
unit menyatakan penskalaan pada
properti position
pixel, inches,
centimeters,
points,
normalized
fontname menyatakan jenis font string
fontsize menyatakan ukuran font integer
fontweight menyatakan ketebalan font light, normal,
MEMBANGUN GUI DENGAN M-FILE
32
demi, bold
color menyatakan warna latar
belakang dari axis
[R G B]
xcolor, ycolor,
zcolor
menyatakan warna dari garis
axis
[R G B]
Selanjutnya, tambahkan source code di bawah ini.
Gambar 42. Source code penggunaan axes
Gambar 43. Hasil running program
MEMBANGUN GUI DENGAN M-FILE
33
CONTOH KASUS
Pada bagian ini, Anda sekalian diajak untuk mempraktekkan sendiri apa
yang telah dipelajari pada bagian-bagian sebelumnya. Contoh kasus yang diambil
penulis adalah membuat aplikasi sederhana yang dapat dipergunakan untuk
mengolah citra. Berikut di bawah ini adalah lampiran source code lengkap
pembuatan aplikasi tersebut.
Bagian Pembuatan Fungsi dan Figure
Bagian Pembuatan Menu
MEMBANGUN GUI DENGAN M-FILE
34
Bagian Pembuatan Toolbar
Bagian Pembuatan Panel dan Axes
Bagian Pembuatan Kontrol
MEMBANGUN GUI DENGAN M-FILE
35
Bagian Pembuatan Preferences dan Info
Bagian Main Menu
MEMBANGUN GUI DENGAN M-FILE
36
MEMBANGUN GUI DENGAN M-FILE
37
MEMBANGUN GUI DENGAN M-FILE
38
MEMBANGUN GUI DENGAN M-FILE
39
MEMBANGUN GUI DENGAN M-FILE
40
TAMPILAN APLIKASI
Untuk membuat aplikasi tersebut, terlebih dahulu dibutuhkan sebuah file
berekstensi *.MAT yang berisi ikon-ikon yang dipergunakan dalam pembuatan
aplikasi. File beserta dengan source codenya dapat di download pada alamat di
bawah ini :
File *.MAT : http://www.4shared.com/file/ZwSFJyvc/GUIDE.html
M-FILE : http://www.4shared.com/file/lRjVapMP/IMG.html
Hal-hal lebih lanjut mengenai tutorial ini, dapat menghubungi penulis pada
alamat email berikut : [email protected]
MEMBANGUN GUI DENGAN M-FILE
41
REFERENSI
[1] Abdia Away, Gunaidi. 2010. The Shortcut of MATLAB Programming.
Bandung: Informatika.
[2] MATLAB 7.0 Help
BIOGRAFI PENULIS
Nama : Chandra Kurniawan
Tempat Lahir : Tulungagung
Tanggal Lahir : 22 Maret 1990
Alamat : Jl. Ir. H. Juanda V/2407 Malang
E-mail : [email protected]
Pendidikan : - SLPTK Santa Maria II Malang
- SMAK Santa Maria Malang
- S1 Institut Teknologi Nasional
Malang Teknik Informatika