> For the complete documentation index, see [llms.txt](https://docs-siticoneframework.gitbook.io/home/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs-siticoneframework.gitbook.io/home/net-framework-or-net-core-ui/container-and-layout/siticone-tabcontrol/general-layout-and-sizing.md).

# General Layout and Sizing

A comprehensive set of properties to control the dimensions and shape of tabs for precise layout customization.

## Overview

The General Layout and Sizing feature of the SiticoneTabControl enables developers to define the uniform width of tabs and customize the corner radii of each tab, thereby controlling the overall appearance and geometric style of the tab headers. This feature ensures a consistent and aesthetically pleasing layout that can be tailored to the application's design requirements.

***

### Properties Overview

| Property Name              | Description                                                     | Default Value | Data Type |
| -------------------------- | --------------------------------------------------------------- | ------------- | --------- |
| TabWidth                   | Sets a uniform width for all tab buttons.                       | 160           | int       |
| TabCornerRadiusTopLeft     | Specifies the roundness of the top-left corner of each tab.     | 8             | int       |
| TabCornerRadiusTopRight    | Specifies the roundness of the top-right corner of each tab.    | 8             | int       |
| TabCornerRadiusBottomLeft  | Specifies the roundness of the bottom-left corner of each tab.  | 8             | int       |
| TabCornerRadiusBottomRight | Specifies the roundness of the bottom-right corner of each tab. | 8             | int       |

***

### Key Points

| Aspect             | Details                                                                                                                                    |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------ |
| Uniformity         | The `TabWidth` property ensures that every tab maintains a consistent width, promoting uniformity in layout.                               |
| Customizable Shape | Individual corner radii properties allow for precise control over the roundness of each tab corner, enhancing the overall visual design.   |
| Dynamic Redraw     | Changes to these properties trigger a redraw (`Invalidate()` is called) ensuring that any modifications are immediately visible in the UI. |

***

### Best Practices

| Practice                            | Explanation                                                                                                                      | Code Example                                                           |
| ----------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------- |
| Set TabWidth Appropriately          | Use a value that fits your application's design. Too narrow may truncate text; too wide may cause layout issues.                 | `tabControl.TabWidth = 180;`                                           |
| Adjust Corner Radii for Modern Look | Use subtle radii (e.g., 8–12) for a modern, rounded appearance while ensuring the radius does not exceed half of tab dimensions. | `tabControl.TabCornerRadiusTopLeft = 10;`                              |
| Reapply Properties on Runtime       | If dynamic UI changes are required, update these properties at runtime and ensure you call `Invalidate()` if needed.             | `tabControl.TabCornerRadiusBottomRight = 12; tabControl.Invalidate();` |

***

### Common Pitfalls

| Pitfall                   | Explanation                                                                                                  | How to Avoid                                                                  |
| ------------------------- | ------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------- |
| Overly Large Corner Radii | Setting radii greater than half the tab dimensions can distort the tab shape.                                | Validate input values to be ≤ half of the tab’s width/height.                 |
| Inconsistent TabWidth     | Inconsistent width settings may lead to a disjointed appearance in multi-tab interfaces.                     | Always use a unified `TabWidth` property value for consistency.               |
| Ignoring Redraw Calls     | Failing to refresh the control after property changes might prevent new settings from appearing immediately. | Ensure `Invalidate()` is called after updates if not automatically refreshed. |

***

### Usage Scenarios

| Scenario                                   | Description                                                                                                                          | Sample Code Snippet                                                                                                                                                                                                                                                                                                                                                   |
| ------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Customizing Tab Appearance for a Dashboard | When creating a dashboard with a modern design, a developer can set a wider tab width and adjust the corner radii for a smooth look. | `csharp<br>// Initialize control and set properties<br>SiticoneTabControl tabControl = new SiticoneTabControl();<br>tabControl.TabWidth = 200;<br>tabControl.TabCornerRadiusTopLeft = 12;<br>tabControl.TabCornerRadiusTopRight = 12;<br>tabControl.TabCornerRadiusBottomLeft = 12;<br>tabControl.TabCornerRadiusBottomRight = 12;<br>this.Controls.Add(tabControl);` |
| Responsive Layout Adjustments              | In a dynamically resizing window, you may update the tab width programmatically to maintain a consistent layout.                     | `csharp<br>private void Form_Resize(object sender, EventArgs e)<br>{<br> tabControl.TabWidth = this.Width / 5;<br> tabControl.Invalidate();<br>}<br>`                                                                                                                                                                                                                 |

***

### Detailed Code Examples

#### Example 1: Basic Initialization and Layout Customization

```csharp
using System;
using System.Drawing;
using System.Windows.Forms;
using SiticoneNetFrameworkUI;

public class MainForm : Form
{
    private SiticoneTabControl tabControl;

    public MainForm()
    {
        InitializeComponents();
    }

    private void InitializeComponents()
    {
        // Create an instance of SiticoneTabControl
        tabControl = new SiticoneTabControl
        {
            Location = new Point(20, 20),
            Size = new Size(600, 300),
            TabWidth = 180, // Set a uniform width for all tabs
            TabCornerRadiusTopLeft = 10, // Customize each corner for a modern rounded look
            TabCornerRadiusTopRight = 10,
            TabCornerRadiusBottomLeft = 10,
            TabCornerRadiusBottomRight = 10
        };

        // Add sample tab pages
        for (int i = 0; i < 5; i++)
        {
            TabPage page = new TabPage($"Tab {i + 1}");
            tabControl.TabPages.Add(page);
        }

        // Add the tab control to the form
        this.Controls.Add(tabControl);
        this.Text = "SiticoneTabControl Demo - Layout and Sizing";
        this.StartPosition = FormStartPosition.CenterScreen;
    }
    
    [STAThread]
    public static void Main()
    {
        Application.EnableVisualStyles();
        Application.Run(new MainForm());
    }
}
```

#### Example 2: Dynamic Adjustment of TabWidth on Form Resize

```csharp
using System;
using System.Drawing;
using System.Windows.Forms;
using SiticoneNetFrameworkUI;

public class ResponsiveForm : Form
{
    private SiticoneTabControl tabControl;

    public ResponsiveForm()
    {
        InitializeComponents();
    }

    private void InitializeComponents()
    {
        // Initialize the SiticoneTabControl
        tabControl = new SiticoneTabControl
        {
            Dock = DockStyle.Top,
            Height = 250,
            TabCornerRadiusTopLeft = 8,
            TabCornerRadiusTopRight = 8,
            TabCornerRadiusBottomLeft = 8,
            TabCornerRadiusBottomRight = 8
        };

        // Add a few tabs for demonstration
        for (int i = 0; i < 3; i++)
        {
            tabControl.TabPages.Add(new TabPage($"Page {i + 1}"));
        }

        // Add controls to the form
        this.Controls.Add(tabControl);
        this.Text = "Responsive Layout Demo";
        this.Resize += ResponsiveForm_Resize;
    }

    private void ResponsiveForm_Resize(object sender, EventArgs e)
    {
        // Adjust the TabWidth proportionally with the form's width
        int newTabWidth = this.ClientSize.Width / 4;
        tabControl.TabWidth = newTabWidth;
        tabControl.Invalidate();
    }
    
    [STAThread]
    public static void Main()
    {
        Application.EnableVisualStyles();
        Application.Run(new ResponsiveForm());
    }
}
```

***

### Review

| Aspect                  | Review Comments                                                                                                        |
| ----------------------- | ---------------------------------------------------------------------------------------------------------------------- |
| Design Consistency      | The ability to control the tab width and corner radii helps maintain a consistent look across the application.         |
| Ease of Use             | The properties are straightforward to set and immediately reflect changes, thanks to the automatic redrawing behavior. |
| Integration Flexibility | The layout properties can be dynamically updated at runtime, offering flexibility for responsive design scenarios.     |

***

### Summary

The General Layout and Sizing feature of the SiticoneTabControl offers extensive customization over the dimensions and shape of tab headers. By setting the `TabWidth` and individual corner radii properties, developers can achieve a consistent, modern look that complements any application design. Key practices include choosing appropriate sizes that fit the overall UI, ensuring dynamic responsiveness with runtime updates, and avoiding extreme values that may distort the tab appearance. This feature is fundamental for creating visually appealing and user-friendly tab interfaces in WinForms applications.

***

### Additional Sections

#### Integration Checklist

| Step                       | Action Required                                                                                   |
| -------------------------- | ------------------------------------------------------------------------------------------------- |
| Instantiate the Control    | Create an instance of SiticoneTabControl and add it to the form.                                  |
| Set Layout Properties      | Configure `TabWidth` and the four corner radius properties according to your design needs.        |
| Add TabPages               | Populate the control with TabPages to see the layout customizations in action.                    |
| Handle Runtime Adjustments | Optionally, implement event handlers (e.g., form resize) to adjust layout properties dynamically. |
| Test and Review            | Verify the visual appearance across different screen resolutions and form sizes.                  |

#### Frequently Asked Questions

| Question                                         | Answer                                                                                                 |
| ------------------------------------------------ | ------------------------------------------------------------------------------------------------------ |
| How do I update the tab layout at runtime?       | Update the properties (like `TabWidth`) and call `Invalidate()` to refresh the control immediately.    |
| Can I set different corner radii for each tab?   | The properties apply uniformly to all tabs; for per-tab customization, consider extending the control. |
| What if the tab width is too narrow for my text? | Increase the `TabWidth` or adjust the font and padding settings to ensure text is not truncated.       |

***

This documentation for the General Layout and Sizing feature, based solely on the provided code, serves as a comprehensive guide to help developers integrate and customize the SiticoneTabControl for their WinForms applications.