5. Toolbar Exit Digunakan untuk keluar dari program aplikasi.
4.4.2 Pendesainan Form
Pada langkah pendesain form, dirancang tampilan-tampilan grafis yang dapat dibuat sebagai antar muka pemakai aplikasi. Hal-hal yang perlu dipertimbangkan adalah:
1. Bagaimana membuat form-form yang efektif serta sesuai dengan
kebutuhan. 2.
Bagaimana mengatur tata letak form layout, baik itu pewarnaan serta penentuan seperti kontrol-kontrol pada form yang akan mempenngaruhi
segi estetika sebuah antar muka pemakai.
Adapun tampilan atau model dari setiap form input data dalam sistem yang dibuat adalah sebagai berikut:
Name : frmhalaman.frm Caption : PROGRAM PENGENDALI SURAT
Icon : Sembarang
Universitas Sumatera Utara
1. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting Toolbar
Name Caption
Toolbar1 -
Picturebox Name
Caption Picture1
- Label1
Name Caption
Label1 PT. PERSERO
ANGKASA PURA II
Label2 Name
Caption Label2
BANDAR UDARA POLONIA
Label3 Name
Caption Label3
MEDAN Monthview
Name Caption
MonthView1 -
Frame Name
Caption Frame1
- Picturebox
Name Caption
Picture2 -
Textbox Name
Caption Text1
-
Tabel 3.0 propertis Tampilan frmhalaman
Selanjutnya mengedit menu Toolbar terlihat pada gambar berikut:
Gambar 3.0 Atur Properties Toolbar
Universitas Sumatera Utara
Setelah itu akan muncul gambar berikut
Gambar 3.1 Property Pages
Pada menu Button masukkan nama menu yang akan diklik. Klik tombol insert menu untuk memasukkan daftar menu yang akan diklik.terlihat pada gambar berikut:
Gambar 3.2 Buttons
Universitas Sumatera Utara
Maka akan menghasilkan Desain Berikut ini:
Gambar 3.3 Hasil Desain frmhalaman
Selanjutnya membuat tampilan surat masuk berikut cara memmbuatnya:
2. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting DataGrid
Name Caption
DataGrid1 -
CommandButton Name
Caption Cmdtambah
Tambah CommandButton
Name Caption
Cmdhapus Hapus
CommandButton Name
Caption Cmdkeluar
Keluar
Tabel 3.1 Edit tampilan frmsuratmasuk
Universitas Sumatera Utara
Maka akan terlihat Hasil Desain berikut:
Gambar 3.4 Hasil Desain frmsuratmasuk
Selanjutnya membuat tampilan Tambah surat masuk berikut cara memmbuatnya: Objek
Properti Setting
Label1 Name
Caption Label1
Tanggal Diterima Label2
Name Caption
Label2 Tanggal Diajukan
Label3 Name
Caption Label3
Perihal Surat Label4
Name Caption
Label4 Kepada
Label5 Name
Caption Label5
DariPengirim TextBox
Name Caption
Txttanggalditerima -
TextBox Name
Caption Txtdiajukan
- TextBox
Name Caption
Txthalsurat -
TextBox Name
Caption Txtkepada
- TextBox
Name Caption
txt1 -
CommandButton Name
Caption Cmdsimpan
Simpan CommandButton
Name Caption
Cmdbatal Batal
Tabel 3.2 Desain Form Tambah dan Edit
Universitas Sumatera Utara
Maka akan terkihat hasil desain sebagai berikut:
Gambar 3.5 Desain Form Edit Data Surat Masuk
Selanjutnya membuat tampilan surat keluar berikut cara memmbuatnya:
3. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting DataGrid
Name Caption
DataGrid1 -
CommandButton Name
Caption Cmdtambah
Tambah CommandButton
Name Caption
Cmdhapus Hapus
CommandButton Name
Caption Cmdkeluar
Keluar CommandButton
Name Caption
Cmdedit Edit
Tabel 3.3 Desain Form Surat Masuk
Universitas Sumatera Utara
Maka akan terlihat Hasil Desain berikut:
Gambar 3.6 Desain Daftar Data Surat Masuk
Selanjutnya membuat tampilan Tambah dan Edit surat masuk berikut cara membuatnya:
Objek Properti
Setting Label1
Name Caption
Label1 Nama Surat
Label2 Name
Caption Label2
Lampiran Label3
Name Caption
Label3 Tujuan
Universitas Sumatera Utara
Label4 Name
Caption Label4
Perihal Label5
Name Caption
Label5 Pengirim
Label6 Name
Caption Label6
Tembusan TextBox
Name Caption
txtnamasurat -
TextBox Name
Caption txtlampiran
- TextBox
Name Caption
txttujuan -
TextBox Name
Properti txtperihal
- TextBox
Name Caption
txtpengirim -
TextBox Name
Caption Txttembusan
- CommandButton
Name Caption
Cmdsimpan Simpan
CommandButton Name
Caption Cmdbatal
Batal
Tabel 3.4 Properties Data Tambah dan Edit Surat Keluar
Maka akan terlihat Hasil Desain berikut:
Gambar 3.7 Hasil Desain Data Surat Keluar
Universitas Sumatera Utara
Selanjutnya membuat tampilan Data Agenda berikut cara membuatnya:
4. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting DataGrid
Name Caption
DataGrid1 -
CommandButton Name
Caption Cmdtambah
Tambah CommandButton
Name Caption
Cmdhapus Hapus
CommandButton Name
Caption Cmdkeluar
Keluar CommandButton
Name Caption
Cmdedit Edit
Tabel 3.5 Properties Data Agenda
Maka akan terlihat Hasil Desain berikut:
Gambar 3.8 Hasil Desain Data Agenda
Universitas Sumatera Utara
Selanjutnya membuat tampilan Tambah dan Edit surat masuk berikut cara membuatnya:
Objek Properti
Setting Label1
Name Caption
Label1 No_Surat
Label2 Name
Caption Label2
Dari Label3
Name Caption
Label3 Keterangan
TextBox Name
Caption txtnosurat
- TextBox
Name Caption
Txtdari -
TextBox Name
Caption Txtket
- CommandButton
Name Caption
Cmdsimpan Simpan
CommandButton Name
Caption Cmdbatal
Batal
Tabel 3.6 Properti Data Tambah dan Edit Agenda
Maka akan terlihat Hasil Desain berikut:
Gambar 3.9 Hasil Desain Tambah dan Edit Data Agenda
Universitas Sumatera Utara
Selanjutnya membuat tampilan Data Terusan berikut cara membuatnya:
5. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting DataGrid
Name Caption
DataGrid1 -
CommandButton Name
Caption Cmdtambah
Tambah CommandButton
Name Caption
Cmdhapus Hapus
CommandButton Name
Caption Cmdkeluar
Keluar CommandButton
Name Caption
Cmdedit Edit
Tabel 3.7 Properti Data Terusan
Maka akan terlihat Hasil Desain berikut :
Gambar 3.10 Hasil Desain Data Terusan
Universitas Sumatera Utara
Selanjutnya membuat tampilan Tambah dan Edit surat masuk berikut cara membuatnya:
Objek Properti
Setting Label1
Name Caption
Label1 Kode_Terusan
Label2 Name
Caption Label2
Terusan TextBox
Name Caption
Txtkoter -
TextBox Name
Caption Txtterusan
- CommandButton
Name Caption
Cmdsimpan Simpan
CommandButton Name
Caption Cmdbatal
Batal
Tabel 3.8 Properties Tambah dan Edit Data Terusan
Maka akan terlihat Hasil Desain berikut
Gambar 3.11 Hasil Desain Tambah dan Edit Data Terusan
Universitas Sumatera Utara
Selanjutnya membuat tampilan Data Terusan berikut cara membuatnya:
6. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting DataGrid
Name Caption
DataGrid1 -
CommandButton Name
Caption Cmdtambah
Tambah CommandButton
Name Caption
Cmdhapus Hapus
CommandButton Name
Caption Cmdkeluar
Keluar CommandButton
Name Caption
Cmdedit Edit
Tabel 3.9 Properties Data Masalah
Maka akan terlihat Hasil Desain berikut
Gambar 3.12 Hasil Desain Data Masalah
Universitas Sumatera Utara
Selanjutnya membuat tampilan Tambah dan Edit Data Masalah berikut cara membuatnya:
Objek Properti
Setting Label1
Name Caption
Label1 Kode_Masalah
Label2 Name
Caption Label2
Masalah TextBox
Name Caption
Txtkode -
TextBox Name
Caption Txtmasalah
- CommandButton
Name Caption
Cmdsimpan Simpan
CommandButton Name
Caption Cmdbatal
Batal
Table 3.10 Properties data Tambah dan Edit Data Masalah
Maka akan terlihat Hasil Desain berikut
Gambar 3.13 Hasil Desain Tambah dan Edit Data Masalah
Universitas Sumatera Utara
Selanjutnya membuat tampilan Data Disposisi berikut cara membuatnya:
7. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting DataGrid
Name Caption
DataGrid1 -
CommandButton Name
Caption Cmdtambah
Tambah CommandButton
Name Caption
Cmdhapus Hapus
CommandButton Name
Caption Cmdkeluar
Keluar CommandButton
Name Caption
Cmdedit Edit
Table 3.11 Properties Data Disposisi
Maka akan terlihat Hasil Desain berikut
Gambar 3.14 Hasil Desain Data Disposisi
Universitas Sumatera Utara
Selanjutnya membuat tampilan Tambah dan Edit Data Disposisi berikut cara membuatnya:
Objek Properti
Setting Label1
Name Caption
Label1 Kode_Disposisi
Label2 Name
Caption Label2
Disposisi TextBox
Name Caption
Txtkodis -
TextBox Name
Caption Txtdisposisi
- CommandButton
Name Caption
Cmdsimpan Simpan
CommandButton Name
Caption Cmdbatal
Batal
Tabel 3.12 Properties Tambah dan Edit Data Disposisi
Maka akan terlihat Hasil Desain berikut
Gambar 3.15 Hasil Desain Tambah dan Edit Data Diposisi
Universitas Sumatera Utara
Selanjutnya membuat tampilan Form About berikut cara membuatnya:
8. Aktifkan Menu Editor, Kemudian desainlah menu seperti dibawah ini :
Objek Properti
Setting
Picture Box Name
Picture1 Picture Box
Name Picture2
Text Box Name
Text1 DMSXpButton1
Name cmdVisitMe
DMSXpButton2 Name
cmd_tutup Timer
Name Timer1
Tabel 3.13 Properties Form About
Maka akan terlihat Hasil Desain berikut
Gambar 3.16 Hasil Desain From About
Universitas Sumatera Utara
4.5 Algoritma