Windows Forms: Creating Application with Chrome-Style Tabs using EasyTabs in C#

This post show you How to Create an Application with Chrome-Style Tabs using EasyTabs in C# .NET Windows Forms Application.

EasyTabs

EasyTabs is a library that you can easily add to your .NET WinForms applications to display a list of tabs in the title bar, similar to Chrome, Firefox...etc.

When creating your winform instead of inheriting from System.Windows.Forms.Form, you should inherit from TitleBarTabs. The base class is responsible for rendering the tabs, responding to clicks to activate, close, add...etc. So you just need to add TitleBarTab objects to the Tabs collection.

TitleBarTab objects expect their content property to be set to a Form object that represents the contents for the tab. You can design these forms in Visual Studio like any other application, the Title and Icon properties are used to display the same tab.

The library comes with a renderer for tabs like Chrome, but you can do it yourself by creating a class that inherits from the BaseTabRenderer.

c# tab with close button

Creating a new windows forms project, then install the EasyTabs library from Nuget Manage Packages in the Visual Studio.

After intalling the EasyTabs control, you should create a new form, then change your form name to AppContainer and make it inherit from TitleBarTabs.

public partial class AppContainer : TitleBarTabs
{
    public AppContainer()
    {
        InitializeComponent();
        AeroPeekEnabled = true;
        TabRenderer = new ChromeTabRenderer(this);
    }

    public override TitleBarTab CreateTab()
    {
        return new TitleBarTab(this)
        {
            Content = new Form2
            {
                Text = "New Tab"
            }
        };
    }
}

Next, You need to override CreateTab method to return the form you want to add to the Chrome Tab.

Note that if you try to open the AppContainer in the Visual Studio Designer, you will get an error.

In this demo, I created two forms named Form1, Form2.

You can drag some controls into Form1 and Form2.

Finally, Open the Program.cs, then modify your code as shown below.

static class Program
{
    /// <summary>
    /// The main entry point for the application.
    /// </summary>
    [STAThread]
    static void Main()
    {
        Application.EnableVisualStyles();
        Application.SetCompatibleTextRenderingDefault(false);
        AppContainer container = new AppContainer();

        container.Tabs.Add(
            new TitleBarTab(container)
            {
                Content = new Form1
                {
                    Text = "New Tab"
                }
            }
        );
        container.SelectedTabIndex = 0;
        TitleBarTabsApplicationContext applicationContext = new TitleBarTabsApplicationContext();
        applicationContext.Start(container);
        Application.Run(applicationContext);
    }
}

By default, we will create a new tab that returns Form1.