Tutorial Kontrol Activex ListView-01

Pengantar.

Di MS-Access kami memiliki ListBox kontrol dan sebagian besar hanya akan memiliki beberapa kolom data, untuk menemukan item dengan cepat. Data sumber untuk kontrol ini diketik langsung ke dalam Properti Sumber Baris sebagai Daftar Nilai atau dimuat dari Tabel atau Kueri sumber. Kontrol Kotak Kombo menyimpan datanya tersembunyi dan membutuhkan klik untuk membuka daftar untuk dipilih. Objek ini sudah terpasang sebagai Kontrol Akses.

Tapi, ada List Control lain yang selalu kami gunakan di database kami, bisakah Anda menebak apa itu? Ya, Kontrol Tampilan Lembar Data. Catatan ditampilkan dari Tabel, Kueri. Dalam semua kasus ini, kami melihat data dalam Tampilan Lembar Data sebagai daftar besar.

Tetapi ada juga kelompok Kontrol lain di Microsoft Access, Kontrol ActiveX. Kita sudah akrab dengan salah satu kontrol ini - Kontrol Dialog Umum atau kontrol Peramban Berkas.

Di sini, topiknya adalah Windows ListView Control. Anda dapat memvisualisasikannya sebagai Objek yang mirip dengan Windows Explorer, di mana Anda dapat menampilkan Item dengan Ikon Gambar, Ikon Gambar Kecil, sebagai Daftar, atau seperti Panel Tampilan Detail Explorer. Anda dapat memuat data Tabel/Kueri ke dalam kontrol ini untuk menampilkannya dalam Tampilan Lembar Data, mengatur ulang Kolom atau Baris, Mengurutkan baris, menampilkan Gambar di samping item, dan seterusnya. Bahasa Pemrograman lainnya, seperti VB6, VB.NET, C#, dll., menggunakan Windows ListView Control. Kita akan melihat bagaimana kita dapat menggunakannya di Microsoft Access Database.

Layar Demo ListView sederhana, dengan beberapa contoh data cepat, diberikan di bawah ini:

Kami akan membuat tampilan seperti gambar di atas sebagai titik awal Tutorial Kontrol ListView. Kami telah mengunggah sepuluh baris data ke dalam kontrol ListView, dengan beberapa baris Kode VBA. Kontrol ActiveX ListView yang mungkin tidak Anda temukan dalam daftar Kontrol ActiveX yang ada di Access. Kita harus menambahkan file Pustaka Kontrol ini MSCOMCTL.OCX dari folder C:\Windows\System32 ke dalam Akses Referensi Perpustakaan. Setelah ditambahkan, Anda dapat menemukan kontrol ini dengan nama Microsoft ListView Control, Versi 6.0 di antara kontrol ActiveX lainnya.

Jadi, mari kita tambahkan MSCOMCTL.OCX Perpustakaan File ke database kami. Ini adalah pustaka sumber Kontrol ActiveX seperti ListView, TreeView, ImageList. Jika Anda telah melalui TreeView kami sebelumnya kontrol Halaman tutorial, maka Anda sudah diperkenalkan dengan kontrol ini.

File Pustaka Kontrol Umum Windows.

Lakukan hal berikut untuk melampirkan File MSCOMCTL.OCX:

Buka Database Anda dan buka Jendela Pengeditan VBA (Alt+F11).
Pilih Referensi… dari TMenu alat .
Klik Tombol Browse untuk menemukan File MSCOMCTL.OCX (Microsoft Windows Common Controls.)
Cari file di atas di C:\Windows\System32\ Folder, jika Anda memiliki Sistem 32 Bit atau Anda memiliki Sistem Operasi Windows 11.
Jika Anda tidak dapat menemukannya di sana, maka cari Folder C:\Windows\sysWOW64\ (Sistem 64 Bit), dan di sana Anda akan menemukan file ini.
Pilih file MSCOMCTL.OCX dan Klik Buka Tombol Perintah untuk melampirkan file ke Database Anda.
Tekan Alt+F11 lagi untuk kembali ke Jendela Database.

Mari kita rancang contoh Formulir agar sesuai dengan Gambar di atas yang diberikan di bagian atas halaman ini.

Buat Formulir Kosong baru.
Pilih Tombol Kontrol ActiveX dari Grup Kontrol opsi.
Temukan dan pilih Microsoft ListView Control dari daftar yang ditampilkan dan klik tombol OK untuk menyisipkan kontrol ListView pada Bagian Detail Formulir.
Klik dan tahan pada pegangan pengubahan ukuran kontrol, di sudut kanan bawah, seret ke kanan dan ke bawah untuk membuatnya cukup besar seperti contoh gambar yang diberikan di atas.
Seret kontrol ListView itu sendiri ke kanan dan ke bawah untuk memberikan beberapa margin ke kiri dan sisakan ruang yang cukup di atas untuk membuat Label Judul.
Klik pada Kontrol ListView untuk memilihnya, jika tidak dalam status yang dipilih.
Tampilkan Lembar Properti dan ubah nama Kontrol ListView menjadi ListView1 .
Buat kontrol Label di atas dan ubah Keterangan nilai properti ke Tutorial Kontrol ListView . Anda dapat memformat label Caption dengan ukuran font, warna, dll., sesuka Anda.
Buat Tombol Perintah di bawah kontrol LlistView dan ubah Nilai Properti Nama menjadi cmdClose dan Keterangan Nilai Properti untuk Tutup. Desain yang telah selesai akan terlihat seperti berikut ketika desain Anda selesai:
Sekarang, Simpan Formulir dengan nama:ListViewTutorial dan pertahankan Formulir dalam tampilan desain.
Tekan Alt+F11 untuk kembali ke Jendela Modul Kelas Formulir.

Kode VBA.

Salin dan Tempel Kode berikut ke dalam Modul VBA Formulir, ganti baris kode yang ada jika ada:

Option Compare Database
Option Explicit

Dim lvwList As MSComctlLib.ListView
Dim lvwItem As MSComctlLib.ListItem
Dim ObjImgList As MSComctlLib.ImageList
Const prfx As String = "X"

Private Sub cmdClose_Click()
   DoCmd.Close acForm, Me.Name
End Sub

Private Sub Form_Load()
    Call LoadListView
End Sub

Private Function LoadListView()
    Dim intCounter As Integer
    Dim strKey As String

'Assign ListView Control on Form to lvwList Object
 Set lvwList = Me.ListView1.Object
 
 'Create Column Headers for ListView
 With lvwList
    .ColumnHeaders.Clear 'initialize header area
   'Parameter List:
'Syntax: .ColumnHeaders.Add Index, Key, Text, Width, Alignment, Icon
    .ColumnHeaders.Add , , "Name", 2500
    .ColumnHeaders.Add , , "Age", 1200
    .ColumnHeaders.Add , , "Height", 1200
    .ColumnHeaders.Add , , "weight", 1200
    .ColumnHeaders.Add , , "Class", 1200
 End With
 
 'Initialize ListView Control
  While lvwList.ListItems.Count > 0
        lvwList.ListItems.Remove (1)
  Wend
    
 With lvwList
    For intCounter = 1 To 10
        strKey = prfx & CStr(intCounter) '
   'Syntax: .ListItems.Add(Index, Key, Text, Icon, SmallIcon)
        Set lvwItem = .ListItems.Add(, strKey, "Student " & intCounter)
        'Add next columns of data as sub-items of ListItem
        With lvwItem
      'Parameters =      .Add Index,Key,Text,Report Icon,TooltipText
            .ListSubItems.Add , strKey & CStr(intCounter), CStr(5 + intCounter)
            .ListSubItems.Add , strKey & CStr(intCounter + 1), CStr(135 + intCounter)
            .ListSubItems.Add , strKey & CStr(intCounter + 2), CStr(40 + intCounter)
            .ListSubItems.Add , strKey & CStr(intCounter + 3), ("Class:" & intCounter)

       End With
    Next
    'reset lvwItem object
    Set lvwItem = Nothing
End With
lvwList.Refresh

End Function

Simpan Form dengan nama ListView Control Tutorial-01.

Tampilan Demo Formulir.
Buka Formulir dalam Tampilan Normal untuk melihat kreasi kami.

Jika Anda menemukan formulir Anda dengan tampilan seperti gambar berikut, maka Anda berada di jalur yang benar.

Kita harus membuat beberapa perubahan dalam pengaturan Properti kontrol Listview. Kami telah mengubah nama kontrol ListView sebagai ListView1 di Lembar Properti Access. Tapi, kontrol ListView memiliki Lembar Properti sendiri. Kami akan menggunakan lembar properti kontrol ListView sendiri untuk membuat perubahan pada kontrol. Beberapa Nilai Properti juga muncul di Access Property Sheet.
Klik kanan pada kontrol ListView dan sorot ListViewCtrl Object opsi dari daftar opsi yang ditampilkan dan pilih Properti dari menu pintasan yang ditampilkan.
Gambar lembar Properti diberikan di bawah ini:

Di Lembar Properti di atas, ada Tab dengan grup opsi lain. Kami berada di tab Umum secara default. Pada tab Umum, ada opsi di sisi kiri kontrol dan kotak centang di sebelah kanan. Kami akan membuat perubahan hanya pada dua Properties, kontrol ListView pada formulir dalam keadaan dinonaktifkan secara default, kami harus mengaktifkannya.

Tampilan kontrol ListView dapat diubah ke mode yang berbeda seperti item Daftar dengan Ikon gambar besar, dengan Ikon Gambar kecil, di ListView, atau di Tampilan Laporan - seperti yang muncul pada Gambar pertama di atas.
Aktifkan Kontrol ListView dengan memberi tanda centang di Diaktifkan Properti, di sisi kanan.
Pilih lvwReport opsi dari Tampilan daftar tarik-turun di sisi kiri.
Klik tombol Terapkan Tombol pada Kontrol untuk menyimpan perubahan.
Klik tombol OK untuk menutup Lembar Properti.
Simpan Formulir dengan perubahannya lalu buka dalam Tampilan normal.
Anda akan menemukan hasil yang sama seperti Gambar yang diberikan di atas halaman ini, kecuali untuk warna latar belakang formulir dan properti formulir lainnya.

Diagram Fungsional Program.

Sebelum masuk ke Kode VBA, akan menarik untuk mengetahui bagaimana item data dimuat ke dalam Kontrol ListView. Susunan data untuk kontrol ListBox sangatlah mudah. Namun, prosedur pemuatan data kontrol ListView sama sekali berbeda. Hal ini tidak dalam urutan logis yang biasanya kita rasakan. Setelah Anda mengetahui aliran data dari sumber ke satu baris dalam bentuk diagram, atau sebut saja diagram alir, tidak akan sulit untuk memahami Kode VBA dan fungsinya.

Diagram Aliran Data.

Kotak pojok kiri atas mewakili kontrol ListView.
Sebagai langkah pertama dalam mempersiapkan List adalah membuat label heading list atau Judul Kolom. Anda dapat melihat ini dalam diagram, judul kolom berwarna merah. Ini dapat Anda bandingkan dengan judul bidang dalam Tampilan Lembar Data Tabel. Setiap Judul Kolom dimuat ke dalam kontrol ListView di anggota Objek ColumnHeaders. ColumnHeaders.Add() kontrol ListView metode ini dipanggil lima kali untuk menetapkan setiap label kolom, satu demi satu, ke dalam kontrol ListView.
Tindakan yang diperlukan untuk menjalankan lima langkah berikutnya penting untuk diperhatikan. Mereka mewakili satu catatan dengan lima Bidang Data. Tetapi mereka dimuat ke dalam kontrol ListView dalam dua set langkah yang berbeda, atau katakanlah mereka dimuat ke dalam dua anggota Obyek yang berbeda (ListItems dan ListSubItems ) dari kontrol ListView.
1. Bidang pertama (Nilai Kolom) dimuat ke dalam ListItems kontrol ListView Tambah . Objek metode. Jika Anda melihat gambar di atas, nilai kolom pertama record pertama Student1 dimuat di ListItems Objek (ListView .Item Daftar.Tambahkan metode) dari kontrol ListView.
2. Dari kolom ke-2 dan seterusnya, semua nilai kolom lainnya dimuat ke dalam ListSubItems Objek ListItems Objek, satu demi satu. ListSubItems.Add Metode ( ListView.ListItems .Item(x).ListSubItems.Add ) dipanggil empat kali untuk memasukkan Nilai ke dalam Usia, Tinggi, Berat, dan Kelas kolom satu per satu.
Langkah tindakan dua tingkat ini diperlukan untuk memuat baris nilai lengkap ke dalam Kontrol ListView. diagram digambar dengan dua baris data dalam kontrol ListView.

Dengan mengingat gambaran di atas, saya yakin Anda tidak akan kesulitan memahami apa yang dilakukan Kode VBA di atas dalam Program.

Mari kita beralih ke Segmen Kode VBA.

Di area Deklarasi Global Modul, kami telah mendeklarasikan Objek ListView, Objek ListItem, Objek ImageList dan Variabel Konstan dengan Nilai String LV.

Dim lvwList As MSComctlLib.ListView
Dim lvwItem As MSComctlLib.ListItem
Dim ObjImgList As MSComctlLib.ImageList
Const prfx As String = "X"

Daftar lvw Variabel dideklarasikan sebagai Obyek ListView, lvwItem dideklarasikan sebagai ListItem Objek Kontrol ListView, ObjImgList dideklarasikan sebagai ImageList Obyek. ImageList Object adalah kontrol ActiveX lain yang dapat dimuat dengan Ikon Gambar untuk digunakan di TreeView, kontrol ListView. Kami akan mengesampingkan kontrol ImageList untuk sementara waktu dan akan mengambilnya nanti. Konstanta Prfx digunakan di ListItems.Add metode Nilai Kunci awalan, salah satu dari Parameter opsional. Nilai Kunci harus dari Tipe String.

LoadListView() Fungsi adalah program utama.

Nama kontrol ListView kami di Formulir adalah ListView1 . Pernyataan pertama dalam program:

Set lvwList = Me.ListView1.Object

Menetapkan ListView1 kontrol pada Form ke dalam variabel Object lvwList dideklarasikan di area Deklarasi global.

Selanjutnya, kita akan bersiap untuk memuat informasi Header Kolom. Pertama, kita menginisialisasi objek ColumnHeader untuk memastikan bahwa itu kosong. Ketika kita berulang kali menjalankan program, kontrol memiliki kecenderungan untuk mempertahankan nilai yang dimuat sebelumnya dalam kontrol. Saat Anda membuka dan menutup formulir ini lebih dari sekali, setelah menonaktifkan ColumnHeaders.Clear pernyataan, Anda akan tahu perbedaannya. Kumpulan judul yang sama ditambahkan ke kontrol setiap saat dan akan muncul di kontrol dengan baris kosong di bawahnya.

Ini Anda dapat memeriksa dan mengkonfirmasi secara manual. Lakukan hal berikut:

Buka Formulir Demo sekali lalu tutup formulir,
Buka Formulir dalam Tampilan Desain.
Klik kanan pada ListView Control, sorot ListViewCtrl Object Opsi, dan pilih Properti dari daftar yang ditampilkan.
Pilih Tab dengan Label Tajuk Kolom.
Di sana Anda dapat menemukan Judul Kolom pertama Nama dalam Kontrol Teks dan di atas Kontrol Teks, Nilai Indeks 1.
Arahkan Mouse Pointer ke sisi kanan kotak Index number, Di sana akan muncul kontrol dengan panah menunjuk ke kiri, arah kanan.
Klik panah kanan untuk menampilkan label Kolom lainnya satu per satu di kontrol Teks, dengan perubahan nomor indeks.
Jika Anda membuka dan menutup Formulir sekali lagi, Tab di atas akan memiliki dua set Label Judul Kolom yang sama.

Sintaks metode ColumnHeaders.Add adalah sebagai berikut:

lvwList.ColumnHeaders.Add(Index, Key, Text, Width, Alignment, Icon)

Semua parameter bersifat opsional.

With lvwList
    .ColumnHeaders.Clear 'initialize header area
'Parameter List:
'Syntax: .ColumnHeaders.Add Index, Key, Text, Width, Alignment, Icon
    .ColumnHeaders.Add , , "Name", 2500
    .ColumnHeaders.Add , , "Age", 1200
    .ColumnHeaders.Add , , "Height", 1200
    .ColumnHeaders.Add , , "weight", 1200
    .ColumnHeaders.Add , , "Class", 1200
 End With

Nilai Indeks secara otomatis ditetapkan sebagai 1, 2, 3 sebagai nomor seri yang berjalan.

Kunci nilainya bertipe data String, tetapi tidak digunakan untuk Header Kolom, jika diperlukan dapat digunakan.

Teks Nilai ditampilkan pada kontrol sebagai Label Kolom.

Berdasarkan ukuran lebar data yang diperlukan untuk ditampilkan di bawah judul kolom, kami dapat menetapkan nilai lebar perkiraan dalam Piksel.

Jika nilai perataan teks dihilangkan maka perataan kiri (0 - lvwAlignmentLeft ) nilai diambil sebagai default. Itu bisa Rata Kanan (1 - lvwAlignmentRight ) atau Rata Tengah (2 - lvwAlignmentCenter ).

Setelah memuat label heading kolom, langkah selanjutnya adalah memuat nilai kolom pertama baris pertama dari record pertama. Sebelum itu, kita harus menginisialisasi ListItems Objek dengan segmen kode berikut:

'Initialize ListView Control
  While lvwList.ListItems.Count > 0
        lvwList.ListItems.Remove (1)
  Wend

Blok Kode berikutnya memuat item daftar catatan satu baris pada satu waktu dan total sepuluh baris dari beberapa nilai konstan dengan sedikit perubahan untuk tujuan demo. Proses ini telah kami masukkan ke dalam For...Next lingkaran berjalan sepuluh kali, membuat sepuluh baris data.

With lvwList
    For intCounter = 1 To 10
        strKey = prfx & CStr(intCounter) '
  'Syntax: .ListItems.Add(Index, Key, Text, Icon, SmallIcon)
        Set lvwItem = .ListItems.Add(, strKey, "Student " & intCounter)
        
  'Add next columns of data as sub-items of ListItem
        With lvwItem
  ' Syntax: .ListSubItems.Add Index,Key,Text,Report Icon,TooltipText
            .ListSubItems.Add , strKey & CStr(intCounter), CStr(5 + intCounter)
            .ListSubItems.Add , strKey & CStr(intCounter + 1), CStr(135 + intCounter)
            .ListSubItems.Add , strKey & CStr(intCounter + 2), CStr(40 + intCounter)
            .ListSubItems.Add , strKey & CStr(intCounter + 3), ("Class:" & intCounter)

       End With
    Next
    'reset lvwItem object
    Set lvwItem = Nothing
End With

Pernyataan pertama dalam For...Next loop strKey =prfx &Cstr(intcounter) menyiapkan nilai Kunci unik untuk ListItem pertama (Kolom pertama).

Semua parameter ListItems.Add metode ini opsional dan tiga parameter pertama Indeks, Kunci, Teks ditetapkan dalam urutan yang sama seperti Header Kolom dan dua parameter lainnya adalah ikon dan referensi gambar ikon kecil.

Ketika nilai baris dari kolom pertama ditetapkan ke ListItem (lvwList.ListItems) referensi objek ini disimpan di lvwItem objek untuk dengan mudah memanggil sub-objek tingkat berikutnya (objek ListSubItems) untuk menghindari penulisan referensi objek yang panjang:

lvwList.ListItems.Item(index).ListSubItems.Add()

Dinyatakan dalam bentuk singkat dengan lvwItem.ListSubItems.Add()

Tiga Parameter pertama metode ListSubItems.Add() dan urutan kelulusannya sama dengan ListItem setelah itu muncul Ikon referensi gambar diikuti oleh Keterangan alat Parameter teks.

Untuk nilai Kunci dari setiap kolom, saya telah menambahkan nilai berjalan variabel For...Next Loop saat ini + beberapa nilai untuk membuatnya unik di semua kolom. Nilai parameter Key dapat dihilangkan, tetapi sebaiknya Anda membiasakannya.

Metode ListSubItems.Add() dipanggil empat kali untuk menambahkan kolom kedua dan seterusnya ke dalam kontrol ListView.

Langkah-langkah ini diulang sembilan kali lagi untuk memuat kesepuluh catatan sampel ke dalam Kontrol ListView.

Basis data Demo Kontrol ListView di atas dilampirkan untuk pembelajaran dan pembelajaran instan.

Di sesi berikutnya dari tutorial kita, kita akan mempelajari cara mencari dan menemukan nilai dari kontrol tampilan daftar dan cara mengatur ulang Kolom seperti yang kita lakukan di Tampilan Lembar Data.

Tutorial Kontrol Microsoft TreeView
Membuat Menu Akses dengan Kontrol TreeView
Menetapkan Gambar ke TreeView Nodes
Menetapkan Gambar ke TreeView Nodes-2
TreeView Control Tanda Centang Tambah Hapus
Akses Drop-down TreeView ImageCombo
Atur ulang Node TreeView Dengan Seret dan Lepas
Kontrol ListView dengan MS-Access TreeView
Acara Seret Seret Kontrol ListView
Kontrol TreeView Dengan Sub-Formulir