使用 Graphics.DrawImage 在 C# 中创建自定义选项卡 [英] Using Graphics.DrawImage to create custom tabs in C#

问题描述

我有一个项目，您可以在其中添加和删除选项卡(如 Web 浏览器).到目前为止，我有这个:

I have a project in which you can add and remove tabs (like a web browser). So far I have this:

//Button to add a new tab page
    private void cb_addPage_Click(object sender, EventArgs e)
    {
        string title = "TabPage " + (tabControl1.TabCount + 1).ToString() + "   ";
        TabPage myTabPage = new TabPage(title);
        tabControl1.TabPages.Add(myTabPage);
        tabControl1.SelectedTab = myTabPage;
    }


//Form1_Load
    private void Form1_Load(object sender, EventArgs e)
    {
        tabControl1.DrawMode = TabDrawMode.OwnerDrawFixed;
        cb_addPage.Top = tabControl1.Top;
        cb_addPage.Left = tabControl1.Right - cb_addPage.Width;
        foreach (TabPage tp in tabControl1.TabPages) tp.Text += "   ";
    }

    Rectangle closeX = Rectangle.Empty;

//Sets background and places the X button on each tab
    private void tabControl1_DrawItem(object sender, DrawItemEventArgs e)
    {
        Size xSize = new Size(15, 15);
        TabPage tp = tabControl1.TabPages[e.Index];
        e.DrawBackground();
        using (SolidBrush brush = new SolidBrush(e.ForeColor))
            e.Graphics.DrawString(tp.Text + "   ", e.Font, brush,
                                  e.Bounds.X + 3, e.Bounds.Y + 4);

        if (e.State == DrawItemState.Selected)
        {
            closeX = new Rectangle(e.Bounds.Right - xSize.Width - 3, 
                           e.Bounds.Top + 5, xSize.Width, xSize.Height);
            e.Graphics.DrawImage(imageList1.Images[0], closeX, 
                         new Rectangle(0,0,16,16), GraphicsUnit.Pixel );
        }

    }

//Removes current tab (from X button)
    private void tabControl1_MouseClick(object sender, MouseEventArgs e)
    {
        if (closeX.Contains(e.Location))
            tabControl1.TabPages.Remove(tabControl1.SelectedTab);
    }

所以这一切都是让您添加带有按钮的标签，并且在每个单独的标签上都有一个 X 按钮来删除标签.

So all this does is let you add tabs with a button and on each individual tab there is an X button to delete the tab.

我使用了 Graphics.DrawImage 来显示自定义的 X 按钮(在 imageList 中).但是，我将如何使用 Graphics.DrawImage 制作自定义选项卡.

I have used Graphics.DrawImage to display the custom X button (that are in an imageList). However how will I go about making custom tabs using Graphics.DrawImage.

总而言之，我想要标签，但我希望它们是我制作的自定义图像，以便看起来更好.- 谢谢

To sum up I want tabs, but I want them to be custom images that I have made so it looks better. - Thanks

推荐答案

如果你想像 webbrowsers favicon 一样显示除文本之外的图像，你可以使用这个修改后的代码:

If you want to display Images in addition to the text like a webbrowsers favicon you can use this modified code:

private void tabControl3_DrawItem(object sender, DrawItemEventArgs e)
{
    Size xSize = new Size(16,16);
    Point imgLoc = new Point(e.Bounds.X +  4, e.Bounds.Y + 4);
    TabPage tp = tabControl3.TabPages[e.Index];
    e.DrawBackground();
    e.Graphics.DrawImage(imageList1.Images[tp.ImageIndex], new Rectangle(imgLoc, xSize), 
                            new Rectangle(Point.Empty, xSize), GraphicsUnit.Pixel);

    using (SolidBrush brush = new SolidBrush(e.ForeColor))
    {
        e.Graphics.DrawString(tp.Text + "   ", e.Font, brush, 
                              e.Bounds.X + 23, e.Bounds.Y + 4);
        if (e.State == DrawItemState.Selected)
        {
            closeX = new Rectangle(e.Bounds.Right - xSize.Width - 3, 
                         e.Bounds.Top + 5, xSize.Width, xSize.Height);
            e.Graphics.DrawImage(imageList1.Images[0], closeX, 
                       new Rectangle(Point.Empty, xSize), GraphicsUnit.Pixel);

        }
    }
}

您需要确保:

• 您有想要在图像列表中的每个标签中显示的图像.
• 并且您知道 ech one 的索引.
• 您必须在创建页面时设置它，但您可以随时更改它.
• 最好在索引 0 处设置一个默认图标，并为那些您不知道正确索引的图像索引设置为 0.

通常，您还必须将 Tab 控件指向 Imagelist.但既然都是我们自己画的，这并不重要.

Usually you would also have to make your Tab control point to the Imagelist. But since we are drawing it all by ourselves, this is not important.

您可以使用更复杂的 DrawString 格式，用于绘制关闭按钮.在这里，您不只是使用一个点来确定要绘制的位置；相反，这种格式使用两个矩形来确定源和目标.这有效地导致了将图像缩放到新尺寸的选项.

You can use the more complex format of DrawString, that is used for drawing the close button. Here you don't just use a point to determine the location where to draw; instead this format uses two rectangles to determine the source and the target. This effectively leads to th option of scaling the image to a new size.

但是，如果您的图片开始时尺寸合适，您将获得最佳质量.请注意，每个TabPage 的文本决定了标签的宽度；要使其更高，您需要选择更大的字体大小.

But you'll get the best quality if your Images have the right size to begin with. Please note that the text of each TabPage determines the width of the tab; to make it higher you need to chose a larger Fontsize.

这篇关于使用 Graphics.DrawImage 在 C# 中创建自定义选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！