List View

List view เป็นตัว control ที่ใช้แสดงรายการของอ๊อบเจค คล้ายกับการแสดงรายการในช่องด้านขวาของ Windows Explorer และสนับสนุนมุมมองพื้นฐาน 4 โหมด คือ ไอคอน (Icon), ไอคอนเล็ก (Small Icon), รายการ (List) และรายงาน (Report) ซึ่งสามโหมดแรก เหมือนกับ Windows Explorer ส่วนโหมดรายงานเป็นการแสดงสารสนเทศในรูปของตาราง

List view แบ่ง collection เป็น 2 กลุ่ม คือ collection ของ List items ประกอบด้วย อ๊อบเจค List item แต่ละอ๊อบเจค และ collection ของ Column headers ประกอบด้วยอ๊อบเจค Column header ซึ่งตารางที่มี Header ในโหมดรายงาน ส่วน List sub item เป็น collection เก็บข้อมูลของแต่ละเซลล์ ในโหมดรายงาน

การตั้งค่าคุณสมบัติเมื่อออกแบบ

การตั้งค่าคุณสมบัติทำได้โดยใช้ตารางคุณสมบัติของ List view แต่ควรใช้ไดอะล๊อกบ๊อกซ์ Property page

คุณสมบัติทั่วไป

ที่แท็บ General มีคุณสมบัติภายในแท็บที่น่าสนใจคือ

คุณสมบัติ View สามารถกำหนดค่าเป็น 0-lewIcon, 1-lvwSmallIcon, 2-lvwList, 3-lvwReport สำหรับการกำหนดโหมดการแสดง

คุณสมบัติ Arrange สำหรับการจัดแนวไอคอนทางซ้าย (1-lvwAutoLeft) หรือจัดแนวด้านบน (2-lvwAutoTop) คุณสมบัตินี้มีผลเมื่อแสดงในโหมดไอคอนและไอคอนเล็ก

คุณสมบัติ LabelEdit กำหนดการให้ผู้ใช้แก้ไขข้อความที่สัมพันธ์กับรายการในตัว control

คุณสมบัติ LabelWrap เป็นค่า Boolean ระบุความยาวของข้อความไอคอนแบบหลายบรรทัดในโหมดไอคอน

คุณสมบัติ HideColumnHeaders เป็นค่า Boolean สำหรับกำหนดการมองเห็นชื่อคอลัมน์ในโหมดรายงาน มีค่าเริ่มต้นเป็น False ซึ่งมองเห็นชื่อคอลัมน์

คุณสมบัติ MultiSelect ถ้ากำหนดเป็น True จะคล้ายกับ List box ที่ตั้งค่าคุณสมบัติ MultiSelect เป็น 2-Extended

คุณสมบัติ AllowColumnRecorder ถ้ากำหนดเป็น True จะสามารถจัดลำดับคอลัมน์โดยการ drag ในโหมดรายงาน

คุณสมบัติ GridLine ถ้ากำหนดเป็น True จะเพิ่มเส้นตาราง

คุณสมบัติ FlatScrollBar ถ้ากำหนดเป็น True จะไม่แสดงแถบเลื่อน

คุณสมบัติ CheckBoxes, FullRowSelect, HotTracking และ HoverSelectIcon ใช้งานแบบเดียวกับ Tree view

Note: คุณสมบัติ AllowColumnRecorder, GridLine และ FlatScrollBar เป็นคุณสมบัติใหม่ใน Visual Basic 6

การสร้างความสัมพันธ์ระหว่าง Image list กับ List view ทำได้ 3 แบบ คือ วิธีแรกใช้ Image list กับตัว control ในโหมดไอคอน วิธีที่สองใช้ Image list กับตัว control ในทุกโหมดและวิธีที่สามใช้ Image list กับชื่อคอลัมน์ โดยการกำหนด Image list ให้กับคุณสมบัติ Icons, SmallIcons และ ColumnHeaderIcons

ในแท็บ Sorting มีคุณสมบัติที่ใช้การเรียงลำดับ คือ คุณสมบัติ Sorted ถ้าต้องการให้เรียงลำดับให้กำหนดเป็น True คุณสมบัติ SortKey เป็นดัชนีของคอลัมน์ในการเรียงลำดับ (0 สำหรับคอลัมน์แรก) และคุณสมบัติ SortOrder สำหรับการกำหนดวิธีการเรียง ซึ่งคุณสมบัติสามารถตั้งค่าได้ในขณะที่เรียกใช้

ส่วนหัวคอลัมน์

การสร้างอ๊อบเจค Column Header ทำได้ในขณะที่ออกแบบ โดยใช้แท็บ Column Headers ด้วยการคลิกปุ่มคำสั่ง Insert Column และพิมพ์ค่าคุณสมบัติ Text ซึ่งจะปรากฏในส่วนหัว

คุณสมบัติ Alignment ใช้สำหรับจัดแนวของคอลัมน์ แต่คอลัมน์แรก จัดได้เฉพาะชิดด้านซ้าย

คุณสมบัติ Width กำหนดความกว้างเป็น twips

คุณสมบัติ Key และ Tag สำหรับการกำหนดดัชนีของไอคอนที่ใช้กับส่วนหัว ซึ่ง ดัชนีอ้างอิงโดย Column Header Icon ใน Image list

ภาพพื้นหลัง

List view สนับสนุนภาพบิตแม็บพื้นหลัง ที่มากับ Visual Basic 6 การโหลดภาพทำได้ในระหว่าการออกแบบโดยใช้แท็บ Picture แล้วเลือกคุณสมบัติ Picture ที่ซ้ายสุดของช่องรายการ ซึ่งรูปแบบภาพที่โหลด สนับสนุนโดย Picture box และมีคุณสมบัติที่เกี่ยวข้อง คือ

คุณสมบัติ PictureAlignment ให้จัดแนวของภาพ อยู่ที่มุมใดมุมหนึ่งของตัว control, กึ่งกลาง หรือ Tile ให้กระจายภายในพื้นที่ของตัว control

คุณสมบัติ TextBackground เป็นกำหนดพื้นหลังให้โปร่งใส (0-IvwTransparent) เป็นค่าเริ่มต้นหรือไม่โปร่งใส (1-lvwOpaque)

ภาพพื้นหลัง มีเมธอดที่เกี่ยวกับการแสดงแถวและสีพื้นหลัง

การทำงานเมื่อเรียกใช้

การเพิ่มข้อมูลใน List view ทำได้โดยการใช้คำสั่งเท่านั้น ในขณะที่ออกแบบเป็นการจัดลักษณะภายนอก

การเพิ่มอ๊อบเจค List Item

การเพิ่มรายการใหม่ ใน List view ใช้เมธอด Add ใน collection ของ List item ตามไวยากรณ์นี้

Add ([Index], [Key], [Text], [Icon], [Small Icon]) As ListItem

Index เป็นตำแหน่งที่จะวางรายการใหม่ ถ้าละไว้ จะเป็นการเพิ่มต่อท้าย
Key เป็นการเพิ่มตัวเลือก Key ของรายการใน collection ของ List item
Text เป็นข้อความที่แสดงในตัว control
Icon เป็นดัชนี หรือ คีย์ ใน Image list ที่ชี้โดยคุณสมบัติ Icons
Small Icon เป็นดัชนี หรือ คีย์ ใน Image list ที่ชี้โดยคุณสมบัติ SmallIcons
คุณสมบัติทั้งหมดเป็นตัวเลือก

เมธอด Add ส่งออกการอ้างถึงอ๊อบเจค List item ที่สร้างขึ้น ซึ่งคุณสมบัติที่ เมธอด Add ไม่ได้ส่งผ่านสามารถตั้งค่าเพิ่มเติม

' สร้าง item ใหม่ด้วยการแสดงแบบ Ghosted
Dim li As ListItem
Set li = ListView.ListItem.Add ( , , "รายการแรก", 1)
li.Ghosted = True

อ๊อบเจค List item สนับสนุนคุณสมบัติใหม่ ได้แก่ คุณสมบัติ Bold และ ForeColor สำหรับตัวหนาและสีของอ๊อบเจค คุณสมบัติ ToolTipText สำหรับกำหนด Tool tip ให้แต่ละรายการ และคุณสมบัติ Checked ตั้งค่าหรือส่งออกสถานะของ Check box หน้ารายการ (ถ้าคุณสมบัติ CheckBoxes ของ List view ตั้งค่าเป็น True) การกำหนดคุณสมบัติหลายอย่างสามารถใช้ With กับเมธอด Add

With ListView1_ListItems.Add ( , , "สุรศักดิ์", 1)
   .Bold = True
   .Fore Color = vbRed
   .ToolTipText = "ผู้จัดการฝ่ายขาย"
End With

ถ้าคุณสมบัติ MultiSelect ของ List view ตั้งค่าเป็น True จะสามารถเลือกแบบหลายรายการโดยการกดปุ่ม Ctrl หรือ Shift ขณะที่เลือก การปรับปรุงสถานะการเลือกของอ๊อบเจค List item สามารถใช้คำสั่งโดยกำหนด ค่าที่เหมาะสมให้คุณสมบัติ Selected และใช้คุณสมบัติ SelectedItem เพื่อทำให้ List item เป็นรายการปัจจุบัน

Set ListView1.SelectItem = ListView1.ListItems (1)
ListView1.ListItems (1).Selected = True

การเพิ่มอ๊อบเจค Column Headers

อ๊อบเจค Column Headers ช่วยในการควบคุมการแสดงคอลัมน์ และสามารถสร้างได้ในเวลาเรียกใช้ด้วยเมธอด Add ใน collection ของ Column Headers

Add ([Index], [Key], [Text], [Width], [Alignment], [Icon]) As ColumnHeader

Index เป็นตำแหน่งใน collection
Key เป็นค่าการเพิ่มตัวเลือกคีย์
Text เป็นข้อความที่แสดงในส่วนหัว
Width ความกว้างของคอลัมน์ เป็น twips
Alignment เป็นการจัดแนวคอลัมน์
Icon เป็น ดัชนีหรือ คีย์ ใน List image ที่อ้างอิงโดยคุณสมบัติ ColumnHeaderIcons
ยกเว้นคุณสมบัติ Tag ที่กำหนดค่าได้เพื่อสร้างอ๊อบเจค Column Headers แล้ว

' ยกเลิกอ๊อบเจค Column Headers ที่มีอยู่
ListView1.ColumnHeaders.Clear

' เพิ่มอ๊อบเจค Column Headers จัดแนวของ Column Headers แรกต้องเป็น lvwColumnleft
ListView1.Column Headers.Add, , "Last Name", 2000, lvwColumnLeft
ListView1.ColumnHeaders.Add, , "ชื่อ", 2000, lvwColumnLeft
ListView1.ColumnHeaders.Add, , "เงินเดือน", 1500, lvwColumnRight

การเพิ่ม List Sub Items

อ๊อบเจค List item สนับสนุน collection ของ List sub items ใช้สร้างการแสดงค่าในแถวเดียวกับอ๊อบเจค List item หลักเมื่อตัว control อยู่ในโหมดรายงาน collection ที่นำมาแทนที่ array sub items การสร้างอ๊อบเจค List sub items ทำได้โดยใช้เมธอด Add ใน collection ของ List items

Add ([Index], [Key], [Text], [Report Icon], [Tool Tip Text]) As ListSubItem

Index เป็นตำแหน่งใน collection
Key เป็นค่าการเพิ่มตัวเลือกคีย์
Text เป็นข้อความที่แสดงในส่วนหัว
Report Icon เป็นดัชนี หรือคีย์ของไอคอนใน Image list ที่อ้างอิงโดยคุณสมบัติ SmallIcon
Tool Tip Text สำหรับกำหนด Tool tip

' ข้อมูลนี้ไปที่ คอลัมน์ 1
With ListView1.ListItems.Add(, , "สุรศักดิ์", 1)
.Bold = True
' ข้อมูลนี้ไปที่ คอลัมน์ 2
With ListView1.ListItems.Add(, , "แสนวิเศษ", 2)
.Bold = True
End With
' ข้อมูลนี้ไปที่ คอลัมน์ 2
With ListView1.ListItems.Add(, , "75,000", 3)
.Bold = True
.ForeColor = vbRed
End With

List view สามารถประยุกต์กับการโหลดข้อมูลจากฐานข้อมูลในโหมดรายงานได้เช่นเดียวกับตัว control ที่ทำงานกับฐานข้อมูล คือ Data, Remote Data และ ADO Data แต่ไม่สามารถรวมข้อมูลได้โดยอัตโนมัติ ซึ่งต้องมีการจัดรายการ RecordSet ที่อ่านเข้ามา สำหรับในเรื่องนี้ขอข้ามไปเนื่องจาก Visual Basic มีตัวเลือกอื่นในการทำงานกับฐานข้อมูล เช่น ADO Data Grid, Hierarchical Flex Grid

คุณสมบัติ Style มีผลกับลักษณะภายนอกและพฤติกรรมของปุ่ม สามารถกำหนดได้เป็น 0-tbrDefault (ปุ่มธรรมดา คล้าย Push button), 1-tbrCheck (ปุ่มจะยุบลงเมื่อกดคล้าย Check box), 2-tbrButtonGroup (ปุ่มที่เป็นกลุ่มเลือกได้เพียงค่าเดียวของกลุ่มคล้าย Option button), 3-tbrSeparator (separator ของความกว้างคงที่), 4- tbrPlaceHolder (separator ที่ปรับค่าตามคุณสมบัติ Width และใช้สำหรับวางตัว control อื่นบนแถบเครื่องมือ), 5-tbrDropDown (ปุ่มที่มีหัวลูกศรลง ซึ่งจะแสดงรายการของเมนู drop-down เมื่อคลิก)

ดาวน์โหลดตัวอย่าง (ListDB.vbp)