バージョン

行と行コネクターを Outlook Group By モードでスタイリング

WinGrid™ で Outlook Group By のグループを作成する場合、展開されたグループの左の領域は GroupByRowConnector として認識されます。GroupByRowConnectorAppearance プロパティを使用して、コントロール全体または特定の列に対して行コネクターの外観をスタイルできます。特定の行の行コネクターをスタイルするために、UltraGridGroupByRow 自体で行コネクターの外観を修正することもできます。これは RowConnectorAppearance プロパティによって実行できます。さらに、GroupByRowAppearance プロパティによって Group By 行自体をスタイルできます。

これは Northwind データベースの Employees テーブルにバインドされた WinGrid コントロールがフォームにドロップされていることを前提とします。フォームの Load イベントに以下のコードを記述します。

Visual Basic の場合:

' Outlook Group By を有効にします
Me.ultraGrid1.DisplayLayout.ViewStyleBand = Infragistics.Win.UltraWinGrid.ViewStyleBand.OutlookGroupBy
' 行コネクターの背景色をマゼンタに設定します
Me.ultraGrid1.DisplayLayout.Bands(0).Override.GroupByRowConnectorAppearance.BackColor = Color.Magenta

C# の場合:

// Outlook Group By を有効にします
this.ultraGrid1.DisplayLayout.ViewStyleBand = Infragistics.Win.UltraWinGrid.ViewStyleBand.OutlookGroupBy;
// 行コネクターの背景色をマゼンタに設定します
this.ultraGrid1.DisplayLayout.Bands[0].Override.GroupByRowConnectorAppearance.BackColor = Color.Magenta;
WinGrid Styling Rows and Row Connectors in Outlook Group By Mode 01.png

Visual Basic の場合:

' すべての Group By 行の背景色の外観を設定します
Me.ultraGrid1.DisplayLayout.Bands(0).Override.GroupByRowAppearance.BackColor = Color.Pink

C# の場合:

// すべての Group By 行の背景色の外観を設定します
this.ultraGrid1.DisplayLayout.Bands[0].Override.GroupByRowAppearance.BackColor = Color.Pink;
WinGrid Styling Rows and Row Connectors in Outlook Group By Mode 02.png

Visual Basic の場合:

' FirstName 列でグループ化された行については、行コネクターの背景色をアクアに設定します
Me.ultraGrid1.DisplayLayout.Bands(0).Columns("FirstName").GroupByRowConnectorAppearance.BackColor = Color.Aqua

C# の場合:

// FirstName 列でグループ化された行については、行コネクターの背景色をアクアに設定します
this.ultraGrid1.DisplayLayout.Bands[0].Columns["FirstName"].GroupByRowConnectorAppearance.BackColor = Color.Aqua;
WinGrid Styling Rows and Row Connectors in Outlook Group By Mode 03.png

Visual Basic の場合:

' BirthDate 列でグループ化された Group By 行の背景色の外観を設定します
Me.ultraGrid1.DisplayLayout.Bands[0].Columns["BirthDate"].GroupByRowAppearance.BackColor = Color.BurlyWood;

C# の場合:

// BirthDate 列でグループ化された Group By 行の背景色の外観を設定します
this.ultraGrid1.DisplayLayout.Bands[0].Columns["BirthDate"].GroupByRowAppearance.BackColor = Color.BurlyWood;
WinGrid Styling Rows and Row Connectors in Outlook Group By Mode 04.png

以下のコードは、WinGrid をスタイルするために WinGrid コントロールの InitializeGroupByRow イベントをどのように処理できるかを示します。InitializeGroupByRow イベント内で以下のコードを記述します。

Visual Basic の場合:

' WinGrid が Title 列でグループ化される場合に限ってコネクターの外観を設定します
If e.Row.Column.Header.Caption = “Title”
Then
' 行コネクター領域の色を DarkOliveGreen に設定します
    e.Row.RowConnectorAppearance.BackColor = Color.DarkOliveGreen
End If

C# の場合:

// WinGrid が Title 列でグループ化される場合に限ってコネクターの外観を設定します
 if(e.Row.Column.Header.Caption = “Title”)
{
 // 行コネクター領域の色を DarkOliveGreen に設定します
 e.Row.RowConnectorAppearance.BackColor = Color.DarkOliveGreen;
}
WinGrid Styling Rows and Row Connectors in Outlook Group By Mode 05.png

関連トピック