[VB.NET] ปฐมบทการใช้งานตารางกริด GridGroupControl ของฟรีจากค่าย Syncfusion

thongkorn

วันนี้แอดมินจะมาขอแนะนำ ระดับสุดยอดของฟรีจริงๆ แบบไม่น่าเชื่อ จนต้องร้องขอชีวิต 5555+ ... ดาวน์โหลดได้ฟรีที่ Syncfusion Essential รุ่น Community ซึ่งทางผู้ผลิตกำหนดการใช้งานฟรีว่า องค์กรนั้นๆต้องมี Deveopers ไม่เกิน 5 คน และมีผลประกอบการไม่เกิน 1 ล้าน U$ ... หลักๆที่ทางผู้ผลิตให้มาประกอบไปด้วย

- 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+
- ทำงานได้รวดเร็ว อันนี้แอดมินลองทดสอบดูเอง จึงได้นำข้อมูลมาเผยแพร่นี่แหละครับ
- การควบคุม ยากง่ายขนาดไหน ซึ่งมันอยู่ที่เรื่องประสบการณ์ของแต่ละบุคคล ในการค้นหาคำตอบ

วิธีการหลักๆในการศึกษา Control ต่างๆแล้ว เราจะต้องดูจาก คู่มือ หรือ Help ที่มีมาให้ เรื่องนี้เป็นเรื่องที่สำคัญที่หลายๆคนมักมองข้ามไป โดยเฉพาะบรรดามือใหม่ทั้งหลาย ที่ไม่ยอมอ่านกัน กะจะหาแต่ในเน็ต หรือ StackOverFlow นั่นแหละคือจุดอ่อนของตัวคุณเอง ทำให้ขาด "พื้นฐาน" ที่จะนำทางให้ไปต่อได้ในระยะยาว ...

อนึ่ง!!! ... Control ต่างๆที่เราใช้งานกันอยู่ในปัจจุบัน มันมีคุณสมบัติ (Properties) ประจำตัวอยู่นับร้อยๆอย่าง ซึ่งเราจดจำไม่ไหวหรอกครับ ดังนั้นในงานทั้งหมดของแอดมิน จะใช้วิธีการแบบ Run-Time คือใช้การเขียนโค้ด แทนที่จะจับ Control ลากมาวางแล้วปรับแต่งคุณสมบัติผ่าน Design-Time เพราะ ...

- เราไม่ต้องจดจำ แต่อาศัยความเข้าใจ
- เมื่อเข้าใจในพฤติกรรมของ Control แต่ละตัว ก็จะสามารถควบคุมมันได้ตามใจนึก ... สิ่งนี้จะนำทางให้เราเรียนรู้ฝึกฝน กับบรรดา Control ตัวใหม่ๆต่างค่ายได้อย่างไม่ยากเย็นนัก เพราะหลักการต่างๆมันแทบไม่ได้แตกต่างกันเลย


Design Time ลากแค่ GGC เข้ามาวางบนฟอร์ม แล้วปรับคุณสมบัติ Anchor เท่านั้น ส่วนอื่นๆเราจะใช้โค้ดกำหนดแทน


Reference ที่จำเป็นต้องใช้งาน

มาดูโค้ดกันเถอะ ...

1. #Region "About"
   
2. ' / -----------------------------------------------------------------
   
3. ' / Developer : Mr.Surapon Yodsanga (Thongkorn Tubtimkrob)
   
4. ' / eMail : thongkorn@hotmail.com
   
5. ' / URL: http://www.g2gnet.com (Khon Kaen - Thailand)
   
6. ' / Facebook: https://www.facebook.com/g2gnet (For Thailand)
   
7. ' / Facebook: https://www.facebook.com/commonindy (Worldwide)
   
8. ' / Purpose: Sample code for GridGroupingControl of Syncfusion Community.
   
9. ' / Microsoft Visual Basic .NET (2010) & MS Access 2007+
   
10. ' /
    
11. ' / This is open source code under @CopyLeft by Thongkorn Tubtimkrob.
    
12. ' / You can modify and/or distribute without to inform the developer.
    
13. ' / -----------------------------------------------------------------
    
14. #End Region
    
15. 
    
16. Imports Syncfusion.Windows.Forms
    
17. Imports Syncfusion.Windows.Forms.Grid
    
18. Imports Syncfusion.Grouping
    
19. Imports Syncfusion.Drawing
    
20. '// DataBase
    
21. Imports System.Data.OleDb
    
22. 
    
23. Public Class frmGGCSample
    
24. 
    
25.     Private Sub frmGGCSample_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
    
26.         Call ConnectDataBase()
    
27.         Call RetrieveData(False)
    
28.     End Sub
    
29. 
    
30.     ' / -----------------------------------------------------------------
    
31.     ' / blnSearch = True, It's search for specified data, False = all data is displayed.
    
32.     Private Sub RetrieveData(Optional ByVal blnSearch As Boolean = False)
    
33.         strSQL = _
    
34.             " SELECT tblSample.PrimaryKey, tblSample.ID, tblSample.NumberField, tblSample.DoubleField, " & _
    
35.             " tblSample.DateField, tblGroup.GroupName " & _
    
36.             " FROM tblSample INNER JOIN tblGroup ON tblSample.GroupFK = tblGroup.GroupPK "
    
37. 
    
38.         '// blnSearch = True for Search
    
39.         If blnSearch Then
    
40.             strSQL = strSQL & _
    
41.                 " WHERE " & _
    
42.                 " [ID] " & " Like '%" & txtSearch.Text & "%'" & " OR " & _
    
43.                 " [GroupName] " & " Like '%" & txtSearch.Text & "%'" & _
    
44.                 " ORDER BY PrimaryKey "
    
45.         Else
    
46.             strSQL = strSQL & " ORDER BY PrimaryKey "
    
47.         End If
    
48.         '//
    
49.         If Conn.State = ConnectionState.Closed Then Conn.Open()
    
50.         '// Creates Data Adapter.
    
51.         DA = New OleDbDataAdapter(strSQL, Conn)
    
52.         ' Creates and fills Data Set.
    
53.         DS = New DataSet
    
54.         DA.Fill(DS)
    
55.         Me.GGC.DataSource = DS.Tables(0)
    
56.         lblRecordCount.Text = "[Total: " & Format(DS.Tables(0).Rows.Count, "#,##") & " Records.]"
    
57.         DA.Dispose()
    
58.         DS.Dispose()
    
59.         Conn.Close()
    
60.         '//
    
61.         Call InitGridGroup()
    
62.         '//
    
63.         txtSearch.Clear()
    
64.     End Sub
    
65. 
    
66.     Private Sub btnRefresh_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnRefresh.Click
    
67.         Call RetrieveData(False)
    
68.     End Sub
    
69. 
    
70.     Private Sub txtSearch_KeyPress(ByVal sender As Object, ByVal e As System.Windows.Forms.KeyPressEventArgs) Handles txtSearch.KeyPress
    
71.         If Trim(txtSearch.Text) = "" Or Len(Trim(txtSearch.Text)) = 0 Then Exit Sub
    
72.         '// Undesirable characters for the database ex.  ', * or %
    
73.         txtSearch.Text = Replace(Trim(txtSearch.Text), "'", "")
    
74.         txtSearch.Text = Replace(Trim(txtSearch.Text), "%", "")
    
75.         txtSearch.Text = Replace(Trim(txtSearch.Text), "*", "")
    
76.         ' RetrieveData(True) It means searching for information.
    
77.         If e.KeyChar = Chr(13) Then '// Press Enter
    
78.             '// No beep.
    
79.             e.Handled = True
    
80.             '//
    
81.             Call RetrieveData(True)
    
82.         End If
    
83.     End Sub
    
84. 
    
85.     ' / -----------------------------------------------------------------
    
86.     ' / Initilized GridGroupingControl
    
87.     Private Sub InitGridGroup()
    
88.         '// Initialize Columns GridGroup
    
89.         With Me.GGC
    
90.             '// Hidden Primary Key Column
    
91.             .TableDescriptor.VisibleColumns.Remove("PrimaryKey")
    
92.             'Using Column Name
    
93.             .TableDescriptor.Columns("ID").HeaderText = "ID"
    
94.             .TableDescriptor.Columns("NumberField").HeaderText = "Number Value"
    
95.             .TableDescriptor.Columns("DoubleField").HeaderText = "Double Value"
    
96.             .TableDescriptor.Columns("DateField").HeaderText = "Date"
    
97.             .TableDescriptor.Columns("DateField").Appearance.AnyRecordFieldCell.Format = "dd/MM/yyyy"
    
98.             .TableDescriptor.Columns("DateField").Appearance.AnyRecordFieldCell.CellType = GridCellTypeName.TextBox
    
99.         End With
    
100.         '// GridVerticalAlignment.Middle
     
101.         For i As Byte = 0 To 5
     
102.             With Me.GGC
     
103.                 .TableDescriptor.Columns(i).Appearance.AnyRecordFieldCell.VerticalAlignment = GridVerticalAlignment.Middle
     
104.                 .TableDescriptor.Columns(i).AllowGroupByColumn = False
     
105.             End With
     
106.         Next
     
107.         '// Initialize normal GridGrouping
     
108.         With Me.GGC
     
109.             ' Allows GroupDropArea to be visible
     
110.             .ShowGroupDropArea = False  ' Disable
     
111.             '// Hidden Top Level of Grouping
     
112.             .TopLevelGroupOptions.ShowCaption = False
     
113. 
     
114.             '// Metro Styles
     
115.             .GridVisualStyles = Syncfusion.Windows.Forms.GridVisualStyles.Metro
     
116.             ' Disables editing in GridGroupingControl
     
117.             .ActivateCurrentCellBehavior = GridCellActivateAction.None
     
118.             '.ActivateCurrentCellBehavior = GridCellActivateAction.ClickOnCell
     
119.             '// Disable Add New
     
120.             .TableDescriptor.AllowNew = False
     
121.             '// Autofit Columns
     
122.             .AllowProportionalColumnSizing = True
     
123. 
     
124.             '// Row Height
     
125.             .Table.DefaultRecordRowHeight = 25
     
126.             '//
     
127.             .Table.DefaultCaptionRowHeight = 25
     
128.             .Table.DefaultColumnHeaderRowHeight = 30    '// Columns Header
     
129. 
     
130.             '// Selection
     
131.             .TableOptions.ListBoxSelectionMode = SelectionMode.One
     
132.             'Selection Back color
     
133.             .TableOptions.SelectionBackColor = Color.Firebrick
     
134.             '//
     
135.             .Appearance.ColumnHeaderCell.TextColor = Color.DarkBlue
     
136. 
     
137.             'Applies back color as LightCyan for alternative records in the Grid.
     
138.             .Appearance.AlternateRecordFieldCell.BackColor = Color.LightCyan
     
139. 
     
140.             '.TableModel.Options.SelectCellsMouseButtonsMask = MouseButtons.Right
     
141. 
     
142.             '/ Disable record preview row
     
143.             .TableOptions.ShowRecordPreviewRow = False
     
144.             '//
     
145.             '/ Will enable the Group Header for the top most group.
     
146.             .TopLevelGroupOptions.ShowGroupHeader = False ' True
     
147.             '/ Will enable the Group Footer for the group.
     
148.             .TopLevelGroupOptions.ShowGroupFooter = False 'True
     
149.             '//
     
150.             .TableOptions.GroupHeaderSectionHeight = 30
     
151.             .TableOptions.GroupFooterSectionHeight = 30
     
152.         End With
     
153. 
     
154.     End Sub
     
155. 
     
156.     ' / -----------------------------------------------------------------
     
157.     '// Double click event for show Primary Key which hidden in Column(0)
     
158.     Private Sub GGC_TableControlCellDoubleClick(ByVal sender As Object, ByVal e As Syncfusion.Windows.Forms.Grid.Grouping.GridTableControlCellClickEventArgs) Handles GGC.TableControlCellDoubleClick
     
159.         '// Row of Column Header
     
160.         If e.Inner.RowIndex <= 1 Then Return
     
161.         '/ Notify the double click performed in a cell
     
162.         Dim rec As Record = Me.GGC.Table.DisplayElements(e.TableControl.CurrentCell.RowIndex).ParentRecord
     
163.         If (rec) IsNot Nothing Then
     
164.             MsgBox("Primary key = " & rec.GetValue("PrimaryKey").ToString)
     
165.         End If
     
166.     End Sub
     
167. 
     
168.     ' / -----------------------------------------------------------------
     
169.     '// Full Select Row
     
170.     Private Sub GGC_TableControlCurrentCellActivating(ByVal sender As Object, ByVal e As Syncfusion.Windows.Forms.Grid.Grouping.GridTableControlCurrentCellActivatingEventArgs) Handles GGC.TableControlCurrentCellActivating
     
171.         '// Get Column Index 0 is the Primary Key. (Hidden column)
     
172.         e.Inner.ColIndex = 0
     
173.     End Sub
     
174. 
     
175.     Private Sub btnExit_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnExit.Click
     
176.         Me.Close()
     
177.     End Sub
     
178. 
     
179.     ' / -----------------------------------------------------------------
     
180.     '// Press enter each row.
     
181.     Private Sub GGC_TableControlCurrentCellKeyPress(sender As Object, e As Syncfusion.Windows.Forms.Grid.Grouping.GridTableControlKeyPressEventArgs) Handles GGC.TableControlCurrentCellKeyPress
     
182.         '// Check rows count before.
     
183.         If GGC.TableModel.RowCount <= 0 Then Return
     
184.         '/ Notify the current cell keypress
     
185.         Dim rec As Record = Me.GGC.Table.DisplayElements(GGC.TableControl.CurrentCell.RowIndex).ParentRecord
     
186.         If (rec) IsNot Nothing Then
     
187.             MsgBox("Primary key = " & rec.GetValue("PrimaryKey").ToString)
     
188.         End If
     
189.     End Sub
     
190. 
     
191.     Private Sub frmGGCSample_FormClosed(ByVal sender As Object, ByVal e As System.Windows.Forms.FormClosedEventArgs) Handles Me.FormClosed
     
192.         Me.Dispose()
     
193.         Application.Exit()
     
194.     End Sub
     
195. End Class

คัดลอกไปที่คลิปบอร์ด

โมดูลหากิน ... modDataBase.vb

1. ' / --------------------------------------------------------------------------------
   
2. ' / Developer : Mr.Surapon Yodsanga (Thongkorn Tubtimkrob)
   
3. ' / eMail : thongkorn@hotmail.com
   
4. ' / URL: http://www.g2gnet.com (Khon Kaen - Thailand)
   
5. ' / Facebook: https://www.facebook.com/g2gnet (For Thailand)
   
6. ' / Facebook: https://www.facebook.com/commonindy (Worldwide)
   
7. ' / Microsoft Visual Basic .NET (2010)
   
8. ' /
   
9. ' / This is open source code under @Copyleft by Thongkorn Tubtimkrob.
   
10. ' / You can modify and/or distribute without to inform the developer.
    
11. ' / --------------------------------------------------------------------------------
    
12. Imports System.Data.OleDb
    
13. Imports Microsoft.VisualBasic
    
14. 
    
15. Module modDataBase
    
16.     '// Declare variable one time but use many times.
    
17.     Public Conn As OleDbConnection
    
18.     Public Cmd As OleDbCommand
    
19.     Public DS As DataSet
    
20.     Public DR As OleDbDataReader
    
21.     Public DA As OleDbDataAdapter
    
22.     Public strSQL As String '// Major SQL
    
23. 
    
24.     '// Data Path
    
25.     Public strPathData As String = MyPath(Application.StartupPath)
    
26.     '// Images Path
    
27.     'Public strPathImages As String = MyPath(Application.StartupPath)
    
28. 
    
29.     Public Function ConnectDataBase() As System.Data.OleDb.OleDbConnection
    
30.         strPathData = MyPath(Application.StartupPath) & "Data"
    
31.         'strPathImages = MyPath(Application.StartupPath) & "Images"
    
32.         Dim strConn As String = _
    
33.             " Provider = Microsoft.ACE.OLEDB.12.0; " & _
    
34.             " Data Source = " & strPathData & "Sample.accdb"
    
35. 
    
36.         Conn = New OleDb.OleDbConnection(strConn)
    
37.         ' Create Connection
    
38.         Conn.ConnectionString = strConn
    
39.         ' Return
    
40.         Return Conn
    
41.     End Function
    
42. 
    
43.     ' / --------------------------------------------------------------------------------
    
44.     ' / Get my project path
    
45.     ' / AppPath = C:\My Project\bin\debug
    
46.     ' / Replace "\bin\debug" with ""
    
47.     ' / Return : C:\My Project\
    
48.     Function MyPath(AppPath As String) As String
    
49.         '/ MessageBox.Show(AppPath);
    
50.         AppPath = AppPath.ToLower()
    
51.         '/ Return Value
    
52.         MyPath = AppPath.Replace("\bin\debug", "").Replace("\bin\release", "").Replace("\bin\x86\debug", "")
    
53.         '// If not found folder then put the \ (BackSlash) at the end.
    
54.         If Right(MyPath, 1) <> "" Then MyPath = MyPath & ""
    
55.     End Function
    
56. End Module

คัดลอกไปที่คลิปบอร์ด

ดาวน์โหลดโค้ดฉบับเต็ม VB.NET (2010) ได้ที่นี่ ...