C#借助TabControl实现浏览器标题栏样式

概述

先上效果图

重点代码

随着标签变化变更尺寸

为了让窗口更好看，所以要舍弃掉Winform的原有窗口样式，改为无边框的窗体。
无边框窗体是好看了，但少了控制按钮，少了标题栏的拖动移动位置，少了窗口大小调整，这些需要自己实现加上去
控制按钮和拖动功能，最好的实现方式是借助一个panel来实现，这样不仅可以让控制按钮和标签显示在同一行更节省空间，也可以增加 + 添加标签 按钮
不啰嗦了，直接上代码

private void changeHeadCtlSize()
{
    int tabsWidth = mainTab.TabCount * mainTab.ItemSize.Width;
    //pHeadCtl 的最小宽度是128 
    int pWidth = mainTab.Width - tabsWidth;
    if (pWidth < 128)
    {
        int itemWidth = (mainTab.Width - 128) / mainTab.TabCount;
        mainTab.ItemSize = new Size(itemWidth, mainTab.ItemSize.Height);
        pHeadCtl.Width = 128;
        pHeadCtl.Left = mainTab.Width - 128;
    }
    else
    {
        pHeadCtl.Width = mainTab.Width - tabsWidth;
        pHeadCtl.Left = tabsWidth;
    }
}

给控制按钮添加事件

其他事件比较简单，不多说，最大化按钮的代码多写了点，主要是因为对于无边框的窗体，最大化时会遮挡任务栏，可能效果更好，但对用户而言体验就要缺点啥了，还是重写这个方法吧。

private void btnClose_Click(object sender, EventArgs e)
{
    this.Close();
}

private Size normalSize;
private Point normalLocation;
private bool isWindowNormal = true;
private void btnMax_Click(object sender, EventArgs e)
{
    if (isWindowNormal)
    {
        normalLocation = this.Location;
        normalSize = this.Size;
        isWindowNormal = false;
        this.Size = new Size(Screen.PrimaryScreen.WorkingArea.Width, Screen.PrimaryScreen.WorkingArea.Height);
        this.Location = new Point(0, 0);
    }
    else
    {
        isWindowNormal = true;
        this.Size = normalSize;
        this.Location = normalLocation;
    }
    changeHeadCtlSize();
}

private void btnMin_Click(object sender, EventArgs e)
{
    this.WindowState = FormWindowState.Minimized;
}

private void btnAdd_Click(object sender, EventArgs e)
{
    TabPage newtab = new TabPage();
    mainTab.TabPages.Add(newtab);
    mainTab.SelectedIndex = mainTab.TabCount - 1;
    changeHeadCtlSize();
}

鼠标拖动移动位置

private Point oldPosition;
private bool isMoving = false;
private void pHeadCtl_MouseDown(object sender, MouseEventArgs e)
{
    oldPosition = e.Location; //记录鼠标按下时所在的位置
    isMoving = true;
}

private void pHeadCtl_MouseMove(object sender, MouseEventArgs e)
{
    if (e.Button == MouseButtons.Left && isMoving) //如果点击了左键移动了，就重新指定窗口的位置
    {
        //新的鼠标位置减去旧的鼠标位置，得到鼠标移动的距离，就是窗口移动的距离
        Point newPosition = new Point(e.Location.X - oldPosition.X, e.Location.Y - oldPosition.Y);
        //原有位置加上移动距离得到新的位置
        this.Location += new Size(newPosition); 
    }
}

private void pHeadCtl_MouseUp(object sender, MouseEventArgs e)
{
    isMoving = false; //鼠标抬起，移动结束
}

常见问题

TabControl尺寸变更后TabPage未发生变化

正常只要把TabPage的子控件dock属性设置为fill即可

TabPage newtab = new TabPage();
mainTab.TabPages.Add(newtab);
WebKitBrowser browser = new WebKitBrowser();
//Tabcontrol调整后Tabpage没有跟着调整大小，通过设置Dock = fill 可以解决，但是那样我的工具栏会失去作用
//Dock = Bottom，然后Anchor设置为上下左右即可实现等同于fill的功能
browser.Top = pHeadTools.Height;
browser.Dock = DockStyle.Bottom;
browser.Anchor = AnchorStyles.Top | AnchorStyles.Left | AnchorStyles.Right | AnchorStyles.Bottom;
browser.Size = new Size(newtab.Size.Width, newtab.Size.Height - pHeadTools.Height);
newtab.Controls.Add(browser);