在界面设计中,TableControl控件经常使用。默认设置中,TabControl的背景和标签样式。接下来我们将学习如何修改TableControl的标签选项、修改TabControld的背景色或背景图片。页面效果如下:
简述原理
TableControl项目属性DrawMode,将属性值设定为OwnerDrawFixed后,就可以由用户绘制标签。添加DrawItem事件(用户需要绘制Table时触发),然后在该方法中绘制自定义的标签即可。
关键代码
设置DrawMode属性。
1 this.tabControl_main.DrawMode = System.Windows.Forms.TabDrawMode.OwnerDrawFixed;
为TabControl添加DrawItem事件。
1 this.tabControl_main.DrawItem += new System.Windows.Forms.DrawItemEventHandler(this.tabControl_main_DrawItem);
设置笔刷。
1 //设置笔刷 2 SolidBrush red = new SolidBrush(Color.Red); // 红色
绘制背景。
1 //绘制红色背景 2 Rectangle rectangleRed = tabControl_main.GetTabRect(0); 3 e.Graphics.FillRectangle(red, rectangleRed);
设置文字对齐属性。
1 //设置文字居中对齐 2 StringFormat stringFormat = new StringFormat(); 3 stringFormat.Alignment = StringAlignment.Center;
设置标签文本。
1 //设置文字字体和文字大小 2 e.Graphics.DrawString(tabControl_main.TabPages[i].Text , new Font("宋体",10) ,black ,rec , stringFormat);
获取工作区域
1 Rectangle recMain = tabControl_main.ClientRectangle; //获取Table控件的工作区域
添加背景图片
1 //获取背景图片,我的背景图片在项目资源文件中。 2 Image backImage = Resources.bg_banner; 3 //绘制主控件的背景 4 e.Graphics.DrawImage(backImage, 0, 0, tabControl_main.Width, tabControl_main.Height);
步骤
设置标签
- 在WinForm页面添加TableControl控件,完成基本的设置。这里设置TableControl控件名称为tabControl_main,并添加三个选项卡,选项卡的关联文本分别为红色、黄色、蓝色。
- 设置DrawMode为OwnerDrawFixed。DrawMode属性的含义为指示是由用户还是由系统绘制标题。由于需要自定义标签背景色,所以由用户来绘制标题。
在页面中设置tabControl_main中设置DrawMode属性。
或者*.Designer.cs文件中,设置DrawMode属性。
1 this.tabControl_main.DrawMode = System.Windows.Forms.TabDrawMode.OwnerDrawFixed;
- 为TabControl添加DrawItem事件(每当需要绘制特定项/特定区域时发生)。
或者在*.Designer.cs页面代码如下:
1 this.tabControl_main.DrawItem += new System.Windows.Forms.DrawItemEventHandler(this.tabControl_main_DrawItem);
- 设置背景标签。包括设置笔刷、绘制背景、设置文字。代码如下:
1 using System.Drawing; 2 using System.Windows.Forms; 3 //…… 4 /// <summary> 5 /// 初始化tableControl选项时的颜色 6 /// </summary> 7 /// <param name="sender"></param> 8 /// <param name="e"></param> 9 private void tabControl_main_DrawItem(object sender, DrawItemEventArgs e) 10 { 11 //设置笔刷 12 SolidBrush red = new SolidBrush(Color.Red); // 红色 13 SolidBrush yellow = new SolidBrush(Color.Yellow); //黄色 14 SolidBrush blue = new SolidBrush(Color.Blue); //蓝色 15 SolidBrush black = new SolidBrush(Color.Black); //黑色 16 //设置背景 17 //绘制红色背景 18 Rectangle rectangleRed = tabControl_main.GetTabRect(0); 19 e.Graphics.FillRectangle(red, rectangleRed); 20 //绘制黄色背景 21 Rectangle rectangleYellow = tabControl_main.GetTabRect(1); 22 e.Graphics.FillRectangle(yellow, rectangleYellow); 23 //绘制黄色背景 24 Rectangle rectangleBlue = tabControl_main.GetTabRect(2); 25 e.Graphics.FillRectangle(blue, rectangleBlue); 26 //设置标签文字居中对齐 27 StringFormat stringFormat = new StringFormat(); 28 stringFormat.Alignment = StringAlignment.Center; 29 //设置标签文字 30 for (int i = 0; i <tabControl_main.TabPages.Count; i ++) 31 { 32 Rectangle rec = tabControl_main.GetTabRect(i); 33 //设置文字字体和文字大小 34 e.Graphics.DrawString(tabControl_main.TabPages[i].Text , new Font("宋体",10) ,black ,rec , stringFormat); 35 } 36 37 } 38 //……
- 启动后运行效果如下:
设置背景色或背景图片
- 在WinForm页面添加TableControl控件(这里命名为tabControl_main),默认情况下,可以修改Tab的背景色为上一个容器的颜色。
当修改DrawMode属性为OwnerDrawFixed时,背景色默认为系统颜色(灰色)。如下图:
- 设置DrawMode为OwnerDrawFixed。DrawMode属性的含义为指示是由用户还是由系统绘制标题。由于需要自定义标签背景色,所以由用户来绘制标题。
在页面中设置tabControl_main中设置DrawMode属性。
或者*.Designer.cs文件中,设置DrawMode属性:
1 this.tabControl_main.DrawMode = System.Windows.Forms.TabDrawMode.OwnerDrawFixed;
- 为TabControl添加DrawItem事件(每当需要绘制特定项/特定区域时发生)。
或者在*.Designer.cs页面代码如下:
1 this.tabControl_main.DrawItem += new System.Windows.Forms.DrawItemEventHandler(this.tabControl_main_DrawItem);
- 在tabControl_main_DrawItem中添加背景颜色代码如下:
1 using System.Drawing; 2 using System.Windows.Forms; 3 //…… 4 private void tabControl_main_DrawItem(object sender, DrawItemEventArgs e) { 5 //…… 6 SolidBrush tab_blackColr = new SolidBrush(Color.Black); // 笔刷背景 7 Rectangle recMain = tabControl_main.ClientRectangle; //获取Table控件的工作区域 8 e.Graphics.FillRectangle(tab_blackColr , recMain); //绘制TabControl背景 9 //…… 10 } 11 //…
运行效果如下:
- 在tabControl_main_DrawItem中添加背景图片代码如下:
1 using System.Drawing; 2 using System.Windows.Forms; 3 //…… 4 private void tabControl_main_DrawItem(object sender, DrawItemEventArgs e) { 5 //…… 6 //获取背景图片,我的背景图片在项目资源文件中。 7 Image backImage = Resources.bg_banner; 8 //绘制主控件的背景 9 e.Graphics.DrawImage(backImage, 0, 0, tabControl_main.Width, tabControl_main.Height); 10 //…… 11 } 12 //……
运行效果如下:
参考网址
[1] https://jingyan.baidu.com/article/8ebacdf0caf35649f75cd562.html
[2] https://www.cnblogs.com/jfbloc/archive/2011/11/12/2246549.html