[VB.NET] การใช้งานตารางกริด GridGroupingControl ของฟรีระดับโลกจากค่าย Syncfusion
http://www.g2gnet.com/webboard/images/vbnet/Syncfusion-Run.gifวันนี้แอดมินจะมาขอแนะนำ ตารางกริดระดับสุดยอดของฟรีจริงๆจากค่าย Syncfusion ภายใต้ชื่อ Syncfusion Essential รุ่น Community ซึ่งทางผู้ผลิตกำหนดเงื่อนไขในการใช้งานฟรีว่า องค์กรนั้นๆต้องมี Deveopers ไม่เกิน 5 คน และมีผลประกอบการไม่เกิน 1 ล้านยูเอสดอลล่าร์ ... และที่สำคัญคือ สามารถนำโปรเจคของเราไปจำหน่ายในเชิงพาณิชย์ได้ครับทั่นผู้ชม ... ท่านสามารถเข้าไปสมัครและรับของฟรีมาใช้ได้เลย นอกเหนือไปจากนั้นค่ายนี้เขายัง eBook ในรูปแบบ PDF แจกฟรีเอาไว้ให้เราได้อ่านกันอีกหลายเรื่องครับ ...
โดยหลักๆที่ทางผู้ผลิตให้มาประกอบไปด้วย ...
- 800+ Controls and Frameworks
- Enterprise solutions for Big Data, Dashboards and Reporting
- A $15,960 value for FREE
- Support and updates included
Control ตัวแรกที่แอดมินทดสอบคือ ตารางกริด GridGroupingControl ซึ่งจะขอเรียกชื่อย่อว่า GGC กันนะครับ ซึ่งเป็นตารางกริดแบบแสดงผลทั่วไปได้ และสามารถทำการจัดกลุ่มได้ด้วย (อันนี้สำมะคัญเลย) การทดสอบทั่วๆไปที่แอดมินวางแนวทางไว้ดังนี้ คือ ...
- เรื่องหน้าตาก่อนล่ะ อันนี้ผ่านฉลุยตั้งแต่แรกเริ่มที่ได้ลูบคลำแล้วครับ 5555+
- ทำงานได้รวดเร็ว อันนี้แอดมินลองทดสอบดูเอง จึงได้นำข้อมูลมาเผยแพร่นี่แหละครับ
- การควบคุม ยากง่ายขนาดไหน ซึ่งมันอยู่ที่เรื่องประสบการณ์ของแต่ละบุคคล ในการค้นหาคำตอบ
http://www.g2gnet.com/webboard/images/vbnet/Control_img1.png
อันดับแรกต้องดู ลักษณะโครงสร้างของตัว GridGroupingControl ให้ลึกซึ้งดื่มด่ำซ่ะก่อน เพราะเวลาไปอ่านคู่มือเราจะโฟกัสในทีละส่วนได้
วิธีการหลักๆในการศึกษา Control ต่างๆแล้ว เราจะต้องดูจาก คู่มือ หรือ Help ที่มีมาให้ เรื่องนี้เป็นเรื่องที่สำคัญที่หลายๆคนมักมองข้ามไป โดยเฉพาะบรรดามือใหม่ทั้งหลาย ที่ไม่ค่อยยอมอ่านกัน กะจะหาแต่เพียงในอินเทอร์เน็ต ซึ่งจะทำให้เราพัฒนาศักยภาพตัวเองต่อไปได้ยากลำบาก อีกทั้งตัวอย่างที่ Syncfusion ให้มา ก็ล้วนแล้วแต่เป็น C# ทั้งนั้น แต่ข้อมูลรายละเอียดในการควบคุม GGC ด้วย VB.Net มันกลับไปอยู่ที่ Help ...
อนึ่ง!!! ... Control ต่างๆที่เราใช้งานกันอยู่ในปัจจุบัน มันมีคุณสมบัติ (Properties) ประจำตัวอยู่นับร้อยๆอย่าง ซึ่งเราไม่สามารถจดจำมันได้ทั้งหมดหรอกครับ ดังนั้นในงานทั้งหมดของแอดมิน จะใช้ วิธีการแบบ Run-Time คือใช้การเขียนโค้ด แล้วสั่งรันโปรแกรมจึงจะเห็นผล แทนที่จะจับ Control ลากมาวางแล้วปรับแต่งคุณสมบัติผ่าน Design-Time เพราะ ...
- เราไม่ต้องจดจำ แต่อาศัยความเข้าใจด้วยการอ่าน หรือตีความหมายจากโค้ดแทน
- Copy & Paste โค้ดไปใช้ได้ โดยที่ไม่ต้องห่วงพะวงกับเวอร์ชั่นของตัว Control เอง
- เมื่อเข้าใจในพฤติกรรมของ Control แต่ละตัว ก็จะสามารถควบคุมมันได้ตามใจนึก ... สิ่งนี้จะนำทางให้เราเรียนรู้ฝึกฝน กับบรรดา Control ตัวใหม่ๆต่างค่ายได้อย่างไม่ยากเย็นนัก เพราะหลักการต่างๆมันแทบไม่ได้แตกต่างกันเลย
http://www.g2gnet.com/webboard/images/vbnet/Syncfusion-Refer.gif
References ... เวอร์ชั่นปัจจุบันที่แอดมินใช้ คือ 15.2.0.40 นะครับ เพราะไม่รู้ว่าทำไมเวอร์ชั่นที่ใหม่กว่านี้ มันตัดเอาโค้ดตัวอย่าง Syncfusion Control Panel ทิ้งไปซ่ะดื้อๆ 5555+
http://www.g2gnet.com/webboard/images/vbnet/Syncfusion-Design.png
Design Time ... การจับลาก GridGroupingControl มาวางแปะไว้บนฟอร์ม โดยที่ไม่ต้องไปกำหนดค่าคุณสมบัติอะไรทั้งสิ้น เราจะใช้การสั่งจากโค้ดแทน
http://www.g2gnet.com/webboard/images/vbnet/Syncfusion-DB.gif
ตัวอย่างการ Join ตารางข้อมูล 2 ตาราง (เพราะเดี๋ยวรอบหน้าแอดมินจะสาธิตวิธีการทำ Group หรือการจัดกลุ่มด้วยวิธีการเขียนโค้ดให้ดูอีกที) มาดูโค้ดตัวอย่างบางส่วนกัน ...
' / -----------------------------------------------------------------
' / Initilized GridGroupingControl
Private Sub InitGridGroup()
'// Initialize Columns GridGroup
With Me.GGC
'// Hidden Primary Key Column
.TableDescriptor.VisibleColumns.Remove("PrimaryKey")
'Using Column Name
.TableDescriptor.Columns("ID").HeaderText = "ID"
.TableDescriptor.Columns("NumberField").HeaderText = "Number Value"
.TableDescriptor.Columns("DoubleField").HeaderText = "Double Value"
.TableDescriptor.Columns("DateField").HeaderText = "Date"
.TableDescriptor.Columns("DateField").Appearance.AnyRecordFieldCell.Format = "dd/MM/yyyy"
.TableDescriptor.Columns("DateField").Appearance.AnyRecordFieldCell.CellType = GridCellTypeName.TextBox
End With
'// GridVerticalAlignment.Middle
For i As Byte = 0 To 5
With Me.GGC
.TableDescriptor.Columns(i).Appearance.AnyRecordFieldCell.VerticalAlignment = GridVerticalAlignment.Middle
.TableDescriptor.Columns(i).AllowGroupByColumn = False
End With
Next
'// Initialize normal GridGrouping
With Me.GGC
' Allows GroupDropArea to be visible
.ShowGroupDropArea = False' Disable
'// Hidden Top Level of Grouping
.TopLevelGroupOptions.ShowCaption = False
'// Metro Styles
.GridVisualStyles = Syncfusion.Windows.Forms.GridVisualStyles.Metro
' Disables editing in GridGroupingControl
.ActivateCurrentCellBehavior = GridCellActivateAction.None
'.ActivateCurrentCellBehavior = GridCellActivateAction.ClickOnCell
'// Disable Add New
.TableDescriptor.AllowNew = False
'// Autofit Columns
.AllowProportionalColumnSizing = True
'// Row Height
.Table.DefaultRecordRowHeight = 25
'//
.Table.DefaultCaptionRowHeight = 25
.Table.DefaultColumnHeaderRowHeight = 30 '// Columns Header
'// Selection
.TableOptions.ListBoxSelectionMode = SelectionMode.One
'Selection Back color
.TableOptions.SelectionBackColor = Color.Firebrick
'//
.Appearance.ColumnHeaderCell.TextColor = Color.DarkBlue
'Applies back color as LightCyan for alternative records in the Grid.
.Appearance.AlternateRecordFieldCell.BackColor = Color.LightCyan
'.TableModel.Options.SelectCellsMouseButtonsMask = MouseButtons.Right
'/ Disable record preview row
.TableOptions.ShowRecordPreviewRow = False
'//
'/ Will enable the Group Header for the top most group.
.TopLevelGroupOptions.ShowGroupHeader = False ' True
'/ Will enable the Group Footer for the group.
.TopLevelGroupOptions.ShowGroupFooter = False 'True
'//
.TableOptions.GroupHeaderSectionHeight = 30
.TableOptions.GroupFooterSectionHeight = 30
End With
End Subการตั้งค่าคุณสมบัติ (Properties) เริ่มต้น ให้กับตัวหลักๆของ GridGroupingControl ... หากนำไปใช้กับโปรเจคอื่นๆก็แค่ Copy & Paste ไปใช้งานได้เลย ส่วนตัว Control ไม่ว่าจะเวอร์ชั่นไหนก็ไม่สำคัญ
การค้นคืนข้อมูล (Retrieval Data) อันนี้เรียกได้ว่าเป็นแพทเทิร์นของทุกๆงาน
' / -----------------------------------------------------------------
' / blnSearch = True, It's search for specified data, False = all data is displayed.
Private Sub RetrieveData(Optional ByVal blnSearch As Boolean = False)
strSQL = _
" SELECT tblSample.PrimaryKey, tblSample.ID, tblSample.NumberField, tblSample.DoubleField, " & _
" tblSample.DateField, tblGroup.GroupName " & _
" FROM tblSample INNER JOIN tblGroup ON tblSample.GroupFK = tblGroup.GroupPK "
'// blnSearch = True for Search
If blnSearch Then
strSQL = strSQL & _
" WHERE " & _
" " & " Like '%" & txtSearch.Text & "%'" & " OR " & _
" " & " Like '%" & txtSearch.Text & "%'" & _
" ORDER BY PrimaryKey "
Else
strSQL = strSQL & " ORDER BY PrimaryKey "
End If
'//
If Conn.State = ConnectionState.Closed Then Conn.Open()
'// Creates Data Adapter.
DA = New OleDbDataAdapter(strSQL, Conn)
' Creates and fills Data Set.
DS = New DataSet
DA.Fill(DS)
Me.GGC.DataSource = DS.Tables(0)
lblRecordCount.Text = ""
DA.Dispose()
DS.Dispose()
Conn.Close()
'//
Call InitGridGroup()
'//
txtSearch.Clear()
End Sub
เหตุการณ์ที่ผู้ใช้เลือกแต่ละแถวรายการ ด้วยการกดดับเบิ้ลคลิ๊กเมาส์
' / -----------------------------------------------------------------
'// Double click event for show Primary Key which hidden in Column(0)
Private Sub GGC_TableControlCellDoubleClick(ByVal sender As Object, ByVal e As Syncfusion.Windows.Forms.Grid.Grouping.GridTableControlCellClickEventArgs) Handles GGC.TableControlCellDoubleClick
'// Row of Column Header
If e.Inner.RowIndex <= 1 Then Return
'/ Notify the double click performed in a cell
Dim rec As Record = Me.GGC.Table.DisplayElements(e.TableControl.CurrentCell.RowIndex).ParentRecord
If (rec) IsNot Nothing Then
MsgBox("Primary key = " & rec.GetValue("PrimaryKey").ToString)
End If
End Sub
เหตุการณ์ที่ผู้ใช้เลือกแต่ละแถวรายการ ด้วยการกด Enter ในแถวรายการ
' / -----------------------------------------------------------------
'// Press enter each row.
Private Sub GGC_TableControlCurrentCellKeyPress(sender As Object, e As Syncfusion.Windows.Forms.Grid.Grouping.GridTableControlKeyPressEventArgs) Handles GGC.TableControlCurrentCellKeyPress
'// Check rows count before.
If GGC.TableModel.RowCount <= 0 Then Return
'/ Notify the current cell keypress
Dim rec As Record = Me.GGC.Table.DisplayElements(GGC.TableControl.CurrentCell.RowIndex).ParentRecord
If (rec) IsNot Nothing Then
MsgBox("Primary key = " & rec.GetValue("PrimaryKey").ToString)
End If
End Sub
Conclusion: ขอให้สังเกตด้วยว่า แอดมินจะนำค่า Primary Key ไปไว้ในหลักแรก (Index = 0) และต้องซ่อนเอาไว้เสมอ เพราะผู้ใช้งานจะไม่ได้ใช้ค่านี้ แต่ตัวเราผู้พัฒนาโปรแกรมจะต้องใช้ค่านี้เป็นหลักในการอ้างอิงถึง สำหรับผู้ใช้งาน เขา/เธอจะเห็นเพียงค่า IDentifier หรือ ID แทน ไม่ว่าจะเป็นโปรเจคใดๆก็ตามในเรื่องราวที่เกี่ยวข้องกับฐานข้อมูล ... สวัสดี
ดาวน์โหลดโค้ดต้นฉบับแบบเต็ม VB.NET (2010) ได้ที่นี่
หน้า:
[1]