visual foxpro

37
Tentang Visual Fox Pro Visual foxpro adalah bahasa pemrograman berorientasi object atau klo pake bahasa inggris OOP(object oriented programming). pemrograman berorietasi objek ini memberikan kemudahan dalam mengubah program, lebih fleksibel dan lebih mudah dalam perawatan. Kayaknya juga lebih mudah dipelajari oleh pemula (kayak saya.. saya juga masih pemula), daripada pemrograman dengan pendekatan sebelumnya. Contohnya klo jaman dulu nih klo mau bikin kotak atau mau bikin form aja kita perlu membuat beberapa baris code pemrograman. Klo OOP tinggal klik & drag kita kasih pesan pada setiap objek, semua dah beres. Banyak hal tentang visual foxpro yang masih belum saya pelajari, tapi dari pengetahuan yang sedikit ini Allhamdulillah bisa ngasih tambahan buat pemasukan. Nah buat anda yang pengen belajar ga ada salahnya belajar pemrograman yang satu ini. Sebetulnya visual foxpro juga memiliki database bawaan sendiri cuman karena pernah dibikin pusing karena seringkali rusak yah makanya saya gabungin sama MySQL, dan akhirnya malah keterusan. Ok… yang penting ada kemauan dan mau menyisihkan waktu untuk mempelajarinya saya yakin anda juga bisa. Saya anggap tutorial ini hanya sebagai batu loncatan bagi anda yang memang betul-betul awam tentang pemrograman visual Foxpro. Area Kerja Visual Fox Pro Saya anggap anda asing dengan jendela Visual Fox pro yah, jadi saya beri gambaran tentang area kerja visual Foxpro dan jenis-jenis item di area kerja visual fox pro ini yang nantinya akan sering kita sebut : 1. Menu Bar 2. Toolbar 3. Project Manager 4. Command Window 5. Object Properties PROJECT MANAGER Disinilah tempat untuk mengelola file-file dalam sebuah project. Di dalam project visual foxpro terdiri dari file, data, dokumen dan object yang disimpan dalam sebuah file berekstention .pjx. Seperti halnya toolbar, anda dapat menempelkan project manager dengan click & drag dan diletakkan pada area toollbar (posisi atas layar) atau dengan dbl klik pada tittle bar. Untuk dapat mengakses file dalam

Upload: lia-deliza

Post on 19-Jan-2016

290 views

Category:

Documents


16 download

TRANSCRIPT

Page 1: Visual Foxpro

Tentang Visual Fox Pro

Visual foxpro adalah bahasa pemrograman berorientasi object atau klo pake bahasa inggris OOP(object oriented programming). pemrograman berorietasi objek ini memberikan kemudahan dalam mengubah program, lebih fleksibel dan lebih mudah dalam perawatan. Kayaknya juga lebih mudah dipelajari oleh pemula (kayak saya.. saya juga masih pemula), daripada pemrograman dengan pendekatan sebelumnya. Contohnya klo jaman dulu nih klo mau bikin kotak atau mau bikin form aja kita perlu membuat beberapa baris code pemrograman. Klo OOP tinggal klik & drag kita kasih pesan pada setiap objek, semua dah beres.

Banyak hal tentang visual foxpro yang masih belum saya pelajari, tapi dari pengetahuan yang sedikit ini Allhamdulillah bisa ngasih tambahan buat pemasukan. Nah buat anda yang pengen belajar ga ada salahnya belajar pemrograman yang satu ini.

Sebetulnya visual foxpro juga memiliki database bawaan sendiri cuman karena pernah dibikin pusing karena seringkali rusak yah makanya saya gabungin sama MySQL, dan akhirnya malah keterusan. Ok… yang penting ada kemauan dan mau menyisihkan waktu untuk mempelajarinya saya yakin anda juga bisa. Saya anggap tutorial ini hanya sebagai batu loncatan bagi anda yang memang betul-betul awam tentang pemrograman visual Foxpro.

Area Kerja Visual Fox Pro

Saya anggap anda asing dengan jendela Visual Fox pro yah, jadi saya beri gambaran tentang area kerja visual Foxpro dan jenis-jenis item di area kerja visual fox pro ini yang nantinya akan sering kita sebut :

1. Menu Bar 2. Toolbar 3. Project Manager 4. Command Window 5. Object Properties

PROJECT MANAGER

Disinilah tempat untuk mengelola file-file dalam sebuah project. Di dalam project visual foxpro terdiri dari file, data, dokumen dan object yang disimpan dalam sebuah file berekstention .pjx.

Seperti halnya toolbar, anda dapat menempelkan project manager dengan click & drag dan diletakkan pada area toollbar (posisi atas layar) atau dengan dbl klik pada tittle bar. Untuk dapat mengakses file dalam

Page 2: Visual Foxpro

project manager, ketika Project Manager dalam posisi menempel pada area toollbar (docked), yang perlu anda lakukan hanya memilih (klik) masing-masing tab.

Untuk menampilkan Project Manager dalam posisi normal, anda tinggal klik kanan pada project manager dan pilih undock.

Tabs

Di dalam Project Manager terdapat beberapa tab yang berfungsi mengelompokkan file-file berdasarkan kategori.

Tab All : Menampilkan semua file dalam project dan disusun secara hierarki berdasarkan kategori Tab Data : Menampilkan file-file yang behubungan dengan database, termasuk tabel view dsb. Tab Docs : Menapilkan file-file form, laporan dan label. Tab Class : Menampilkan file-file class Tab Programs : Menampilkan file-file program. Tab Other : Menampilkan file-file menu, text dan file lain diluar kategori diatas misalnya file-file gambar.

Membuat dan membuka project

Anda dapat membuat project baru atau sekaligus membuka project baru dengan menuliskan perintah pada jendela command window (ctrl + f2) :

modify project [drive]\[nama project] contoh : modify project d:\pegawai\pegawai yang berarti : Membuat\membuka project dengan nama project pegawai.pjx pada drive d:\pegawai

Latihan : Buat project dengan nama Aisimply dan disimpan di drive D:\aisimply

Mengelola File - File Project

Setelah anda membuat project, anda dapat mulai mengelola (membuat file baru, menambahkan, menghapus, menjalankan dll) seperti form, laporan, program, text atau file lainya.

Cara yang paling singkat dalam pembuatan file-file baik itu form, laporan atau file lain adalah dengan menggunakan fungsi menu dari klik kanan, dan ini juga berlaku untuk memodifikasi, menghapus, menjalankan dsb.

mengelola file-file project manager visual fox pro

Latihan :

Buka project anda, kemudian gunakan klik kanan dan perhatikan, menu-menu apa saja yang akan keluar.

Page 3: Visual Foxpro

Membuat File Utama (Set Main)

Semua program aplikasi memiliki file utama, merupakan program awal yang pertama kali dijalankan dan akan merujuk pada semua file dalam sebuah project.

Untuk mensetting file utama pada project manager adalah : pilih file yang akan dijadikan sebagai file utama, klik kanan trus pilih set main. File berstatus file utama/main file akan memiliki tanda lebih tebal dari file-file lainya di project manager.

membuat file utama / set main visual fox pro

Latihan : Pilih salah satu dari beberapa file dalam project yang anda buat, kemudian klik kanan, trus pilih set main trus perhatikan apa yang akan terjadi…!!!(kayak nonton pelem horor yah).

Form, Control, Properties

Objek-objek dalam visual foxpro dibedakan menjadi 2 golongan yaitu kontainer dan kontrol. bedanya adalah kalau kontainer adalah objek yang dapat menampung objek lain sedangkan kontrol tidak dapat menampung objek lain tetapi dapat diletakan dalam kontainer.

Contoh Kontainer : Form, Page Frame dan kontainer Contoh Kontrol : TextBox, CommandButton, Combo Box dll.

Masing-masing objek, baik itu kontainer/ kontrol memiliki pengaturan-pengaturan yang bisa didapatkan pada jendela Properties.

properties Visual Foxpro

Pada gambar adalah contoh properties dari objek form. Pada jendela proeprties terdapat 5 tab yang berfungsi mengelompokkan jenis setting dari objek tersebut.

Page 4: Visual Foxpro

Form , Form Set

Merupakan penghubung antara user dengan database (melihat atau input data ke database), form memiliki sifat bisa berinteraksi dengan user karena form didukung oleh bermacam-macam objek yang dapat merespon user melalui events2-nya.

contoh : objek tombol close memiliki events klik, dbl klik dll. Berarti tombol close akan merespon user dengan menutup aplikasi apabila mendapatkan aksi klik dari user.

Form / formset sendiri juga merupakan objek yang masing-masing memiliki properties, events dan methods yang dapat anda modifikasi pada form designer. Formset sendiri terdiri dari satu atau lebih form yang bisa anda manipulasi dan disimpan menjadi satu unit dalam satu file .scx. Contoh manipulasi disini adalah misalnya anda memiliki 3 form dalam 1 formset, pada waktu pertama kali form dijalankan anda bisa menampilkan 1 form sebagai form utama dan form yang lainya bisa anda sembunyikan, dan nanti akan dipanggil ketika form tersebut memang dibutuhkan.

Tahapan dalam pembuatan program aplikasi visual foxpro Tahap Desain visual : Tahap merancang desain input atau output. Pada tahap ini anda memasukan beberapa kontrol yang dianggap perlu untuk menunjang desain perencanaan program. Tahap pengkodean : Tahap memberikan perintah berupa baris kode kedalam setiap objek pada setiap kejadian yang diperlukan.

Apabila anda bekerja dengan form maka jendela lain yang otomatis akan ditampilkan adalah : 1. Jendela Form designer 2. Jendela form control 3. Jendela Properties.

Membuat form & Form set

Pada project manager, Pilih tab documents, Pilih icon form, Klik tombol new, Pilih new form

Apabila status form ingin dijadikan formset, dalam kondisi form designer sedang aktif pada menu bar 1. Pilih Form 2. Pilih create form set

Untuk menambahkan form, pada menu bar 1. Pilih form 2. Pilih Add New Form

” Seandainya anda bekerja dengan class dan telah membuat class untuk form, dalam kondisi form designer sedang aktif, anda tinggal menambahkan form class yang anda buat dengan klik dan drag ke dalam form designer.”

Menjalankan Form & Form set

Dalam kondisi from designer aktif, klik kanan trus pilih run form atau menggunakan tombol standart toolbar

Page 5: Visual Foxpro

menjalankan form/formset dalam visual fox pro

untuk tanda no 1 berarti anda akan menjalankan form dan tanda no 2 kembali pada form desainer.

Label

Fungsi label adalah menampilkan informasi untuk user di dalam form. Perbedaan antara label dengan textbox adalah bahwa label : 1. Tidak memiliki data source 2. Tidak bisa diedit 3. Tidak bisa di TAb

Setting property yang biasa digunakan adalah :

Caption =Text yang akan muncul pada label Autosize = Label akan menyesuaikan panjang dari caption Backstyle = Background Transparan atau warna

Contoh Label :

Page 6: Visual Foxpro

Text BOX

Setting Text BOX dengan Text BOX Builder

Buka textbox builder (klik kanan pada textbox) Cara setting textbox selain menggunakan TextBoxBuilder bisa juga menggunakan properties. Kalo memakai text box builder kayaknya cukup jelas yah. Coba anda melihat nilai dari setting property value ketika anda merubah Type Data pada Text Box Builder. Selain berfungsi untuk menampilkan informasi text box juga berfungsi sebagai kotak input.

Seandainya anda menginginkan Textbox hanya berfungsi untuk menampilkan informasi saja maka setting pada poperties tab data ReadOnly=.T. atau Enabled=.F. pada tab Other.

Contoh Text BOX

Membuat Password

Jika TextBox akan digunakan sebagai inputan untuk password maka anda dapat mensetting pada PasswordChar properties, tab layout. Dengan memberikan character apa yang akan muncul ketika user memasukan password.

Page 7: Visual Foxpro

textBox Password

Edit BOX

edit BOX Icon

Edit box sih biasanya digunakan untuk menuliskan data yang jumlah characternya panjang contohnya penulisan memo. Selain berfungsi untuk menampilkan data juga berfungsi sebagai input data.

Contoh Edit Box

Page 8: Visual Foxpro

Command Button

Dengan Command Button memungkinkan user untuk berinteraksi dengan program aplikasi secara spesifik. Contohnya anda dapat membuat tombol untuk user untuk menutup sebuah form, atau mungkin membuat tombol untuk membuka form lain yang disembunyikan atau membuat tombol navigasi untuk mleihat data, atau menampilakan laporan dll. Sebenarnya command button ada yang berdiri sendiri dan ada pula yang secara group. Cuman yang group ga dibahas yah… yah dibahas yang favorit-favorit aja.

Command Button properties favorite

Contoh : kita akan membuat tombol close. 1. Gunakan 2 gambar untuk satu Command Button :

2. Masukan Command Properties sbb :

command Button Visual FoxPro

3. Masukan sedikit baris perintah sbb:

Procedure : GotFocus dan MouseMove

this.Picture= ‘D:\AISIMPLY\IMAGE\CLOSE2.ICO’

Procedure : LostFocus dan MouseLeave

this.Picture= ‘D:\AISIMPLY\IMAGE\CLOSE1.ICO’

Page 9: Visual Foxpro

4. Hasilnya :

Option Group

Option Group Icon

Dengan OptionGroup memungkinkan kepada user untuk dapat melakukan pilihan dari beberapa pilihan. Contoh : biasanya digunakan untuk pilihan gender, (laki-perempuan), group pilihan sekolah (SD,SMP,SMA) dll.

Option Group Builder

Tips.

Kalo pake name defaultnya OptionGroup kan kepanjangan, makanya sering ganti yang lebih pendek misalnya name propertisnya adalah : OG trus Option1 diganti O1,O2 dst, biar nulis codenya juga ga kepanjangan.

Page 10: Visual Foxpro

Check BOX

Check BOX Icon

Dengan menggunakan check box berarti hanya memberikan 2 pilihan kepada user, yaitu memilih atau tidak memilih. Memilih berarti memberikan nilai 1 atau .T. kepada Check Box sedangkan tidak dipilih berarti memberikan nilai 0 atau .F. pada check box.

Contoh Check BOx

Combo Box

August 8, 2008 — rofiq

Combo BOX Icon

Combo box selain bisa diisi dengan data tabel, array juga bisa diisi dengan data pilihan yang bersifat statis/tetap.

Untuk setting combo box, klik kanan pada combo box, pilih builder. Setelah jendela combo box builder terbuka kita dapat mengisikan datanya apakah berdasarkan tabel / view (fields from tabel or view), apakah berdasarkan array (values from an array) atau berdasarkan pilihan kita sendiri (data entered by hand).

Dicombo Box ini user diberi dua pilihan untuk input data.

1. User hanya memilih dan tidak diberikan kesempatan untuk memasukan data baru(bukan termasuk pilihan). (drop down list)

Page 11: Visual Foxpro

2. User selain memilih juga bisa menginputkan data baru.(drop down combo)

Contoh Membuat Combo Type Kartu Nama

1. pilih combo box, klik kanan, pilih builder Pada File the List with : isikan dengan data entered by hand

2. Isikan data dalam kolom dengan daftar pilihan 3. Pada tab style pilih dengan Drop down list, karena user tidak diperkenankan untuk mengisi data

baru.

Spinner

Spinner Icon

Spinner memiliki sifat menerima input, bernilai numerik yang nilainnya dapat dinaikan / diturunkan melalui tombol naik/turun atau input dapat dimasukan langsung oleh user. Batasan / range dalam spinner dapat diatur melalui setting properties.

Page 12: Visual Foxpro

Grid

Grid Icon

Grid adalah objek kontainer yang dapat menampilkan data berupa baris dan kolom seperti jendela browse. Dalam sebuah kolom dapat berisi header, kontrol dan masing-masing memiliki properties sendiri-sendiri.

Contoh Grid data kartu nama

Posted in 02. Basic. Tags: grid.

Class dalam Visual Fox Pro

Agar pembuatan program aplikasi ini lebih cepat dan efisien maka anda bisa menggunakan class untuk membuat template objek. Misalnya anda ingin membuat command button seperti pada tutorial sebelumnya, seandainya anda tidak menggunakan class tentu akan memakan waktu. Loh kok bisa ….? soalnya setiap anda membuat tombol yang sama pada form yang berlainan pasti anda akan membuat setting yang berulang-ulang. Bisa kok tanpa mengulang setting yaitu dengan cara copy paste dari objek yang telah kita buat, tapi bagaimana seandainya anda sudah membuat banyak form dan ternyata tombol yang kita buat ada perubahan… wahhh bisa dibayangkan repotnya kita copy paste tombol ke setiap form. dan hal ini kayaknya kurang efisien. Nah… agar lebih efisien kita bisa menggunakan class pada visual foxpro.

Dengan membuat class objek berarti kita membuat template objek. Sehingga sewaktu-waktu kita membutuhkan objek tertentu yang sudah kita buat dalam Class kita tinggal klik & drag semuanya sudah beres. Demikian pula seandainya kita ingin memperbaiki objek tersebut kita tinggal memperbaikinya di class designer. Secara otomatis perubahan yang telah kita buat akan berpengaruh objek class yang sudah aktif disetiapform.

Untuk membuat class sendiri dapat dilakukan pada Project Manager tab Classes. Klik tombol new, kemudian akan muncul jendela New Class

Page 13: Visual Foxpro

Pada jendela New Class isikan nama class pada Name Class. Isikan objek apa yang akan anda buat pada Combo Box Based On Masukan di file class apakah yang akan kita simpan pada Store In. Untuk kumpulan class yang kita buat disimpan dalam satu unit file class dengan menggunakan ekstensi .VCX.

Menggunakan Class , dari Project Manager kita tinggal klik & drag objek class ke dalam form designer.

Events , Method

Events / kejadian terjadi ketika user berhubungan dengan objek melalui tindakan secara spesifik. Misalnya kejadian ketika tombol close di klik, kejadian ketika form pertama kali dibuka. Nah… disinilah tugas anda untuk mendefinisikan, hal apa yang akan terjadi ketika tombol close di klik, hal apa yang akan terjadi ketika form pertama kali dibuka dll. Anda bisa menambahkan baris perintah pada events, sehingga apabila user berinteraksi dengan objek sesuai dengan events-nya maka baris perintah yang telah kita berikan akan dijalankan secara otomatis.

Method

Selain melalui events baris kode dapat kita tambahkan melalui method, dan dapat kita definisikan sendiri nama methodnya. Contoh : Kita akan membuat baris perintah untuk membersihkan layar input Data Kartu Nama

1. Nama Method : “ClearF2Input“ 2. Ketika form designer aktif pada menubar Form klik New Method 3. Masukan nama Method, trus klik tombol Add. 4. Kita bisa mengisikan perintah pada method yang kita buat pada object formset jika kita

menggunakan banyak form dan objek form jika menggunakan single form dan status bukan formset.

Page 14: Visual Foxpro

Perintah Koneksi dengan MySQL

Digunakan untuk membuat koneksi dengan sumber data.

KS=SQLConnect(’aisimply‘,’root‘,’root‘)

Keterangan :

VariabelKoneksi=SQLConnect(’nama databse‘,’nama user‘,’password‘)

SQLEXEC

Mengirimkan perintah SQL ke sumber data.

SQLExec(KS,”SELECT kdk,nma,al1,phn,cp,hp,fax,tga FROM 9KRt”,”GRIDDLLKARTU“)

Keterangan : SQLExec(variabelKoneksi,”perintah SQL”,”nama cursor”) Jika tidak menggunakan cursor Visual foxpro akan menggunakan default SQLRESULT untuk nama cursor.

Page 15: Visual Foxpro

Pengambilan Keputusan

Perintah IF…ENDIF

digunakan untuk mengambil keputusan dari 1 atau 2 alternatif pilihan.

Bentuk Umum

IF kondisi perintah ENDIF

keterangan

Jika kondisi bernilai .T. maka Jalankan Perintah Penutup if

atau

IF kondisi perintah 1 else perintah 2 ENDIF

keterangan

Jika kondisi bernilai .T. maka Jalankan Perintah 1 Jika tidak maka Jalankan Perintah 2 Penutup if

Perintah DO…CASE

Perintah DO.CASE digunakan untuk mengambil keputusan dari beberapa alternatif pilihan

DO CASE CASE kondisi n1 jalankan perintah 1 CASE kondisi n2 jalankan perintah 2 CASE kondisi n…. jalankan perintah n…. OTHERWISE jalankan perintah lain ENDCASE

keterangan

awal perintah do case jika kondisi n1 terpenuhi jalankan perintah 1 jika kondisi n2 terpenuhi

Page 16: Visual Foxpro

jalankan perintah 2 jika kondisi n dst terpenuhi jalankan perintah dst selain kondisi diatas jalankan perintah lain akhir perintah endcase

Tab Order

Berfungsi mengurutkan alur pointer. contoh :

Pada menu bar VIEW pilih Tab Order kemudian pilih Assign Interactivelly. Kalo kita lihat gambar diatas, ketika form pertama kali dibuka, posisi pointer akan berada pada tombol close. Agar pointer berada di posisi KDK, maka klik pada textBox Kdk agar posisi berada pada nomor 1, kemudian diurutkan sesuai inputan dari NMA s/d Command button cbClose1.

Hingga menjadi seprti di bawah ini :

Selain dengan menggunakan tab order, anda juga bisa mengatur melalui jendela properties pada property TabIndex.

Page 17: Visual Foxpro

Melihat cursor / tabel aktif

Pada MenuBar Window, pilih data Session:

Nah pada gambar diatas kebetulan terdapat cursor/tabel aktif GridDllKartu, seandainya kita klik tombol browse akan muncul jendela browser data cursor. Data tersebut natinya yang akan ditampilkan dalam setiap grid yang kita buat.

MySQL

Dari bagan diatas dijelaskan bahwa Program Visual FoxPro merupakan program aplikasi sebagai sarana untuk berinteraksi antara user dengan database di mysql server, sedangkan mysql odbc adalah software yang menjembatani antara program aplikasi dengan Mysql server, trus mysql front sendiri berfungsi mempermudah pengelolaan database mysql server

karena didukung dengan visualisasi. Cntoh : untuk membuat database atau tabel selain menggunakan bahasa SQL di mysql front juga menyediakan perintah visual (dengan fasilitas penggunaaan menu bar, klik & klik semua dah beres). Selain itu, pada mysql front juga diberikan fasilitas export import baik itu berupa struktur maupun data.

MySQL Front

Gambar ini adalah jendela Mysql Front ketika pertama kali dibuka. Sebelum masuk dalam area kerja Mysqlfront Anda akan diminta verifikasi tentang user, pssword dan databse apa yang hendak anda kelola.

Apabila anda ingin membuat databse pertama kali maka anda akan diminta untuk mengisi form isian dari : description : keterangan/penjelasan tentang databse yang anda kelola hostname/ip : di server manakah user akan mengakses databse. Jika server berada di tempat user mengakses databse maka dapat diisi dengan localhost, jika user server berada di komputer lain dapat diisikan dengan IP address atau nama komputer. User : Nama user Password : Password. (Pada waktu pertama kali mysql diinstal maka user default adalah root dan password

masih kosong, untuk keamanan data segeralah anda masuk pada user manager dan edit untuk user root dengan menambahkan password ) trus Database : nama databse yang akan dikelola.

Page 18: Visual Foxpro

Area Kerja MySQL Front

Area kerja Mysql Front

Pada kolom 1 berisi tentang databse dan tabel-tabelnya Pada kolom 2 terdiri dari beberapa tab : Tab Host Menjelaskan tentang dimana posisi server dan penjelasan detail lainya. Tab Database : berisi tentang daftar tabel Tab Tabel : berisi tentang daftar field dari tabel yang dipilih pada kolom 1 Tab Data : berisi data dari tabel yang dipilih pada kolom 1 Tab Query : tempat mengisikan perintah-perintah query Pada kolom 3 berisi dari hasil perintah query Pada kolom 4 berisi perintah query/ pesan kesalahan dari hasil perintah query yang kita buat atau dari aktifitas pengelolaan database.

Membuat Database & Tabel

Pada menu bar pilih Tools pilih Create Database, kemudian masukan nama database.

Page 19: Visual Foxpro

Contoh : kita akan membuat tabel 9krt (tabel kartu nama) dengan struktur seperti gambar diatas. Untuk membuat tabel 9krt pada Menu Bar Tools , pilih Create Tabel. Trus masukan field-fieldnya.

Perintah Select

August 13, 2008 — rofiq

BENTUK QUERY ‘SELECT’ PALING SEDERHANA

Select * from nama tabel

note : field ditampilkan seluruhnya atau

Select field1,field2,dst from nama tabel note : menampilkan field sesuai dengan kebutuhan

contoh 1

note : menampilkan semua field dan semua data dari tabel 9krt

note : menampilkan field kdk,nma, al1 dan semua data dari tabel 9krt

Page 20: Visual Foxpro

BENTUK QUERY ‘SELECT’ DENGAN PERNYATAAN

Select */fields from nama tabel where pernyataan

note : menampilkan semua data dari tabel 9krt yang status pegawai =’Y’ / (menampilkan data kartu nama pegawai saja)

BENTUK QUERY ‘SELECT’ DENGAN PENGURUTAN DATA

Select */fields from nama tabel where pernyataan order by field1,field2,dst desc/asc

notes : bisa diurutkan lebih dari 1 field, jika tidak disertakan jenis pengurutan (ascending/descending) maka defaultnya adalah ascending.

notes : menampilkan semua data dari tabel 9krt yang memilki status supplier(SUP)=’Y’ dan diurutkan berdasarkan kode(kdk) diurutkan dari besar ke kecil. Atau menampilkan semua data kartu nama supplier diurutkan dengan kode(KDK) dari besar ke kecil.

BENTUK QUERY ‘SELECT’ DENGAN YANG MEMILIKI RELASI DENGAN TABEL LAIN

Select */fields from nama tabel inner join nama tabel 2 on NamaTabel1.fieldkunci=NamaTabel2.fieldkunci

contoh :

Misalnya dari informasi absen yang kita dapatkan dari tabel ABSN, kita menginginkan nama karyawan diikutsertakan juga. Padahal dalam tabel ABSN tidak terdapat nama karyawan karena nama karyawan hanya terdapat dalam tabel karyawan (KRY). Agar nama karyawan bisa masuk dalam informasi yang kita inginkan maka kita harus membuat relasi antara tabel ABSN dengan tabel KRY dengan menggunakan kunci filed NIK, menjadi sbb:

Page 21: Visual Foxpro

Penulisan perintah Query diatas bisa diperpendek lagi jika field kunci tabel 1 (ABSN) namanya berbeda dengan kunci tabel 2 (KRY). Misalnya pada tabel KRY field Nomor Induk Karyawan adalah NIK sedangkan pada ABSN nomor induk karyawan adalah NIKA(maksudnya NIK absen..hehe)

maka perintah querynya menjadi sbb:

select tga,nika,nma,hdr from absn inner join kry on nika=nik

TIPS :” Gunakan nama berbeda untuk field relasi dari setiap tabel untuk memperpendek perintah query.”

Perintah Insert

BENTUK QUERY INSERT :

Insert Into nama tabel(field1,field2,field3,fieldN)values(var1,var2,var3,varN)

jika berada dalam lingkungan visual foxpro agar variabel dikenali tambahkan tanda ‘?’ sehingga menjadi

sqlexec(variabelKoneksi,”Insert Into nama tabel(field1,field2,field3,fieldN)values(?var1,?var2,?var3,?varN)”)

Mysql Odbc

Sesuai dengan fungsinya sebagai jembatan penghubung antara program aplikasi dengan database pada mysql server, maka diperlukan setting koneksi pada mysql odbc driver. Untuk membuat setting koneksi pada mysql odbc adalah sbb : (sebelumnya anda sudah menginstal mysql odbc driver terlebih dahulu)

1. Pada kontrol panel pilih Administrative tool 2. kemudian pilih Data Sources(ODBC) 3. Setelah ODBC data source administrator terbuka klik tombol add 4. Kemudian akan muncul jendela Create New Data Source 5. Setelah anda memilih mysql odbc 3.51 driver klik tombol finish 6. setelah mysql odbc 3.51 driver-dsn Configuaration terbuka 7. Isikan data setting untuk bisa terkoneksi dengan mysql server(sama kayak koneksi ketika akan

masuk dengan menggunakan mysqlfront) 8. Klik Tombol test data source. Apabila setting yang dimasukan benar maka akan muncul pesan

bahwa databse sudah bisa terkoneksi. Apabila gagal maka anda harus cek lagi, mungkin ada kesalahan dalam penulisan databse atau yang lainnya.

Page 22: Visual Foxpro

Start

Berikut ini merupakan hal-hal yang perlu dipersiapkan sebelum kita melangkah ke modul selanjutnya : 1. Membuat folder untuk menyimpan file-file project yang akan kita buat dengan struktur sebagai-berikut :

1. Membuat Project Manager Aisimply , Contoh. 2. Membuat Database aisimply. Contoh. 3. Membuat koneksi dengan menggunakan Mysql ODBC driver 4. Membuat template objek dengan menggunakan class 5. Membuat Program Utama / Main Program

Membuat Template Object

Agar pembuatan program aplikasi lebih efisien, kita mempersiapkan template-template objek yang nantinya akan digunakan untuk program aplikasi selanjutnya. Template objek ini nanti kita simpan dalam class aisimply.vcx. (penjelasan tentang class) Template objek yang perlu anda persiapkan antara lain:

Page 23: Visual Foxpro

Daftar Class yang akan kita buat seperti terlihat pada Project Manager diatas :(untuk kekurangan nanti nyusul sambil jalan..hehhe) 1. Class Control Command Button Seperti yang kita lihat pada Project Manager diatas untuk command button yang disiapkan adalah tombol Clear (cbClear), Close (cbClose), Delete(cbDel), Find (cbFind), New (cbNew), Save(cbSave). Untuk setting property gunakan sama dengan setting property pada Tutorial Kontrol Command Button

2. Form Utama & Form Pendukung Karena program yang kita bikin sering menggunakan formset(banyak form), maka kita akan membuat 2 form yang berfungsi sebagai form utama dan form pendukung. Bedanya antara form utama dengan form pendukung adalah ketika formset kita jalankan form utama akan tampil sedangkan form pendukung akan kita sembunyikan. Ok… form utama kita simpan dengan nama cfFormMaster (class form master), dan form pendukung kita simpan dengan nama cfForm.

kemudian Setting Properties :

Karena kita sudah membuat template tombol Close maka kita bisa langsung tambahkan dalam template form. Untuk Form pendukung setting propertynya sama hanya Visible dibikin jadi .F.

Page 24: Visual Foxpro

3. Class Grid

4. Class Label

Membuat Program Utama

Pada Project Manager AiSIMPLY pilih tab Code, kemudian pilih ikon Programs kemudian klik tombol New. Isikan dengan perintah sebagai berikut :

1. Set Null Off 2. Set Century On 3. Set Date BRITISH 4. Set Talk Off 5. Set Default To d:\aisimply 6. Set Path To ./Class,./Form,./Image,./Report,./Prog,./Text 7. Public ks 8. ks=SQLConnect(’aisimply’,'root’,'root’) 9. Set Status Bar Off 10. If ks<=0 11. Messagebox(’Data tak terkoneksi’,64,’Informasi’) 12. ELSE

Page 25: Visual Foxpro

13. Messagebox(’Data berhasil terkoneksi’,64,’Informasi’) 14. Endif

1. Menspesifikasikan default directory untuk project aisimply (5) 2. Menspesifikasikan di folder mana saja pencarian file-file project aisimply.(6) 3. Mempublikasikan variabel ks agar dapat dikenali di setiap aplikasi (form, report, program dll).(7) 4. Memberikan nilai pada variabel ks dengan nilai koneksi ke database aisimply (8). Format penulisan

koneksi : sqlconnect(’nama database’,'user’,'password’) 5. jika nilainya 0 koneksi gagal jika nilai 1 koneksi berhasil. (10-14)

Setelah perintah dimasukan simpan dengan nama Program1 kemudian jadikan sebagai program utama.

” Untuk selanjutnya anda harus menjalankan program1 ini pada awal project dibuka untuk dapat memodifikasi file-file dalam program aisimply “.

Modul Kartu Nama

Desain Input/Output

TAbel yang diperlukan

Page 26: Visual Foxpro

notes : Untuk status pegawai, cabang, supplier dan pelanggan jika bernilai 0 = .f. dan 1=.t.. Contoh Nilai sup=0 berarti tidak berstus sebagai supplier.

Buat tabel 9krt dengan struktur seperti gambar diatas. Check Box Not Null di centang semua dan isikan dengan default 0, untuk tanggal 0000-00-00 dan type text dikosongin saja. Contoh membuat tabel.

Jika tabel sudah dibuat coba isikan data tabel 9krt minimal 5 record. Cara memngisi tabel 9krt pada Tab Data anda tinggal mengisi data pada kolom dibawahnya kemudian tekan tombol centang apabila data sudah terisi.

Memasukan COntrol

1. Tambahkan tombol dari class Command Button yang kita buat

Tombol New : Jika diklik pada tombol ini maka akan muncul form pendukung yang berfungsi untuk input data Tombol Del : Jika di klik maka data kartu nama akan kita hapus per record. Tombol Find : Jika kita klik tombol ini maka aka muncul form pendukung lainnya yang berfungsi tempat pencarian data.

1. Tambahkan control ComboBox dan isikan data Statis (data entered by hand) dengan data PELANGGAN, SUPPLIER, PEGAWAI, CABANG, ALL.

2. Tambahkan Option Group Isikan pilihan dengan Kode dan Nama. Rubah name property mejadi OG. Ganti name property untuk Option1 menjadi o1 dan Option2 menjadi o2.

3. Tambahkan Grid dari class yang pernah kita buat 4. Tambahkan texbox yang berfungsi untuk menampilkan jumlah record dari data kartunama. karena

yang kita butuhkan hanya informasi bukan input maka rubah status ReadOnly Menjadi .T. dan ganti name propertynya menjadi Rec.

5. Coba cek lagi apakah sudah sesuai dengan desain input/Outputnya.

Page 27: Visual Foxpro

6. Sebelum form kita coba jalankan jangan lupa pada tombol close, event Click isikian kode “Thisformset.release()“Sekarang kita coba jalankan form yang telah kita buat. .(Ctrl + E). Hehehe.. karena belom dikasih kode sementara datanya belom keluar… Tahap selanjutnya

7. Pengkodean Form Utama.

Code dllKartuGrid 1

MISI 1. “MENAMPILKAN DATA KARTU NAMA”

Baris kode berikut berfungsi untuk menampilkan data kartu nama yang akan ditampilkan dalam objek GRID. Karena perintah untuk menampilkan data kartu nama sering dilakukan berulang-ulang maka kita buat method untuk menampilkan data kartu nama dengan nama dllKartuGrid.Oke buat method dengan nama dllKartuGrid. (Contoh membuat method).Isikan baris perintah dalam method dllKartuGrid sbb :

Objek : Formset, Procedure : dllKartuGrid

1. SQLExec(KS,”SELECT kdk,nma,al1,phn,cp,hp,fax,tga FROM 9KRt”,”GRIDDLLKARTU”) 2. Thisformset.dllkartu.CGGRID1.ColumnCount=8 3. Thisformset.dllkartu.CGGRID1.RecordSourceType=1 4. Thisformset.dllkartu.CGGRID1.RecordSource=’GRIDDLLKARTU’ 5. Thisformset.dllkartu.CGGRID1.column1.Width=80 6. Thisformset.dllkartu.CGGRID1.column2.Width=150 7. Thisformset.dllkartu.CGGRID1.column3.Width=150 8. Thisformset.dllkartu.CGGRID1.column4.Width=150 9. Thisformset.dllkartu.CGGRID1.column5.Width=150 10. Thisformset.dllkartu.CGGRID1.column6.Width=150 11. Thisformset.dllkartu.CGGRID1.column7.Width=150 12. Thisformset.dllkartu.CGGRID1.column8.Width=80 13. Thisformset.dllkartu.CGGRID1.column1.header1.Caption=’KODE’ 14. Thisformset.dllkartu.CGGRID1.column2.header1.Caption=’NAMA’ 15. Thisformset.dllkartu.CGGRID1.column3.header1.Caption=’ALAMAT’ 16. Thisformset.dllkartu.CGGRID1.column4.header1.Caption=’PHONE’ 17. Thisformset.dllkartu.CGGRID1.column5.header1.Caption=’CONTACT’ 18. Thisformset.dllkartu.CGGRID1.column6.header1.Caption=’HP’ 19. Thisformset.dllkartu.CGGRID1.column7.header1.Caption=’FAX’ 20. Thisformset.dllkartu.CGGRID1.column8.header1.Caption=’TGL.AKTIF’ 21. Thisformset.dllkartu.CGGRID1.column1.header1.Alignment= 2 22. Thisformset.dllkartu.CGGRID1.column2.header1.Alignment= 2

Page 28: Visual Foxpro

23. Thisformset.dllkartu.CGGRID1.column3.header1.Alignment= 2 24. Thisformset.dllkartu.CGGRID1.column4.header1.Alignment= 2 25. Thisformset.dllkartu.CGGRID1.column5.header1.Alignment= 2 26. Thisformset.dllkartu.CGGRID1.column6.header1.Alignment= 2 27. Thisformset.dllkartu.CGGRID1.column7.header1.Alignment= 2 28. Thisformset.dllkartu.CGGRID1.column8.header1.Alignment= 2 29. Thisformset.dllkartu.CGGRID1.ReadOnly= .T. 30. Thisformset.dllkartu.REC.Value=Reccount()

1. Membuat cursor GRIDDLLKARTU yang datanya berisi semua record dari tabel 9krt. (perintah select pada SQL). Cursor aktif dapat dilihat dengan menggunakan dataSession. (1)

2. Jumlah kolom dalam grid. (2) Jumlah kolom disesuaikan dengan jumlah field dari cursor GRIDDLLKARTU. Perhatikan jika menginginkan semua field ditampilkan, digunakan tanda “*”.

3. Record source type = alias. (3) 4. Record source / data sumber = dari cursor GRIDDLLKARTU. (4) 5. Lebar kolom.(5-12) 6. Judul Header. (13-20) 7. Aligment ; Header rata tengah. ( 21-28 ) 8. Grid hanya berupa informasi(tidak bisa menerima input). (29) 9. menampilkan jumlah data pada TextBox REC

Jalankan form (ctrl + E),

Nah… data sudah keluar … UPS tunggu .. kayaknya belum sesuai dengan misi nih… kalau kita lihat data belum urut dengan benar, Oke berlanjut ke sesi berikutnya

Code DllKartuGrid 2

MISI 2. “MENAMPILKAN DATA KARTU NAMA DENGAN PENGURUTAN DATA”

Kalo misi sebelumnya hanya menampilkan data dari Kartu Nama sekarang misi berlanjut dengan menambahkan indek (mengurutkan data) kartu nama. Agar data urut, kita bisa memanfaatkan Option Group yang telah kita siapkan sebelumnya. Ok… karena yang diurutkan berdasarkan kode dan nama maka kita bisa menggunakan perintah IF..ENDIF.

(Oh iyah sebelumnya hanya mengingatkan kepada anda. Untuk Option Group, Name properties sudah diganti menjadi menjadi OG yah, biar ga kepanjangan ngetik kodenya.)

Page 29: Visual Foxpro

Objek : Formset, Procedure : dllKartuGrid

1. If Thisformset.dllkartu.oG.Value=1 2. SQLExec(KS,”SELECT kdk,nma,al1,phn,cp,hp,fax,tga FROM 9KRt order by kdk “,”GRIDDLLKARTU”) 3. Else 4. SQLExec(KS,”SELECT kdk,nma,al1,phn,cp,hp,fax,tga FROM 9KRt order by nma”,”GRIDDLLKARTU”) 5. ENDIF 6. Thisformset.dllkartu.CGGRID1.ColumnCount=8 7. Thisformset.dllkartu.CGGRID1.RecordSourceType= 1 8. Thisformset.dllkartu.CGGRID1.RecordSource=’GRIDDLLKARTU’

*Dst…..

1. Jika Option Group Bernilai 1(kode). (1) 2. maka Buat cursor GRIDDLLKARTU urut berdasarkan kode (2) 3. jika tidak (3) 4. maka Buat cursor GRIDDLLKARTU urut berdasarkan nama (4)

dst.

Nah .. agar efek dari pengurutan data ini terlihat tambahkan pada Objek Option Group O1 dan O2, procedure klik :

Objek : Option Group O1 dan O2, Procedure : Click

thisformset.dllkartugrid()

Jalankan perintah dllkartugrid

Nah sekarang coba jalankan lagi form dllKartu (ctrl + E), dan cobalah anda klik pada option group Kode dan Nama.

heheheh… tentunya misi kita belum usai yah.. soalnya data yang dipanggil diatas masih semua data dari pegawai sampai dengan supplier masih jadi satu. untuk mengelompokkan kita lanjutkan ke misi selanjutnya.

Page 30: Visual Foxpro

Code DllKartugrid 3

MISI 3. “MENAMPILKAN DATA KARTU NAMA DENGAN URUT DAN DIKELOMPOKAN BERDASARKAN TYPE KARTU”

Gunakan perintah DO..CASE untuk menyelesaikan MISI 3.

Hmpf….. selesai sudah ngerjain form DAFTAR KARTU NAMA. eh iyah.. jangan lupa pada object ComboBox procedure interactiveChange tambahkan kode sbb:

Dengan procedure InteractiveChange baris perintah tersebut akan dijalankan ketika terjadi perubahan nilai pada Objek tersebut dengan menggunakan keyboard atau mouse.

Sekarang coba jalankan form dan coba ganti nilai CBO1 (combo Box) dengan menggunakan keyboard / mouse.

Page 31: Visual Foxpro

Kode hapus data

Untuk menghapus data kartu nama, kita memerlukan variabel kode kartu nama dalam form ‘DAFTAR KARTU NAMA’. Untuk itu kita perlu mempersiapkan Control textBox yang berisi data kode kartu nama.

control : Textbox

Properties : Name = kdk, readonly = .t.

Sekenario kayak begini : Data bisa dihapus jika dalam TextBox KDK terdapat data Kode kartu nama. Jika tidak terdapat kode kartu nama maka anda dapat menampilkan pesan informasi (messagebox), bahwa untuk menghapus data, user harus memilih data yang akan dihapus melalui object grid. Caranya, tambahkan baris perintah seperti dibawah ini:

Page 32: Visual Foxpro

Membuat Form Input Data

Desain Input

Nah sekarang dalam kondisi form designer aktif klik & drag class form cfForm. Berikan Caption Properties ‘INPUT/UPDATE DATA KARTU NAMA’, dan name proeprties= f2Input Kemudian tambahkan beberapa kontrol sbb, dan atur sedemikian rupa.

1. TextBOX -> Properties = Name :KDK, MaxLength : 10, Format : ! 2. TextBox (5) -> Properties = Name :NMA, ALM1, PHN,HP,FAX, Maxlength : 50, format : ! 3. CheckBox (4) -> Properties = Caption :PEGAWAI, SUPPLIER, CABANG, PELANGGAN, autosize :.t. 4. TextBox -> Properties name = TGA, Value : {} 5. EditBox -> Properties NAme : KET 6. Command Button (diambil dari class)-> Name Properties CBsave1, CBClear1

Kode menampilkan Form

August 22, 2008 — rofiq

Dengan menekan tombol new berarti kita menampilkan Form pendukung yaitu F2Input/form ‘INPUT/UPDATE DATA KARTU NAMA‘. baris perintah :

Kebalikannya, untuk menyembunyikan lagi berikan baris perintah berikut pada tombol close di form ‘Input/update data kartu nama’.

Page 33: Visual Foxpro

Kode Clear Input

Sekarang coba kita bayangkan. seandainya tombol new kita pencet perintah apa saja yang akan kita berikan. oke … 1. Kondisi layar dalam kondisi bersih 2. Posisi pointer awal kali berada dalam posisi textbox KDK Karena baris perintah kondisi layar bersih juga sering dilakukan berulang-ulang maka kita dapat membuat method dengan nama ClearF2Input

kemudian tambahkan code ‘thisformset.clearf2input()’ pada tombol new, sehingga menjadi sperti berikut :

Tambahkan juga code ‘thisformset.clearf2input()’ ini pada tombol clear form f2Input.

Sekarang joba anda jalankan form (ctrl + e) trus coba anda isikan Form input dengan data seperlunya, kemudian anda klik tombol clear… hehhehe… :) sampai disini kayaknya juga ga ada masalah yah… (Seandainya dalam pengisian data kok loncat-loncat anda dapat mengaturnya dengan menggunakan tab order)

Kode Pencarian data

Pencarian data disini dijalankan setelah user memasukan kode kartu nama. Setelah kode masuk akan dicek terlabih dahulu, apakah kode sudah terdaftar dalam tabel 9krt apa belum. Jika belum terdaftar maka proses berjalan dengan status DATA BARU, Jika sudah terdaftar maka data akan ditampilkan dalam Form dengan status data dalam posisi UPDATE DATA. Oke… selanjutnya anda bisa tambahkan dalam Form Input/Update Data sebuah objek Label.

Label - > Properties : name = lbl, Fontsize=12, Caption=’DATA BARU’, font colour =merah.

Diulangi lagi yah… jadi alur programnya, setelah user memasukan kode kartu nama maka label yang diatas sebagai acuan nanti, apakah data akan dinput atau data akan diupdate. Jika posisi data baru maka Caption label masih ‘DATA BARU‘ jika data ternayata sudah terdaftar dalam tabel maka CAption akan kita ubah menjadi ‘UPDATE DATA‘. Isikan baris perintah dibawah ini dalam Object NMA, Procedure GotFocus.

Page 34: Visual Foxpro

Loh.. kenapa kok di procedure Gotfocus, ga di procedure yang laen? Iyah.. soalnya objek NMA akan menerima focus pointer setelah objek KDK. Dalam hal ini ketika Pointer lepas dari KDK posisi KDK adalah LostFocus, sedangkan posisi NMA menjadi GotFocus karena akan menerima pointer… Gimana ..bingung ga… Klo masih bingung jalanin dulu aja nanti akan tahu dengan sendirinya. … hehehhe..:), , Oh iyah dipastikan lagi tab ordernya, NMA dengan tab order 2 atau pada Proeprties TabIndex bernilai 2.

Jangan lupa mengembalikan nilai caption pada Label ‘UPDATE DATA‘ menjadi ‘DATA BARU‘, tambahkan kode pada baris perintah ClearF2Input:

(note : pelajari kembali perintah select)

Page 35: Visual Foxpro

Kode Input Data

MISI 1 . INPUT DATA KARTU NAMA

Masukan kode seperti berikut :

Anda coba jalankan kembali form anda, kemudian setelah anda klik tombol save anda cek database aisimply pada jendela mysqlfront….. perhatikan apakah data dalam tabel 9krt bertambah atau tidak. Jika data bertambah berarti MISI 1 untuk input data sudah berhasil anda lakukan, seandainya belom berarti anda harus cek kembali perintah SQL yang anda masukan, mungkin ada kesalahan dalam penulisan perintahnya, soalnya perintah SQL yang salah tidak akan mempengaruhi jalanya program.

TIPS : Sandainya anda cek, trus susah sekali menemukan kesalahannya anda copy paste perintah SQL yang kita buat pada kolom yang telah disediakan pada mysqlfront untuk menuliskan perintah SQL. Nah .. apabila ada kesalahan nanti mysqlfront akan memberitahukan letak kesalahannya, atau kebalikannya misalnya anda menginginkan perintah SQL untuk input data, anda dapat input data secara manual pada Mysqlfront, kemudian nanti mysqlfront akan memunculkan baris perintah SQL sebagai akibat dari input manual kita. Nah baris perintah SQL yang keluar tersebut kita kopy paste pada perintah SQL di Visual Foxpro kemudian modifikasi dengan variabel yang diperlukan. contoh dengan gambar :

Penjelasan :

1. Isikan data secara manual 2. Klik tombol centang/post edit 3. Mucul Perintah SQL, Anda Copy perintah tsb 4. Paste pada Visual Fox Pro kemudian ganti values dengan variabel dari Visual Fox PRo

(Note : Pelajari kembali perintah Insert)

Page 36: Visual Foxpro

Kode Update date

Untuk update data, kita dapat menggunakan acuan object label LBL. Tambahkan beberapa baris kode seperti di bawah ini :

TENTANG NERACA

Dulu klo disuruh bikin program yang ada neraca trus jurnal, trus macem2 en pernak-perniknya sempet keder… iyah, lawong dulu klo disuruh ngedepin pelajaran akuntansi males banget rasanya. Efeknya sekarang baru kerasa…. hehhehe.. tapi gapapa yang penting sekarang diambil hikmahnya… bukankah orang yang bijak adalah orang yang mau mengambil hikmah dari setiap perbuatan-perbuatan yang dilakukannya kemudian mau untuk melakukan perubahan untuk ke arah yang lebih baik…. (walahhhhh. kok malah kayak aa Gym… ,lanjuttt…).

Oke.. modul yang akan kita kerjakan adalah pembuatan NERACA AWAL. Oh iyah… , saya juga beranggapan bahwa anda juga tidak tahu tentang apa itu neraca. Jadi Neraca adalah informasi yang menujukan tentang kondisi kekayaan/harta suatu perusahaan. Sedangkan kekayaan/harta berasal dari 2 sumber yaitu modal pribadi dan modal dari orang lain (ngutang).

HARTA / KEKAYAAN (AKTIVA) = MODAL + NGUTANG (PASIVA)

Neraca disusun dengan 2 model, model vertikal dan model horizontal

contoh model vertikal

Page 37: Visual Foxpro

contoh model horizontal