Form Cantik Activeskin 4.3

DISCLAIMER

Seluruh dokumen E-Trik di dalam CD ini dapat digunakan dan disebarkan secara bebas untuk tujuan belajar bukan komersial (non-profit), dengan syarat tidak menghapus atau merubah atribut penulis dan pernyataan copyright yang disertakan dalam dokumen. Tidak diperbolehkan melakukan penulisan ulang, kecuali mendapatkan ijin tertulis terlebih dahulu dari Penerbit Maxikom.

E-Trik Visual C++ 6.0

Form Cantik Dengan ActiveSkin 4.3

MUHAMMAD SADELI

�

E-Trik berikut ini merupakan E-Trik sederhana Visual C++ 6.0, yang dapat memodifikasi tampilan Form pada Visual C++ 6.0 dengan berbagai bentuk tipe dan jenis form yang Anda inginkan. Agar para pengguna program yang Anda buat tidak mudah bosan dengan tampilan program Anda.

A. Membuat Project Baru1. Buka program Microsoft Visual C++ 6.0. Caranya klik tombol Start pada

windows taksbar. Kemudian pilih All Programs > Microsoft Visual Studio 6.0 > Microsoft Visual C++ 6.0, lihat Gambar 1

Gambar 1. Membuka program Microsoft Visual C++ 6.0

�. Setelah menu kerja Microsoft Visual C++ tampil buatlah project baru Microsoft Visual C++ 6.0 dengan nama “Form Cantik Dengan ActiveSkin 4.3”. Caranya, klik menu File > New atau tekan Ctrl+N. Setelah itu kotak dialog New akan tampil, pada Tab project pilih jenis project MFC AppWizard(exe), lalu ketikkan nama project dan tentukan lokasi peny-impanan dengan menekan tombol , pada kolom Location kemudian klik OK, lihat Gambar 2

Form Cantik Dengan ActiveSkin 4.3E - Trik

3


Gambar 2. Menentukan jenis project

3. Pada kotak dialog MFC AppWizard - Step 1, pilih radio button Dialog Based kemudian klik tombol Next >, lihat Gambar 3

Gambar 3 Menentukan tipe aplikasi

4. Pada kotak dialog MFC AppWizard - Step 2 of 4, klik tombol Next >, lihat Gambar 4

1. Pilih Project MFC AppWizard(exe)

3. Tentukan Lokasi Penyimpanan

4. Klik Tombol OK

Tab Project

2. Ketik Nama Project

1. Pilih Radio Button Dialog Based

2. Klik Tombol Next >

4


Gambar 4. Menentukan fitur yang ingin dipakai

5. Pada kotak dialog MFC AppWizard - Step 3 of 4, klik tombol Next >, lihat Gambar 5

Gambar 5. Menetukan style project

6. Pada kotak dialog MFC AppWizard - Step 4 of 4, klik tombol Finish, lihat Gambar 6

Klik Tombol Next >

Klik Tombol Next >

5


Gambar 6. Hasil pembuatan project baru dari step 1 - step 4

7. Terakhir muncul kotak dialog New Project Information, klik tombol OK, lihat Gambar 7

Gambar 7. Menampilkan informasi project secara sfesifikasi

Klik Tombol Finish

Klik Tombol OK

6

B. Mendesain Tampilan Program

Setelah Selesai dalam pembuatan project baru Microsoft Visual C++ 6.0. Sek-arang Anda desain tampilan program yang akan Anda buat seperti dibawah ini, lihat Gambar 8

Gambar 8. Desain tampilan program

C. Menambahkan Komponen ActiveX Control ActiveSkin 4.3

Untuk mendukung jalanya aplikasi dengan baik Anda harus menambahkan komponen ActiveX Control yaitu ActiveSkin 4.3 Control sebanyak 6 buah, yang softwarenya bisa Anda Download di http://www.softshape.com. Untuk menempelkan kontrol ActiveSkin 4.3 ke dalam lembar Form Caranya ikuti langkah- langkah dibawah ini.

1. Klik kanan pada lembar Form kemudian pilih Insert ActiveX Control, lihat Gambar 9

Gambar 9. Menampilkan Komponen ActiveX Control


1. Klik Kanan Pada Lembar Form

2. Klik Insert Active X Control

Button

7

�. Kotak dialog Insert ActiveX Control akan muncul, pilih komponen dengan nama ActiveSkin Control 4.3, kemudian klik tombol OK, lihat Gambar 10

Gambar 10. Memilih komponen activeskin 4.3

3. Setelah itu komponen ActiveSkin 4.3 , akan tertempel secara otomatis pada lembar Form, lihat Gambar 11

Gambar 11. Komponen ActiveSkin yang tertempel pada lembar Form

D. Memberikan Nama Variabel Member

Setelah itu kita akan memberikan nama variabel member pada masing - mas-ing kontrol yang melekat pada lembar form. Untuk pemberian nama variabel member, kita hanya memberikan beberapa kontrol saja yang dianggap perlu dan mendukung dalam pembuatan kode atau listing pada jendela editor kode pemrograman Visual C++ 6.0. Berikut akan ditampilkan Tabel nama Variabel member, lihat Tabel 1.


1. Pilih Kontrol Active Skin 4.3 Control

2. Klik Tombol OK

Kontrol ActiveSkin 4.3

�

Tabel 1. Nama Variable Member

E. Memilih Jenis Skin

Untuk memilih jenis skin yang Anda inginkan Anda harus mencari folder “Skins” pada drive komputer Anda. Dan lokasi folder “Skins” tergantung pada waktu Anda menginstall software ActiveSkin 4.3, untuk memilih jenis “Skins”, Caranya :

1. Klik kanan kontrol ActiveSkin 4.3 yang tertempel pada lembar Form yang telah Anda desain. Kemudian pilih ActiveSkin 4.3 Control Object lalu klik Load Skin, lihat Gambar 12

ID Kontrol Type Kontrol Variabel Member Type Caption

IDC_BUTTON 1 BUTTON - CButton Tes Skin 1






IDC_KELUAR BUTTON - CButton Keluar

IDC_SKIN21 SKIN m_SKIN1 CSkin -







�

Gambar 12. Load Skin

�. Kotak dialog Open Skin akan muncul, cari lokasi folder “ActiveSkin 4.3” pada drive komputer Anda, dan pada folder ActiveSkin 4.3 akan terdapat folder “Skins”, klik folder tersebut dan kumpulan jenis “Skins” akan tampil, pilih jenis skin yang diinginkan dengan mengklik jenis skin lihat Gambar 13

Gambar 13. Menentukan jenis skin

3. Lakukan langkah 1 - � sampai pada kontrol ActiveSkin 4.3 yang ke 6, dan untuk jenis skin, sebagai contoh Anda dapat mengikuti ketentuan jenis skin dengan melihat tabel dibawah ini, lihat Tabel 2


1. Klik Kanan Pada Kontrol ActiveSkin 4.3

2. Pilih ActiveSkin 4.3 Control Object 2. Klik Load Skin

1. Klik ProgramFiles

2. Klik ActiveSkin 4.3

3. Klik Skins

4. Pilih Jenis Skin

10

Tabel �. Jenis Skin

F. Pembuatan Kode Atau Listing Program

Selanjutnya kita akan membuat kode pemrograman pada jendela editor kode pemrograman Visual C++ 6.0, ikuti langkah dibawah ini

1. Double klik pada tombol Button dengan caption “Tes Skin 1” klik tombol OK pada kotak dialog Add Member Function, kemudian ketikkan kode pemrograman seperti dibawah ini :

Hasil kode pemrograman diatas akan menghasilkan tampilan Form seperti gambar dibawah ini, lihat Gambar 14


ID Skin Jenis Skin

IDC_SKIN21 Winaqua

IDC_SKIN22 Green

IDC_SKIN22 Web II

IDC_SKIN22 Top Secret

IDC_SKIN22 B - Studio

IDC_SKIN22 Zhelezo

m_SKIN1.ApplySkin(0);1

- Baris 1 Merupakan fungsi untuk merubah tampilan Form atau meng aktifkan jenis skin pada kontrol ActiveSkin 4.3 yang pertama sesuai dengan jenis skin yang kita pilih pada saat Load Skin.

Keterangan Kode

11

Gambar 14. Bentuk Form kontrol ActiveSkin 4.3 yang pertama

�. Double klik pada tombol Button dengan caption “Tes Skin �” klik tombol OK pada kotak dialog Add Member Function, kemudian ketikkan kode pemrograman seperti dibawah ini :

Hasil kode pemrograman diatas akan menghasilkan tampilan Form seperti gambar dibawah ini, lihat Gambar 15

Gambar 15. Bentuk Form kontrol ActiveSkin 4.3 yang kedua



- Baris 1 Merupakan fungsi untuk merubah tampilan Form atau meng aktifkan jenis skin pada kontrol ActiveSkin 4.3 yang kedua sesuai dengan jenis skin yang kita pilih pada saat Load Skin.

Keterangan Kode

1�


Hasil dari kode pemrograman diatas akan menghasilkan tampilan form seperti dibawah ini, lihat Gambar 16

Gambar 16. Bentuk Form kontrol ActiveSkin 4.3 yang ketiga




- Baris 1 Merupakan fungsi untuk merubah tampilan Form atau meng aktifkan jenis skin pada kontrol ActiveSkin 4.3 yang ketiga sesuai dengan jenis skin yang kita pilih pada saat Load Skin.

Keterangan Kode


- Baris 1 Merupakan fungsi untuk merubah tampilan Form atau meng aktifkan jenis skin pada kontrol ActiveSkin 4.3 yang keempat sesuai dengan jenis skin yang kita pilih pada saat Load Skin.

Keterangan Kode

13


Gambar 17. Bentuk Form kontrol ActiveSkin 4.3 yang keempat

5. Double klik pada tombol Button dengan caption “Tes Skin 5” klik tombol OK pada kotak dialog Add member Function ketikkan kode pemrogra-man seperti dibawah ini :


Gambar 18. Bentuk Form kontrol ActiveSkin 4.3 yang kelima



- Baris 1 Merupakan fungsi untuk merubah tampilan Form atau meng aktifkan jenis skin pada kontrol ActiveSkin 4.3 yang kelima sesuai dengan jenis skin yang kita pilih pada saat Load Skin.

Keterangan Kode

14

6. Double klik pada tombol Button dengan caption “Tes Skin 6” klik tombol OK pada kotak dialog Add member Function, kemudian ketikkan kode pemrograman seperti dibawah ini :


Gambar 19. Bentuk Form kontrol ActiveSkin 4.3 yang keenam

7. Double klik pada tombol Button dengan caption “Keluar”, klik tombol OK pada kotak dialog Add Member Function, ketikkan kode pemrograman seperti dibawah ini :



- Baris 1 Merupakan fungsi untuk merubah tampilan Form atau meng aktifkan jenis skin pada kontrol ActiveSkin 4.3 yang keenam sesuai dengan jenis skin yang kita pilih pada saat Load Skin.

Keterangan Kode

CDialog::OnOK( );1

- Baris 1 Merupakan fungsi untuk mengakhiri jalannya program yang telah Anda buat atau menutup program yang telah Anda buat.

Keterangan Kode

15

G. Menjalankan Program / Kompile

Setelah Anda selesai dengan penulisan kode program pada jendela editor kode pemrogramanVisual C++ 6.0, Anda bisa langsung menjalankan pro-gram yang telah Anda buat, Caranya klik menu Build > Execute atau klik icon , atau bisa juga dengan menekan tombol F5 pada keyboard Anda. Lihat Gambar 20

Gambar 20. Menjalankan program

H. Tampilan Program Saat Dijalankan

Untuk melihat hasil kerja dari program yang telah anda buat klik tombol But-ton dengan caption “Tes Skin 1” sampai “Tes Skin 6” dan lihat perubahan Form yang terjadi. Dan Anda dapat menerapkannya pada program Anda.

Gambar 14. Tampilan program saat dijalankan


2. Klik Execute

KLik Icon Builder / Execute

1. Klik Menu Build

Form Cantik Activeskin 4.3

Documents

Transcript of Form Cantik Activeskin 4.3