Home > Visual Basic > Meningkatkan daya tarik ListView

Meningkatkan daya tarik ListView

January 11, 2010

ListView adalah salah satu komponen VB yang digunakan untuk menampilkan data dalam format tabel, lihat gambar :

Sayangnya secara default ListView tidak mempunyai kemampuan untuk menghasilkan tampilan seperti di bawah ini, tetapi jangan khawatir dengan sedikit permainan kode kita bisa membuat tampilan ListView menjadi seperti berikut :

Oke kita langsung saja, buat design program seperti berikut :

kemudian copy paste kode berikut :

Private Sub setBackColorListView(ByVal objList As ListView, ByVal objPic As PictureBox)

    Dim i As Long

    objPic.BackColor = objList.BackColor
    objPic.ScaleMode = vbTwips
    objPic.BorderStyle = vbBSNone
    objPic.AutoRedraw = True

    objPic.Width = objList.Width
    objPic.Height = objList.ListItems(1).Height * (objList.ListItems.Count)
    objPic.ScaleHeight = objList.ListItems.Count
    objPic.ScaleWidth = 1
    objPic.DrawWidth = 1
    objPic.Cls

    For i = 1 To objList.ListItems.Count
       If i Mod 2 = 0 Then
         objPic.Line (0, i - 1)-(1, i), RGB(255, 255, 255), BF

       Else
         objPic.Line (0, i - 1)-(1, i), RGB(239, 239, 239), BF 'ganti warna posisinya disini
       End If
    Next

    objList.Picture = objPic.Image
End Sub

Contoh penggunaan

Private Sub Form_Load()
    Dim x As Long

    With ListView1
        .View = lvwReport
        .GridLines = True
        .ColumnHeaders.Add , , "No.", 500
        .ColumnHeaders.Add , , "Item", 4700

        For x = 1 To 10
            .ListItems.Add , , x
            .ListItems(x).SubItems(1) = "Item " & x
        Next
    End With

    Call setBackColorListView(ListView1, Picture1) 'panggil prosedurnya disini
End Sub

Selamat mencoba🙂

  1. July 6, 2010 at 11:57 pm

    makasih gan infonya… mantep deh…

    • July 7, 2010 at 1:06 am

      Sama-sama om

  2. phic
    August 1, 2010 at 11:11 am

    mantap bgt

    • August 2, 2010 at 1:55 am

      Biasa aja lage😀

  3. Kenjitsu
    August 2, 2010 at 2:35 pm

    kalau yang itu kan membuat listview berwarna hanya pada row, nah misal coloumn nya? bagaimna bos??
    seperti ini http://i28.tinypic.com/13zsti8.jpg

    • August 3, 2010 at 3:36 am

      Kan udah kita bahas diSINI om

  4. d'bot
    December 27, 2010 at 3:44 am

    om mau nanya
    bagaimana caranya mencari data di dalam listview
    misalnya saya ingin menemukan data yang ada di listview, kemudian jika ditemukan akan dihapus

    jelasnya: saya akan menginputkan sebuah text dalam textbox sebagai data yang akan dicari, kemudian akan melakukan pencarian di kolom tertentu (misalnya di kolom1, ato kolom2) setelah ditemukan maka hapus baris tersebut dari listview
    kira kira sintaxnya gmn ya???

    • December 27, 2010 at 5:29 am

      Masih berdasarkan sample diatas, tambahkan 1 textbox dan commandbutton kemudian copas kode berikut :

      Private Sub cmdHapus_Click()
          Dim i As Integer
          
          For i = 1 To ListView1.ListItems.Count
              ' pencarian di kolom item (index = 1)
              If InStr(1, ListView1.ListItems(i).SubItems(1), txtItem.Text) > 0 Then
                  ListView1.ListItems.Remove i ' hapus klo ketemu
                  Exit For
              End If
          Next i
      End Sub
      

      Output

      • d'bot
        December 27, 2010 at 1:36 pm

        ok om terimakasih banyak

        • December 28, 2010 at 1:30 am

          Sama2x om

  5. July 11, 2011 at 3:39 am

    gan. thanks ya gan infonya…………..
    oiya . saya mau tanya.. sebenernya ini banyak di google. tpi sy mau simple aja tapi maaf sebelumnya ,.karena ini OOT. thanks

    saya mau buat warna pada baris yang sudah saya tentukan. misalnya kalau pembayaran di data sipolan sudah dibayar diwarnai warna hijau. thanks ya gan.
    wass…………

  6. February 6, 2012 at 4:09 pm

    Saya kok tidak bisa om… type mismatch Error nya om…

    saya memakai ListView dari componen Xtreme Suit Controls Activex dari CodeJock ??

    • February 7, 2012 at 11:52 am

      Klo ListViewnya CodeJock memang blm sy coba om karena sy juga belum pernah make komponen CodeJock😀

  7. Joni
    February 12, 2012 at 9:53 am

    Kalau di vb.net gimana ya caranya?

    • November 7, 2013 at 2:52 am

      di vb net bikin dulu function seperti ini :

      Ini untuk DataGridView :

      Public Sub ChangeColorGrid(ByVal pDataGridView As DataGridView)
      For Each iRow As DataGridViewRow In pDataGridView.Rows
      For Each iCell As DataGridViewCell In iRow.Cells
      If iRow.Index Mod 2 = 0 Then
      iCell.Style.BackColor = Color.Aqua
      Else
      iCell.Style.BackColor = Color.LightBlue
      End If
      Next
      Next
      End Sub

      Ini untuk ListView:

      Public Sub ChangeColorList(ByVal pListView As ListView)
      For Each iItem As ListViewItem In pListView.Items
      If iItem.Index Mod 2 = 0 Then
      iItem.BackColor = Color.GreenYellow
      Else
      iItem.BackColor = Color.White
      End If
      Next
      End Sub

      trus pada form_load panggil function tersebut seperti ini:

      ChangeColorList(LVuser)

      note : LVuser ganti dengan name listview anda.

  8. saranggo
    June 9, 2012 at 9:01 am

    mo nanya nih….
    kl menghapus per record dengan cara double klik pada listview nya bagaimana ya….

    • June 9, 2012 at 10:09 am

      Om bisa coba seperti ini, silahkan dikembangkan sesuai kebutuhan :

      Private Sub ListView1_DblClick()
          Debug.Print ListView1.SelectedItem.Text ' kolom 1
          Debug.Print ListView1.ListItems(ListView1.SelectedItem.Index).SubItems(1) ' kolom 2
      End Sub
      

      dan jangan lupa set property FullRowSelect menjadi true

  9. June 11, 2012 at 9:18 pm

    Gan
    Mau Tanya Kalo Pengen Mengetahui No Terakhir Di Listview Gimana Caranya
    Thanks

    • June 12, 2012 at 1:20 pm

      Coba seperti ini om, dg asumsi nomor urut ada di kolom pertama

      Debug.Print ListView1.ListItems(ListView1.ListItems.Count).Text
      
  10. Pengen bisa vb
    September 8, 2012 at 9:41 am

    Om, biar columnheader di listview ga bisa di otak-atik (klik & drag) caranya gmn ya?

  11. septian
    January 23, 2013 at 3:47 am

    bagaimna kalo kita mau menampilkan gambar/ icon di samping masing kolom gan ???

  12. mamak
    February 15, 2013 at 9:24 am

    Gan, sudah saya coba di VB 6. Kok nggak berubah warnanya ya Gan? pada listview ane jumlah total baris ada 10, lalu kalo saya filter listviewnya jadi satu baris, baru yang sembilan baris sisanya berubah warna. Apanya yg salah ya gan? (Artinya warnanya tertimpa oleh isi ListView ) thanks

    • February 16, 2013 at 12:30 pm

      Intinya setiap pengisian ulang isi dari listview setelahnya harus memanggil fungsi setBackColorListView di atas.

  13. mamak
    February 18, 2013 at 9:55 am

    Maaf Gan, udh saya cek berkali2 sama Gan. warnanya tertimpa oleh isi dari ListView yang tampil. Gimana ya Gan?

    • February 19, 2013 at 8:57 am

      Coba sy mau lihat kodenya om seperti apa ?

  14. March 28, 2013 at 10:53 am

    om, kalau multiple delete record gimana yah codingnya, saya punya coding dibawah ini tapi masih belum berhasil, letak salahnya dimana yah.. atau om punya coding untuk masalah tersebut, mohon bantuanya, makasi

    http://www.facebook.com/download/563692423655235/Multiple%20delete%20list%20item%20Checkd.bmp

  15. Yng
    June 1, 2013 at 1:33 pm

    Permisi gan,saya mau tanya code untuk menyimpan sebagian data yang ada di listview ke databasenya,saya pakai VB6,Thanks

  16. September 27, 2013 at 12:33 pm

    Maaf Gan…
    jika baris nya kurang dari 1000 maka warna baris tampak normal.. tapi jika baris lebih besar dari 1000 semakin warna semakin menyempit dan tidak akurat… tolong penjelasannya

    • September 28, 2013 at 3:03 pm

      Oh iya ada bugnya toh😀, klo ngeliat kodenya sih harusnya enggak ada masalah, coba aja alternatif kode yang lain disini.

  17. alfian
    December 9, 2013 at 5:06 am

    gan knapa ya listviewnya itu ada lagi muncul listview diatasnya gan…

  1. No trackbacks yet.
Comments are closed.
%d bloggers like this: