DevExpress WinForms擁有180+組件和UI庫(kù)，能為Windows Forms平臺(tái)創(chuàng)建具有影響力的業(yè)務(wù)解決方案。DevExpress WinForms能完美構(gòu)建流暢、美觀且易于使用的應(yīng)用程序，無(wú)論是Office風(fēng)格的界面，還是分析處理大批量的業(yè)務(wù)數(shù)據(jù)，它都能輕松勝任！

在本教程中，您將學(xué)習(xí)如何使用DevExpress WinForms在代碼中創(chuàng)建帶狀和高級(jí)帶狀布局。首先將主視圖切換到所需的類型，然后您將創(chuàng)建第一級(jí)帶狀和子帶狀來(lái)創(chuàng)建層次結(jié)構(gòu)。初始化帶狀之后，將創(chuàng)建列并將它們鏈接到父帶狀，最后您將切換到高級(jí)帶狀網(wǎng)格視圖，把列移動(dòng)到第二行，并讓列標(biāo)題填充它們下面的空白空間。

獲取DevExpress WinForms 正式版下載

DevExpress技術(shù)交流群11：749942875      歡迎一起進(jìn)群討論

開(kāi)始

從一個(gè)綁定到Car數(shù)據(jù)庫(kù)的Grid Control應(yīng)用程序開(kāi)始。

切換到帶狀網(wǎng)格視圖

Ribbon控件中的Create Banded Layout按鈕將啟動(dòng)把布局切換到帶狀視圖的代碼，在Click事件處理程序中，創(chuàng)建一個(gè)實(shí)例，禁用其選項(xiàng)，并將結(jié)果對(duì)象分配給網(wǎng)格的 屬性。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// Switch to the Banded Grid View.
BandedGridView view = new BandedGridView();
view.OptionsBehavior.AutoPopulateColumns = false;
gridControl1.MainView = view;
}

運(yùn)行應(yīng)用程序并單擊Create Banded Layout按鈕，布局切換了，但是新創(chuàng)建的View是空的，因?yàn)榻昧俗詣?dòng)列生成。

創(chuàng)建頂級(jí)Bands

關(guān)閉應(yīng)用程序并返回處理程序代碼，創(chuàng)建實(shí)例，在頂層分層級(jí)別添加Main、Performance Attributes和Notes band，將對(duì)象添加到視圖的集合中。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// ...
// Create top-level bands.
GridBand bandMain = new GridBand() { Name = "bandMain", Caption = "Main" };
GridBand bandPerformanceAttributes = new GridBand() { Name = "bandPerformance", Caption = "Performance Attributes" };
GridBand bandNotes = new GridBand() { Name = "bandNotes", Caption = "Notes" };
view.Bands.AddRange(new GridBand[] { bandMain, bandPerformanceAttributes, bandNotes });
}

運(yùn)行應(yīng)用程序，單擊按鈕，現(xiàn)在視圖將顯示bands。

創(chuàng)建嵌套Bands

這一次，創(chuàng)建嵌套bands，為此創(chuàng)建新的band對(duì)象并將它們添加到主band的集合中。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// ...
// Create nested bands.
GridBand bandModel = new GridBand { Name = "bandModel", Caption = "Model" };
GridBand bandPrice = new GridBand { Name = "bandPrice", Caption = "Price" };
bandMain.Children.AddRange(new GridBand[] { bandModel, bandPrice });
}

運(yùn)行應(yīng)用程序并單擊按鈕來(lái)查看新的分層band結(jié)構(gòu)。

創(chuàng)建帶狀列

返回到單擊處理程序代碼并創(chuàng)建由對(duì)象表示的列，初始化它們的屬性并使它們可見(jiàn)，將創(chuàng)建的列添加到視圖的集合中。

使用屬性將Price列值格式化為貨幣。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// ...
// Create banded grid columns and make them visible.
BandedGridColumn colTrademark = new BandedGridColumn() { Name = "colTrademark", FieldName = "Trademark", Visible = true };
BandedGridColumn colModel = new BandedGridColumn() { Name = "colModel", FieldName = "Model", Visible = true };
BandedGridColumn colCategory = new BandedGridColumn() { Name = "colCategory", FieldName = "Category", Visible = true };
BandedGridColumn colPrice = new BandedGridColumn() { Name = "colPrice", FieldName = "Price", Visible = true };
BandedGridColumn colHP = new BandedGridColumn() { Name = "colHP", FieldName = "HP", Visible = true };
BandedGridColumn colLiter = new BandedGridColumn() { Name = "colLiter", FieldName = "Liter", Visible = true };
BandedGridColumn colCyl = new BandedGridColumn() { Name = "colCyl", FieldName = "Cyl", Visible = true };
BandedGridColumn colDescription = new BandedGridColumn() { Name = "colDescription", FieldName = "Description", Visible = true };
BandedGridColumn colPicture = new BandedGridColumn() { Name = "colPicture", FieldName = "Picture", Visible = true };
view.Columns.AddRange(new BandedGridColumn[] { colTrademark, colModel, colCategory, colPrice, colHP, colLiter, colCyl, colDescription, colPicture });

// Format the Price column values as currency.
colPrice.DisplayFormat.FormatType = DevExpress.Utils.FormatType.Numeric;
colPrice.DisplayFormat.FormatString = "c2";
}

運(yùn)行應(yīng)用程序并再次點(diǎn)擊按鈕，列沒(méi)有顯示在視圖中，這是因?yàn)樗鼈冞€沒(méi)有鏈接到bands 。

為Bands分配列

要將列添加到Bands中，請(qǐng)?jiān)O(shè)置列的屬性。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// ...
// Assign columns to bands.
colTrademark.OwnerBand = bandModel;
colModel.OwnerBand = bandModel;
colCategory.OwnerBand = bandModel;
colPrice.OwnerBand = bandPrice;
colHP.OwnerBand = bandPerformanceAttributes;
colLiter.OwnerBand = bandPerformanceAttributes;
colCyl.OwnerBand = bandPerformanceAttributes;
colDescription.OwnerBand = bandNotes;
colPicture.OwnerBand = bandNotes;
}

運(yùn)行應(yīng)用程序，單擊按鈕，可以看到列現(xiàn)在在相應(yīng)的bands下可見(jiàn)。

切換到高級(jí)帶狀網(wǎng)格視圖

返回代碼并修改處理程序，使其創(chuàng)建高級(jí)帶狀網(wǎng)格視圖替代標(biāo)準(zhǔn)帶狀網(wǎng)格視圖，只需為視圖使用一個(gè)不同的類，其余的代碼將繼續(xù)工作。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// Switch to the Advanced Banded Grid View.
AdvBandedGridView view = new AdvBandedGridView();
view.OptionsBehavior.AutoPopulateColumns = false;
gridControl1.MainView = view;
// ...
}

運(yùn)行應(yīng)用程序，布局和以前一樣，只是列的自動(dòng)寬度功能現(xiàn)在被禁用了。

將列排列成多行

關(guān)閉應(yīng)用程序并將列標(biāo)題排列到多行中，要在父bands內(nèi)的其他列下顯示Category和Liter列，請(qǐng)將它們的 屬性設(shè)置為1。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// ...
// Set the vertical position of column headers.
colCategory.RowIndex = 1;
colLiter.RowIndex = 1;
}

再次運(yùn)行應(yīng)用程序，可以看到更改，但是現(xiàn)在在某些列標(biāo)題下出現(xiàn)了空格。

自動(dòng)拉伸列標(biāo)題

要自動(dòng)修改列標(biāo)題的高度來(lái)填充空白空間，請(qǐng)啟用它們的選項(xiàng)。

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemCl
// ...
// Stretch columns to fit empty spaces below them.
colPrice.AutoFillDown = true;
colDescription.AutoFillDown = true;
colPicture.AutoFillDown = true;
}

運(yùn)行應(yīng)用程序并再次單擊Create Banded Layout按鈕來(lái)查看最終結(jié)果。

完整代碼

C#

private void btnCreateBandedLayout_ItemClick(object sender, ItemClickEventArgs e) {
// Switch to the Advanced Banded Grid View.
AdvBandedGridView view = new AdvBandedGridView();
view.OptionsBehavior.AutoPopulateColumns = false;
gridControl1.MainView = view;

// Create top-level bands.
GridBand bandMain = new GridBand() { Name = "bandMain", Caption = "Main" };
GridBand bandPerformanceAttributes = new GridBand() { Name = "bandPerformance", Caption = "Performance Attributes" };
GridBand bandNotes = new GridBand() { Name = "bandNotes", Caption = "Notes" };
view.Bands.AddRange(new GridBand[] { bandMain, bandPerformanceAttributes, bandNotes });

// Create nested bands.
GridBand bandModel = new GridBand { Name = "bandModel", Caption = "Model" };
GridBand bandPrice = new GridBand { Name = "bandPrice", Caption = "Price" };
bandMain.Children.AddRange(new GridBand[] { bandModel, bandPrice });

// Create banded grid columns and make them visible.
BandedGridColumn colTrademark = new BandedGridColumn() { Name = "colTrademark", FieldName = "Trademark", Visible = true };
BandedGridColumn colModel = new BandedGridColumn() { Name = "colModel", FieldName = "Model", Visible = true };
BandedGridColumn colCategory = new BandedGridColumn() { Name = "colCategory", FieldName = "Category", Visible = true };
BandedGridColumn colPrice = new BandedGridColumn() { Name = "colPrice", FieldName = "Price", Visible = true };
BandedGridColumn colHP = new BandedGridColumn() { Name = "colHP", FieldName = "HP", Visible = true };
BandedGridColumn colLiter = new BandedGridColumn() { Name = "colLiter", FieldName = "Liter", Visible = true };
BandedGridColumn colCyl = new BandedGridColumn() { Name = "colCyl", FieldName = "Cyl", Visible = true };
BandedGridColumn colDescription = new BandedGridColumn() { Name = "colDescription", FieldName = "Description", Visible = true };
BandedGridColumn colPicture = new BandedGridColumn() { Name = "colPicture", FieldName = "Picture", Visible = true };
view.Columns.AddRange(new BandedGridColumn[] { colTrademark, colModel, colCategory, colPrice, colHP, colLiter, colCyl, colDescription, colPicture });

// Format the Price column values as currency.
colPrice.DisplayFormat.FormatType = DevExpress.Utils.FormatType.Numeric;
colPrice.DisplayFormat.FormatString = "c2";

// Assign columns to bands.
colTrademark.OwnerBand = bandModel;
colModel.OwnerBand = bandModel;
colCategory.OwnerBand = bandModel;
colPrice.OwnerBand = bandPrice;
colHP.OwnerBand = bandPerformanceAttributes;
colLiter.OwnerBand = bandPerformanceAttributes;
colCyl.OwnerBand = bandPerformanceAttributes;
colDescription.OwnerBand = bandNotes;
colPicture.OwnerBand = bandNotes;

// Set the vertical position of column headers.
colCategory.RowIndex = 1;
colLiter.RowIndex = 1;

// Stretch columns to fit empty spaces below them.
colPrice.AutoFillDown = true;
colDescription.AutoFillDown = true;
colPicture.AutoFillDown = true;
}

關(guān)于慧都科技

慧都是?家?業(yè)數(shù)字化解決?案公司，專注于軟件、?油與?業(yè)領(lǐng)域，以深?的業(yè)務(wù)理解和?業(yè)經(jīng)驗(yàn)，幫助企業(yè)實(shí)現(xiàn)智能化轉(zhuǎn)型與持續(xù)競(jìng)爭(zhēng)優(yōu)勢(shì)。

慧都科技是DevExpress的中國(guó)區(qū)的合作伙伴，DevExpress作為用戶界面領(lǐng)域的優(yōu)秀產(chǎn)品，幫助企業(yè)高效構(gòu)建權(quán)限管理、數(shù)據(jù)可視化（如網(wǎng)格/圖表/儀表盤）、跨平臺(tái)系統(tǒng)（WinForms/ASP.NET/.NET MAUI）及行業(yè)定制解決方案，加速開(kāi)發(fā)并強(qiáng)化交互體驗(yàn)。