选项卡控件带有关闭和添加按钮。

13

我正在尝试使选项卡控件具有“x”(关闭按钮)和“+”(新选项卡按钮)。我找到了一种解决方案,可以添加一个x按钮,现在选项卡看起来像这样:

enter image description here

但我想在黑色圆圈的位置添加一个+。我不知道该怎么做,我尝试了在最后一个选项卡的Paint事件上绘制,就像这样:

var p = tabs.TabPages[tabs.TabCount - 1];
p.Paint += new PaintEventHandler(tab_OnDrawPage);

private void tab_OnDrawPage(object sender, PaintEventArgs e)
{
    // e.ClipRectangle.
    e.Graphics.DrawString("+", 
                          new Font("verdana", 
                                   10, 
                                   FontStyle.Bold), 
                          Brushes.Black, 
                          e.ClipRectangle.X + 10, 
                          e.ClipRectangle.Y + 10);
}

但它没有显示任何绘画内容。我猜这与我在DrawString()调用中传递的位置有关,但我不知道要使用哪些正确的位置。我使用+10来将其绘制远离最后一个选项卡。如何解决?我还没有进行任何自定义绘图,我正在学习。


请参见TabControl和边框视觉故障 - LarsTech
我不确定这与我的问题有什么关系?他试图删除我想要绘制的空格? - Jack
你似乎想在选项卡控件区域绘制,而不是页面区域。尝试根据你的需求进行调整。由于TabControl使用老式的win32样式进行绘制,可能会出现闪烁问题。 - LarsTech
3个回答

27
作为一个选项,您可以添加一个额外的选项卡,其中显示一个添加图标Add ,并在用户单击该选项卡时检查,然后在其前插入一个新的 TabPage

此外,您可以通过使用 TabControlSelecting 事件来防止选择该额外选项卡。这样,最后一个选项卡仅像IE和Chrome一样作为添加按钮。

Tab with close and add button

实现细节

我们将使用自绘制选项卡来显示每个选项卡上的关闭图标和最后一个选项卡上的添加图标。我们使用 DrawItem 来绘制关闭和添加图标,MouseDown 处理关闭和添加按钮的点击,Selecting 防止选择最后一个选项卡,HandleCreated 调整选项卡宽度。您可以在下面看到所有实现设置和代码。

初始化

设置填充和 DrawMode 并为 DrawItemMouseDownSelectingHandleCreated 事件分配事件处理程序。

this.tabControl1.Padding = new Point(12, 4);
this.tabControl1.DrawMode = TabDrawMode.OwnerDrawFixed;

this.tabControl1.DrawItem += tabControl1_DrawItem;
this.tabControl1.MouseDown += tabControl1_MouseDown;
this.tabControl1.Selecting += tabControl1_Selecting;
this.tabControl1.HandleCreated += tabControl1_HandleCreated;

处理关闭按钮和添加按钮的点击事件。
您可以处理MouseDown或MouseClick事件,并检查最后一个选项卡矩形是否包含鼠标单击点,然后在最后一个选项卡之前插入选项卡。否则,请检查哪个关闭按钮包含单击位置,然后关闭其关闭按钮被单击的选项卡。
private void tabControl1_MouseDown(object sender, MouseEventArgs e)
{
    var lastIndex = this.tabControl1.TabCount - 1;
    if (this.tabControl1.GetTabRect(lastIndex).Contains(e.Location))
    {
        this.tabControl1.TabPages.Insert(lastIndex, "New Tab");
        this.tabControl1.SelectedIndex = lastIndex;
    }
    else
    {
        for (var i = 0; i < this.tabControl1.TabPages.Count; i++)
        {
            var tabRect = this.tabControl1.GetTabRect(i);
            tabRect.Inflate(-2, -2);
            var closeImage = Properties.Resources.DeleteButton_Image;
            var imageRect = new Rectangle(
                (tabRect.Right - closeImage.Width),
                tabRect.Top + (tabRect.Height - closeImage.Height) / 2,
                closeImage.Width,
                closeImage.Height);
            if (imageRect.Contains(e.Location))
            {
                this.tabControl1.TabPages.RemoveAt(i);
                break;
            }
        }
    }
}

防止选择最后一个选项卡

为了防止选择最后一个选项卡,您可以处理控件的Selecting事件,并检查所选的选项卡是否是最后一个选项卡,如果是,则取消该事件:

private void tabControl1_Selecting(object sender, TabControlCancelEventArgs e)
{
    if (e.TabPageIndex == this.tabControl1.TabCount - 1)
        e.Cancel = true;
}

绘制关闭按钮和添加按钮

要绘制关闭按钮和添加按钮,您可以处理 DrawItem 事件。我使用了这些图标来表示添加 Add 和关闭 Close 按钮。

private void tabControl1_DrawItem(object sender, DrawItemEventArgs e)
{
    var tabPage = this.tabControl1.TabPages[e.Index];
    var tabRect = this.tabControl1.GetTabRect(e.Index);
    tabRect.Inflate(-2, -2);
    if (e.Index == this.tabControl1.TabCount - 1)
    {
        var addImage = Properties.Resources.AddButton_Image;
        e.Graphics.DrawImage(addImage,
            tabRect.Left + (tabRect.Width - addImage.Width) / 2,
            tabRect.Top + (tabRect.Height - addImage.Height) / 2);
    }
    else
    {
        var closeImage = Properties.Resources.DeleteButton_Image;
        e.Graphics.DrawImage(closeImage,
            (tabRect.Right - closeImage.Width),
            tabRect.Top + (tabRect.Height - closeImage.Height) / 2);
        TextRenderer.DrawText(e.Graphics, tabPage.Text, tabPage.Font,
            tabRect, tabPage.ForeColor, TextFormatFlags.Left);
    }
}

调整选项卡宽度
要调整选项卡的宽度并让最后一个选项卡具有较小的宽度,您可以处理HandleCreated事件,并向控件发送TCM_SETMINTABWIDTH以指定允许的最小选项卡宽度大小。
[DllImport("user32.dll")]
private static extern IntPtr SendMessage(IntPtr hWnd, int msg, IntPtr wp, IntPtr lp);
private const int TCM_SETMINTABWIDTH = 0x1300 + 49;
private void tabControl1_HandleCreated(object sender, EventArgs e)
{
    SendMessage(this.tabControl1.Handle, TCM_SETMINTABWIDTH, IntPtr.Zero, (IntPtr)16);
}

下载

您可以在此处下载代码或克隆存储库:


我正在尝试使用这种方法。当您只有一个选项卡时,即“新建选项卡”时,我发现应用程序中存在一个错误,当您点击“x”按钮时,鼠标会自动移动到“新建选项卡”选项卡并创建一个新的选项卡,这样,除非我小心地点击x按钮并且不离开鼠标的单击按钮拖动光标远离“新建选项卡”,否则我永远无法删除所有选项卡。问题我猜是在检查this.tabControl1.GetTabRect(lastIndex).Contains(e.Location)中,它匹配所有选项卡而不仅仅是“+”按钮(我使用SizeMode = Fixed,因此选项卡比“+”图标大)。我没有成功解决,有什么想法吗? - Jack
@Jack,我已经检查过了。它的行为没有问题。我会在这里分享完整的代码。 - Reza Aghaei
@Jack,我为这个问题WinForms TabControl - Add New Tab Button (+)分享了一个答案,它的重点是添加“+”按钮。希望你会发现它有用。它与这个问题无关,但我也在我的答案中链接了这篇文章,以便自定义绘制选项卡。 - Reza Aghaei
你的实现并没有我之前提到的问题。非常好用。现在标签页关闭功能也正常了。谢谢。我像你一样处理了MouseClick事件而不是MouseDown,这有什么区别吗?最后一个标签大小的问题对我来说仍然无法解决,我不知道为什么。我的最后一个图标标签看起来像这样:http://i.imgur.com/8koMZjQ.png SendMessage()总是返回值60 - Jack
2
谢谢您的好意 :-) 这并不应该很难,我在codeproject.com上看到了一些很好的实现。您可以查看它们,然后根据您的要求自定义绘图代码。 - Reza Aghaei
显示剩余5条评论

1
通常,处理像这样的任务的直接、"低级别"方法是处理 Paint 事件并在 TabControl 中绘制,然后还要处理鼠标输入事件来检测您已绘制的点击位置。
但是,a) 这很麻烦,b) TabControl 抑制了 Paint 事件,因此不可能处理它,除非更低级别地处理 WndProc() 方法覆盖中的 WM_PAINT 消息。
针对您的目的,我建议简单地添加一个新控件,例如一个 Button,将其放置在您想让用户能够单击的 TabControl 上方的位置。然后在 Button.Click 事件处理程序中,您可以根据需要添加新页面。如果您想封装 ButtonTabControl 的组合,可以使用一个 UserControl
例如:

TabControlWithAdd.Designer.cs:

partial class TabControlWithAdd
{
    /// <summary> 
    /// Required designer variable.
    /// </summary>
    private System.ComponentModel.IContainer components = null;

    /// <summary> 
    /// Clean up any resources being used.
    /// </summary>
    /// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param>
    protected override void Dispose(bool disposing)
    {
        if (disposing && (components != null))
        {
            components.Dispose();
        }
        base.Dispose(disposing);
    }

    #region Component Designer generated code

    /// <summary> 
    /// Required method for Designer support - do not modify 
    /// the contents of this method with the code editor.
    /// </summary>
    private void InitializeComponent()
    {
        this.button1 = new System.Windows.Forms.Button();
        this.tabControl1 = new System.Windows.Forms.TabControl();
        this.tabPage1 = new System.Windows.Forms.TabPage();
        this.tabPage2 = new System.Windows.Forms.TabPage();
        this.tabControl1.SuspendLayout();
        this.SuspendLayout();
        // 
        // button1
        // 
        this.button1.Anchor = ((System.Windows.Forms.AnchorStyles)((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Right)));
        this.button1.Location = new System.Drawing.Point(247, 3);
        this.button1.Name = "button1";
        this.button1.Size = new System.Drawing.Size(23, 23);
        this.button1.TabIndex = 0;
        this.button1.Text = "+";
        this.button1.UseVisualStyleBackColor = true;
        this.button1.Click += new System.EventHandler(this.button1_Click);
        // 
        // tabControl1
        // 
        this.tabControl1.Anchor = ((System.Windows.Forms.AnchorStyles)((((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Bottom) 
        | System.Windows.Forms.AnchorStyles.Left) 
        | System.Windows.Forms.AnchorStyles.Right)));
        this.tabControl1.Controls.Add(this.tabPage1);
        this.tabControl1.Controls.Add(this.tabPage2);
        this.tabControl1.Location = new System.Drawing.Point(3, 3);
        this.tabControl1.Name = "tabControl1";
        this.tabControl1.SelectedIndex = 0;
        this.tabControl1.Size = new System.Drawing.Size(267, 181);
        this.tabControl1.TabIndex = 1;
        // 
        // tabPage1
        // 
        this.tabPage1.Location = new System.Drawing.Point(4, 25);
        this.tabPage1.Name = "tabPage1";
        this.tabPage1.Padding = new System.Windows.Forms.Padding(3);
        this.tabPage1.Size = new System.Drawing.Size(259, 152);
        this.tabPage1.TabIndex = 0;
        this.tabPage1.Text = "tabPage1";
        this.tabPage1.UseVisualStyleBackColor = true;
        // 
        // tabPage2
        // 
        this.tabPage2.Location = new System.Drawing.Point(4, 25);
        this.tabPage2.Name = "tabPage2";
        this.tabPage2.Padding = new System.Windows.Forms.Padding(3);
        this.tabPage2.Size = new System.Drawing.Size(192, 71);
        this.tabPage2.TabIndex = 1;
        this.tabPage2.Text = "tabPage2";
        this.tabPage2.UseVisualStyleBackColor = true;
        // 
        // TabControlWithAdd
        // 
        this.AutoScaleDimensions = new System.Drawing.SizeF(8F, 16F);
        this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
        this.Controls.Add(this.button1);
        this.Controls.Add(this.tabControl1);
        this.Name = "TabControlWithAdd";
        this.Size = new System.Drawing.Size(273, 187);
        this.tabControl1.ResumeLayout(false);
        this.ResumeLayout(false);

    }

    #endregion

    private System.Windows.Forms.Button button1;
    private System.Windows.Forms.TabControl tabControl1;
    private System.Windows.Forms.TabPage tabPage1;
    private System.Windows.Forms.TabPage tabPage2;
}

TabControlWithAdd.cs:

public partial class TabControlWithAdd : UserControl
{
    public TabControlWithAdd()
    {
        InitializeComponent();
    }

    private void button1_Click(object sender, EventArgs e)
    {
        tabControl1.TabPages.Add("Tab " + (tabControl1.TabPages.Count + 1));
    }
}

上面使用了Button,当然您可以使用任何其他可点击的控件,包括Label(例如,如果您不想要按钮边框外观),以产生您想要的视觉效果。

-1
另一种方法是创建一个扩展了TabControl类的新TabControl。我曾经遇到过同样的问题,那时我就是这么做的。虽然我找不到完成的代码,但这种方法可以在选项卡上添加X,同样的方法也适用于加号符号(+)。
public delegate bool PreRemoveTab(int indx);
public class TabControlEx : TabControl
{
    public TabControlEx()
        : base()
    {
        PreRemoveTabPage = null;
        this.DrawMode = TabDrawMode.OwnerDrawFixed;
    }

    public PreRemoveTab PreRemoveTabPage;

    protected const int size = 5;

    protected int moveRight = 0;

    protected int MoveRight
    {
        get { return moveRight; }
        set { moveRight = value; }
    }

    protected override void OnDrawItem(DrawItemEventArgs e)
    {
        Brush b = new SolidBrush(Color.Salmon);
        Brush b1 = new SolidBrush(Color.Black);
        Font f = this.Font;
        Font f1 = new Font("Arial", 9,FontStyle.Bold);
        if (e.Index != 0)
        {
            Rectangle r = e.Bounds;
            r = GetTabRect(e.Index);
            r.Offset(2, 2);
            r.Width = size;
            r.Height = size;               
            Pen p = new Pen(b,2);
            string title = this.TabPages[e.Index].Text;               
            string boldLetter = title.Substring(0, 1);
            title = title.Remove(0, 1);
            MoveRight = ((Int32)e.Graphics.MeasureString(title, f, 200).Width) + 1;   // -1
            e.Graphics.DrawLine(p, r.X +10 + MoveRight - 2, r.Y, r.X +10 + MoveRight + r.Width, r.Y + r.Height+2);
            e.Graphics.DrawLine(p, r.X +10 + MoveRight + r.Width, r.Y, r.X + 10 + MoveRight-2, r.Y + r.Height+2);
            e.Graphics.DrawString(boldLetter, f1, b1, new PointF(r.X, r.Y));
            e.Graphics.DrawString(title, f, b1, new PointF(r.X+8, r.Y+1));    
        }
        else
        {
            Rectangle r = GetTabRect(e.Index);
            e.Graphics.DrawString(this.TabPages[e.Index].Text, f, b1, new PointF(r.X + 5, r.Y));
        }
    }

    protected override void OnMouseClick(MouseEventArgs e)
    {
        Point p = e.Location;
        for (int i = 0; i < TabCount; i++)
        {
            Rectangle r = GetTabRect(i);
            r.Offset(2, 2);
            r.Width = size+2;
            r.Height = size+2;
            r.X = r.X + MoveRight + 8;
            if (r.Contains(p))
            {
                if (i != 0)
                {
                    CloseTab(i);
                }
            }
        }
    }

    private void CloseTab(int i)
    {
        if (PreRemoveTabPage != null)
        {
            bool closeIt = PreRemoveTabPage(i);
            if (!closeIt)
                return;
        }
        TabPages.Remove(TabPages[i]);
    }
}

你可以尝试稍微修改一下,直到它符合你的需求。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接