具有圆边的自定义GroupBox

我在Visual Studio中有一个关于UI的问题，在C＃中。 我想让我的groupbox自定义如下：

然后，我也希望它的消耗取决于用户的屏幕分辨率，因此组框的大小不固定，我需要它例如80％的屏幕。

所以我的问题实际上是两个问题：

1. 制作一个groupbox costum
2. 使其宽80％（例如）宽屏。

编辑 ：多亏了这个答案： 如何在win表单中制作组框文本对齐中心？ 我设法做了我想要的颜色，现在我只是错过了圆角。 有任何想法吗？

Answer 1

作为选项，您可以创建从GroupBox派生的自定义控件：

• 您需要计算圆角矩形。 为此，作为选项，您可以使用AddArc方法并将弧添加到路径中矩形的四个角。
• 要使用填充样式绘制标题背景，可以使用HatchBrush 。 因此，为标题填充样式添加属性。 这样，您可以为标题背景使用不同的HatchStyle值。
• 要使用不同的标题颜色和标题字体，请添加一些要控制的属性。
• 在更完整的实现中，您应该以一种将新值设置为属性的方式实现属性，从而通过调用this.Invalidate()来重新绘制控件。
• 在resize时防止闪烁通过在构造函数DoubleBuffered设置为true来启用双缓冲。
• 要在角落中使用透明背景，请使用GroupBoxRenderer.DrawParentBackground 。 截图

码

 using System.ComponentModel; using System.Drawing; using System.Drawing.Drawing2D; using System.Windows.Forms; public class RoundPanel : GroupBox { public RoundPanel() { this.DoubleBuffered = true; this.TitleBackColor = Color.SteelBlue; this.TitleForeColor = Color.White; this.TitleFont = new Font(this.Font.FontFamily, Font.Size + 8, FontStyle.Bold); this.BackColor = Color.Transparent; this.Radious = 25; this.TitleHatchStyle = HatchStyle.Percent60; } protected override void OnPaint(PaintEventArgs e) { base.OnPaint(e); GroupBoxRenderer.DrawParentBackground(e.Graphics, this.ClientRectangle, this); var rect = ClientRectangle; using (var path = GetRoundRectagle(this.ClientRectangle, Radious)) { e.Graphics.SmoothingMode = SmoothingMode.AntiAlias; rect = new Rectangle(0, 0, rect.Width, TitleFont.Height + Padding.Bottom + Padding.Top); if(this.BackColor!= Color.Transparent) using (var brush = new SolidBrush(BackColor)) e.Graphics.FillPath(brush, path); var clip = e.Graphics.ClipBounds; e.Graphics.SetClip(rect); using (var brush = new HatchBrush(TitleHatchStyle, TitleBackColor, ControlPaint.Light(TitleBackColor))) e.Graphics.FillPath(brush, path); using (var pen = new Pen(TitleBackColor, 1)) e.Graphics.DrawPath(pen, path); TextRenderer.DrawText(e.Graphics, Text, TitleFont, rect, TitleForeColor); e.Graphics.SetClip(clip); using (var pen = new Pen(TitleBackColor, 1)) e.Graphics.DrawPath(pen, path); } } public Color TitleBackColor { get; set; } public HatchStyle TitleHatchStyle { get; set; } public Font TitleFont { get; set; } public Color TitleForeColor { get; set; } public int Radious { get; set; } private GraphicsPath GetRoundRectagle(Rectangle b, int r) { GraphicsPath path = new GraphicsPath(); path.AddArc(bX, bY, r, r, 180, 90); path.AddArc(bX + b.Width - r - 1, bY, r, r, 270, 90); path.AddArc(bX + b.Width - r - 1, bY + b.Height - r - 1, r, r, 0, 90); path.AddArc(bX, bY + b.Height - r - 1, r, r, 90, 90); path.CloseAllFigures(); return path; } } 

Answer 2

一种选择是开发自己的自定义控件派生自GroupBox并覆盖OnPaint()方法来进行绘图。

 public class CustomGroupBox : GroupBox { protected override void OnPaint(PaintEventArgs e) { e.Graphics.FillRectangle(Brushes.Azure, this.ClientRectangle); //base.OnPaint(e); } } 

自动构建后，新控件将显示在工具箱中。

要绘制此对象，可以使用DrawPath方法绘制外部矩形，并使用FillPath方法填充上部条形图。

https://msdn.microsoft.com/en-us/library/system.drawing.graphics.drawpath(v=vs.110).aspx

https://msdn.microsoft.com/en-us/library/system.drawing.graphics.fillpath(v=vs.110).aspx

弹性设计可以使用TableLayoutPanel完成。

Answer 3

对于WPF：

您可以创建Style以使GroupBox以不同的方式显示。

也许这可以帮助你： 设置GroupBox的样式

对于Windows窗体：

要更改布局，您可以查看： https ： //stackoverflow.com/a/31828317/4610605

要调整GroupBox大小，您可以使用：

 System.Windows.SystemParameters.PrimaryScreenWidth System.Windows.SystemParameters.PrimaryScreenHeight GroupBox gb = new GroupBox(); gb.Width = (System.Windows.SystemParameters.PrimaryScreenWidth * 0.8) //Get your 80% ScreenWidth here. 

Answer 4

这是一个纯XAML解决方案，没有自定义控件或代码。 它只使用标准的WPF样式/模板技术。 通常，最好在自定义控件上使用样式/模板。

GroupBox标题可以是不同的大小，因此我添加了使用“Tag”属性更改标题文本的选项（当前设置为18）。

演示用法：

  Text is different size to Header  

款式定义：