Nov 2, 2010

How to sort columns in Infragistics WinGrid

This code demonstrates how WinGrid allows the user to sort on both single and multiple columns by clicking on the column headers. The UltraWinGrid allows user to sort by setting the .HeaderClickAction property to either .SortSingle or .SortMulti.

Below are the steps to achieve the same

1. Adding using/imports directives
VB:


Imports Infragistics.Win.UltraWinGrid

C#:
using Infragistics.Win.UltraWinGrid;


2. The InitializeLayout event of UltraGrid sets the default HeaderClickAction for all bands and all columns

VB:
Private Sub UGSort_InitializeLayout(ByVal sender As Object, _
  ByVal e As Infragistics.Win.UltraWinGrid.InitializeLayoutEventArgs) _
  Handles UGSort.InitializeLayout
   e.Layout.Override.HeaderClickAction = HeaderClickAction.SortSingle
End Sub


C#:
private void UGSort_InitializeLayout(object sender, 
  Infragistics.Win.UltraWinGrid.InitializeLayoutEventArgs e)
{
 e.Layout.Override.HeaderClickAction = HeaderClickAction.SortSingle;
}


3. The code in the Button Click event instructs the UltraWinGrid to sort on band 1 column 2 in Descending order

Visual Basic:
Private Sub btnSortBand1Column2_Click(ByVal sender As System.Object, _
  ByVal e As System.EventArgs) Handles btnSortBand1Column3.Click
 Me.UltraGrid1.DisplayLayout.Bands(1).Columns(2).SortIndicator = _
   SortIndicator.Descending
End Sub


C#:
private void btnSortBand1Column2_Click(object sender, EventArgs e)
{
 this.ultraGrid1.DisplayLayout.Bands[1].Columns[2].SortIndicator = 
   SortIndicator.Descending;
}

How to choose column chooser feature in Infragistics Wingrid

This code demonstrates using the Column Chooser functionality to display a dialog similar to Microsoft Outlook's Field Chooser where the user can choose columns to display in the WinGrid. 

Now, lets start with the step by step process of how we can achieve the same

1. Add using/imports directives 
VB:


Imports Infragistics.Win
Imports Infragistics.Win.UltraWinGrid


C#:
using Infragistics.Win;
using Infragistics.Win.UltraWinGrid;


2. The WinGrid has in-built RowSelectorheaderstyle property to choose the column button which will display a button in the row selector area. You can change the appearance of it by RowSelectorHeaderAppearance property.

VB:
' Set the RowSelectorHeaderStyle property to ColumnChooserButton.
Me.UltraGrid1.DisplayLayout.Override.RowSelectorHeaderStyle = _
  RowSelectorHeaderStyle.ColumnChooserButton

' Enable the RowSelectors. 
Me.UltraGrid1.DisplayLayout.Override.RowSelectors = DefaultableBoolean.True

' If you want to change the BackColor of the button then you need to
' set the ThemedElementAlpha property to Transparent otherwise BackColor setting won't be ' honored. 
Me.UltraGrid1.DisplayLayout.Override.RowSelectorHeaderAppearance.ThemedElementAlpha = Alpha.Transparent
Me.UltraGrid1.DisplayLayout.Override.RowSelectorHeaderAppearance.BackColor = Color.Blue


C#:
// Set the RowSelectorHeaderStyle to ColumnChooserButton.
this.ultraGrid1.DisplayLayout.Override.RowSelectorHeaderStyle = 
  RowSelectorHeaderStyle.ColumnChooserButton;

// Enable the RowSelectors. 
this.ultraGrid1.DisplayLayout.Override.RowSelectors = DefaultableBoolean.True;

// If you want to change the BackColor of the button then you need to
//set the ThemedElementAlpha property to Transparent otherwise BackColor setting won't be //honored. 
this.ultraGrid1.DisplayLayout.Override.RowSelectorHeaderAppearance.ThemedElementAlpha = Alpha.Transparent;
this.ultraGrid1.DisplayLayout.Override.RowSelectorHeaderAppearance.BackColor = Color.Blue;


3. You can also have your own user interface for displaying the column chooser. UltraGridColumnChooser is derived from .NET Control class. It displays list of columns & implements drag-n-drop functionality. ColumnChooserDialog derives from .NET Form class. It simply embeds UltragridColumnChooser inset it. 

The following code demonstrates how to display column chooser dialog.

Visual Basic:
' Create an instance of the ColumnChooserDialog.
Dim dlg As ColumnChooserDialog = New ColumnChooserDialog()

dlg.Owner = Me

Dim cc As UltraGridColumnChooser = dlg.ColumnChooserControl

' Associate a WinGrid to the column chooser. 
cc.SourceGrid = Me.UltraGrid1

cc.CurrentBand = Me.UltraGrid1.DisplayLayout.Bands(0)

cc.Style = ColumnChooserStyle.AllColumnsWithCheckBoxes
cc.MultipleBandSupport = MultipleBandSupport.SingleBandOnly

' Set location, size etc...
dlg.Size = New Size(150, 300)

dlg.Show()


C#:
// Create an instance of the ColumnChooserDialog.
ColumnChooserDialog dlg = new ColumnChooserDialog( );

dlg.Owner = this;

UltraGridColumnChooser cc = dlg.ColumnChooserControl;

// Associate a WinGrid to the column chooser. 
cc.SourceGrid = this.ultraGrid1;

cc.CurrentBand = this.ultraGrid1.DisplayLayout.Bands[0];

cc.Style = ColumnChooserStyle.AllColumnsAndChildBandsWithCheckBoxes;
cc.MultipleBandSupport = MultipleBandSupport.SingleBandOnly;

// Set location, size etc...
dlg.Size = new Size( 150, 300 );

dlg.Show( );

How to bind WinGrid to obtain a card view layout - Infragistics

This code shows how to obtain a card view layout with the help of Infragistics WinGrid. WinGrid helps you to easily print and export your data in the form of excel or PDF document.

1. Bind grid to a DataSource (Same as we do in usual Gridview)
wingrid1

2. Now we need to obtain a card view layout which can be achieved by properties of Displaylayout object

VB:


'You must set this property in order to print in card view.
Me.UltraGrid1.DisplayLayout.AllowCardPrinting = _
   Infragistics.Win.UltraWinGrid.AllowCardPrinting.RootBandOnly

'Display WinGrid in card view.
Me.UltraGrid1.DisplayLayout.Bands(0).CardView = True

'Set a caption for each card using the CompanyName field.
Me.UltraGrid1.DisplayLayout.Bands(0).CardSettings.CaptionField = "CompanyName"


C#:
//You must set this property in order to print in card view.
this.ultraGrid1.DisplayLayout.AllowCardPrinting = Infragistics.Win.UltraWinGrid.AllowCardPrinting.RootBandOnly;

//Display WinGrid in card view.
this.ultraGrid1.DisplayLayout.Bands[0].CardView = true;

//Set a caption for each card using the CompanyName field.
this.ultraGrid1.DisplayLayout.Bands[0].CardSettings.CaptionField = CompanyName";


3. To print cards (print layout) you need to write code in InitializePrintPreview event
VB:
'Standard labels makes it easier for each card to stand on its own, allowing you 'to possibly cut out the cards for distribution.
e.PrintLayout.Bands(0).CardSettings.Style = _ Infragistics.Win.UltraWinGrid.CardStyle.StandardLabels

'Setting the MaxCardAreaCols and MaxCardAreaRows properties allow you to limit 'the amount of cards per page. Setting these properties to 3 will give you nine 'cards per page.
e.PrintLayout.Bands(0).CardSettings.MaxCardAreaCols = 3
e.PrintLayout.Bands(0).CardSettings.MaxCardAreaRows = 3

'Each card will automatically increase width in order to fit in the available space.
e.PrintLayout.Bands(0).CardSettings.AutoFit = True
C#:
//Standard labels makes it easier for each card to
//stand on its own, allowing you to possibly cut out the cards for distribution.
e.PrintLayout.Bands[0].CardSettings.Style = Infragistics.Win.UltraWinGrid.CardStyle.StandardLabels;

//Setting the MaxCardAreaCols and MaxCardAreaRows properties allow you to limit //the amount of cards per page. Setting these properties to 3 will give you nine //cards per page.
e.PrintLayout.Bands[0].CardSettings.MaxCardAreaCols = 3;
e.PrintLayout.Bands[0].CardSettings.MaxCardAreaRows = 3;

//Each card will automatically increase width in order to fit in the available space.
e.PrintLayout.Bands[0].CardSettings.AutoFit = true;
4. For print preview write this code on the button click event of Print Preview
VB:
'Calling the PrintPreview method displays WinGrid's print preview dialog box.
Me.UltraGrid1.PrintPreview()
C#:
//Calling the PrintPreview method displays WinGrid's print preview dialog box. this.ultraGrid1.PrintPreview();


5. Now Run the application and you'll see the output in the form of card view.
wingrid2

6. Output on Print Preview
wingrid3