Pemrograman Aplikasi Visual C

This watermark does not appear in the registered version - http://www.clicktoconvert.
com
BAB 1: Pemrograman Aplikasi Visual C++

Visual C++ adalah compiler yang dapat digunakan untuk membuat program
aplikasi berbasis Windows dengan cepat karena telah tersedianya tools yang disebut
AppWizard. Dengan tools yang efektif ini maka programmer akan dapat menghasilkan
program yang professional seperti halnya programmer yang berpengalaman, seperti
melakukan pengaturan jendela program, menampilkan menu, membuat isian, dan
menampilkan kontrol-kontrol obyek lainnya seperti command button, combo box, list
box, slider dan lain- lain.
1.1 Tools AppWizard

Untuk membuat bermacam aplikasi dapat digunakan tools AppWizard, terutama
program yang dapat dijalankan secara langsung seperti file *.exe, dengan AppWizard
juga dapat menghasilkan source program, seperti klas, obyek dan fungsi. Agar hal
tersebut terwujud maka dapat dilakukan langkah-langkah sebagai berikut:
ü Jalankan Visual C++

ü Klik pada menu File, klik New dan klik tab Project pada kotak dialog
New seperti pada Gambar 1.1 dibawah ini.
Gambar 1.1 Kotak dialog New
ü Pilih MFC AppWizard (exe)

ü Isilah nama proyek pada kotak edit Project name: proyekku
ü Isilah direktori tempat menyimpan proyek tersebut: C:\Student\Sigwa
ü Klik OK
AppWizard akan menuju ke langkah berkutnya yaitu Step-1 dan seterusnya, setiap
langkah terdapat pilihan yang harus dipilih guna menentukan bentuk aplikasi yang akan
dibuat dan pendukungnya, seperti berbasis MDI, SDI atau Dialog.
1
This watermark does not appear in the registered version - http://www.clicktoconvert.com
1.2 Tipe Aplikasi

Ada 3 tipe aplikasi yang dapat dipilih yaitu:
ü Aplikasi SDI (Single document interface), seperti Notepad, hanya mempunyai
satu bukaan dokumen pada saat yang sama. Pada saat File, Open dipilih file yang
dibuka ditutup sebelum membuka file yang baru.
ü Aplikasi MDI (Multiple document interface), seperti Exel atau Word, dapat
membuka banyak dokumen (umumnya file) pada saat yang sama. Terdapat menu
Jendela dan item Close pada menu File. Bila ingin melihat tampilan banyak pada
suatu dokumen tunggal, maka harus dipilih aplikasi MDI.
ü Aplikasi dialog-based, seperti utilitas Character Map pada Windows, tidak
mempunyai dokumen sama sekali dan tidak ada menu. Pada Windows XP, dapat
diklik Start, Accessories, System Tools, Character Map.
1.3 Tipe Aplikasi Berbasis Dialog

Tipe aplikasi ini dipilih karena bentuknya sederhana dan mudah bagi pemula untuk
mempelajarinya, meskipun tidak mendukung adanya akses basis data ataupun gabungan
dokumen. Pada langkah pertama pilih Dialog based seperti Gambar 1.2 dibawah.
Gambar 1.2 Langkah 1 Pilihan Tipe Aplikasi
Selanjutnya klik next untuk melanjutkan ke langkah berikutnya, yaitu menentukan

fitur-fitur yang akan disertakan pada dialog. Bila diinginkan item About seperti pada
system menu, maka dapat dipilih item About Box. Untuk menambah tombol help maka
dapat dipilih Context-sensitive Help. Sedangkan pada pilihan ketiga adalah 3D Control,
seharusnya dipilih untuk aplikasi Windows 95 atau NT. Bila diinginkan aplikasi tersebut
dibawah aplikasi lain maka pilih check box Automation. Bila aplikasi berisi control
ActiveX maka pilih check box Active X Controls. Bila aplikasi direncanakan bekerja
dibawah Internet dengan sokets, pilihkah kotak Windows Sokets, setelah pilihan
ditentukan maka klik Next untuk pindah ke langkah selanjutnya, seperti Gambar 1.4.
2
Gambar 1.3 Langkah 2 Pilihan Fitur-fitur yang diinginkan
Gambar 1.4 Langkah 3 Pilihan Pustaka MFC
Pada langkah dibawah dapat dilakukan pengubahan nama-nama AppWizard

untuk file dan kelas. Tapi ide ini jarang dilakukan karena akan membingungkan orang
yang merawat program bila nama file tidak mudah dibedakan dari nama kelas dan
sebaliknya. Bila telah terlanjur menggunakan nama yang tidak baik atau kurang sesuai
sebaiknya menggunakan Back untuk kembali ke dialog Workspace Proyek baru, ubah
nama, dan klik Create, dan menggunakan Next untuk kembalik ke dialog ini. Klik Finish
3
untuk melihat ringkasan dari file dan kelas yang akan dibuat, serupa pada Gambar 1.5
dibawah ini.
Gambar 1.5 Langkah 4 Pilihan Namafile dan Namakelas
Gambar 1.6 Konfirmasi Nama-nama file sebelum dilakukan pembuatan
4
Bila informasi diatas ada yang tidak disetujui maka klik Cancel untuk kembali
kelangkah sebelumnya, betulkan dan kembali ke langkah ini. Klik OK setelah disetujui,
maka aplikasi akan dibuat, yaitu tersedianya dialog kosong. Untuk mencoba dialog ini
maka klik Build kemudian Run, maka akan ditampilkan seperti pa d a Gambar 1.7
dibawah ini.
Gambar 1.7 Tampilan awal dialog kosong “Dialogku”
Gambar 1.8 Toolbox Controls yang menyertai dialog kosong “Dialogku”
5
1.4 Icon-icon pada ToolBox Control

Untuk memahami kegunaan dari Toolbox Control maka berikut ini akan diberikan
penjelasan singkat mengenai masing- masing dari Icon didalam ToolBox Control.
Icon Select
Digunakan untuk mengubah penunjuk mouse menjadi normal (tidak memilih
salah satu dari icon. Sehingga penunjuk mouse dapat digunakan untuk memilih pilihan
menu lainnya.
Icon Picture
Digunakan untuk meletakkan obyek gambar ke dialog, sehingga pengguna dapat
menampilkan gambar didalam dialog.
Icon Static Text

Dengan pilihan obyek ini maka memungkinkan pengguna dapat menampilkan
komentar yang berupa teks didalam dialog.
Icon Edit Box

Untuk mendapatkan masukan data dari keyboard, disamping itu Kotak Edit dapat
digunakan untuk menampilkan keluaran/ hasil data, baik secara satu baris (single line)
atau beberapa baris tampilan (scroll).
Icon Group Box

Digunakan untuk mengelompokkan beberapa obyek yang sama menjadi satu
grup, sehingga membuat tampilan lebih teratur dan lebih rapi.
Icon Button
Obyek tombol ini sering digunakan karena aksi yang dilakukan didalam dialog
biasanya dilakukan dengan penekanan suatu tombol, yaitu untuk menjalankan aksi yang
diinginkan
Icon Check Box

Kotak Check atau Check Box digunakan bila terdapat beberapa pilihan masukan
data dan dapat dipilih semuanya, misalkan data tentang hobby, data menu makanan serta
minuman.
Icon Radio Button

Tombol Radio atau Radio Botton digunakan bila terdapat beberapa pilihan tetapi
hanya satu pilihan saja yang harus dipilih, misalkan data kota kelahiran, jenis kelamin,
umur dan pilihan jurusan.
6
Icon Combo Box

Digunakan bila ada beberapa item pilihan tetapi hanya satu saja yang dapat
dipilih, item pilihan dapat diganti, ditambah atau dihapus. Pilihan yang tidak dipilih dapat
disembunyikan sehingga hanya item pilihan yang dipilih yang ditampilkan.
Icon List Box

Fungsinya hampir sama dengan Kotak Combo atau Combo Box, List Box atau
Kotak List
Icon Horizontal Scroll Bar

Untuk membuat obyek scroll secara mendatar, obyek ini biasanya digabung
dengan Kotak Edit. Sedangkan disini digunakan secara terpisah.
Icon Vertical Scroll Bar

Untuk membuat obyek scroll secara menurun, obyek ini biasanya digabung
dengan Kotak Edit, Kotak Combo atau Kotak List. Sedangkan disini digunakan secara
terpisah.
Icon Progress
Pada suatu proses program perulangan yang sedang berjalan lama, maka tidak
dapat diketahui sejauh mana program looping tersebut dikerjakan. Dengan penggunaan
obyek Progress maka dapat diperkirakan selesainya proses perulangan tersebut, karena
proses yang telah dikerjakan akan ditampilkan pada obyek Progress.
Icon Slider
Digunakan bila masukan adalah berupa perkiraan angka yang dilakukan dengan
penekanan tombol mouse, sehingga pengguna lebih mudah memasukkan perkiraan angka
yang diinginkan. Seperti setting perpaduan warna RGB.
Icon Tab Control

Membuat dialog menjadi beberapa bagian tampilan yang terpisah, sehingga
pengguna dapat memilih tampilan mana yang diinginkan berdasarkan pilihan menu tab.
Icon IP address
Untuk menampilkan data Alamat IP dengan format titik.
Icon Month Calendar

Untuk menampilkan calendar.
Icon Date Time Picker

Untuk menampilkan tanggal dan jam.
7
BAB 2: Kotak Edit, Tombol Radio dan Kotak Cawang

Suatu alasan pembuatan program aplikasi berbasis dialog adalah dikarenakan
bahwa, umumnya setiap program yang dibuat memerlukan masukkan (input) dari user,
sehingga aplikasi berbasis dialog adalah yang paling tepat untuk digunakan disini.
Berikut ini akan diberikan bermacam masukan (controls) yang telah disediakan oleh
Visual C++ secara default. Untuk dapat membuat masukkan bagi program maka telah
disediakan obyek yang disebut control dimana sudah dikumpulkan pada satu toolbox
dengan icon yang bersesuaian dengan kegunaannya, seperti Gambar 1.8 pada bab
sebelumnya. Dengan obyek-obyek tersebut maka programmer akan dapat dengan mudah
memilih tipe masukan yang diinginkan, seperti kotak edit, tombol radio, kotak check,
tombol aksi, scroll bar, slider dan lain sebagainya. Berikut ini akan dibahas satu persatu
mengenai penggunaan dari obyek-obyek control tersebut.
2.1 Kotak Edit Control

Kotak edit control adalah obyek yang sering digunakan karena bentuknya yang
sederhana, dimana pengguna sudah terbiasa dengan tipe masukkan data seperti ini.
Karena tipe masukan seperti ini sudah ada pada pemrograman sebelum windows ada.
Dengan tipe masukan kotak edit maka pengguna dapat memasukkan data yang
diperlukan oleh program, yaitu dengan mengetikkan data tersebut melalui keyboard.
Berikut ini akan diberikan langkah- langkah pembuatan kotak edit yang sederhana,
kemudian dapat dikembangkan menjadi yang lebih rumit.
Langkah- langkah pembuatan:
1. Buatlah dulu Dialog kosong “Dialogku” seperti pada Bab I.
2. Hapuslah dulu Komentar ditengah Kotak Dialog tersebut, dengan cara klik teks
tersebut dan tekan del atau klik icon gunting.
3. Pada Toolbox Control pilih icon “Edit Box” dengan gambar symbol ab|, klik dan
tarik ke daerah dialog kosong “Dialogku”, atur penenpatannya seperti pada
Gambar 2.1 dibawah,
4. Pilih pula icon “Static Text” dengan gambar symbol Aa, klik dan tarik ke daerah
dialog kosong “Dialogku”, atur penempatannya seperti pada Gambar 2.1 dibawah,
5. Ulangi pembuatan kotak edit dan teks static tersebut sehingga menjadi dua, yang
berarti dialog ini memerlukan masukkan dari pengguna sebanyak dua kali dari
keyboard.
6. Ubahlah teks static tersebut sesuai dengan data yang akan dimasukkan, misalkan
diinginkan untuk menghasilkan perhitungan pembagian, maka teks statik pertama
(atas) diubah menjadi “Pembilang” dan teks static kedua (bawah) diubah menjadi
“Penyebut”. Untuk mengubah cukup dilakukan klik kanan mouse pada obyek
yang bersangkutan kemudian pilih properties. Pada kotak edit Caption gantilah
dengan keterangan yang diinginkan misalkan “Penyebut”. Sehingga akan
ditampilkan seperti pada Gambar 2.4 dibawah.
7. Gunakan pilihan menu bar utama yaitu “Layout” untuk mengatur tata letak dari
obyek control yaitu Align, Space Evenly, Make Same Size, Arrange Buttons dan
Center in Dialog.
8
Gambar 2.1 Tampilan Awal pembuatan Kotak Edit
Gambar 2.2 Mengganti tampilan pada teks static pertama (atas)
Gambar 2.3 Mengganti tampilan pada teks static kedua (bawah)
9
Gambar 2.4 Hasil tampilan teks setelah diubah
Setiap kotak edit mempunyai Identitas yaitu sebagai nama obyek yang bersangkutan,
adapun identitas tersebut biasanya disingkat dengan IDC_EDITn. Nama identitas ini
biasanya diset dengan huruf besar, bila akan diganti maka gunakan huruf besar, ingat
bahwa huruf besar dan kecil akan berbeda (case sensitive). Untuk permasalahan disini
sebaiknya tidak usah diganti, dimana ada dua kotak edit dengan Identitas berturut-turut
IDC_EDIT1 dan IDC_EDIT2. Untuk melihat tampilan dialog sesungguhnya (preview)
dapat ditekan [Ctrl] + [T].
2.1.1 Mengambil Data Masukan

Ada dua cara untuk mengambil data masukan dari kotak edit, yaitu menggunakan
fungsi GetDlgItemInt() atau GetDlgItemText() bila data yang diinginkan berupa
integer atau teks. Tetapi cara ini tidak disarankan yang disarankan adalah dengan variable
anggota yang dideklarasikan terlebih dulu. Untuk dapat mengimplementasikan kedua
cara tersebut, maka harus dibuat suatu fungsi baru untuk menanganinya, dimana fungsi
tersebut adalah merupakan “peristiwa” (even) dari suatu obyek yang dikenai suatu
pekerjaan (driven), misalkan diklik satu kali atau dienter dan lain sebagainya. Agar
maksud tersebut dapat dilakukan maka tambahkan Button control (icon tombol kotak)
pada dialog “Dialogku”, dengan cara klik dan tarik seperti sebelumnya. Kemudian
gantilah label pada tombol tekan tersebut dengan kata “Proses”. Untuk lebih jelasnya
dapat dilihat pada Gambar 2.6 dibawah.
10
Gambar 2.5 Penggantian label “Button1” menjadi “Proses”
Gambar 2.6 Penambahan tombol tekan “Proses”
Setelah tombol tekan ditambahkan kemudian klik pada tombol tersebut dua kali, maka
akan pindah pada tampilan dialog penambahan fungsi anggota baru seperti pada Gambar
2.7 dibawah. Gantilah OnButton1 dengan OnProses, kemudian klik OK.
11
Gambar 2.7 Penambahan Fungsi Anggota
Gambar 2.8 Penggantian Nama Fungsi Anggota
Gambar 2.9 Penambahan Fungsi Anggota Baru “OnProses()”
12
Dari sini pembuatan program dapat dimulai, yaitu dibawah komentar //TODO, seperti
pada Gambar 2.9 diatas. Tambahkan baris program berikut:
int pembilang, penyebut, hasil;

char chasil[50];
pembilang=GetDlgItemInt(IDC_EDIT1);
penyebut=GetDlgItemInt(IDC_EDIT2);
hasil=pembilang/penyebut;
sprintf(chasil,"Hasil pembagian = %d",hasil);
MessageBox(chasil,"Kotak Pesan");
Program mendeklarasikan tiga variable yaitu pembilang, penyebut dan hasil dengan
tipe integer (bulat) semuanya, dan juga satu variable string chasil dengan lebar 50
karakter yang digunakan untuk menampung hasil proses, yang telah diformat dalam
b e n t u k string, sehingga dapat ditampilkan pada kotak pesan dengan fungsi
MessageBox().
Fungsi sprintf() akan mencetak tampilan yang telah diformat kedalam
variable string chasil, sehingga dapat ditampilkan pada kotak pesan dengan fungsi
MessageBox(), untuk dapat menggunakan fungsi sprintf(), maka perlu ditambahkan
file header “stdio.h” pada awal program utama yang menggunakan fungsi tersebut.
Jalankan program dan isikan suatu data misal 50 untuk pembilan dan 5 untuk
penyebut, maka akan ditampilkan seperti pada Gambar 2.10 dibawah.
Gambar 2.10 Tampilan program dialog pembagian “Dialogku”
13
Kelemahan dari fungsi GetDlgItemText() dan GetDlgItemInt() adalah tipe

pengambilan data sudah ditentukan yaitu kalau tidak teks maka integer (bulat), apabila
datanya float (pecahan) maka harus dilakukan konversi dulu dari tipe karakter ke tipe
float, sehingga tidak praktis untuk hal- hal tertentu. Untuk mengatasi hal tersebut maka
dapat digunakan deklarasi variable anggota, dimana mendefinisikan suatu variable
penampung pada suatu kotak edit yang bersangkutan, dimana tipenya variabelnya dapat
diatur sesuai dengan kehendak. Sebelum dapat melakukan modifikasi program, maka
lakukan dulu deklarasi variable anggota yaitu dengan cara:
1. Tekan [Ctrl] + [W] untuk membuka dialog MFC ClassWizard seperti pada
Gambar 2.11 dibawah.
Gambar 2.11 Kotak Dialog MFC ClassWizard
2. Pilih tab Member Variables, pada kotak edit IDs pilih IDC_EDIT1, klik
tombol Add Variable disebelah kanan atas, maka akan ditampilkan seperti
pada Gambar 2.12 dibawah.
3. Masukkan nama variable yang akan digunakan untuk menyimpan data
masukan dari kotak edit (misalkan m_penyebut), secara default variable ini
didepannya diberi symbol m_ yang berarti bahwa variable ini merupakan
variable (memori) dari masukan obyek control.
4. Pada isian Category terdapat dua pilihan yaitu Value dan Control, Pilih Value
bila variable bersifat biasa dan Control untuk keperluan pengendalian tertentu
seperti menampilkan karakter secara multiline (akan dibahas kemudian).
14
5. Pilih tipe variable yang diinginkan pada pilihan Variable type, misalkan pilih
tipe variable float. Kemudian klik OK.
6. Ulangi langkah-langkah tersebut untuk IDC_EDIT2, sehingga didapatkan
daftar ID seperti pada Gambar 2.13 dibawah. Klik OK untuk menutup dialog
MFC ClassWizard.
Gambar 2.12 Dialog MFC ClassWizard pada tab Member Variable
Setelah variable-variabel tersebut dideklarasikan, maka dapat dilihat

keberadaannya dalam program yaitu dengan cara Klik tab ClassView pada menu sebelah
kiri tengah (lihat Gambar 2.14a dibawah), klik tanda “+” pada dialogku classess, klik
tanda “+” pada CDialogkuDlg, maka akan ditampilakan daftar keanggotaan dari class
tersebut. Kemudian klik 2x pada nama variable yang ingin diketahui letaknya. Ternyata
variable-varaibel tersebut diletakkan pada file berektensi .h (header), file tersebut disusun
(didaftar) didalam daftar file proyek dialogku files, untuk melihat susunan file dapat
diklik pada menu tab FileView disebelah kanan dari 2 tab ClassView. Untuk lebih
jelasnya lihat Gambar 2.14b (dibawah).
Untuk melakukan modifikasi dari varibel-variabel tersebut maka dapat dilakukan
dengan cara kembali ke dialog ClassWizard, misalkan diinginkan untuk membatas
jumlah dari data yang dapat diterima oleh variable yang bersangkutan maka dapat
dilakukan pengisian nilai minimum dan maksimum. Untuk lebih jelasnya ikuti langkah-
langkah sebagai berikut:
1. Tekan [Ctrl] + [W] untuk membuka dialog ClassWizard.
15
2. Pilih tab Member Variables, pilih variable yang akan diubah,

3. Isikan pada kotak edit dibawah yaitu pada Minimum Value dengan nilai
minimum yang dikehendaki, misalkan 0.
4. Isikan pada kotak edit Maximum Value dengan nilai maksimum, misalkan 100
5. Klik OK.
Lihat perubahan tersebut pada program, yaitu klik ClassView, klik pada
DoDataExchange(CDataExchange *pDX), maka akan terlihat pada editor sebagai
berikut:
void CDialogkuDlg::DoDataExchange(CDataExchange* pDX)

{
CDialog::DoDataExchange(pDX);
//{{AFX_DATA_MAP(CDialogkuDlg)
DDX_Text(pDX, IDC_EDIT1, m_pembilang);
DDV_MinMaxFloat(pDX, m_pembilang, 0.f, 100.f);
DDX_Text(pDX, IDC_EDIT2, m_penyebut);
//}}AFX_DATA_MAP
}
Terdapat tambahan fungsi DDV_MinMaxFloat(), yang berfungsi untuk membatasi

jangkauan data yang diinginkan, sehingga validasi data terjamin dari kesalahan
pengetikan pengguna.
Gambar 2.13 Daftar TipeVariabel yang dibuat
16
(a) (b)
Gambar 2.14a Tapilan Jendela ClassView, 2.14b Tampilan Jendela FileView
Sedangkan nilai awal dari kedua variable tersebut dapat dilihat pada ClassView dimana
terletak pada fungsi CDialogkuDlg(CWnd *pParent=NULL), seperti dibawah ini:
CDialogkuDlg::CDialogkuDlg(CWnd* pParent /*=NULL*/)

: CDialog(CDialogkuDlg::IDD, pParent)
{
//{{AFX_DATA_INIT(CDialogkuDlg)
m_pembilang = 0.0f;
m_penyebut = 0.0f;
//}}AFX_DATA_INIT
// Note that LoadIcon does not require a subsequent
DestroyIcon in Win32
m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
}
Untuk mencoba kebenaran dari seting diatas maka modifikasi program sebelumnya (ganti
semua), yaitu pada fungsi ::OnProses() dengan program dibawah ini:
17
float fhasil;
char chasil[50];
UpdateData(TRUE);
fhasil=m_pembilang/m_penyebut;
sprintf(chasil,"Hasil pembagian = %f",fhasil);

MessageBox(chasil,"Kotak Pesan");
Fungsi UpdateData(TRUE) digunakan untuk memperbarui nilai dari variable obyek

kontrol m_ sehingga bila terjadi perubahan pada data masukan maka otomatis akan
digunakan sebagai data yang baru.
Jalankan program dan masukkan data pembilang diatas 100, dan masukkan penyebut
dengan nilai selain nol, klik tombol proses, maka akan ditampilkan pesan kesalahan
seperti pada Gambar 2.15 dibawah. Bila kotak pesan kesalahan ditampilkan maka nilai
yang dimasukkan tidak akan digunakan, meskipun proses terus berjalan dan akan
menghasilkan nilai yang salah. Ini dapat diatasi dengan memberikan validasi data
sebelum dilakukan proses, sehingga bila input salah maka tidak akan dilakukan proses
perhitungan.
Gambar 2.15 Pesan Kesalahan yang terjadi
2.1.2 Menampilkan Hasil Proses
Pada subbab diatas telah dibahas bagaimana mendapatkan data dan menampilkan
data, akan tetapi hasil proses masih ditampilkan pada kotak pesan (terpisah dari dialog
utama). Berikut ini akan diberikan cara untuk menampilkan hasil proses dalam dialog
yang sama, yaitu dengan memanfaatkan kotak edit sebagai tampilan hasil proses. Kotak
edit dapat digunakan untuk menampilkan hasil proses secara satu baris atau beberapa
baris, untuk beberapa baris maka harus dilakukan trik khusus yang akan dibahas setelah
pembahasan menampilkan hasil proses dalam satu baris.
Adapun langkah yang dilakukan untuk menampilkan hasil proses dalam satu baris
adalah cukup mudah yaitu klik icon “Edit box” kemudian letakkan pada tempat yang
diinginkan dan berikan label seperti pada Gambar 2.16 dibawah. Untuk menuju Dialog
Editor yaitu dengan cara klik tab ResourceView disebelah kanan ClassView, klik tanda
“+” pada dialogku resources, klik tanda “+” pada Dialog dan klik pada
IDD_DIALOGKU_...
18
Untuk menampilkan hasil proses dapat dilakukan juga dengan dua cara seperti
halnya mendapatkan data dari kotak edit, yaitu dengan SetDlgItemText() atau
SetDlgItemInt() atau dengan fungsi SetWindowText().
Gambar 2.16 Kotak Edit untuk Menampilkan Hasil Proses dalam Satu Baris
Berikut ini digunakan cara pertama yaitu menggunakan fungsi

SetDlgItemText() dimana data yang akan ditampilkan harus dilakukan format data
menjadi bentuk string dengan fungsi sprintf() yang merupakan kumpulan dari file
header “stdio.h” seperti halnya pada program sebelumnya.
void CDialogkuDlg::OnProses()
{
// TODO: Add your control notification handler code here
float fhasil;
char chasil[50];
UpdateData(TRUE);
sprintf(chasil,"Hasil pembagian = %f",fhasil);

//MessageBox(chasil,"Kotak Pesan");
SetDlgItemText(IDC_EDIT3,chasil);
}
19
Fungsi SetDlgItemText() memerlukan ID dari kotak edit yang bersangkutan,

disini IDnya adalah IDC_EDIT3 sehingga hasil proses akan ditampilkan pada kotak ID
yang disebutkan dalam parameter fungsi ini.
Gambar 2.17 Hasil tampilan pembagian
Untuk menampilkan hasil proses secara multiline maka dapat dilakukan dengan setting
pada properties dari kotak edit tersebut yaitu dengan langkah sebagai berikut:
1. Klik kanan pada kotak edit yang bersangkutan, klik properties
2. Klik tab Styles, klik Multiline, klik Auto VScroll (lihat Gambar 2.18)
3. Klik tanda x pada sudut kanan atas untuk selesai,
4. Lebarkan kotak edit tampilan proses hasil seperti pada Gambar 2.19 dibawah.
Gambar 2.18 Setting kotak edit tampilan proses hasil untuk Multiline
20
Gambar 2.19 Modifikasi Kotak Edit Hasil Proses
Tambahkan/ modifikasi baris-baris berikut pada program sebelumnya:
{
float fhasil;
char chasil[50];
int i;
CString sbuffer="";
UpdateData(TRUE);
for(i=0; i<10; i++) {

sprintf(chasil,"Hasil pembagian = %f\r\n",fhasil);
sbuffer+=chasil;
}
SetDlgItemText(IDC_EDIT3,sbuffer);
}
Program akan mencetak 10 kali hasil proses pada variable chasil, yaitu dengan cara
perulangan for(), sedangkan untuk menampilkan 10 tampilan tersebut harus dilakukan
dalam variable memori (sbuffer) yang ditandai dengan “\r\n” untuk ganti baris baru.
Setelah tampilan berada dalam variable sbuffer, maka dapat ditampilkan sekaligus ke
kotak edit dengan fungsi SetDlgItemText().
21
Gambar 2.20 Hasil Tampilan Proses Multiline
Untuk menampilkan hasil proses tersebut pada Gambar 2.20 diatas, dapat pula dilakukan
dengan fungsi SetWindowText(), yaitu modifikasi program diatas menjadi seperti
dibawah ini:
{
float fhasil;
char chasil[50];
int i;
CString sbuffer="";
UpdateData(TRUE);
for(i=0; i<10; i++) {

sprintf(chasil,"Hasil pembagian = %f\r\n",fhasil);
sbuffer+=chasil;
}
m_tampilan.SetWindowText(sbuffer);
}
Kemudian masuk ke dialog ClassWizard klik tab Member Variables, deklarasikan suatu
variable [Add Variable…] pada kotak edit yang bersangkutan (IDC_EDIT3) dengan
nama m_tampilan dan pilihan Category adalah Control sehingga mempunyai tipe
varaibel CEdit seperti pada Gambar 2.21 dibawah:
22
Gambar 2.21 Variabel Kontrol m_tampilan
Jalankan program dan akan didapatkan hasil sama seperti pada Gambar 2.20 diatas.
LATIHAN MEMBUAT APLIKASI

1. Buatlah aplikasi dialog dengan nama “Kabisat”, dimana proyek tersebut berbasis
dialog. Rancanglah masukan dan keluaran kotak edit sesuai dengan maksud dari
proyek tersebut. Petunjuk: 2 kotak edit, 1 tombol tekan. Apabila kotak edit
pertama dimasukkan tahun kabisat maka dikotak edit kedua setelah ditekan
tombol proses akan menampilkan Tahun Kabisat begitu sebaliknya.
2. Buatlah aplikasi dialog dengan nama “Kalkulator”, dimana proyek tersebut
berbasis dialog. Didalam dialog terdapat tiga kotak edit yang masing- masing
mempunyai label (static text) “data pertama”, “data kedua”, dan label “hasil
proses”. Ada Lima tombol aksi yang terdiri dari tombol berlabel “Perkalian”,
“Pembagian”, “Penambahan” dan “Pengurangan” serta tombol “Selesai”.
3. Buatlah aplikasi dialog dengan nama “Derajat”, dimana dalam proyek tersebut
berbasis dialog. Masukan program berupa jam dan menit, sedangkan keluaran
program berupa derajat dari sudut sisi yang lancip kedua jarum jam, contoh jam
3:30 adalah 75 derajat.
4. Buatlah proyek dengan nama “Detik”, dimana proyek berbasis dialog. Masukan
program berupa jumlah detik sedangkan keluaran program berupa Hari, Jam,
Menit dan Detik. Contoh 100000 detik adalah setara dengan 1 Hari, 3 Jam, 46
Menit dan 40 detik.
23
2.2 Tombol Radio

Tombol radio digunakan untuk menentukan satu pilihan dari beberapa pilihan
yang tersedia, seperti contohnya data pria/ wanita, merah/ putih, elektronika/
telekomunikasi/ listrik/ informatika dan lain sebagainya. Tombol radio adalah suatu
obyek yang harus dilakukan pengolompokan karena tidak seperti obyek lainnya dimana
obyek tombol radio mempunyai banyak obyek tetapi hanya ditangani oleh satu variable
saja dan tidak dapat ditangani oleh beberapa variable, seperti halnya obyek lain.
Langkah- langkah implementasi dari tombol radio ini adalah sebagai berikut:
1. Klik icon “Radio button” dan tarik pada editor dialog, sebanyak 4 kali.
2. Masing- masing tombol radio tersebut ubah label “Radio” dengan label Jurusan
Elektronika, Telkomunikasi, Listrik dan Informatika.
3. Klik icon “Edit Box” dan tarik pada editor dialog dan sesuaikan. Diberikan label
“Pilihan Jurusan”.
4. Klik icon “Button” dan tarik pada editor dialog kemudian ubah namanya menjadi
“Pilih”. Untuk lebih jelasnya perhatikan Gambar 2.22 dibawah.
5. Tekan tombol [Ctrl] dan klik pada masing- masing Jurusan sehingga menjadi satu
grup lihat Gambar 2.22, klik kanan dan cawang pada kotak check group, seperti
pada Gambar 2.23 dibawah.
6. Tekan tombol [Ctrl] + [W] untuk mengaktifkan ClassWizard, kemudian klik
Member Variables maka akan ditampilkan ID seperti pada Gambar 2.24
dibawah.
Gambar 2.22 Dialog Radio dengan Pilihan 4 Jurusan
24
Gambar 2.23 Kotak check Grup dicawang
Gambar 2.24 Anggota Variabel Radio dengan Type CButton
7. Tambahkan variable pada masing- masing IDC_RADIO1 s/d ID_RADIO4, yaitu

berturut-turut m_elektronika, m_telekomunikasi, m_listrik dan m_informatika,
dengan catagory masing- masing adalah Control seperti pada Gambar 2.25
dibawah, sehingga akan didapatkan seperti pada Gambar 2.24 diatas.
8. Klik tombol radio dua kali pada masing- masing tombol radio, untuk menambah
aksi baru bila tombol tersebut ditekan, beri nama masing- masing fungsi berturut-
t u r u t OnElektronika, OnTelekomunikasi, OnListrik, dan
OnInformatika.
9. Ketik program dibawah ini sesuai dengan fungsinya, perhatikan program yang
dibawah //TODO.
25
void CRadioDlg::OnElektronika()
{
UpdateData();
m_pilihan.Format("%s","Teknik Elektronika");
UpdateData(FALSE);
}
void CRadioDlg::OnTelekomunikasi()
{
UpdateData();
m_pilihan.Format("%s","Teknik Telkomunikasi");
UpdateData(FALSE);
void CRadioDlg::OnListrik()
{
UpdateData();
m_pilihan.Format("%s”,"Teknik Listrik");
UpdateData(FALSE);
void CRadioDlg::OnInformatika()
{
UpdateData();
m_pilihan.Format("%s","Teknik Informatika");
UpdateData(FALSE);
10. Untuk menampilkan hasil pilihan tombol radio, maka tambahkan variable
m_pilihan pada kotak edit, dengan Category value dan tipe CString, lihat pada
Gambar 2.24 diatas.
11. Penting dilakukan disini yaitu klik kembali semua tombol radio dengan
bersamaan menekan tombol [Ctrl], hapus cawang pada kotak check Group.
12. Jalankan Program.
26
Gambar 2.25 Seting Variabel Radio dengan Category Control
Modifikasi program tersebut dengan mengaktikkan tombol tekan “Pilih”,

sehingga pada saat tombol radio dipilih maka hasilnya belum ditampilkan
sebelum menekan tombol “Pilih”.
1. Klik dua kali pada tombol “Pilih”, berikan nama OnPilih pada kotad edit.
2. Modifikasi program menjadi seperti dibawah ini:
void CRadioDlg::OnElektronika()
{
m_pilihan="Teknik Elektronika";
}
void CRadioDlg::OnTelekomunikasi()
{
m_pilihan="Teknik Telkomunikasi";
}
void CRadioDlg::OnListrik()
{
m_pilihan="Teknik Listrik";
}
void CRadioDlg::OnInformatika()
{
m_pilihan="Teknik Informatika";
}
void CRadioDlg::OnPilih()
{
SetDlgItemText(IDC_EDIT1,m_pilihan);
}
27

1. Buatlah tampilan dialog dengan nama “Operator” seperti dibawah ini, kemudian
sesuaikan program aplikasi yang dibuat. Aplikasi akan menampilkan hasil dari kedua
bilangan, sesuai dengan pilihan operatornya yaitu perkalian, pembagian, penjumlahan
dan pengurangan.
2. Buatlah program untuk menampilkan soal pilihan ganda menggunakan tombol radio,
seperti pada tampilan dibawah ini.
28
Petunjuk langkah-langkah pembuatan:

ü Buatlah dulu form dialog seperti dibawah ini:
ü Tab order-nya adalah sebagai berikut:
29
ü Tabel propertinya adalah sebagai berikut:
Control ID Caption Property

1 Group Box IDC_QUESTION_NBR Question
Multiline = cawang
2 Kotak Edit IDC_SOAL
Vertical Scroll = ON
3 Group Box Answers
4 Tombol Radio IDC_RDO_JAWAB1 Group = cawang
8 Tombol Tekan IDC_BERIKUTNYA &Berikutnya Default = cawang
9 Tombol Tekan IDCANCEL &Selesai
ü Anggota variabelnya adalah sebagai berikut:
Untuk menampilkan semua IDC RADIO, jangan lupa klik semua tombol radio sambil
menekan tombol [Ctrl], kemudian cawang pilihan Group, setelah Anggota Variabel
diset hapus cawang pada Group.
ü Klik pada ClassView, klik pada tanda + Pilihan Classes, klik 2x pada
CPilihanDlg, maka akan ditampilkan Klas dari CPilihanDlg, tambahkan deklarasi
program dibawah ini yaitu setelah baris program DECLARE_MESSAGE_MAP()
30
private:
int JumlahPertayaan;
ü Klik tanda + pada folder CPilihanDlg, klik 2x pada CInitDialog, dan tambahkan
baris dibawah ini setelah //TODO
JumlahPertayaan = 3;
OnBerikutnya();
ü Masih pada ClassView, klik kanan pada folder CPilihanDlg, pilih Add Member
Function dan isikan seperti Gambar dibawah ini
ü Ketik program dibawah ini didalam fungsi yang baru saja dibuat:
int Jawaban;
switch(q) {
case 0:
m_Pertanyaan.Format("Manakah bahasa tingkat menengah?");
m_Jawab1.SetWindowText("Pascal");
m_Jawab2.SetWindowText("C");
m_Jawab3.SetWindowText("Fortran");
m_Jawab4.SetWindowText("Basic");
Jawaban = 2;
break;
case 1:
m_Pertanyaan.Format("Visual C++ dibuat oleh siapa?");
m_Jawab1.SetWindowText("Borland");
m_Jawab2.SetWindowText("Seagate");
m_Jawab3.SetWindowText("Microsoft");
m_Jawab4.SetWindowText("Infogamer");
Jawaban = 3;
break;
31
case 2:
m_Pertanyaan.Format("Visual C++ termasuk permrograman");
m_Jawab1.SetWindowText("Linear");
m_Jawab2.SetWindowText("Graphics");
m_Jawab3.SetWindowText("Database");
m_Jawab4.SetWindowText("Non Linear");
Jawaban = 4;
break;
}
return Jawaban;
ü Klik dua kali pada tombol Berikutnya, isikan nama OnBerikutnya untuk membuat
fungsi baru OnBerikutnya(), dan tambahkan baris-baris program dibawah ini:
static int q=0;
UpdateData(TRUE);
if(q<JumlahPertanyaan)
TanyaJawab(q);
q++;
UpdateData(FALSE);
ü Jalankan program, modifikasilah program dengan menambahkan nomor urut

program, tambahkan pertanyaan yang lainnya, dan bila jawaban benar berilah
keterangan benar, dan berilah keterangan salah bila jawaban salah.
1.3 Kotak Cawang

Seperti halnya pada obyek tombol radio, maka obyek kotak cawang (check box)
dapat digunakan untuk menentukan pilihan dari pengguna, perbedaan dari tombol radio
dan kotak cawang adalah bahwa kota cawang dapat dipilih lebih dari satu atau semuanya,
bahkan tidak memilih satu pilihanpun bias.
Umumnya penggunaan kotak cawang adalah bila ada beberapa pilihan yang harus
dipilih misalkan pilihan hobby, pilihan menu makanan, pilihan soal jawaban ganda,
pilihan tampilan hasil dan lain sebagainya.
Untuk mengimplementasikan pembuatan kotak cawang ini maka dapat diikuti
langkah-langkah dibawah ini:
ü Buatlah dialog dengan nama Hobby, klik obyek kotak cawang dan letakkan pada
posisi seperti pada layout dibawah ini:
32
ü Buatlah nama ID dan anggota variable seperti dibawah ini:
33
ü Untuk ID_ED_TAMPILAN aktifkan edit properties kotak cawang Multiline dan

Vertical scroll.
ü Hapus tombol OK dan buatlah tombol baru dengan nama ID yaitu
IDC_BTN_TAMPIL, beri nama Caption dengan nama &Tampil
ü Klik 2x pada tombol Tampil, dan isikan nama OnTampil, sehingga akan dibuat
secara otomatis fungsi dengan nama ::OnBtnTampil().
ü Isikan program dibawah ini didalam fungsi ::OnBtnTampil().
CString cTampilan, cHobby1, cHobby2, cHobby3, cHobby4, cHobby5;
UpdateData();
if(m_hobby1) cHobby1="Membaca"; else cHobby1="";
if(m_hobby2) cHobby2="Olah raga"; else cHobby2="";
if(m_hobby3) cHobby3="Komputer"; else cHobby3="";
if(m_hobby4) cHobby4="Elektronika"; else cHobby4="";
if(m_hobby5) cHobby5="Jalan-jalan"; else cHobby5="";
cTampilan=m_nama+"\r\n"+m_alamat+"\r\n"+m_jurusan+ “\r\n”;
cTampilan+=cHobby1+”\r\n”+cHobby2+”\r\n”+cHobby3+
“\r\n”+cHobby4+”\r\n”+cHobby5;
m_tampilan.Format(cTampilan);
UpdateData(FALSE);
ü Jalankan program, isikan data, pilih hobby dan tekan tombol “Tampil”.

1. Buatlah aplikasi dialog dengan nama “Harga”, yang berisi harga menu makanan
yang dipesan oleh pelanggan dari suatu café “Mo Lagi Ah”. Layout dari dialog
tersebut dapat dilihat pada Gambar dibawah. Buatlah perhitungan total dari menu
makanan yang dipesan oleh pelanggan. Modifikasi layout dengan menu makanan
dan minuman yang lainnya.
2. Buatlah aplikasi dialog dengan nama “Konversi”, dimana dialog ini menangani
konversi suatu dasar/ basis bilangan, yaitu Biner, Oktal, Desimal dan Hexa.
Bilangan yang dimasukkan dapat dipilih salah satu dari keempat dasar bilangan
tersebut, untuk lebih jelasnya perhatikan pada layout dialog dibawah ini:
34
3. Modifikasilah aplikasi dialog pada latihan no.2 menjadi konversi temperature dan
mata uang, dengan nama dialog “Konversi2” dan “Konversi3”.
4. Buatlah aplikasi dialog dengan nama “Restoran”, yang menangani pemesanan

makanan dan minuman seperti pada layout dibawah ini, buatlah modifikasinya:
35
BAB 3: Kotak Combo dan Kotak List

Berikut ini akan diberikan pembuatan kontrol jendela yang lain, dimana kontrol-
kontrol ini disebut Kotak Combo dan Kotak List. Keduanya mempunyai kesamaan yaitu
terdapat pilihan item- item pada jendela kontrol tersebut, sehingga pengguna tinggal
memilih pilihan yang dikehendaki. Dengan kontrol-kontrol ini memudahkan pengguna
memasukkan pilihan, karena pilihan sudah disediakan dan dapat menghindari kesalahan
masukan.
3.1 Kotak Combo

Seperti telah diuraikan diatas bahwa, Kotak Combo adalah kontrol jendela yang
menyimpan beberapa daftar pilihan didalam jendelanya. Masing- masing item pilihan
dapat berupa karakter atau string. Ada dua tipe dari Kotak Combo, yaitu tanpa
menggunakan panah penunjuk (Simple) dan menggunakan panah penunjuk disisi kanan
kotak isian (Dropdown/ Drop List), untuk lebih jelasnya maka perhatikan Gambar 3.1
dan Gambar 3.4 dibawah ini.
Kotak Combo dapat dibuat dengan memilih icon pada toolbox Controls.
Gambar 3.1 Kotak Combo Simple tidak Menggunakan Panah Penunjuk
Untuk mengisi pilihan dalam Kotak Combo maka pilih tab Data dan isikan
Pilihan Jurusan seperti Gambar 3.2 dibawah ini, untuk berpindah baris maka harus
digunakan [Ctrl] + [Enter], karena bila tombol Enter saja maka Properties akan ditutup.
Gambar 3.2 Properties Data
36
Pilihlah pada kotak List Type yaitu Simple, hilangkan cawang pada Kotak Cawang Sort,
kemudian cawang pada Kotak Cawang pada Disable no scroll. Kemudian atur Kotak
Combo seperti pada Gambar 3.1 diatas. Untuk meneriksa apakah tampilan sudah benar
maka tekan [Ctrl] + [T].
Gambar 3.3 Properties Styles untuk Kotak Combo Simple
Gambar 3.4 Kotak Combo Drop List Menggunakan Panah Penunjuk
Gambar 3.5 Properties Styles untuk Kotak Combo Drop List
Secara tampilan antara tampilan Dropdown dan Drop List adalah sama, tetapi secara
fungsi berbeda yaitu bahwa Dropdown dapat diisi masukan pilihan baru sedangkan Drop
List tidak dapat diisikan pilihan baru. Gunakan pilihan Dropdown bila pengguna dapat
memasukkan pilihan diluar pilihan yang tersedia.
37
Gambar 3.6 Kotak Combo Dropdown Menggukan Panah Penunjuk
3.1.1 Setting Data pada Kontak Combo

Setting Data item pilihan pada Kotak Combo dapat dilakukan melalui dua cara,
cara yang pertama adalah telah dijelaskan diatas yaitu menggunakan properties Data,
sedangkan cara kedua adalah menggunakan program, sehingga data item pilihan akan ada
setelah program dijalankan. Untuk dapat melakukan itu buatlah layout dialog seperti
dibawah ini:
Gambar 3.7 Layout Kotak Combo Daftar Kota
Gambar 3.8 Setting Nama ID untuk Kotak Combo Daftar Kota
38
Gambar 3.9 Setting Nama ID untuk Kotak Combo Kota Pilihan
Gambar 3.10 Properties Tipe dan pilihan cawang Kotak Combo
Buatlah Variable Anggota untuk Kotak Combo ID_DAFTARKOTA dengan nama

m_daftarkota dengan Category Control seperti Gambar 3.11 dibawah ini:
Gambar 3.11 Variabel Anggota m_daftarkota dengan Category Control
39
Gambar 3.12 Variabel Anggota m_kotapilihan dengan Variable type CString
Gambar 3.13 Daftar ID dan Variabel Anggotanya
40
Tambahkan baris program dibawah ini didalam fungsi OnInitDialog() dibawah baris
//TODO sebagai berikut:
m_daftarkota.AddString("Surabaya");
m_daftarkota.AddString("Gresik");
m_daftarkota.AddString("Lamongan");
m_daftarkota.AddString("Malang");
m_daftarkota.AddString("Sidoarjo");
m_daftarkota.AddString("Probolinggo”);
m_daftarkota.AddString("Situbondo");
m_daftarkota.AddString("Banyuwangi");
m_daftarkota.AddString("Magetan");
m_daftarkota.AddString("Madiun");
m_daftarkota.AddString("Jombang");
m_daftarkota.AddString("Blitar");
Untuk menampilkan pilihan default maka dapat digunakan obyek SetCurSel(),

misalkan pilihan adalah kota Magetan maka dapat dilakukan
m_daftarkota.SetCurSel(8), angka “8” adalah nomor urutan daftar kota,
magetan adalah urutan kedelapan pada daftar program diatas, hitungan dimulai dari 0
(nol) . Jalankan program maka akan ditampilkan seperti pada Gambar 3.14 dibawah ini,
dimana Daftar Kota telah berisi kota Magetan.
Gambar 3.14 Hasil dialog DropDown dengan pilihan default kota Magetan
Panggil dialog ClassWizard dengan [Ctrl] + [W], pilih pada kotak Obyek IDs yaitu
IDC_DAFTARKOTA, kemudian pilih pada kotak Messages CBN_SELCHANGE, klik pada
tombol Add Function, maka akan muncul pesan nama fungsi yang akan dibuat yaitu
OnSelchangeDaftarkota, klik OK, maka akan dibuat fungsi yang baru yaitu dengan
nama ::OnSelchangeDaftarkota(), kemudian tambahkan program dibawah ini
dibawa //TODO sebagai berikut:
m_daftarkota.GetLBText(m_daftarkota.GetCurSel(), m_kotapilihan);
UpdateData(FALSE);
41
Gambar 3.15 Membuat fungsi baru OnSelchangeDaftarkota
Jalankan program maka akan ditampilkan pilihan kota pada kotak edit Kota Pilihan
setelah memilih kota pada kota Combo Daftar Kota.
Gambar 3.16 Tampilan pada saat memilih Kota pada kotak Combo Daftar Kota

1. Buatlah aplikasi dialog “KotaPilihan” dengan layout seperti dibawah ini. Setiap
memilih Kota pada kotak Combo maka kota tersebut ditampilkan pada kotak Edit
“Kota Pilihan”. Buatlah tombol button dengan caption “>”, fungsi tombol ini adalah
untuk memindahkan kota yang telah dipilih kedalam kotak Edit yang bersesuaian
pada “Pilihan Kota”. Ada 4 kotak “Pilihan Kota”, sehingga memungkinkan untuk
memilih kota lebih dari satu. Saat tombol button “>” ditekan maka kota tersebut akan
dihapus dari “Daftar Kota” pada kotak Combo.
42
Petunjuk: Gunakan fungsi DeleteString()atau InsertString() untuk mengapus

atau menyisipkan kota pada Daftar Kota pada Kotak Combo. Fungsi GetCount()
digunakan untuk menghitung jumlah Kota pada Kotak Combo. Perhatikan juga baris-
baris program dibawah ini:
void CKotaPilihanDlg::OnDblclkDaftarkota()
{
m_daftarkota.GetLBText(m_daftarkota.GetCurSel(), m_kotapilihan);
m_jmlkota.Format("%d",m_daftarkota.GetCount());
UpdateData(FALSE);
}
void CKotaPilihanDlg::OnPanah1()
{
HWND hWnd;
//GetDlgItemText(IDC_KOTAPILIHAN,m_kota1);
GetDlgItem(IDC_PANAH1, &hWnd);
::EnableWindow(hWnd, FALSE); //non aktif tombol Panah 1
m_daftarkota.DeleteString(m_daftarkota.GetCurSel());
m_kota1.Format(m_kotapilihan);
m_kotapilihan=""; // menghapus kota pilihan
UpdateData(FALSE);
}
43
void CKotaPilihanDlg::OnRollback()
{
HWND hWnd;
GetDlgItem(IDC_PANAH1, &hWnd);
::EnableWindow(hWnd, TRUE); // aktifkan tombol Panah 1
if(m_kota1!="") {
m_daftarkota.InsertString(m_daftarkota.GetCurSel(),m_kota1);
m_kota1="";
}
UpdateData(FALSE);
}
Berikut ini adalah daftar nama dan tipe variabel yang digunakan.
2. Buatlah aplikasi dialog dengan nama “Laporan”, dimana terdapat dua Kotak
Combo seperti pada layout dibawah. Kotak Combo sebelah kiri berisi semua
atribut “Daftar Atribut” dari suatu record tabel, sedangkan Kotak Combo
sebelah kanan tidak berisi apa-apa (kosong). Diantara kedua Kotak Combo
tersebut terdapat dua tombol dengan caption “>” dan “<” yang digunakan untuk
mentransfer nama atribut dari kedua Kotak Combo tersebut.
44
3. Modifikasilah aplikasi dialog pada latihan no.2 menjadi layout seperti dibawah ini
dan berilah nama “Laporan2”.
3.2 Kotak List

Bentuk dari Kotak List adalah hampir sama dengan Kotak Combo, cara pengisian
dan pemrogramannya juga hampir mirip hanya berbeda pada beberapa fungsi yang
digunakan, seperti fungsi GetLBText() pada Kotak Combo diganti dengan fungsi
GetText(), sedangkan fungsi- fungsi yang lainnya relatif tetap. Perbedaan lainnya
adalah pada tampilan kotaknya yaitu pada Kotak Combo diatasnya terdapat Kotak Edit
sedangkan Kotak List tidak, kemudian pada Kota List tidak dapat dimasukkan data item
45
secara manual dari properties. Daftar item pada Kotak List telah diberikan secara default
yaitu Item, Listbox, Sample, dan tabtabtab.
Kotak List dapat dibuat dengan memilih icon dari Toolbox Controls. Setting
dari properties Kotal List memungkinkan pengguna untuk menseting bermacam tampilan
dan kegunaan. Gambar- gambar dibawah ini diberikan tiga properties yang dimiliki oleh
Kotak List.
Gambar 3.15 Tiga Properties dari Kotak List
Untuk membuat Kotak List maka lakukan langkah-langkah berikut ini:

ü Bukalah aplikasi dialog,
ü Klik dan letakkan icon Kotak List pada kotak dialog dan atur besarnya kotak,
ü Klik kanan pada Kotak List tersebut, set properties yang dikehendaki,
ü Isikan data item pilihan kota melalui program seperti pada Kotak Combo diatas,
yaitu diletakkan dibawah baris //TODO pada fungsi ::OnInitDialog(), atau
perhatikan baris-baris dibawah ini:
46
m_daftarkota.AddString("Surabaya");
m_daftarkota.AddString("Gresik");
m_daftarkota.AddString("Lamongan");
m_daftarkota.AddString("Malang");
m_daftarkota.AddString("Sidoarjo");
m_daftarkota.AddString("Probolinggo");
m_daftarkota.AddString("Situbondo");
m_daftarkota.AddString("Banyuwangi");
m_daftarkota.AddString("Magetan");
m_daftarkota.AddString("Madiun");
m_daftarkota.AddString("Jombang");
m_daftarkota.AddString("Blitar");
m_daftarkota.SetCurSel(0);
ü Kembali editor kedialog, tambahkan Kotak Edit disebelah kanan Kotak List, atur
letak dan besarnya sehingga sama dengan Kotak List,
ü Diantara kedua Kotak obyek tersebut berikan tombol tekan dengan camption “>”,
dan “<”,
ü Sehingga akan ditampilkan seperti pada Gambar 3.16 dibawah ini:
Gambar 3.16 Demo Kotak List dan Kotak Edit
ü Setting Anggota Variabel menjadi seperti Gambar 3.17 dibawah ini:

ü Agar pada saat tombol tekan “>” ditekan dan pilihan kota dapat ditampilkan pada
Kotak List sebelah kanan, maka dapat dilakukan penambahan fungsi baru sebagai
aksi penekanan tombol tersebut. Adapun program pada fungsi baru tersebur
adalah seperti dibawah ini:
void CListBoxDlg::OnPanah1()
{
Cstring skota;
m_daftarkota.GetText(m_daftarkota.GetCurSel(), skota);
m_daftarkota.DeleteString(m_daftarkota.GetCurSel());
m_daftarkota.SetCurSel(0);
m_pilihankota.InsertString(m_pilihankota.GetCurSel(), skota);
}
47
ü Lakukan hal yang sama untuk penekanan tombol kebalikannya yaitu tombol “<”,
dimana bila tombol tersebut ditekan maka akan berlaku sebaliknya, untuk lebih
jelasnya perhatikan baris-baris program dibawah ini:
void CListBoxDlg::OnPanah2()
{
CString skota;
m_pilihankota.SetCurSel(m_daftarkota.GetCurSel());
m_pilihankota.GetText(m_pilihankota.GetCurSel(), skota);
m_pilihankota.DeleteString(m_pilihankota.GetCurSel());
m_pilihankota.SetCurSel(0);
m_daftarkota.InsertString(m_daftarkota.GetCurSel(), skota);
}
48

1. Buatlah modifikasi pada aplikasi dialog Kota Pilihan diatas menjadi seperti layout
dialog dibawah ini:
Perbaiki kesalahan yang terjadi pada dialog diatas, seperti apabila semua kota telah
dipindah semuanya, dan tetap dilakukan penekanan tombol panah, maka tampilkan
pesan bahwa Kotak List kosong! Tambahkan fungsi baru untuk penekanan tombol
pamah ganda “>>” dan “<<”, dimana penekanan tombol ini akan memindahkan
semua kota dari kiri ke kanan dan sebaliknya. Tambahkan juga jumlah item yang
terdaftar atau jumlah kota pada masing- masing Kotak List.
2. Buatlah aplikasi dialog dengan nama “Pooling” yang mempunyai layout seperti
dibawah ini. Tampilkan hasil pilihan responden pada Kotak Edit secara multiline.
49
Bab 4: KONTROL SPIN, SLIDER DAN SCROLL BAR

Berikut ini akan dibahas mengenai kontrol obyek yang biasanya digunakan untuk
menentukan/ memperkirakan nilai pendekatan yang sesuai secara tidak pasti, misalkan
diinginkan suatu data angka dari suatu warna yang terjadi dari percampuran 3 warna
dasar yaitu Merah, Hijau dan Biru, atau untuk memperkirakan suatu nilai awal dari suatu
perhitungan, dimana mempunyai nilai antara, misalkan 0 s/d 100, dan beberapa kegunaan
yang lainnya dimana user tidak mengetikkan data melalui keyboard, akan tetapi cukup
dilakukan dengan klik dari mouse.
4.1 Kontrol Spin

Kontrol ini terdiri dari dua tombol yang masing- masing tombolnya terdapat gambar
panah, dua tombol ini digunakan untuk mengubah nilai yang ditunjukkan didalam kotak
edit yang terpisah dari tombol spin (ditambahkan sendiri). Pengguna dapat melakukan
pengaturan angka yang dikehendaki dengan melakukan klik pada salah satu panah
tersebut, panah atas untuk menaikkan angka dan panah bawah untuk menurunkan angka.
Untuk jelasnya perhatikan Gambar 4.1 dibawah ini:
Gambar 4.1 Kontrol Spin dan Kotak Edit
Untuk membuat tombol kontrol spin, maka pilih icon dan tarik ke editor kotak
dialog, atur ukurannya dan lokasi penempatannya, tambahkan kotak edit sehingga
terbentuk seperti Gambar 4.1 diatas.
Berikut ini langkah-langkah untuk membuat aplikasi tombol kontrol spin.
ü Bukalah dialog dan namakan dengan “Spin”,

ü Klik dan tarik icon kontrol spin atur ukuran dan posisinya,
ü Klik dan tarik icon kotak edit atur ukuran dan posisinya,
ü Klik pada kontrol spin pada editor dialog, tekan [Alt] + [Enter]
ü Ubahlah nama ID menjadi IDC_SPIN,
ü Klik pada kotak edit, tekan [Alt] + [Enter],
ü Ubahlah nama ID menjadi IDC_EDITSPIN,
ü Tekan [Ctrl] + [W] untuk memanggil kotak dialog Class Wizard,
ü Pilih tab Member Variables, klik ganda pada IDC_SPIN, masukkan nama
variabel m_spin, lalu tekan Enter,
50
ü Klik ganda pada IDC_EDITSPIN, masukkan nama variabel m_editspin,

lalu tekan Enter, maka akan terbentuk anggota variabel seperti Gambar 4.2
dibawah ini.
ü Untuk menentukan batasan nilai dari angka yang akan digunakan pada kontrol
spin maka digunakan fungsi SetRange(m, n), dimana m adalah batas awal
nilai dan n adalah akhir nilai. Fungsi tersebut diletakkan didalam fungsi
InitDialog() seperti biasanya dibawah //TODO. Contoh lengkapnya
perhatikan program dibawah ini:
UDACCEL AccellValue;
AccellValue.nSec = 1000;
AccellValue.nInc = 5;
m_spin.SetRange(-100, 100);
m_spin.SetAccel(1, &AccellValue);
Gambar 4.2 Anggota Variabel EditSpin dan Spin
ü Agar tombol spin dapat digunakan maka harus dibuat fungsi baru yang digunakan
untuk menangani penekanan tombol spin tersebut, yaitu tekan [Ctrl] + [W], pilih
IDC_SPIN pada kotak edit Object IDs, pilih UDN_DELTAPOS pada Messages, klik
Add Function, klik Edit Code, tambahkan kode program dibawah ini:
51
void CSpinDlg::OnDeltaposSpin(NMHDR* pNMHDR, LRESULT* pResult)

{
NM_UPDOWN* pNMUpDown = (NM_UPDOWN*)pNMHDR;
static int step=0;
if((*pNMUpDown).iDelta+(*pNMUpDown).iPos>(*pNMUpDown).iPos) step++;
if((*pNMUpDown).iDelta+(*pNMUpDown).iPos<(*pNMUpDown).iPos) step--;
m_editspin.Format("%d",step);
UpdateData(FALSE);
*pResult = 0;
}
Keterangan program:
NM_UPDOWN adalah struktur yang berisi tiga elemen, tetapi yang dibahas disini
hanya dua saja yaitu iPos dan iDelta, dimana iPos digunakan sebagai penunjuk posisi
terakhir dan iDelta menunjukkan penekanan tombol +/- (Up/ Down) dan keduanya
adalah merupakan variabel pointer.
ü Sebelum program dijalankan, berikan nilai awal dulu pada variable m_editspin
yang deklarasinya terletak pada baris awal-awal program didalam fungsi
CSpinDlg() seperti dibawah ini:
CSpinDlg::CSpinDlg(CWnd* pParent /*=NULL*/)

: CDialog(CSpinDlg::IDD, pParent)
{
//{{AFX_DATA_INIT(CSpinDlg)
m_editspin = _T("0");
//}}AFX_DATA_INIT
// Note that LoadIcon does not require a subsequent
DestroyIcon in Win32
m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
}
4.2 Kontrol Slider

Seperti halnya dijelaskan pada awal bab ini, maka kontrol slider (track bar) dapat
memenuhi criteria yang telah disebutkan tersebut, yaitu berupa tampilan control yang
dapat digeser untuk memperkirakan suatu nilai. Kontrol slider dapat diletakkan secara
vertical maupun harisontal, seperti kebanyakan control yang lain, control slider dapat
juga diatur tampilannya pada properties, seperti border, bentuk penunjuknya, titik-titik
pergeseran dan sebagainya.
Kontrol slider dapat dibuat dengan memilih icon pada toolbar control.
52
Berikut ini langkah-langkah untuk membuat kontrol slider:

ü Klik icon control slider dan atur posisinya, masuk ke properties pada tab General
ganti nama ID menjadi ID_SLIDER, pada tab Styles dapat diberikan tanda
cawang pada Tick Marks, Auto Ticks, dan Enable selection,
ü Tambahkan kotak edit diatas kontrol slider tersebut, masuk ke properties dang
anti nama ID menjadi ID_EDITSLIDER,
ü Untuk lebih jelasnya lihat pada Gambar 4.3 dibawah ini,
ü Masuk ke dialog Class Wizard tambahkan anggota variable seperti pada Gambar
4.4 dibawah,
ü Tambahkan baris program dibawah ini pada fungsi InitDialog sebagai berikut:
// TODO: Add extra initialization here
m_slider.SetRangeMin(1,false);
m_slider.SetRangeMax(100,false);
m_editslider = "1";
UpdateData(false);
ü Untuk menghubungkan antara kontrol slider dan kotak edit maka harus dilakukan
koneksi antara keduanya. Caranya adalah masuk ke Class Wizard pilih
CSliderDlg pada kotak edit Object IDs, pilih WM_HSCROLL pada kotak edit
Messages, klik Add Function, klik Edit Function.
Gambar 4.3 Tampilan Dialog Kontrol Slider
ü Tambahkan baris-baris program dibawah ini didalam fungsi yang baru dibuat:
// TODO: Add your message handler code here and/or call default
m_editslider.Format("%d",m_slider.GetPos());
UpdateData(false);
53
Gambar 4.4 Anggota Variabel pada Kontrol Slider
4.3 Scroll Bar

Perangkat Kontrol Scroll Bar adalah merupakan persegi panjang dengan tombol
panah dikedua ujungnya, dimana pengguna dapat mengklik pada daerah persegi panjang
dan kedua tombol panah, sehingga memungkinkan pengaturan yang lebih akurat.
Untuk membuat Scroll Bar dapat dilakukan dengan memilih icon atau
pada toolbox control.
Berikut ini adalah langkah- langkah untuk membuat Scroll Bar bekerja:
ü Klik pada icon vertical scroll bar dan atur penempatannya, masuk ke properties
ganti nama ID dengan IDC_SCROLLBAR,
ü Klik pada icon kotak edit dan atur penempatannya, masuk ke properties ganti
nama ID dengan IDC_VALUESB, untuk lebih jelasnya perhatikan Gambar 4.5
dibawah.
ü Panggil dialog Class Wizard, tambahkan variabel seperti pada Gambar 4.6
dibawah,
54
Gambar 4.5 Tampilah Kontrol Scroll Bar
Gambar 4.6 Anggota Variabel pada Scroll Bar
ü Tambahkan baris program dibawah ini pada InitDialog() dibawah // TODO,
m_scrollbar.SetScrollRange(0, 255);
m_editscroll = "0";
UpdateData(false);
55
ü Panggil dialog Class Wizard, klik tab Message Map, klik CScrollBarDlg pada
kotak edit Object IDs, klik WM_HSCROLL pada kotak edit Messages, klik pada
Add Function, klik Edit Code,
ü Tambahkan baris-baris program dibawah ini:
int CurPos = m_scrollbar.GetScrollPos();
m_editscroll.Format("%d", CurPos);
UpdateData(false);
switch (nSBCode) {
case SB_LINELEFT: // Scroll left.
CurPos--; break;
case SB_LINERIGHT: // Scroll right.

CurPos++; break;
case SB_PAGELEFT: // Scroll one page left.

CurPos-=10;
break;
case SB_PAGERIGHT: // Scroll one page right

CurPos+=10;
break;
case SB_THUMBPOSITION: // Stright Scroll

CurPos = nPos;
break;
case SB_THUMBTRACK: // Real Scroll

CurPos = nPos;
break;
}
m_scrollbar.SetScrollPos(CurPos);
Keterangan:
§ SB_LINELEFT dan SB_LINERIGHT adalah konstanta untuk mendeteksi
penekanan penunjuk mouse pada tombol panah kiri atau kanan pada scroll bar.
§ SB_PAGELEFT dan SB_PAGERIGHT adalah konstanta untuk mendeteksi
penekanan penunjuk mouse pada kotak kosong pada scroll bar.
§ SB_THUMBPOSITION adalah konstanta untuk mendeteksi pergeseran posisi kotak
geser secara langsung (tanpa menunjukkan angka pergeserannya).
§ SB_THUMBTRACK adalah konstanta untuk mendeteksi pergeseran posisi kotak
geser dengan menunjukkan angka pergeserannya.
ü Jalankan program dan klik pada panah kiri atau kanan, klik pada kotak scroll bar,
dan klik pada kotak geser kemudian tarik dan letakkan pada posisi yang
diinginkan.
56
1. Buatlah program aplikasi dialog dengan nama “Kombinasi”, yang menirukan cara
kerja dari kunci kombinasi dengan 4 digit, dimana masing- masing mempunyai
jangkauang angka dari 0 sampai 9, apabila angka kombinasi yang dimasukkan
benar maka tampilkan pesan “SUCCESS!” dan bila salah tampilkan
“INTRUDER!”, untuk lebih jelasnya perhatikan tampilan gmbar dibawah ini:
2. Buatlah program aplikasi dialog dengan nama “Jam”, yang digunakan untuk
menghitung sudut terkecil yang dibentuk dari dua jarum jam, yaitu jarum pendek
dan jarum panjang, contoh pada jam 10.30 maka akan membentuk sudut 135o ,
gunakan kontrol spin untuk memasukkan jam dan menit seperti pada gambar
dibawah ini:
Petunjuk:
Misalkan titik acuan 0o jam 12
1 menit = 360/60 = 6o
1 jam = 5 x 6o = 30o
pada jam 10.30 terdiri dari 10 jam dan 30 menit,
maka 10 x 30o = 300o dan 30 x 6o = 180o
sehingga 300 o - 180o = 120 o
ditambah dengan kelebihan derajat jarum pendek karena pergerakan jarum
panjang sebesar perbandingannya, yaitu 0.5o didapatkan dari perbandingan
pergerakan jarum panjang 1 menit maka jam pendek bergerak sebesar
30o /60 = 0.5o , jadi hasil perhitungan sudut adalah 120o + 30 * 0.5o = 135o
3. Buatlah program aplikasi dialog dengan nama “Warna”. Program aplikasi ini
digunakan untuk menetukan campuran warna yang dipilih oleh pengguna, apabila
warna merah lebih besar dari penjumlahan antara warna hijau dan biru maka
57
tampilkan pada kotak edit “Hasil Warna” yaitu “RED”, sedangkan bila warna
hijau lebih besar dari penjumlahan antara warna merah dan biru maka tampilkan
pada kotak edit diatas “GREEN” dan begitu sebaliknya tampilkan “BLUE”, dan
bila tidak memenuhi syarat tersebut tampilkan “UNKNOWN”, serta apabila
ketiga warna sama tampilkan “GREYSCALE”. Untuk lebih jelasnya perhatikan
tampilan dialog dibawah ini:
Petunjuk:
Berikut ini daftar adalah tipe variabel yang digunakan, nama variabel
disesuaikan sendiri.
58
Berikut klip program yang digunakan, untuk menangani pergeseran batang slider.
int merah, hijau, biru;
merah=m_slidermerah.GetPos();
hijau=m_sliderhijau.GetPos();
biru=m_sliderbiru.GetPos();
m_staticmerah.Format("%d",merah);
m_statichijau.Format("%d",hijau);
m_staticbiru.Format("%d",biru);
4. Buatlah program aplikasi dialog dengan nama “RGB” yang digunakan untuk
menampilkan warna hasil campuran dari nilai merah, hijau dan biru sebagai
berikut:
Petunjuk:
Perhatikan baris-baris program dibawah ini, yang berguna untuk melakukan
setting pada slider warna merah, meliputi nilai jangkauan batas slider, langkah
pertambahan setiap diklik, dan posisi awal dari batang slider.
m_slidermerah.SetRange(0, 255);
m_slidermerah.SetTicFreq(15);
m_slidermerah.SetPos(128);
59
Perhatikan juga tipe variable yang digunakan pada aplikasi slider diatas.
Kotak tampilan warna dibuat dari teks static dengan seting pada properties
sebagai berikut:
ü Pertama, pada tab General hapus isi karakter pada kotak edit Caption,
hapus cawang pada kotak check Visible, dan hapus cawang pada kotak
check Group, seperti tampilan dialog dibawah ini:
60
ü Kedua, cawang pada kotak check Border.
Tambahkan baris program dibawah ini pada file header sebagai berikut:
private:
COLORREF brColor;
Tambahkan dibagian awal dari fungsi ::OnPaint(), yaitu baris-baris seperti

dibawah ini:
// dikeluarkan dari dalam statement if program aslinya, dan diletakkan diatas

CPaintDC dc(this); // device context for painting
// deklarasi kotak (rectangle)

CRect Recto;
// menyimpan dimensi dari control Static pada obyek Recto

m_hasilwarna.GetWindowRect(&Recto);
ScreenToClient(&Recto);
// Membuat sikat yang digunakan untuk mengecat Static

CBrush BrushColor(brColor);
// memilih sikat
CBrush *pBrush = dc.SelectObject(&BrushColor);
// Menggambar latar belakang dari obyek Static

dc.Rectangle(&Recto);
Tambahkan baris-baris program dibawah dibagian akhir fungsi ::OnVScroll()

CRect Recto;
brColor = RGB(nRed, nGreen, nBlue);
m_hasilwarna.GetWindowRect(&Recto);
ScreenToClient(&Recto);
InvalidateRect(&Recto);
61
5. Buatlah program aplikasi dialog dengan nama “Derajat” yang berfungsi untuk
menunjukkan perkiraan suatu nilai temperatur derajat Celsius yang dimasukkan
melalui kotak edit, pada saat kotak edit diganti nilainya maka batang penunjuk
akan bergerak sesuai dengan angka yang diberikan, dengan jangkauan dari 0
sampai 100. Untuk lebih jelasnya perhatikan dialog dibawah ini:
Petunjuk:
Control IDs: IDC_EDITCELSIUS dan IDC_SCROLLBAR
Member Variable: m_editcelsius (int) dan m_scrollbar (control)
void CDerajatDlg::OnChangeEditcelsius()
{
UpdateData(true);
m_scrollbar.SetScrollPos(100 - m_editcelsius);
UpdateData(false);
}
6. Buatlah program aplikasi dialog “Suhu” yang menampilkan tiga kontrol scoll bar.
Dimana masing- masing mewakili thermometer Celsius, Reamur dan Fahrenheit,
pada saat penunjuk scroll bar Celsius digeser maka otomatis penunjuk pada scroll
bar Reamur dan Fahrenheit menyesuaikan.
62
Petunjuk:
Berikut adalah tipe-tipe variable yang digunakan pada aplikasi dialog “Suhu”
Tambahkan baris-baris program didalam fungsi ::OnInitDialog() sebagai

berikut:
m_sbcelsius.SetScrollRange(0, 100);
m_sbreamur.SetScrollRange(0, 80);
m_sbfahrenheit.SetScrollRange(32, 212);
m_stcelsius=”0”;
m_streamur=”0”;
m_fahrenheit=”0”;
UpdateData(false);
Tambahkan fungsi baru, yaitu dengan cara masuk ke Class Wizard, pada tab
Message Maps, pada kotak edit Object IDs pilih CSuhuDlg, pada kotak edit
Messages pilih WM_VSCROLL, klik Add Function, kemudian klik Edit Code
untuk menambahkan baris-baris program seperti dibawah ini:
int CurPos = m_sbcelsius.GetScrollPos();

m_stcelsius.Format("%d", CurPos);
UpdateData(false);
63
switch (nSBCode) {
case SB_LINELEFT: // Scroll left.
CurPos--; break;
case SB_LINERIGHT: // Scroll right.

CurPos++; break;
case SB_PAGELEFT: // Scroll one page left.

CurPos-=10;
break;
case SB_PAGERIGHT: // Scroll one page right

CurPos+=10;
break;
case SB_THUMBPOSITION: // Stright Scroll

CurPos = nPos;
break;
case SB_THUMBTRACK: // Real Scroll

CurPos = nPos;
break;
}
m_sbcelsius.SetScrollPos(CurPos);
64

Pemrograman Aplikasi Visual C

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Pemrograman Aplikasi Visual C

Uploaded by

Copyright:

Available Formats

This watermark does not appear in the registered version - http://www.clicktoconvert.

BAB 1: Pemrograman Aplikasi Visual C++

1.1 Tools AppWizard

ü Jalankan Visual C++

Gambar 1.1 Kotak dialog New

ü Pilih MFC AppWizard (exe)

1.2 Tipe Aplikasi

1.3 Tipe Aplikasi Berbasis Dialog

Gambar 1.2 Langkah 1 Pilihan Tipe Aplikasi

Selanjutnya klik next untuk melanjutkan ke langkah berikutnya, yaitu menentukan

Gambar 1.3 Langkah 2 Pilihan Fitur-fitur yang diinginkan

Gambar 1.4 Langkah 3 Pilihan Pustaka MFC

Pada langkah dibawah dapat dilakukan pengubahan nama-nama AppWizard

Gambar 1.5 Langkah 4 Pilihan Namafile dan Namakelas

Gambar 1.6 Konfirmasi Nama-nama file sebelum dilakukan pembuatan

Gambar 1.7 Tampilan awal dialog kosong “Dialogku”

Gambar 1.8 Toolbox Controls yang menyertai dialog kosong “Dialogku”

1.4 Icon-icon pada ToolBox Control

Icon Static Text

Icon Edit Box

Icon Group Box

Icon Check Box

Icon Radio Button

Icon Combo Box

Icon List Box

Icon Horizontal Scroll Bar

Icon Vertical Scroll Bar

Icon Tab Control

Icon Month Calendar

Icon Date Time Picker

BAB 2: Kotak Edit, Tombol Radio dan Kotak Cawang

2.1 Kotak Edit Control

Gambar 2.1 Tampilan Awal pembuatan Kotak Edit

Gambar 2.2 Mengganti tampilan pada teks static pertama (atas)

Gambar 2.3 Mengganti tampilan pada teks static kedua (bawah)

Gambar 2.4 Hasil tampilan teks setelah diubah

2.1.1 Mengambil Data Masukan

Gambar 2.5 Penggantian label “Button1” menjadi “Proses”

Gambar 2.6 Penambahan tombol tekan “Proses”

Gambar 2.7 Penambahan Fungsi Anggota

Gambar 2.8 Penggantian Nama Fungsi Anggota

Gambar 2.9 Penambahan Fungsi Anggota Baru “OnProses()”

int pembilang, penyebut, hasil;

Gambar 2.10 Tampilan program dialog pembagian “Dialogku”

Kelemahan dari fungsi GetDlgItemText() dan GetDlgItemInt() adalah tipe

Gambar 2.11 Kotak Dialog MFC ClassWizard

Gambar 2.12 Dialog MFC ClassWizard pada tab Member Variable

Setelah variable-variabel tersebut dideklarasikan, maka dapat dilihat

1. Tekan [Ctrl] + [W] untuk membuka dialog ClassWizard.

2. Pilih tab Member Variables, pilih variable yang akan diubah,

void CDialogkuDlg::DoDataExchange(CDataExchange* pDX)

Terdapat tambahan fungsi DDV_MinMaxFloat(), yang berfungsi untuk membatasi

Gambar 2.13 Daftar TipeVariabel yang dibuat

CDialogkuDlg::CDialogkuDlg(CWnd* pParent /*=NULL*/)

sprintf(chasil,"Hasil pembagian = %f",fhasil);

Fungsi UpdateData(TRUE) digunakan untuk memperbarui nilai dari variable obyek

Gambar 2.15 Pesan Kesalahan yang terjadi

2.1.2 Menampilkan Hasil Proses

Berikut ini digunakan cara pertama yaitu menggunakan fungsi

sprintf(chasil,"Hasil pembagian = %f",fhasil);

Fungsi SetDlgItemText() memerlukan ID dari kotak edit yang bersangkutan,

Gambar 2.17 Hasil tampilan pembagian

Gambar 2.19 Modifikasi Kotak Edit Hasil Proses

Tambahkan/ modifikasi baris-baris berikut pada program sebelumnya:

CDialogkuDlg::CDialogkuDlg(CWnd* pParent /=NULL/)

CSpinDlg::CSpinDlg(CWnd* pParent /=NULL/)