浅谈Winform控件开发（一）：使用GDI+美化基础窗口

•  写在前面：
  • 本系列随笔将作为我对于winform控件开发的心得总结，方便对一些读者在GDI+、winform等技术方面进行一个入门级的讲解，抛砖引玉。
  • 别问为什么不用WPF，为什么不用QT。问就是懒，不想学。
  • 本项目所有代码均开源在https://github.com/muxiang/PowerLib
  • 效果预览：(gif,3.4MB)

  

• 本系列第一篇内容将仅包含对于Winform基础窗口也就是System.Windows.Forms.Form的美化，后续将对一些常用控件如Button、ComboBox、CheckBox、TextBox等进行修改，并提供一些其他如Loading遮罩层等常见控件。
• 对于基础窗口的美化，首要的任务就是先把基础标题栏干掉。这个过程中会涉及一些Windows消息机制。
• 首先，我们新建一个类XForm，派生自System.Windows.Forms.Form。

  /// <summary>
  /// 表示组成应用程序的用户界面的窗口或对话框。
  /// </summary>
  [ToolboxItem(false)]
  public class XForm : Form
  ...

   随后，我们定义一些常量

  /// <summary>
  /// 标题栏高度
  /// </summary>
  public const int TitleBarHeight = 30;
  
  // 边框宽度
  private const int BorderWidth = 4;
  // 标题栏图标大小
  private const int IconSize = 16;
  // 标题栏按钮大小
  private const int ButtonWidth = 30;
  private const int ButtonHeight = 30;

  覆盖基类属性FormBorderStyle使base.FormBorderStyle保持None，覆盖基类属性Padding返回或设置正确的内边距

  /// <summary>
  /// 获取或设置窗体的边框样式。
  /// </summary>
  [Browsable(true)]
  [Category("Appearance")]
  [Description("获取或设置窗体的边框样式。")]
  [DefaultValue(FormBorderStyle.Sizable)]
  public new FormBorderStyle FormBorderStyle
  {
      get => _formBorderStyle;
      set
      {
          _formBorderStyle = value;
          UpdateStyles();
          DrawTitleBar();
      }
  }
  
  /// <summary>
  /// 获取或设置窗体的内边距。
  /// </summary>
  [Browsable(true)]
  [Category("Appearance")]
  [Description("获取或设置窗体的内边距。")]
  public new Padding Padding
  {
      get => new Padding(base.Padding.Left, base.Padding.Top, base.Padding.Right, base.Padding.Bottom - TitleBarHeight);
      set => base.Padding = new Padding(value.Left, value.Top, value.Right, value.Bottom + TitleBarHeight);
  }

  ※最后一步也是最关键的一步：重新定义窗口客户区边界。重写WndProc并处理WM_NCCALCSIZE消息。

  protected override void WndProc(ref Message m)
          {
              switch (m.Msg)
              {
                  case WM_NCCALCSIZE:
                      {
                          // 自定义客户区
                          if (m.WParam != IntPtr.Zero && _formBorderStyle != FormBorderStyle.None)
                          {
                              NCCALCSIZE_PARAMS @params = (NCCALCSIZE_PARAMS)
                                  Marshal.PtrToStructure(m.LParam, typeof(NCCALCSIZE_PARAMS));
  
                              @params.rgrc[0].Top += BorderWidth + TitleBarHeight;
                              @params.rgrc[0].Bottom -= BorderWidth;
                              @params.rgrc[0].Left += BorderWidth;
                              @params.rgrc[0].Right -= BorderWidth;
  
                              @params.rgrc[1] = @params.rgrc[0];
  
                              Marshal.StructureToPtr(@params, m.LParam, false);
  
                              m.Result = (IntPtr)WVR_VALIDRECTS;
                          }
  
                          base.WndProc(ref m);
                          break;
                      }
  ...

  相关常量以及P/Invoke相关方法已在我的库中定义，详见MSDN，也可从http://pinvoke.net/查询。

  同样在WndProc中处理WM_NCPAINT消息

  case WM_NCPAINT:
  {
      DrawTitleBar();
      m.Result = (IntPtr)1;
      break;
  }

   DrawTitleBar()方法定义如下：

  /// <summary>
  /// 绘制标题栏
  /// </summary>
  private void DrawTitleBar()
  {
      if (_formBorderStyle == FormBorderStyle.None)
          return;
  
      DrawTitleBackgroundTextIcon();
      CreateButtonImages();
      DrawTitleButtons();
  }

  首先使用线性渐变画刷绘制标题栏背景、图标、标题文字：

  /// <summary>
  /// 绘制标题栏背景、文字、图标
  /// </summary>
  private void DrawTitleBackgroundTextIcon()
  {
      IntPtr hdc = GetWindowDC(Handle);
      Graphics g = Graphics.FromHdc(hdc);
  
      // 标题栏背景
      using (Brush brsTitleBar = new LinearGradientBrush(TitleBarRectangle,
          _titleBarStartColor, _titleBarEndColor, LinearGradientMode.Horizontal))
          g.FillRectangle(brsTitleBar, TitleBarRectangle);
  
      // 标题栏图标
      if (ShowIcon)
          g.DrawIcon(Icon, new Rectangle(
              BorderWidth, TitleBarRectangle.Top + (TitleBarRectangle.Height - IconSize) / 2,
              IconSize, IconSize));
  
      // 标题文本
      const int txtX = BorderWidth + IconSize;
      SizeF szText = g.MeasureString(Text, SystemFonts.CaptionFont, Width, StringFormat.GenericDefault);
      using Brush brsText = new SolidBrush(_titleBarForeColor);
      g.DrawString(Text,
          SystemFonts.CaptionFont,
          brsText,
          new RectangleF(txtX,
              TitleBarRectangle.Top + (TitleBarRectangle.Bottom - szText.Height) / 2,
              Width - BorderWidth * 2,
              TitleBarHeight),
          StringFormat.GenericDefault);
  
      g.Dispose();
      ReleaseDC(Handle, hdc);
  }

  随后绘制标题栏按钮，犹豫篇幅限制，在此不多赘述，详见源码中CreateButtonImages()与DrawTitleButtons()。

  至此，表面工作基本做完了，但这个窗口还不像个窗口，因为最小化、最大化、关闭以及调整窗口大小都不好用。

  为什么？因为还有很多工作要做，首先，同样在WndProc中处理WM_NCHITTEST消息，通过m.Result指定当前鼠标位置位于标题栏、最小化按钮、最大化按钮、关闭按钮或上下左右边框

  case WM_NCHITTEST:
      {
          base.WndProc(ref m);
  
          Point pt = PointToClient(new Point((int)m.LParam & 0xFFFF, (int)m.LParam >> 16 & 0xFFFF));
  
          _userSizedOrMoved = true;
  
          switch (_formBorderStyle)
          {
              case FormBorderStyle.None:
                  break;
              case FormBorderStyle.FixedSingle:
              case FormBorderStyle.Fixed3D:
              case FormBorderStyle.FixedDialog:
              case FormBorderStyle.FixedToolWindow:
                  if (pt.Y < 0)
                  {
                      _userSizedOrMoved = false;
                      m.Result = (IntPtr)HTCAPTION;
                  }
  
                  if (CorrectToLogical(CloseButtonRectangle).Contains(pt))
                      m.Result = (IntPtr)HTCLOSE;
                  if (CorrectToLogical(MaximizeButtonRectangle).Contains(pt))
                      m.Result = (IntPtr)HTMAXBUTTON;
                  if (CorrectToLogical(MinimizeButtonRectangle).Contains(pt))
                      m.Result = (IntPtr)HTMINBUTTON;
  
                  break;
              case FormBorderStyle.Sizable:
              case FormBorderStyle.SizableToolWindow:
                  if (pt.Y < 0)
                  {
                      _userSizedOrMoved = false;
                      m.Result = (IntPtr)HTCAPTION;
                  }
  
                  if (CorrectToLogical(CloseButtonRectangle).Contains(pt))
                      m.Result = (IntPtr)HTCLOSE;
                  if (CorrectToLogical(MaximizeButtonRectangle).Contains(pt))
                      m.Result = (IntPtr)HTMAXBUTTON;
                  if (CorrectToLogical(MinimizeButtonRectangle).Contains(pt))
                      m.Result = (IntPtr)HTMINBUTTON;
  
                  if (WindowState == FormWindowState.Maximized)
                      break;
  
                  bool bTop = pt.Y <= -TitleBarHeight + BorderWidth;
                  bool bBottom = pt.Y >= Height - TitleBarHeight - BorderWidth;
                  bool bLeft = pt.X <= BorderWidth;
                  bool bRight = pt.X >= Width - BorderWidth;
  
                  if (bLeft)
                  {
                      _userSizedOrMoved = true;
                      if (bTop)
                          m.Result = (IntPtr)HTTOPLEFT;
                      else if (bBottom)
                          m.Result = (IntPtr)HTBOTTOMLEFT;
                      else
                          m.Result = (IntPtr)HTLEFT;
                  }
                  else if (bRight)
                  {
                      _userSizedOrMoved = true;
                      if (bTop)
                          m.Result = (IntPtr)HTTOPRIGHT;
                      else if (bBottom)
                          m.Result = (IntPtr)HTBOTTOMRIGHT;
                      else
                          m.Result = (IntPtr)HTRIGHT;
                  }
                  else if (bTop)
                  {
                      _userSizedOrMoved = true;
                      m.Result = (IntPtr)HTTOP;
                  }
                  else if (bBottom)
                  {
                      _userSizedOrMoved = true;
                      m.Result = (IntPtr)HTBOTTOM;
                  }
                  break;
              default:
                  throw new ArgumentOutOfRangeException();
          }
          break;
      }

   随后以同样的方式处理WM_NCLBUTTONDBLCLK、WM_NCLBUTTONDOWN、WM_NCLBUTTONUP、WM_NCMOUSEMOVE等消息，进行标题栏按钮等元素重绘，不多赘述。

  现在窗口进行正常的单击、双击、调整尺寸，我们在最后为窗口添加阴影

  首先定义一个可以承载32位位图的分层窗口(Layered Window)来负责主窗口阴影的呈现，详见源码中XFormShadow类，此处仅列出用于创建分层窗口的核心代码：

  private void UpdateBmp(Bitmap bmp)
  {
      if (!IsHandleCreated) return;
  
      if (!Image.IsCanonicalPixelFormat(bmp.PixelFormat) || !Image.IsAlphaPixelFormat(bmp.PixelFormat))
          throw new ArgumentException(@"位图格式不正确", nameof(bmp));
  
      IntPtr oldBits = IntPtr.Zero;
      IntPtr screenDC = GetDC(IntPtr.Zero);
      IntPtr hBmp = IntPtr.Zero;
      IntPtr memDc = CreateCompatibleDC(screenDC);
  
      try
      {
          POINT formLocation = new POINT(Left, Top);
          SIZE bitmapSize = new SIZE(bmp.Width, bmp.Height);
          BLENDFUNCTION blendFunc = new BLENDFUNCTION(
              AC_SRC_OVER,
              0,
              255,
              AC_SRC_ALPHA);
  
          POINT srcLoc = new POINT(0, 0);
  
          hBmp = bmp.GetHbitmap(Color.FromArgb(0));
          oldBits = SelectObject(memDc, hBmp);
  
          UpdateLayeredWindow(
              Handle,
              screenDC,
              ref formLocation,
              ref bitmapSize,
              memDc,
              ref srcLoc,
              0,
              ref blendFunc,
              ULW_ALPHA);
      }
      finally
      {
          if (hBmp != IntPtr.Zero)
          {
              SelectObject(memDc, oldBits);
              DeleteObject(hBmp);
          }
  
          ReleaseDC(IntPtr.Zero, screenDC);
          DeleteDC(memDc);
      }
  }

  最后通过路径渐变画刷创建阴影位图，通过位图构建分层窗口，并与主窗口建立父子关系：

  /// <summary>
  /// 构建阴影
  /// </summary>
  private void BuildShadow()
  {
      lock (this)
      {
          _buildingShadow = true;
  
          if (_shadow != null && !_shadow.IsDisposed && !_shadow.Disposing)
          {
              // 解除父子窗口关系
              SetWindowLong(
                  Handle,
                  GWL_HWNDPARENT,
                  0);
  
              _shadow.Dispose();
          }
  
          Bitmap bmpBackground = new Bitmap(Width + BorderWidth * 4, Height + BorderWidth * 4);
  
          GraphicsPath gp = new GraphicsPath();
          gp.AddRectangle(new Rectangle(0, 0, bmpBackground.Width, bmpBackground.Height));
  
          using (Graphics g = Graphics.FromImage(bmpBackground))
          using (PathGradientBrush brs = new PathGradientBrush(gp))
          {
              g.CompositingMode = CompositingMode.SourceCopy;
              g.InterpolationMode = InterpolationMode.HighQualityBicubic;
              g.PixelOffsetMode = PixelOffsetMode.HighQuality;
              g.SmoothingMode = SmoothingMode.AntiAlias;
  
              // 中心颜色
              brs.CenterColor = Color.FromArgb(100, Color.Black);
              // 指定从实际阴影边界到窗口边框边界的渐变
              brs.FocusScales = new PointF(1 - BorderWidth * 4F / Width, 1 - BorderWidth * 4F / Height);
              // 边框环绕颜色
              brs.SurroundColors = new[] { Color.FromArgb(0, 0, 0, 0) };
              // 掏空窗口实际区域
              gp.AddRectangle(new Rectangle(BorderWidth * 2, BorderWidth * 2, Width, Height));
              g.FillPath(brs, gp);
          }
  
          gp.Dispose();
  
          _shadow = new XFormShadow(bmpBackground);
  
          _buildingShadow = false;
  
          AlignShadow();
          _shadow.Show();
  
          // 设置父子窗口关系
          SetWindowLong(
              Handle,
              GWL_HWNDPARENT,
              _shadow.Handle.ToInt32());
  
          Activate();
      }//end of lock(this)
  }

  感谢大家能读到这里，代码中如有错误，或存在其它建议，欢迎在评论区或Github指正。

  如果觉得本文对你有帮助，还请点个推荐或Github上点个星星，谢谢大家。

转载请注明原作者，谢谢。