In this tutorial, you will learn how to use the grid’s Filter Bar functionality to allow the end user to sort column data dynamically at run time.
1. Create a new project. Add a C1TrueDBGrid control to the form.
2. Add the following items to the form and situate them like they appear in the following image.
· Five ComboBoxes (ComboBox1 – 5).
· Two frames and set their Text property to “Border Size” and “Scrolling” respectively.
· Four Labels (Label1 – 5) and set their Text properties to “Top Width”, “Bottom Width”, “Left Width”, “Right Width”, and “Border Appearance” respectively.
· Button (Button1) and set its Text property to “Border Color”.
· Two Checkboxes and set their text properties to “ScrollTips” and “ScrollTracking”.
3. Add a Color Dialog to the form (ColorDialog1).
4. In the TrueDBGrid Tasks menu, locate the Choose Data Source drop-down and select Add Project Data Source. In the adapter’s Data Source Configuration Wizard, either select a connection to TDBGDemo.mdb or create a new connection to this database. On the Choose your database objects page of the wizard, select all fields in the Customer table and type "DsCustomer" into the DataSet name box, and then finish out the wizard.
5. Click on the grid to give it focus, then in the Properties window set the RowHeight property to 40.
6. Visual Studio adds the following code to the Form_Load event:
Me.CustomerTableAdapter.Fill(Me.DsCustomer.Customer)
· C#
this.CustomerTableAdapter.Fill(this.DsCustomer.Customer);
· Delphi
Self.CustomerTableAdapter.Fill(Self.DsCustomer.Customer);
7. In the general section of Form1 add the following declarations:
' Copy the data.
Dim dbTable As DataTable
Dim borderColor As Color
Dim borderLeft As Integer, borderTop As Integer, borderRight As Integer, borderBottom As Integer
Dim borderType As C1.Win.C1TrueDBGrid.BorderTypeEnum
· C#
// Copy the data.
DataTable dbTable;
Color borderColor;
int borderLeft, int borderTop, int borderRight, int borderBottom;
C1.Win.C1TrueDBGrid.BorderTypeEnum borderType;
· Delphi
FBorderColor: System.Drawing.Color;
BorderLeft, BorderTop, BorderRight, BorderBottom: Integer;
FBorderType: C1.Win.C1TrueDBGrid.BorderTypeEnum;
8. Into the Load event of Form1 add the following code:
dbTable = Me.DsCustomer.Tables(0).Copy()
' Fill each combobox.
FillComboBox1()
FillCombo(ComboBox2)
FillCombo(ComboBox3)
FillCombo(ComboBox4)
FillCombo(ComboBox5)
Me.CheckBox2.Checked = True
' Initalize border sizes.
Me.borderBottom = 1
Me.borderLeft = 1
Me.borderRight = 1
Me.borderTop = 1
· C#
dbTable = this.DsCustomer.Tables[0].Copy();
// Fill each combobox.
FillComboBox1();
FillCombo(ComboBox2);
FillCombo(ComboBox3);
FillCombo(ComboBox4);
FillCombo(ComboBox5);
this.CheckBox2.Checked = true;
// Initalize border sizes.
this.borderBottom = 1;
this.borderLeft = 1;
this.borderRight = 1;
this.borderTop = 1;
· Delphi
begin
FillComboBorderAppearance;
FillComboBorderSize(Self.comboBox1);
FillComboBorderSize(Self.comboBox2);
FillComboBorderSize(Self.comboBox3);
FillComboBorderSize(Self.comboBox4);
CheckBox2.Checked := True;
BorderBottom := 1;
BorderLeft := 1;
BorderRight := 1;
BorderTop := 1;
end;
9. Now add the functions that will fill the ComboBoxes:
' Fill each combo with numbers from 1 to 10.
Private Sub FillCombo(ByRef com As ComboBox)
Dim i As Integer
com.Text = 1
For i = 1 To 10
com.Items.Add(i)
Next
End Sub
' Fill the first combo with border types.
Private Sub FillComboBox1()
Me.ComboBox1.Text = "None"
With Me.ComboBox1.Items
.Add("Fillet")
.Add("Flat")
.Add("Groove")
.Add("Inset")
.Add("InsetBevel")
.Add("None")
.Add("Raised")
.Add("RaisedBevel")
End With
End Sub
· C#
// Fill each combo with numbers from 1 to 10.
private void FillCombo(ref ComboBox com)
{
int i;
com.Text = 1;
for ( i = 1 ; i <= 10; i++)
{
com.Items.Add[I];
}
}
// Fill the first combo with border types.
private void FillComboBox1()
{
this.ComboBox1.Text = "None";
this.ComboBox1.Items.Add("Fillet");
this.ComboBox1.Items.Add("Flat");
this.ComboBox1.Items.Add("Groove");
this.ComboBox1.Items.Add("Inset");
this.ComboBox1.Items.Add("InsetBevel");
this.ComboBox1.Items.Add("None");
this.ComboBox1.Items.Add("Raised");
this.ComboBox1.Items.Add("RaisedBevel");
}
· Delphi
procedure TWinForm.FillComboBorderAppearance;
begin
Self.comboBox5.Items.Add('Fillet');
Self.comboBox5.Items.Add('Flat');
Self.comboBox5.Items.Add('Groove');
Self.comboBox5.Items.Add('Inset');
Self.comboBox5.Items.Add('InsetBevel');
Self.comboBox5.Items.Add('None');
Self.comboBox5.Items.Add('Raised');
Self.comboBox5.Items.Add('RaisedBevel');
end;
procedure TWinForm.FillComboBorderSize(combo: ComboBox);
var
i: Integer;
begin
combo.Text := '1';
i := 1;
while (i <> 11) do
begin
combo.Items.Add(i.ToString);
i := i + 1;
end;
end;
10. Now create a handler for the Click event of Button1 that will set the color of the border using the color dialog:
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim result As DialogResult
result = Me.ColorDialog1.ShowDialog()
If result = DialogResult.OK Then
borderColor = Me.ColorDialog1.Color
Button1.BackColor = borderColor
End If
UpdateBorder()
End Sub
· C#
private void Button1_Click( System.object sender, System.EventArgs e) Button1.Click {
DialogResult result;
result = this.ColorDialog1.ShowDialog();
if ( result == DialogResult.OK )
{
borderColor = this.ColorDialog1.Color;
Button1.BackColor = borderColor;
}
UpdateBorder();
}
· Delphi
procedure TWinForm.Button1_Click(sender: System.Object; e: System.EventArgs);
var
result: System.Windows.Forms.DialogResult;
begin
result := ColorDialog1.ShowDialog;
if (result = System.Windows.Forms.DialogResult.OK) then
begin
FBorderColor := ColorDialog1.Color;
Button1.BackColor := FBorderColor;
end;
UpdateBorder;
end;
11. Now include the function that updates the borders:
Private Sub UpdateBorder()
With Me.C1TrueDBGrid1.Splits(0).DisplayColumns(Me.C1TrueDBGrid1.Col).Style.Borders
.Color = ColorDialog1.Color
.BorderType = borderType
.Bottom = borderBottom
.Left = borderLeft
.Right = borderRight
.Top = borderTop
End With
End Sub
· C#
private void UpdateBorder()
{
C1.Win.C1TrueDBGrid.GridBorders b;
b = his.C1TrueDBGrid1.Splits[0].DisplayColumns(this.C1TrueDBGrid1.Col).Style.Borders;
b.Color = ColorDialog1.Color;
b.BorderType = borderType;
b.Bottom = borderBottom;
b.Left = borderLeft;
b.Right = borderRight;
b.Top = borderTop;
}
· Delphi
procedure TWinForm.UpdateBorder;
var
Column: C1.Win.C1TrueDBGrid.C1DisplayColumn;
begin
Column := C1TrueDBGrid1.Splits[0].DisplayColumns[Self.c1TrueDBGrid1.Col];
Column.Style.Borders.Color := ColorDialog1.Color;
Column.Style.Borders.BorderType := FBorderType;
Column.Style.Borders.Bottom := BorderBottom;
Column.Style.Borders.Left := BorderLeft;
Column.Style.Borders.Top := BorderTop;
Column.Style.Borders.Right := BorderRight;
end;
12. Now include the code that handles changes in the ComboBox values:
Private Sub ComboBox1_SelectionChangeCommitted(ByVal sender As Object, ByVal e As System.EventArgs) Handles ComboBox1.SelectionChangeCommitted
Select Case Me.ComboBox1.SelectedItem
Case "Fillet"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Fillet
Case "Flat"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Flat
Case "Groove"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Groove
Case "Inset"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Inset
Case "InsetBevel"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.InsetBevel
Case "None"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.None
Case "Raised"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Raised
Case "RaisedBevel"
Me.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.RaisedBevel
End Select
Me.UpdateBorder()
End Sub
Private Sub ComboBox2_SelectionChangeCommitted(ByVal sender As Object, ByVal e As System.EventArgs) Handles ComboBox2.SelectionChangeCommitted
Me.borderTop = Me.ComboBox2.SelectedItem
Me.UpdateBorder()
End Sub
Private Sub ComboBox3_SelectionChangeCommitted(ByVal sender As Object, ByVal e As System.EventArgs) Handles ComboBox3.SelectionChangeCommitted
Me.borderBottom = Me.ComboBox3.SelectedItem
Me.UpdateBorder()
End Sub
Private Sub ComboBox4_SelectionChangeCommitted(ByVal sender As Object, ByVal e As System.EventArgs) Handles ComboBox4.SelectionChangeCommitted
Me.borderLeft = Me.ComboBox4.SelectedItem
Me.UpdateBorder()
End Sub
Private Sub ComboBox5_SelectionChangeCommitted(ByVal sender As Object, ByVal e As System.EventArgs) Handles ComboBox5.SelectionChangeCommitted
Me.borderRight = Me.ComboBox5.SelectedItem
Me.UpdateBorder()
End Sub
· C#
private void ComboBox1_SelectionChangeCommitted( object sender, System.EventArgs e) {
switch (this.ComboBox1.SelectedItem)
{
case "Fillet";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Fillet;
break;
case "Flat";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Flat;
break;
case "Groove";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Groove;
break;
case "Inset";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Inset;
break;
case "InsetBevel";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.InsetBevel;
break;
case "None";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.None;
break;
case "Raised";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.Raised;
break;
case "RaisedBevel";
this.borderType = C1.Win.C1TrueDBGrid.BorderTypeEnum.RaisedBevel;
break;
}
this.UpdateBorder();
}
private void ComboBox2_SelectionChangeCommitted( object sender, System.EventArgs e) {
this.borderTop = this.ComboBox2.SelectedItem;
this.UpdateBorder();
}
private void ComboBox3_SelectionChangeCommitted( object sender, System.EventArgs e) {
this.borderBottom = this.ComboBox3.SelectedItem;
this.UpdateBorder();
}
private void ComboBox4_SelectionChangeCommitted( object sender, System.EventArgs e) {
this.borderLeft = this.ComboBox4.SelectedItem;
this.UpdateBorder();
}
private void ComboBox5_SelectionChangeCommitted( object sender, System.EventArgs e) {
this.borderRight = this.ComboBox5.SelectedItem;
this.UpdateBorder();
}
· Delphi
procedure TWinForm.ComboBox5_SelectedIndexChanged(sender: System.Object; e: System.EventArgs);
begin
case ComboBox5.SelectedIndex of
0: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.Fillet;
1: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.Flat;
2: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.Groove;
3: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.Inset;
4: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.InsetBevel;
5: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.None;
6: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.Raised;
7: FBorderType := C1.Win.C1TrueDBGrid.BorderTypeEnum.RaisedBevel;
end;
UpdateBorder;
end;
procedure TWinForm.ComboBox4_SelectedIndexChanged(sender: System.Object; e: System.EventArgs);
begin
BorderRight := System.Int32.Parse(ComboBox4.SelectedItem.ToString);
UpdateBorder;
end;
procedure TWinForm.ComboBox3_SelectedIndexChanged(sender: System.Object; e: System.EventArgs);
begin
BorderLeft := System.Int32.Parse(ComboBox3.SelectedItem.ToString);
UpdateBorder;
end;
procedure TWinForm.ComboBox2_SelectedIndexChanged(sender: System.Object; e: System.EventArgs);
begin
BorderBottom := System.Int32.Parse(ComboBox2.SelectedItem.ToString);
UpdateBorder;
end;
procedure TWinForm.ComboBox1_SelectedIndexChanged(sender: System.Object; e: System.EventArgs);
begin
BorderTop := System.Int32.Parse(ComboBox1.SelectedItem.ToString);
UpdateBorder;
end;
13. Finally include the code that handles the checkboxes and the FetchScrollTips event that sets the Tooltip box that displays when the user is scrolling:
Private Sub CheckBox1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles CheckBox1.Click
Me.C1TrueDBGrid1.ScrollTips = Me.CheckBox1.Checked
End Sub
Private Sub CheckBox2_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles CheckBox2.Click
Me.C1TrueDBGrid1.ScrollTrack = Me.CheckBox2.Checked
End Sub
Private Sub C1TrueDBGrid1_FetchScrollTips(ByVal sender As System.Object, ByVal e As C1.Win.C1TrueDBGrid.FetchScrollTipsEventArgs) Handles C1TrueDBGrid1.FetchScrollTips
' Set the ScrollTip depending on which scroll bar was moved.
Select Case e.ScrollBar
Case C1.Win.C1TrueDBGrid.ScrollBarEnum.Horizontal
e.ScrollTip = Me.C1TrueDBGrid1.Columns(e.ColIndex).Caption
Case C1.Win.C1TrueDBGrid.ScrollBarEnum.Vertical
e.ScrollTip = "Record: " & CStr(e.Row + 1) & " of " & CStr(Me.dbTable.Rows.Count) & vbCrLf & "Company: " & Me.dbTable.Rows(e.Row).Item("Company") & vbCrLf & "User code: " & Me.dbTable.Rows(e.Row).Item("UserCode")
End Select
e.TipStyle.ForeColor = Color.Blue
End Sub
· C#
private void CheckBox1_Click( object sender, System.EventArgs e)
{
this.C1TrueDBGrid1.ScrollTips = this.CheckBox1.Checked;
}
private void CheckBox2_Click( object sender, System.EventArgs e)
{
this.C1TrueDBGrid1.ScrollTrack = this.CheckBox2.Checked;
}
private void C1TrueDBGrid1_FetchScrollTips( System.object sender, C1.Win.C1TrueDBGrid.FetchScrollTipsEventArgs e)
{
// Set the ScrollTip depending on which scroll bar was moved.
switch (e.ScrollBar)
{
case C1.Win.C1TrueDBGrid.ScrollBarEnum.Horizontal:
e.ScrollTip = this.C1TrueDBGrid1.Columns[e.ColIndex].Caption;
break;
case C1.Win.C1TrueDBGrid.ScrollBarEnum.Vertical:
e.ScrollTip = "Record: " + (e.Row + 1).ToString() + " of " + this.dbTable.Rows.Count.ToString() + "\n" + "Company: " + this.dbTable.Rows[e.Row]["Company"].ToString() + "\n" + "User code: " + this.dbTable.Rows[e.Row]["UserCode"].ToString();
break;
}
e.TipStyle.ForeColor = Color.Blue;
}
· Delphi
procedure TWinForm.C1TrueDBGrid1_FetchScrollTips(sender: System.Object; e: C1.Win.C1TrueDBGrid.FetchScrollTipsEventArgs);
var Row: Integer;
begin
case e.ScrollBar of
C1.Win.C1TrueDBGrid.ScrollBarEnum.Horizontal:
e.ScrollTip := c1TrueDBGrid1.Columns[e.ColIndex].Caption;
C1.Win.C1TrueDBGrid.ScrollBarEnum.Vertical:
begin
Row := e.Row + 1;
e.ScrollTip := 'Record: ' + Row.ToString + ' of ' + dbTable.Rows.Count.ToString + #10#13 + 'Company: ' + dbTable.Rows[e.Row]['Company'].ToString + #10#13 + 'User code: ' + dbTable.Rows[e.Row]['UserCode'].ToString;
end;
end;
e.TipStyle.ForeColor := Color.Blue;
end;
procedure TWinForm.CheckBox2_CheckedChanged(sender: System.Object; e: System.EventArgs);
begin
C1TrueDBGrid1.ScrollTrack := CheckBox2.Checked;
end;
procedure TWinForm.CheckBox1_CheckedChanged(sender: System.Object; e: System.EventArgs);
begin
C1TrueDBGrid1.ScrollTips := CheckBox1.Checked;
end;
Run the program and observe the following:
· C1TrueDBGrid1 displays the data specified.
· Setting ScrollTrack to True lets you see the data as it is being scrolled.
· Setting ScrollTips to True shows a Tooltip box with column information while the user is scrolling.
· By manipulating the ComboBoxes and the Color Dialog, create a border around a column’s cells and set them to a System color.
This concludes the tutorial.
Send comments about this topic to ComponentOne. Copyright © ComponentOne LLC. All rights reserved. |