LAPORAN PEMROGRAMAN VISUAL MDI MULTIPL

LAPORAN PRAKTIKUM

BAHASA PEMOGRAMAN VISUAL

Ananda Putri Syaviri

130533608243

Offering B

UNIVERSITAS NEGERI MALANG

FAKULTAS TEKNIK ELEKTRO

PROGRAM STUDI

S1 PENDIDIKAN TEKNIK INFORMATIKA

Maret, 2015

LABORATORIUM KOMPUTER

Fakultas Teknik Elektro - Universitas Negeri Malang Jl.Semarang, Jawa Timur

Nama Ananda Putri Syaviri

Nim 130533608243

Prodi S1 PTI Offering B

Dosen Pembimbing 1. Ashar Ahmad, M.Pd

2. Ahmad Mursyidun Nidhom, M.Pd

PRAKTIKUM KE-5 APLIKASI WINDOWS FORM

A.

TUJUAN

 Memahami komponen-komponen aplikasi windows form.

 Mampu menggunakan menumenu dan MDI untuk menciptakan aplikasi Windows Form.

B.

DASAR TEORI (Modul 4.1) 1. Menu

Keberadaan menu mempunyai tujuan agar end user untuk mengakses perintah-perintah dan fungsi-fungsi high level dalam antarmuka yang familiar dan mudah dipahami. Di Windows Form, menu utama direpresentasikan oleh objek MenuStrip. Menu ini berperan sebagai penampung item-item menu dalam struktur menu.

2. Menu Pop-up

Jenis menu ini memerlukan pemicu seperti klik kanan agar dapat ditampilkan.

3. Tool Bar

Pada Windows Form, tool bar direpresentasikan oleh objek ToolBar, dan button-buton di dalamnya direpresentasikan oleh ToolBarButton.

4. MDI (Multiple Document Interface)

MDI menyediakan metodologi untuk menyediakan antarmuka “document centric”. Salah satu keuntungan MDI adalah mereduksi clutter dan meningkatkan efisiensi penggunaan layar.

C. LATIHAN :

Latihan 1 : Menu

Menu dihasilkan melalui objek MenuItem yang merepresentasikan bagian-bagian individu menu, misalnya File > New, Open, dan sebagainya. Langkah - langkah pembuatan menu diperlihatkan sebagai berikut:

2. Menambah tools Menustrip ke dalam form dan membuat menu file , edit dan view.

3. Mengatur properti menu seperti tabel berikut:

4. Menambahkan sub menu Cut, Copy, Paste dan Select All dan membuat shortcutKeys untuk masing-masing submenu.

6. Atur properti Rich Textbo, pada Dock menjadi center.

7. Melengkapi kode program dibawah ini pada setiap menu dan submenu.

PublicClassForm1

PrivateSub CutToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles CutToolStripMenuItem.Click IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Cut() EndIf

EndSub

PrivateSub CopyToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles CopyToolStripMenuItem.Click IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Copy() EndIf

EndSub

PrivateSub PasteToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles PasteToolStripMenuItem.Click Me.RichTextBox1.Paste()

EndSub

PrivateSub SelectAllToolStripMenuItem_Click(ByVal sender As

System.Object, ByVal e As System.EventArgs) Handles

SelectAllToolStripMenuItem.Click Me.RichTextBox1.SelectAll() EndSub

EndClass

Keterangan : pada program diatas dapat menerapkan menu copy, paste, select all dan cut setelah diberikan submenu dan melengkapi kode program agar submeu dapat digunakan. Namun pada program latihan 1 ini, sub menu tidak dapat ditampilkan ketika mengklik kanan pada richbox. Sehingga dapat menggunakan shortcutKeys atau mengklik pada menu bar. Untuk kode program yang digunakan

IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Cut()

Artinya: digunakan pada richtextbox, jika menselect text yang dituliskan kemudian menggunakan submenu cut , hasilnya akan terpotong. Begitu juga dengan yang lainnya, untuk menu copy menggunakan Me.RichTextBox1.Copy. Untuk paste dan select all, tidak menggunakan perkondisian sehingga penulisan kode program : Me.RichTextBox1.Paste ( ); Me.RichTextBox1.SelectAll ( );

Latihan 2 : Menu Pop Up

1. Melanjutkan project sebelumnya dengan menambahkan sebuah komponen ContextMenuStrip pada form dan membuat menu item Cut, Copy, Paste, dan Select All pada ContextMenuStrip.. Atau bisa membuat project baru dan jangan lupa didahului dengan langkah pada latihan 1.

2. Untuk menambahkan shortcutKeys dapat diatur pada properties seperti pada latihan 1.

3. Lengkapi kode program berikut :

PublicClassForm1

PrivateSub CutToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles CutToolStripMenuItem.Click IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Cut() EndIf

EndSub

PrivateSub CopyToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles CopyToolStripMenuItem.Click IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Copy() EndIf

EndSub

PrivateSub PasteToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles PasteToolStripMenuItem.Click Me.RichTextBox1.Paste()

EndSub

PrivateSub SelectAllToolStripMenuItem_Click(ByVal sender As

System.Object, ByVal e As System.EventArgs) Handles

SelectAllToolStripMenuItem.Click Me.RichTextBox1.SelectAll() EndSub

PrivateSub ContextMenuStrip1_Opening(ByVal sender As System.Object,

ByVal e As System.ComponentModel.CancelEventArgs) Handles

ContextMenuStrip1.Opening EndSub

4. Mengaitkan Context Menu dengan Rich textbox atur pada properties RichTextBox.

5. Tekan F5 untuk menampilkan hasil program

Keterangan : pada program diatas sama seperti program pada latihan 1, bedanya hanya menggunakan contextmenustrip yang fungsinya dapat menampilkan submenu pada richtextbox, tanpa mengklik menu bar, daat dilakukan dengan klik kanan. Untuk kode program yang digunakan sama seperti latihan 1

IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Cut()

Artinya: digunakan pada richtextbox, jika menselect text yang dituliskan kemudian menggunakan submenu cut , hasilnya akan terpotong. Begitu juga dengan yang lainnya, untuk menu copy menggunakan Me.RichTextBox1.Copy. Untuk paste dan select all, tidak menggunakan perkondisian sehingga penulisan kode program : Me.RichTextBox1.Paste ( ); Me.RichTextBox1.SelectAll ( );

1. Melanjutkan project sebelumnya dengan menambahkan sebuah komponen ToolStrip pada form.

2. Menambahkan Button untuk membuat menu Tool Bar pada Form dan mengubah image button sesuai dengan submenu yang akan digunakan, missal: cut maka menggunakan icon gunting, dll.

3. Mengatur properti pada button.

4. Melengkapi kode program berikut:

PublicClassForm1

PrivateSub ToolStripButton1_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles ToolStripButton1.Click IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Cut() EndIf

EndSub

PrivateSub ToolStripButton2_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles ToolStripButton2.Click IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Copy() EndIf

PrivateSub ToolStripButton3_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles ToolStripButton3.Click Me.RichTextBox1.Paste()

EndSub EndClass

5. Tekan F5 utuk menampilkan hasil program.

Keterangan : pada program diatas sama seperti program pada latihan 1 dan 2, bedanya hanya menambahkan penggunaan toolstrip yang fungsinya menyediakan button untuk submenu cut, copy, dll, sehingga penggunaanya tinggal mnegklik button yang tersedia pada menu bar. Untuk kode program yang digunakan sama seperti latihan 1 dan 2

IfMe.RichTextBox1.SelectedText <> "" Then

Me.RichTextBox1.Cut()

Artinya: digunakan pada richtextbox, jika menselect text yang dituliskan kemudian menggunakan button cut , hasilnya akan terpotong. Begitu juga dengan yang lainnya, untuk menu copy menggunakan Me.RichTextBox1.Copy.

Untuk paste dan select all, tidak menggunakan perkondisian sehingga penulisan kode program : Me.RichTextBox1.Paste ( ); Me.RichTextBox1.SelectAll ( );

Latihan 4 : MDI

1. Membuat project Windows baru.

2. Mengatur Form pertama menjadi form default. Atur properti form untuk IsMdiContainer menjadi True.

3. Menambahkan MenuStripTool dan membuat menu file dan window.

4. Menambahkan sub menu pada menu File dan menu Window dengan properti seperti dibawah ini:

6. Melanjutkan pembuatan Form2 “Child” dan ubah propertinya menjadi frmChild.

7. Menambahkan Rich Textbox ke dalam Form2 dan atur properti Docknya menjadi Center.

8. Melengkapi kode program pada form 1:

Public Class Form1

Private Sub HorizontalToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles

HorizontalToolStripMenuItem.Click

Me.LayoutMdi(MdiLayout.TileHorizontal) End Sub

Private Sub CascadeToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles

CascadeToolStripMenuItem.Click

Me.LayoutMdi(MdiLayout.Cascade) End Sub

Private Sub ArrangeIconsToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles

ArrangeIconsToolStripMenuItem.Click

Me.LayoutMdi(MdiLayout.ArrangeIcons) End Sub

Private Sub CloseAllToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles

CloseAllToolStripMenuItem.Click

For Each ChildForm As Form In Me.MdiChildren ChildForm.Close()

Next End Sub

Private Sub NewToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles NewToolStripMenuItem.Click

Dim MDIChild As New frmChild MDIChild.MdiParent = Me MDIChild.Text = "Window" MDIChild.Show()

End Sub

Private Sub VerticalToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles

VerticalToolStripMenuItem.Click

Me.LayoutMdi(MdiLayout.TileVertical) End Sub

End Class

9. Untuk menampilkan daftar window yang terbuka, mengubah nilai property MdiWindowListItem pada komponen MenuStrip menjadi WindToolStripMenuItem.

Keterangan : Pada program diatas menerapkan MDI , yaitu multiple document interface, yang artinya, dalam satu windows, dapat terdiri dari ebberapa windows lainnya. Yang disebut anak window(child). Untuk peletakan posisi window dapat diatur dengan fungsi horizontal, vertical, arrange icons, cascade, dll. Untuk mengaitkan form 1 dan 2 mengubah properties ada tool yang digunakan, karena menggunakan menustrip, sehingga properties MDI pada menustrip diubah menjadi

MdiWindowListItem WindToolStripMenuItem.

D.

PRAKTIKUM Tugas Praktikum 1:

Sempurnakan pembuatan MDI agar mampu menghasilkan title yang unik pada child window. Misalnya Window 1, Window 2, Window 3, dan seterusnya. Di mana nilai bilangan (urutan) dokumen di-generate secara dinamis.

Langkah-langkah:

1) Sama seperti latihan 4, hanya menambahkan kode program agar dapat disempurnakan.

2) Melengkapi kode program :

PublicClassForm1

Dim s AsString = 0

PrivateSub NewToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles NewToolStripMenuItem.Click Dim MDIChild AsNewfrmChild

MDIChild.MdiParent = Me

MDIChild.Text = "Window " & s MDIChild.Show()

s = s + 1 EndSub

PrivateSub TileHorizontallyToolStripMenuItem_Click(ByVal sender As

System.Object, ByVal e As System.EventArgs) Handles

TileHorizontallyToolStripMenuItem.Click Me.LayoutMdi(MdiLayout.TileHorizontal) EndSub

PrivateSub TileVerticallyToolStripMenuItem_Click(ByVal sender As

System.Object, ByVal e As System.EventArgs) Handles

TileVerticallyToolStripMenuItem.Click Me.LayoutMdi(MdiLayout.TileVertical) EndSub

PrivateSub CascadeToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles CascadeToolStripMenuItem.Click Me.LayoutMdi(MdiLayout.Cascade)

EndSub

PrivateSub ArrangeIconsToolStripMenuItem_Click(ByVal sender As

System.Object, ByVal e As System.EventArgs) Handles

ArrangeIconsToolStripMenuItem.Click

Me.LayoutMdi(MdiLayout.ArrangeIcons) EndSub

PrivateSub CloseToolStripMenuItem_Click_1(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles CloseToolStripMenuItem.Click ForEach ChildForm AsFormInMe.MdiChildren

ChildForm.Close() Next

EndSub

PrivateSub ExitToolStripMenuItem_Click(ByVal sender As System.Object, ByVal

e As System.EventArgs) Handles ExitToolStripMenuItem.Click Me.Close()

EndSub EndClass

3) Tekan F5 untuk menampilkan hasil program :

Keterangan:

Program diatas dibuat untuk dapat menampilkan berapa window yang telah dibuka dengan menggunakan kode program :

Dim s AsString = 0

PrivateSub NewToolStripMenuItem_Click(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles NewToolStripMenuItem.Click Dim MDIChild AsNewfrmChild

MDIChild.Text = "Window " & s MDIChild.Show()

s = s + 1 EndSub

Yang artinya, membuat objek baru MDIChild pada formChild, dimana , pada MDIChild akan tertera text , Window … s , jika s bertambah 1 , maka Window yang akan tertera adalah 1 Window 0 , 2 Window 1, dst.

Tugas Praktikum 2:

Tambahkan form login pada aplikasi MDI yang dibuat. Gunakan kondisi IF untuk simulasi validasi identitas. Jika validasi login berhasil, maka tampilkan form MDI, jika gagal tampilkan peringatan gagal login yang dilanjutkan dengan penutupan aplikasi.

Langkah-langkah:

1. Membuat form untuk login dan masuk:

2. Melengkapi kode program pada form login

PublicClassForm1

Dim MDIChild AsNewfrmChild

PrivateSub Button1_Click(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Button1.Click

If TextBox1.Text = "syaviri" And TextBox2.Text = "110395" Then

MDIChild.Show() Else

MessageBox.Show("ID dan Password salah, silahkan coba kembali") EndIf

EndSub EndClass

3. Mengatur agar form login tampil awal dengan klik Project > Properties > Startup Form = Form1.

4. Tekan F5 untuk menampilkan hasil program

Program diatas menggunakan fungsi perkondisian if else untuk membuat login pada form. Dengan kondisi, jika textbox ID diinputkan “syaviri” dan textbox password “110395” , maka akan dinavigasikan ke form masuk (form child/2). Jika salah satu textbox diisi selain yang ditentukan pada kode program maka akan muncul textbox “ID dan password salah, silahkan coba kembali”.

Tugas Praktikum 3:

Tambahkan status bar pada aplikasi MDI yang dibuat. Misal: untuk menampilkan current time.

Langkah-langkah:

1. Membuat form 1 dan form 2. Pada form 2, menggunakan status strip untuk menampilkan status bar current time. Menggunakan timer, agar pada saat masuk ke form 2, dapat menampilkan waktu yang berjalan sesuai kapan form di jalankan.

2. Melengkapi kode program.

PublicClassfrmChild

PrivateSub frmChild_Load(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles MyBase.Load

Label1.Text = Date.Now.ToString("dddd, dd MMMM yyyy") Timer1.Enabled = True

EndSub

PrivateSub Timer1_Tick(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Timer1.Tick

Label2.Text = Date.Now.ToString("hh:mm:ss")

ToolStripStatusLabel1.Text = Date.Now.ToString("hh:mm:ss") EndSub

EndClass

PublicClassForm1

Dim MDIChild AsNewfrmChild

PrivateSub Button1_Click(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Button1.Click MDIChild.MdiParent = Me

MDIChild.Show() Button1.Visible = False

EndSub EndClass

3. Tekan F5 untuk menampilkan hasil program

Keterangan:

- Program diatas dapat dibuat dengan melanjutkan project pada latihan sebelumnya, tinggal menambahkan timer dan status trip untuk status bar current time pada sebuah window. Untuk kode program dapat menggunakan

Date.Now.ToString("hh:mm:ss") artinya, untuk pengaturan waktu , dengan format hour,

menit, second. Begitu juga dengan

Date.Now.ToString("dddd, dd MMMM yyyy")

Yang artinya , untuk pengaturan tanggal, dengan format day, month, dan year.

E.

TUGAS RUMAH

1. Buat splash screen sebagai pembuka dari aplikasi. Langkah-langkah:

1. Membuat project baru, dan membuat item Form1. 2. Menambahkan item baru yaitu Splashscreen. 3. Menambahkan tools, progress bar dan timer. 4. Melengkapi kode program

PublicNotInheritableClassSplashScreen1

PrivateSub Timer1_Tick(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Timer1.Tick ProgressBar1.Value += 10

If ProgressBar1.Value = 100 Then

Timer1.Dispose() Form1.Show() EndIf

EndClass

5. Buka Project > Properties > setting Startup form = Splashscreen1 > setting Shutdown mode = When last form Close. Fungsinya untuk mengatur splashcscreen exit ketika progress bar selesai.

6. Run, tampilannya akan seperti ini:

Keterangan :

- Pada program diatas menggunkan item splashscreen untuk membuat tampilan awal jika membuka sebuah program aplikasi. Menggunakan progress bar untuk mengetahui berapa lama proses membuak sebuah program agar masuk ke halaman awal sebuah aplikasi. Alur kerja dari program diatas adalah, menggunakan timer value +10, sehingga progress bar akan bertamabh dengan nilai pertamabahn 10, jika selesai maka splashscreen akan keluar dan masuk ke form 1.

F.

KESIMPULAN

Modul 11 – Window Aplication Form/Praktikum Pemrograman Visual (PTI438)/FT-UM/Universitas Negeri Malang.

MDIChild.Text = "Window " & s MDIChild.Show()

s = s + 1 EndSub

Yang artinya, membuat objek baru MDIChild pada formChild, dimana , pada MDIChild akan tertera text , Window … s , jika s bertambah 1 , maka Window yang akan tertera adalah 1 Window 0 , 2 Window 1, dst.

Tugas Praktikum 2:

Tambahkan form login pada aplikasi MDI yang dibuat. Gunakan kondisi IF untuk simulasi validasi identitas. Jika validasi login berhasil, maka tampilkan form MDI, jika gagal tampilkan peringatan gagal login yang dilanjutkan dengan penutupan aplikasi.

Langkah-langkah:

1. Membuat form untuk login dan masuk:

2. Melengkapi kode program pada form login PublicClass Form1

Dim MDIChild AsNew frmChild

PrivateSub Button1_Click(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Button1.Click

If TextBox1.Text = "syaviri" And TextBox2.Text = "110395" Then

MDIChild.Show() Else

MessageBox.Show("ID dan Password salah, silahkan coba kembali") EndIf

EndSub EndClass

3. Mengatur agar form login tampil awal dengan klik Project > Properties > Startup Form = Form1.

4. Tekan F5 untuk menampilkan hasil program

Program diatas menggunakan fungsi perkondisian if else untuk membuat login pada form. Dengan kondisi, jika textbox ID diinputkan “syaviri” dan textbox password “110395” , maka akan dinavigasikan ke form masuk (form child/2). Jika salah satu textbox diisi selain yang ditentukan pada kode program maka akan muncul textbox “ID dan password salah, silahkan coba kembali”.

Tugas Praktikum 3:

Tambahkan status bar pada aplikasi MDI yang dibuat. Misal: untuk menampilkan current time.

Langkah-langkah:

1. Membuat form 1 dan form 2. Pada form 2, menggunakan status strip untuk menampilkan status bar current time. Menggunakan timer, agar pada saat masuk ke form 2, dapat menampilkan waktu yang berjalan sesuai kapan form di jalankan.

2. Melengkapi kode program. PublicClass frmChild

PrivateSub frmChild_Load(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles MyBase.Load

Label1.Text = Date.Now.ToString("dddd, dd MMMM yyyy") Timer1.Enabled = True

EndSub

PrivateSub Timer1_Tick(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Timer1.Tick

Label2.Text = Date.Now.ToString("hh:mm:ss")

ToolStripStatusLabel1.Text = Date.Now.ToString("hh:mm:ss") EndSub

EndClass

PublicClass Form1

Dim MDIChild AsNew frmChild

PrivateSub Button1_Click(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Button1.Click MDIChild.MdiParent = Me

MDIChild.Show() Button1.Visible = False

EndSub EndClass

3. Tekan F5 untuk menampilkan hasil program

Keterangan:

- Program diatas dapat dibuat dengan melanjutkan project pada latihan sebelumnya, tinggal menambahkan timer dan status trip untuk status bar current time pada sebuah window. Untuk kode program dapat menggunakan

Date.Now.ToString("hh:mm:ss") artinya, untuk pengaturan waktu , dengan format hour,

menit, second. Begitu juga dengan Date.Now.ToString("dddd, dd MMMM yyyy")

Yang artinya , untuk pengaturan tanggal, dengan format day, month, dan year.

E.

TUGAS RUMAH

1. Buat splash screen sebagai pembuka dari aplikasi.

Langkah-langkah:

1. Membuat project baru, dan membuat item Form1. 2. Menambahkan item baru yaitu Splashscreen. 3. Menambahkan tools, progress bar dan timer. 4. Melengkapi kode program

PublicNotInheritableClass SplashScreen1

PrivateSub Timer1_Tick(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Timer1.Tick ProgressBar1.Value += 10

If ProgressBar1.Value = 100 Then

Timer1.Dispose() Form1.Show() EndIf

EndClass

5. Buka Project > Properties > setting Startup form = Splashscreen1 > setting Shutdown mode = When last form Close. Fungsinya untuk mengatur splashcscreen exit ketika progress bar selesai.

6. Run, tampilannya akan seperti ini:

Keterangan :

- Pada program diatas menggunkan item splashscreen untuk membuat tampilan awal jika membuka sebuah program aplikasi. Menggunakan progress bar untuk mengetahui berapa lama proses membuak sebuah program agar masuk ke halaman awal sebuah aplikasi. Alur kerja dari program diatas adalah, menggunakan timer value +10, sehingga progress bar akan bertamabh dengan nilai pertamabahn 10, jika selesai maka splashscreen akan keluar dan masuk ke form 1.

F.

KESIMPULAN

Modul 11 – Window Aplication Form/Praktikum Pemrograman Visual (PTI438)/FT-UM/Universitas Negeri Malang.