DzListHeader

Dzlistheader

Delphi Visual Control เพื่อสร้างส่วนหัวคอลัมน์กล่องรายการ

• มีอะไรใหม่
• คำอธิบายส่วนประกอบ
• การติดตั้ง
• วิธีใช้
• การใช้งาน OnDrawItem
• การทำงานกับข้อความแบบแท็บ
• ปรับแต่งกล่องโต้ตอบ
• คุณสมบัติ
• คุณสมบัติคอลัมน์
• ขั้นตอน/ฟังก์ชั่น
• ขั้นตอน/ฟังก์ชันคอลัมน์
• เหตุการณ์

มีอะไรใหม่

• 09/12/2021 (เวอร์ชัน 1.7)

  • การรองรับการติดตั้งอัตโนมัติ Delphi 11

คลิกที่นี่เพื่อดูการเปลี่ยนแปลงทั้งหมด

• 03/13/2021 (เวอร์ชัน 1.6)

  • ลบ compinstall.exe ออกจากแหล่งที่มาเนื่องจากคำเตือนที่เป็นบวก AV (ตอนนี้คุณสามารถรับได้โดยตรงจากที่เก็บ Compinstall)

• 02/01/2021 (เวอร์ชัน 1.5)

  • ลบ Delphi XE2 ออกจากรายการสภาพแวดล้อมเนื่องจากไม่สามารถรวบรวมได้ในเวอร์ชันนี้

• 12/18/2020 (เวอร์ชัน 1.4)

  • แอพตัวติดตั้งส่วนประกอบที่อัปเดต (แก้ไขการโทรไปยัง rsvars.bat เมื่อติดตั้ง Delphi ในเส้นทางที่มีอักขระช่องว่าง)

• 10/31/2020 (เวอร์ชัน 1.3)

  • รวมการรองรับการติดตั้งอัตโนมัติ Delphi 10.4

• 10/27/2020 (เวอร์ชัน 1.2)

  • แก้ไขเวอร์ชัน Delphi ก่อนหน้า (อย่างน้อยบนแท็กแพ็คเกจ XE2, XE3, XE4 และ XE5) มันทำให้เกิดข้อผิดพลาดในการรวบรวมแพ็คเกจ
  • แก้ไขการใช้ System.imageList Unit ในโครงการสาธิตเพราะมีเฉพาะจาก XE8

• 10/26/2020 (เวอร์ชัน 1.1)

  • อัปเดต Compinstall เป็นเวอร์ชัน 2.0 (ตอนนี้รองรับ GitHub Auto-Update)

• 05/03/2020

  • อัปเดต Compinstall เป็นเวอร์ชัน 1.2

• 02/11/2019

  • รวมแอพติดตั้งอัตโนมัติ

• 02/08/2019

  • ส่วนประกอบเปลี่ยนชื่อ โปรดถอนการติดตั้งเวอร์ชันก่อนหน้าก่อนติดตั้งเวอร์ชันนี้

• 02/07/2019

  • เพิ่มการสนับสนุน Win64 (โฟลเดอร์ห้องสมุดเปลี่ยนไป!)

คำอธิบายส่วนประกอบ

เมื่อคุณใช้ ListBox และโดยปกติเมื่อกำหนดวัตถุให้กับรายการกล่องรายการคุณต้องการแสดง/วาดคอลัมน์ในกล่องรายการโดยใช้เหตุการณ์ OnDrawItem

ไม่เป็นไร แต่คุณไม่มีตัวควบคุมส่วนหัวเพื่อแสดงคอลัมน์และไม่อนุญาตให้ผู้ใช้ปรับขนาดย้ายและแสดง/ซ่อนคอลัมน์

TheEderControl (Delphi Default Control) อนุญาตให้มีการดำเนินการเหล่านี้บางอย่าง แต่คุณต้องเขียนโค้ดจำนวนมากสำหรับกล่องรายการทุกรายการดูแลรายการทาสีใหม่และการคำนวณตำแหน่งคอลัมน์ และแน่นอนคุณไม่มีฟังก์ชั่นคอลัมน์ซ่อน/แสดง

ดังนั้นฉันได้ทำงานกับองค์ประกอบนี้และฉันตัดสินใจที่จะแบ่งปันเพราะมันมีประโยชน์มาก

นอกจากนี้ dzlistheader ยังแสดงแถบเลื่อนเมื่อคอลัมน์ขนาดใหญ่ขึ้นพื้นที่ที่มองเห็นได้ -

การติดตั้ง

ติดตั้งอัตโนมัติ

1. ดาวน์โหลดตัวติดตั้งส่วนประกอบจาก: https://github.com/digao-dalpiaz/compinstall/releases/latest
2. ใส่ compinstall.exe ลงในโฟลเดอร์แหล่งที่เก็บส่วนประกอบ
3. ปิดแอป Delphi IDE และเรียกใช้แอป Compinstall.exe

การติดตั้งด้วยตนเอง

1. เปิดแพ็คเกจ dzlistheader ใน Delphi
2. ตรวจสอบให้แน่ใจว่ามีการเลือกแพลตฟอร์ม Win32 และการกำหนดค่า การเปิดตัว
3. จากนั้น สร้าง และ ติดตั้ง
4. หากคุณต้องการใช้แพลตฟอร์ม Win64 ให้เลือกแพลตฟอร์มนี้และสร้างอีกครั้ง
5. เพิ่ม Sub-Path Win32 release ไปยังเส้นทางไลบรารีที่เครื่องมือ ตัวเลือกโดยใช้ตัวเลือก 32 บิตและหากคุณได้รวบรวมไปยังแพลตฟอร์ม 64 บิตให้เพิ่ม Sub-Path Win64 Release โดยใช้ตัวเลือก 64 บิต
6. เรียกใช้ Afterbuild.bat เพื่อเผยแพร่ DFM เพื่อปล่อยโฟลเดอร์

รองรับ Delphi XE3..delphi 11

วิธีใช้

วาง dzlistheader ในรูปแบบจากนั้นวางกล่องรายการภายใน dzlistheader

ตั้งค่า dzlistheader.listbox = listbox

สร้างคอลัมน์ที่ต้องการได้ที่คุณสมบัติ Dzlistheader.Columns (คุณควรดูคอลัมน์ในเวลาออกแบบ)

จากนั้นเขียน onDrawItem ของ dzlistheader (ไม่ใช่ onDrawItem ของ ListBox - ปล่อยให้ไม่ได้กำหนด) โทรหาวิธี dzlistheader.dwcol เพื่อวาดทุกคอลัมน์ได้อย่างง่ายดาย

โปรดดูตัวอย่างโฟลเดอร์เพื่อทราบฟังก์ชั่นพื้นฐาน

การใช้งาน OnDrawItem

คุณควรเขียน onDrawItem ของ dzlistheader (ไม่ใช่กล่องรายการ) ตามแนวคิดนี้:

 procedure TForm1.DzListHeaderDrawItem (Control: TWinControl; Index: Integer; Rect: TRect;
  State: TOwnerDrawState);
var P: TPerson;
begin
  P := TPerson(ListBox.Items.Objects[Index]);

  DzListHeader.DwCol( 0 , Rect, P.ID);
  DzListHeader.DwCol( 1 , Rect, P. Name );
  DzListHeader.DwCol( 2 , Rect, P.Gender);
end ;

แค่นั้น!

การทำงานกับข้อความแบบแท็บ

ส่วนประกอบนี้มีตัวเลือกที่สองของการใช้งานดังนั้นคุณไม่จำเป็นต้องใช้วัตถุและคุณไม่จำเป็นต้องเขียนโค้ดเพื่อวาดรายการ ในตัวเลือกนี้คุณควรเพิ่มรายการด้วยเซลล์ข้อความคั่นด้วยอักขระแท็บ

สมมติว่าคุณมีตารางต่อไปนี้:

รหัสประจำตัว	ชื่อ	โทรศัพท์
1	jhon	1111-2222
2	ซาร่าห์	3333-4444
3	อัลเฟรด	5555-6666

ดังนั้นคุณเพียงแค่เปิดใช้งานคุณสมบัติ AutodrawTabbedTex

 1[TAB]JHON[TAB]1111-2222
2[TAB]SARAH[TAB]3333-4444
3[TAB]ALFRED[TAB]5555-6666

หมายเหตุ: [tab] แสดงถึงอักขระ #9

จากนั้นเพียงกำหนดค่าคอลัมน์ที่ต้องการ ในตัวอย่างนี้จะเป็นคอลัมน์: ID, ชื่อ, โทรศัพท์ หากไม่มีบรรทัดใด ๆ ของรหัสสิ่งนี้จะพิมพ์รายการทั้งหมดในรายการและจัดเรียงตามพารามิเตอร์คอลัมน์

หากคุณต้องการเพิ่มรายการในเวลาทำงานคุณสามารถใช้ฟังก์ชั่น additem โดยระบุอาร์เรย์ของสตริงที่จะถูกแปลงในข้อความที่แยกจากแท็บ

คุณอาจต้องใช้ onDrawItem ด้วยข้อความแบบแท็บเพื่อปรับแต่งการวาดเซลล์ ในกรณีนี้คุณควรปล่อยให้ AutodrawTabbedText ปิดการใช้งานและเขียนเหตุการณ์ onDrawItem จากนั้นใช้ GetItemArray เพื่อแยกอาร์เรย์ของรายการปัจจุบันโดยแยกเซลล์เพื่อวาดโดยใช้วิธี DWCOL

ปรับแต่งกล่องโต้ตอบ

หากต้องการเปิดกล่องโต้ตอบปรับแต่งให้คลิกขวาที่ส่วนใดส่วนหนึ่งของส่วนหัวหรือคอลัมน์ ในการปรับแต่งกล่องโต้ตอบคุณสามารถสั่งซื้อคอลัมน์ใหม่แสดง/ซ่อนคอลัมน์และตั้งค่าคำสั่งเริ่มต้น

คุณสมบัติ

AllowMoving: Boolean = เปิด/ปิดการใช้งานคอลัมน์การจัดตำแหน่งใหม่

AllowResize: Boolean = เปิด/ปิดการใช้งานคอลัมน์การเคลื่อนย้าย (ถ้า false, column.sizeable ไม่สำคัญ)

AutoDrawTabbedText: Boolean = เมื่อใช้ AutodrawTabbedText คุณไม่จำเป็นต้องใช้วัตถุหรือ OnDrawItem คุณสามารถเพิ่มรายการไปยังกล่องรายการพร้อมตัวคั่นแท็บเพื่อแยกคอลัมน์ ในกรณีนี้คุณไม่จำเป็นต้องใช้รหัสเพื่อวาดรายการ มีสองวิธีในการใช้กับข้อความแท็บ: addItem (เพิ่มอาร์เรย์รายการดังนั้นส่วนประกอบจะแปลงในข้อความแท็บโดยอัตโนมัติ); getArrayText (ส่งคืนอาร์เรย์ของดัชนีที่ร้องขอ) คุณยังสามารถปล่อยให้คุณสมบัตินี้ปิดใช้งานและทำงานกับข้อความแท็บเขียนเหตุการณ์ onDrawItem และใช้ getArrayText เพื่ออ่านข้อความของคอลัมน์ที่คั่นด้วย

ColorNormalCol: TColor = สีพื้นหลังคอลัมน์

ColorHoverCol: TColor = คอลัมน์พื้นหลังสีพื้นหลังเมื่อเมาส์เหนือคอลัมน์

ColorLineNormal: TColor = สีพื้นหลังของเส้น (บนกล่องรายการ) เมื่อไม่ใช่บรรทัดคี่ (หรือใช้งาน useodd) และไม่ได้เลือกบรรทัด

ColorLineOdd: TColor = สีพื้นหลังสีเมื่อเปิดใช้งานสายคี่และใช้งาน

ColorLineSel: TColor = สีพื้นหลังของเส้นเมื่อเลือกบรรทัด

ColorShape: TColor = สีของเส้นประที่บ่งบอกถึงการเคลื่อนไหวหรือปรับขนาดการวางแนว

Columns: TDzListHeaderColumns = คอลัมน์คอลเลกชัน

HeaderHeight: Integer = ความสูงส่วนหัวคงที่ (คุณสามารถพิมพ์หลายเส้นในคำบรรยายภาพคอลัมน์หากคุณต้องการ)

LineCenter: Boolean = ระบุฟังก์ชั่น dwcol วาดข้อความส่วนกลางในแนวตั้งตามความสูงของเส้น

LineTop: Integer = ระบุตำแหน่ง y ของข้อความไปยัง dwcol เมื่อ linecenter เป็นเท็จ

ListBox: TCustomListBox = listbox object (จำเป็น!)

TextMargin: Integer = Space in Pixels ที่ซ้ายและขวาของคอลัมน์ (ใช้เพื่อให้ข้อความในคอลัมน์หนึ่งไม่ติดกับข้อความในคอลัมน์อื่น)

TitleFont: TFont = ตัวอักษรชื่อเรื่องสำหรับคำอธิบายภาพคอลัมน์

UseOdd: Boolean = ใช้พื้นหลังสีเฉพาะสำหรับเส้นคี่ (ดูคุณสมบัติ ColorlineOdd)

คุณสมบัติคอลัมน์

Alignment: TAlignment = หมายถึงการจัดตำแหน่งของข้อความที่ใช้กับฟังก์ชัน dwcol

Caption: String = ข้อความคำบรรยายภาพของชื่อคอลัมน์

CaptionEx: String = คำบรรยายภาพนี้เป็นทางเลือกใช้ถ้าคุณต้องการระบุคำบรรยายภาพเต็มรูปแบบเพื่อแสดงในกล่องโต้ตอบปรับแต่ง (เช่น: คำอธิบาย: "id", คำอธิบาย: "id of person"))

Customizable: Boolean = อนุญาตให้คอลัมน์สามารถปรับแต่งได้ในกล่องโต้ตอบปรับแต่ง

CustomTextFont: Boolean = กำหนดที่เก็บไว้สำหรับคุณสมบัติ textFont (ถูกตั้งค่าโดยอัตโนมัติเมื่อมีการเปลี่ยนแปลง textFont)

Hint: String = คำใบ้คอลัมน์

MaxWidth: Integer = คอลัมน์ MaxWidth เมื่อปรับขนาด

MinWidth: Integer = คอลัมน์ minwidth เมื่อปรับขนาด

Name: String = ชื่อคอลัมน์เพื่อค้นหาคอลัมน์ (ฟังก์ชัน colbyname) และสำหรับการบันทึก/โหลดการปรับแต่ง (ฟังก์ชัน savecustom/loadcustom) การปรับแต่งต้องใช้ชื่อคอลัมน์เนื่องจากคุณอาจเปลี่ยนโครงการของคุณและในกรณีนี้คอลัมน์จะถูกเก็บไว้ในลำดับที่ถูกต้องตามชื่อคอลัมน์

Sizeable: Boolean = อนุญาตให้ปรับขนาดคอลัมน์

TextFont: TFont = ฟอนต์ที่ใช้โดย Canvas เพื่อวาดข้อความรายการสำหรับคอลัมน์นี้ (หากไม่เปลี่ยนแปลง Canvas ใช้ ListBox Font เพื่อวาดรายการ)

Visible: Boolean = คอลัมน์แสดง/ซ่อน

Width: Integer = ความกว้างของคอลัมน์

Data: Pointer = ตัวชี้ไปใช้ฟรี (คุณสมบัติที่ไม่เผยแพร่)

ขั้นตอน/ฟังก์ชั่น

 procedure LoadCustom ( const A: String);

โหลดการปรับแต่งคอลัมน์จากสตริงรวมถึงตำแหน่งขนาดและการมองเห็น คุณสามารถโหลดจากไฟล์รีจิสทรี/INI

 function SaveCustom : String;

บันทึกการปรับแต่งคอลัมน์เป็นสตริงรวมถึงตำแหน่งขนาดและการมองเห็น คุณสามารถบันทึกไปยังไฟล์รีจิสทรี/INI

 function ColByID (ID: Integer): TDzListHeaderCol;

ส่งคืน TDZLISTEDERCOL โดย ID คอลัมน์ ID ยังคงได้รับการแก้ไขเมื่อย้ายคอลัมน์ (ตำแหน่งของคอลัมน์ถูกกำหนดโดยคุณสมบัติดัชนี)

 function ColByName ( const aName: String): TDzListHeaderCol;

ส่งคืน TDZLISTEDERCOL โดยชื่อคอลัมน์

 procedure DwCol (ID: Integer; Rect: TRect; const Value : Variant; Margin: Integer = 0 );

ใช้ที่ OnDrawItem เพื่อวาดข้อความรายการคอลัมน์ ID แสดงหมายเลขคอลัมน์ที่พิจารณาคำสั่งซื้อในการรวบรวม ดังนั้นแม้ว่าคอลัมน์จะถูกย้ายในเวลาทำงาน ID ยังคงเหมือนเดิมเสมอ นี่คือการระบุหลักของคอลัมน์ ค่าแสดงถึงข้อความที่จะพิมพ์ โปรดทราบว่าค่าเป็นประเภทตัวแปรดังนั้นคุณไม่จำเป็นต้องแปลงเป็นสตริงเว้นแต่คุณต้องการจัดรูปแบบค่าแน่นอน คุณสามารถระบุระยะขอบที่ด้านซ้ายของคอลัมน์เพื่อวาดไอคอนหรือการวาดแบบกำหนดเองอื่น ๆ (ดูแหล่งที่มาตัวอย่าง)

 function AddItem ( const Ar: TArray<String>): Integer;

ฟังก์ชั่นนี้ช่วยให้คุณเพิ่มรายการลงในกล่องรายการแยกสตริงอาร์เรย์โดยอัตโนมัติด้วยอักขระแท็บ คุณควรใช้ฟังก์ชั่นนี้เฉพาะเมื่อคุณจัดเก็บข้อมูลลงในกล่องรายการโดยใช้วิธีการคั่นแบบแท็บ โดยปกติคุณจะต้องใช้สิ่งนี้พร้อมกับคุณสมบัติ AutodrawTabbedText ดังนั้นคุณไม่จำเป็นต้องเขียน onDrawItem

 function GetItemArray (Index: Integer): TArray<String>;

ส่งคืนอาร์เรย์ของสตริงที่สัมพันธ์กับดัชนีในกล่องรายการพิจารณาข้อความรายการมีข้อมูลคั่นด้วยอักขระแท็บ คุณสามารถอ่านเซลล์อย่างรวดเร็วโดยใช้ GetItemArray(Index)[Column]

ขั้นตอน/ฟังก์ชันคอลัมน์

 function GetLeft : Integer;

ส่งคืนตำแหน่งด้านซ้ายของคอลัมน์ตามขอบเขต rect

 function GetRight : Integer;

ส่งคืนตำแหน่งที่ถูกต้องของคอลัมน์ตามขอบเขต rect

เหตุการณ์

 procedure OnColumnClick (Sender: TObject; Col: TDzListHeaderCol);

เกิดขึ้นเมื่อคลิกซ้ายบนคอลัมน์

 procedure OnColumnDraw (Sender: TObject; Col: TDzListHeaderCol; Canvas: TCanvas; Rect: TRect; Hover: Boolean);

หากคุณตั้งค่ากิจกรรมนี้คุณสามารถจับเวลาของการวาดชื่อคอลัมน์เพื่อให้คุณสามารถเปลี่ยนผืนผ้าใบหรือเพิ่มบางส่วนลงในคอลัมน์ทาสีปัจจุบัน เมื่อเหตุการณ์เกิดขึ้นคอลัมน์จะถูกทาสีแล้ว แต่ไม่ได้ทาสีลงในหน้าจอเพราะใช้บิตแมปภายใน ดังนั้นเหตุการณ์นี้ช่วยให้คุณสามารถเปลี่ยนผืนผ้าใบบิตแมปนี้ได้ เมื่อเหตุการณ์สิ้นสุดลงบิตแมปจะถูกทาสีลงบนหน้าจอ พารามิเตอร์โฮเวอร์ระบุว่าเมาส์อยู่เหนือคอลัมน์ในขณะนี้

 procedure OnColumnRClick (Sender: TObject; Col: TDzListHeaderCol);

เกิดขึ้นเมื่อคลิกขวาที่คอลัมน์

 procedure OnColumnResize (Sender: TObject; Col: TDzListHeaderCol);

เกิดขึ้นหลังจากมีการปรับขนาดคอลัมน์

 procedure OnDrawItem (Control: TWinControl; Index: Integer; Rect: TRect; State: TOwnerDrawState);

คุณควรใช้กิจกรรมนี้เพื่อเขียนคอลัมน์ทั้งหมดโดยใช้วิธี DWCOL (โปรดดูแหล่งที่มาตัวอย่าง)

เหตุการณ์นี้จะไม่ยิงถ้าคุณใช้ AutodrawTabbedText = true

 procedure MouseEnterCol (Sender: TObject; Col: TDzListHeaderCol);

เกิดขึ้นเมื่อเมาส์เข้าสู่พื้นที่คอลัมน์

 procedure MouseLeaveCol (Sender: TObject; Col: TDzListHeaderCol);

เกิดขึ้นเมื่อเมาส์ออกจากพื้นที่คอลัมน์