TUGAS PEMROGRAMAN KOMPUTER

RISKA SRI HIDAYANTI

14302241052
PENDIDIKAN FISIKA A 2014

GUI DALAM MATLAB

A. Pengertian GUI
GUIDE atau GUI builder merupakan sebuah graphical user interface (GUI)
yang dibangun dengan obyek grafik seperti tombol (button), kotak teks, slider, menu
dan lain-lain. Aplikasi yang menggunakan GUI umumnya lebih mudah dipelajari dan
digunakan karena orang yang menjalankannya tidak perlu mengetahui perintah yang
ada dan bagaimana kerjanya.
GUIDE Matlab mempunyai kelebihan tersendiri dibandingkan dengan bahasa
pemrogram lainnya, diantaranya:
1) GUIDE Matlab banyak digunakan dan cocok untuk aplikasi-aplikasi berorientasi
sains, sehingga banyak peneliti dan mahasiswa menggunakan GUIDE Matlab
untuk menyelesaikan riset atau tugas akhirnya.
2) GUIDE Matlab mempunyai fungsi built-in yang siap digunakan dan pemakai tidak
perlu repot membuatnya sendiri.
3) Ukuran file, baik FIG-file maupun M-file, yang dihasilkan relatif kecil.
4) Kemampuan grafisnya cukup andal dan tidak kalah dibandingkan dengan bahasa
pemrograman lainnya.

B. Komponen – komponen GUI

Toolbar adalah berisi ikon-ikon yang meliputi:

1. New : berfungsi untuk membuka lembar kerja GUI

2. Open : berfungsi untuk membuka file GUI Matlab yang sudah tersimpan
3. Save : berfungsi untuk menyimpan file GUI Matlab yang telah dibuat
4. Cut : berfungsi untuk menghapus komponen GUI, dan dapat disalin kembali
(mengembalikan)
5. Align Object : berfungsi untuk merapikan beberapa komponen GUI
6. Menu editor : ada dua menu, yaitu: menu bar berfungsi membuat menu pada
fingure yang bersangkutan dan context menu akan berfungsi menampilkan jika
pengguna meng klik kanan mouse pada komponen menu yang didefinisikan
7. M-file editor : berfungsi untuk menuliskan script program GUI pada m-file editor
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

8. Property Inspector: berfungsi membuka properti suatu komponen GUI yang

dibuat
9. object Browser : berfungsi menampilkan daftar urutan komponen GUI pada
figure
10. Run : berfungsi untuk menjalankan program GUI yang sudah selesai dibuat.

1. Selector
Fungsinya sama seperti kursor
2. Push Button
Push Button biasa digunakan untuk menjalankan fungsi yang akan dieksekusi.
Saat GUI dijalankan, Push Button di klik untuk menjalankan fungsi tertentu.
3. Radio Button
Radio button digunakan untuk memilih atau menandai pilihan dari beberapa
pilihan yang ada (bisa lebih dari satu seperti Check Box).
4. Edit Text
Edit Text biasa digunakan untuk input data yang dimasukkan ke dalam program.
5. Pop-up Menu
Pop-up Menu biasa digunakan untuk menu atau pilihan.Biasanya diisi lebih dari 1
pilihan.
6. Toggle Button
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Toggle button memiliki fungsi yang sama dengan pushbutton. Perbedaannya

adalah saat pushbutton ditekan, maka tombol akan kembali pada posisi semula
jika tombol mouse dilepas, sedangkan pada toggle button, tombol tidak akan
kembali ke posisi semula, kecuali kita menekannya kembali.
7. Axes
Axes berfungsi menampilkan grafik atau gambar (image). Axes tidak masuk
dalam UIControl, tetapi dapat diprogram agar pemakai dapat berinteraksi dengan
axes dan obyek grafik yang ditampilkan melalui axes.
8. Button Group
Menyatukan beberapa radio button. Jika salah satu radio button dipilih, yang lain
otomatis dikosongi.
9. Slider
Slider berfungsi memberi input nilai tanpa menggunakan keyboard, kita dapat
mengatur sendiri nilai maksimum, minimum, serta sliderstep. Caranya dengan
menggeser slider secara vertical maupun horizontal ke nilai yang diinginkan. Nilai
default slider adalah 0 sampai 1.
10. Check Box
Check Box berfungsi menyediakan beberapa pilihan mandiri atau tidak
bergantung dengan pilihan-pilihan lainnya.
11. Static Text
Static Text biasa digunakan untuk memberi keterangan pada GUI. Bisa juga
digunakan untuk menampilkan output.
12. Listbox
Mirip dengan Pop-up Menu tetapi daftar menu ditampilkan dalam bentuk list.
13. Table
Table berfungsi menampilkan tabel di GUI matlab.
14. Panel
Panel biasa digunakan sebagai background atau tempat mendesain GUI. Bisa juga
untuk mengelompokan.
15. ActiveX Control
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

C. Prosedur pembuatan GUI

Langkah dasar yang harus dikerjakan dalam membuat GUI adalah :
1) Mengatur layout komponen GUI
Setelah kita membuka GUIDE Matlab dan telah menentukan template GUI,
langkah selanjutnya adalah adalah mendesai figure dengan menggunakan
komponen palet sesuai dengan kebutuhan, seperti p ushbutton, radiobutton,
chexkboxes, edit text, static text, slider, frames, popup menu, axes, dan sebagainya.
Selanjutnya kita dapat mengatur layout masing-masing komponen, baik
string(caption), font, color, size, dan sebagainya menggunakan property inspector.
Jika kita telah selesai mendesain, jangan lupa untuk menyimpan file figure yang
secara default akan memiliki ekstensi *.fig. Dari sini, matlab secara otomatis akan
membuatkan sebuah m-file dengan nama yang sama, yaitu file berekstensi *.m.

2) Memprogram Komponen GUI

M-file yang telah dibuat pada langkah sebelumnya, akan otomatis terbuka dan kita
harus menulis programnya agar komponen kontrol dapat bekerja secara simultan.
Untuk membuat program dalam m-file kita cukup memperhatikan fungsi-fungsi
matlab bertanda callback dimana perintah disispkan.

Dari langah-langkah dasar diatas, secara sederhana sebenarnya GUI Matlab dibentuk
oleh dua buah file, yaitu fig-file dan m-file.

D. Meng-handle komponen-komponen GUI

Agar komponen GUI yang berupa user interface control (uicontrol) dapat bekerja sesuai
dengan keinginan maka harus memprogram masing-masing komponen. Kita dapat
memprogram komponen GUI dengan mengatur secara fisik komponen dari property
inspector serta menambahkan beberapa kode matlab pada m.file

 Contoh penggunaan pushbutton

Dalam memprogram pushbutton, kita perlu memikirkan apa yang akan dilakukan atau
efek apa yang terjadi jika sebuah pushbutton ditekan. Misalnya, kita akan
menampilkan tulisan ‘Hallo Saya sedang belajar Matlab…’ pada figure jika pushbutton
‘Tampil’ ditekan. Hal yang harus dilakukan adalah :
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

1. Bukalah sebuah figure dan buatlah sebuah pushbutton.

2. Atur property string dengan ‘Tampil’ dan property tag ‘button_tampil’

3. Buatlah sebuah static text dan tempatkan di sebelah kanan button ‘Tampil’

4. Atur property dengan mengosongkan tab string

5. Simpan dengan nama Tampilan

6. Setelah disimpan maka akan muncul tampilan m.file nya

7. Pada m.file tambahkan kode berikut :

% --- Executes on button press in button_tampil.

function button_tampil_Callback(hObject, eventdata, handles)
% hObject handle to button_tampil (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
set(handles.text1,'String','Hallo Saya sedang belajar Matlab...');
Kita dapat melihat bahwa yang perlu ditambah hanya pada
function button_tampil_Callback(hObject, eventdata, handles).
Karena melalui callback inilah kita akan meminta Matlab menampilkan tulisan ‘ Hallo
Saya sedang belajar Matlab…’ pada figure jika kita menekan button ‘Tampil’ dengan
perintah
set(handles.text1,'String','Hallo Saya sedang belajar Matlab...');
lebih lanjut, nama callback pada fungsi diambil dari tag property yaitu button_tampil.
Dengan demikian,jika dijalankan akan diperoleh hasil :
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Gambar 5. Tampilan aplikasi Hallo Saya sedang belajar Matlab

 Contoh membuat program penjumlahan sederhana
1. Buatlah objek dengan rincian sebagai berikut : 3 buah static text, 3 buah edit text
dan 1 buah push button seperti pada gambar 4

2. Pada tag dari object diberi nama :

a. Edit text : edit_text_1,edit_text_2 dan hasil

b. Push button : hitung

Gambar 6. Desain dan Tampilan GUI

 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Perintah operasi penjumlahan adalah :

Angka_Pertama=str2double(get(findobj(gcf,'Tag','edit_text_1'),'String
'));
Angka_Kedua=str2double(get(findobj(gcf,'Tag','edit_text_2'),'String')
);
hasil=angka_pertama+angka_kedua;
disp(hasil);
%Menampilkan Hasil Penjumlahan pada edit text
set(findobj(gcf,'Tag','hasil'),'String',hasil);
Memanipulasi M-File
1. Setelah terbuat desain tersebut selanjutnya lakukan manipulasi terhadap objek

2. Pada Matlab, masukan yang diisikan pada edit text akan dilihat sebagai
karakter/string

3. Perlu dilakukan konversi terlebih dahulu ke dalam tipe data numeric

Callback merupakan aktifitas yang akan dilakukan apabila suatu objek dikenai
pekerjaan. Biasa disebut dengan event. Sebagai contoh callback dari push button
adalah ketika diklik

Gambar 7. Menampilkan Callback

 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Gambar 8. M.File
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Gambar 9. Hasil Penjumlahan

E. Penerapan GUI Matlab dalam fisika

 Contoh penerapan GUI dalam Matlab untuk materi Fisika adalah salah satunya
Gerak Parabola, dan berikut cara untuk membuat GUI Matlab materi gerak
parabola :
Untuk membuat GUI gerak parabola. Maka pertama kita mengetikan "guide"
dicommond windows. sehingga muncul tampilan seperti dibawah ini:
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Selanjutnya Klik ok. Kemudian pilih button group untuk membuat tampilan input dan
output. Sehingga tampilanya seperti berikut:

Selanjutnya klik ststistic Text dan rubah inputan dan output di variable string. maka
tampilanya seperti dibawah ini:

Selanjutnya klik edit text. Kemudian untuk kolom string kita kosongkan semuanya.
Nah disini kita akan membuat callback program. untuk kec_awal pada kolom Tag kita
isi dg v0, untuk sudut pada kolom Tag kita isi dg sudut, untuk waktu pada kolom Tag
kita isi dg waktu, untuk gravitasi pada kolom Tag kita isi dg gravitasi, untuk kec_akhir
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

pada kolom Tag kita isi dg velocity, untuk x pada kolom Tag kita isi dg px, untuk y
pada kolom Tag kita isi dg py, untuk xmax pada kolom Tag kita isi dg xmax dan untuk
ymax pada kolom Tag kita isi dg ymax. maka tampilanya seperti berikut:

Kemudian selanjutnya klik axes. kemudian ganti axes1 menjadi grafik pada kolom Tag.
Seperti tampilan dibawah ini:

Kemudian selanjutnya klik pushbutton. buat dua pushbutton. satu untuk hitung satu
lagi untuk exit. Untuk pushbutton pertama kita ubah string sama tag dengan kata
hitung. begitu juga exit: Untuk Tampilan bisa dilihat seperti dibawah ini:

Setelah beres. Kemudian klik Run untuk mejalankan sistem. Kemudian save. setelah
itu hasil GUI anda close. kemudian anda masukan source code pada function
Hitung_Callback(hObject, eventdata, handles) sebagai berikut:

proyek=guidata(gcbo);

v0=str2double(get(proyek.v0,'String'));

sudut=str2double(get(proyek.sudut,'String'));
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

waktu=str2double(get(proyek.waktu,'String'));

gravitasi=str2double(get(proyek.gravitasi,'String'));

v0x=v0*cos(sudut*pi/180);

v0y=v0*sin(sudut*pi/180);

vy=v0y-gravitasi*waktu;

tx=2*v0*sin(sudut*pi/180)/gravitasi;

if (waktu>tx)

msgbox('waktu melebihi maksimal,inputkan nilai waktu yang lain');

else

v=sqrt(v0x^2+vy^2);

set(proyek.velocity,'String',num2str(v));

x=v0x*waktu;

y=v0y*waktu-0.5*gravitasi*(waktu^2);

tinggi=v0^2*((sin(sudut*pi/180))^2)/(2*gravitasi);

jauh=v0^2*sin(2*sudut*pi/180)/gravitasi;

set (proyek.py,'String',num2str(y));

set (proyek.px,'String',num2str(x));

set(proyek.ymax,'String',num2str(tinggi));

set(proyek.xmax,'String',num2str(jauh));

xx=0:x;

yy=xx*(tan(sudut*pi/180))-0.5*gravitasi*(xx.^2)/(v0*cos(sudut*pi/180))^2;

for i=1:x

axes(handles.grafik);
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

plot(xx(i),yy(i),'*','linewidth',2);

axis([0 (jauh+5) 0 (tinggi+5)]);

grid on

pause(0.01);

end

axes(handles.grafik);

plot(xx,yy,'*','linewidth',2);

axis([0 (jauh+5) 0 (tinggi+5)]);

grid on

end

Setelah memasukan source code tersebut. kemudian anda Run source code tersebut
pada file editor. Sehingga muncul tampilan

Selanjutnya kita isi input sesuai yang kita inginkan. Kemudian kita klik Hitung maka
akan muncul tampilan seperti ini:
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

Dan juga masih banyak lagi penerapan GUI Matlab dalam bidang Fisika, seperti :
membuat konversi suhu, menghitung jarak, gerak vertikal, GLB, GLBB, GJB,
pembentukan gelombang dan superposisi, menghitng gerak melingkar dan masih
banyak lagi.
 TUGAS PEMROGRAMAN KOMPUTER
RISKA SRI HIDAYANTI
14302241052
PENDIDIKAN FISIKA A 2014

DAFTAR PUSTAKA
https://teuinsuska2009.files.wordpress.com/2010/10/modul-guideuploder-by-teuinsuska2009-
wordpress-com.pdf diakses Rabu, 24 Mei 2017 pukul 11.27 WIB.

http://staff.uny.ac.id/sites/default/files/pengabdian/sri-andayani-ssi-mkom/pembuatan-gui-dengan-
matlab.pdf diakses Rabu, 24 Mei 2017 pukul 11.38 WIB.

https://www.scribd.com/document/276415947/modul-matlab-pdf diakses senin, 29 Mei 2017 pukul

11.57 WIB

https://www.scribd.com/doc/69823731/Membuat-Design-Program-Aplikasi diakses selasa, 30 Mei

2017 pukul 21.44 WIB