GridView的表頭跨欄設計(11.19)

這個功能，在Google用「GridView 跨欄」去搜尋，就會有一大堆的文章。

對這功能來說，是個老梗了啦!

現下，我便引用某位大大的文章，及配合自己的實例，來幫助註解一下吧。

峰語銘心

if (e.Row.RowType == DataControlRowType.Header)
{
TableCellCollection oldCell = e.Row.Cells;
oldCell.Clear();//將原有的表頭格式移除

//產生多重表列的第一列
GridViewRow headRow = new GridViewRow(0,0, DataControlRowType.Header, DataControlRowState.Insert);

//第一欄
TableCell head2Cell = new TableCell();
head2Cell.Text = "單位";
head2Cell.BackColor = row1color();//自訂的方法用以統一取得色彩
head2Cell.HorizontalAlign = HorizontalAlign.Center;
head2Cell.RowSpan = 2;//所跨的欄數
headRow.Cells.Add(head2Cell);//新增自製的儲存格


//第二欄
head2Cell = new TableCell();
head2Cell.Text = "群組";
head2Cell.BackColor = row1color();
head2Cell.ColumnSpan = 8;//所跨的欄數
head2Cell.HorizontalAlign = HorizontalAlign.Center;
headRow.Cells.Add(head2Cell);//新增自製的儲存格

//第三欄
head2Cell = new TableCell();
head2Cell.Text = "聯絡人";
head2Cell.BackColor = row1color();
head2Cell.ColumnSpan = 3;//所跨的欄數
head2Cell.HorizontalAlign = HorizontalAlign.Center;
headRow.Cells.Add(head2Cell);//新增自製的儲存格

//第四欄
head2Cell = new TableCell();
head2Cell.Text = "行事曆";
head2Cell.BackColor = row1color();
head2Cell.ColumnSpan = 3;//所跨的欄數
head2Cell.HorizontalAlign = HorizontalAlign.Center;
headRow.Cells.Add(head2Cell);//新增自製的儲存格

//將自製的資料列新增上去
GridView1.Controls[0].Controls.Add(headRow);

//產生多重表列的第二列
headRow = new GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Insert);

#region 群組裡的欄位

//用法都與第一列相同
head2Cell = new TableCell();
head2Cell.Text = "使用量";
head2Cell.BackColor = row2color();//自訂的方法用以統一取得色彩
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "成員數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "員工數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "通訊錄量";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "檔案總數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "總檔案量";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "檔案下載次數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "下載磁碟總量";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

#endregion

#region 聯絡人裡的欄位

head2Cell = new TableCell();
head2Cell.Text = "使用人數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "聯絡人數量";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "同步次數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

#endregion

#region 行事曆裡的欄位

head2Cell = new TableCell();
head2Cell.Text = "使用人數";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "events_personal";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

head2Cell = new TableCell();
head2Cell.Text = "events_group";
head2Cell.BackColor = row2color();
headRow.Cells.Add(head2Cell);

#endregion

GridView1.Controls[0].Controls.Add(headRow);

完成後，我們的資料表頭，就會變成下列樣式：