Siticone Left Sidebar

The SiticoneLeftSidebar is a specialized panel designed for creating modern, responsive navigation drawers. It integrates high-quality CSS-style drop shadows, customizable borders, and a unique "Auto-Close" feature that detects clicks outside the sidebar to mimic mobile drawer behavior.

Drop Shadows

Unlike standard controls, this sidebar features a multi-layered shadowing algorithm to create depth and separation from the main content area.

Property	Type	Description & Usage Example
`EnableDropShadow`	bool	sidebar.EnableDropShadow = true; Toggles the rendering of the depth shadow on the right side.
`ShadowDepth`	int	sidebar.ShadowDepth = 15; Controls the spread distance of the shadow. Note: The control's right padding automatically adjusts to accommodate this value.
`ShadowColor`	Color	sidebar.ShadowColor = Color.FromArgb(50, 0, 0, 0); The base color of the shadow. Alpha transparency is calculated automatically for a smooth fade.

Borders

Customize the separation line between the sidebar and the main form content.

Property	Type	Description & Usage Example
`RightBorderThickness`	int	sidebar.RightBorderThickness = 1; The width in pixels of the border line drawn on the right edge.
`RightBorderColor`	Color	sidebar.RightBorderColor = Color.Silver; The color of the border line. Set to `Color.Transparent` to hide the border while keeping the shadow.

Interactive Behavior

Features that control how the sidebar reacts to user input.

Property	Type	Description & Usage Example
`AutoCloseOnOutsideClick`	bool	sidebar.AutoCloseOnOutsideClick = true; When enabled, the control installs a message filter to detect clicks anywhere in the application. If a click occurs outside the sidebar boundaries, the sidebar automatically collapses to its minimum size.

Designer Support

The control includes a robust Smart Tag menu in the Visual Studio designer. Click the small arrow on the top-right of the control to access quick actions.

Layout Actions: Quickly Expand or Collapse the sidebar to test layouts at design time.
Theme Presets: One-click application of styles like "Dark", "Blue", "Green", "Red", etc.
Copy/Paste Settings: Easily copy the visual configuration from one sidebar to another.

Detailed Usage Examples

Example 1: Standard Dashboard Layout

Sets up a professional sidebar docked to the left with a subtle shadow and border.

C# - Dashboard Setup

private void InitializeDashboard()
{
                // 1. Dock to left side
    siticoneLeftSidebar1.Dock = DockStyle.Left;
    siticoneLeftSidebar1.Width = 250;

                // 2. Configure Shadow
    siticoneLeftSidebar1.EnableDropShadow = true;
    siticoneLeftSidebar1.ShadowDepth = 20;
    siticoneLeftSidebar1.ShadowColor = Color.FromArgb(40, 0, 0, 0); // Soft black

                // 3. Configure Border
    siticoneLeftSidebar1.RightBorderColor = Color.Gainsboro;
    siticoneLeftSidebar1.RightBorderThickness = 1;
}

Example 2: Implementing a Hamburger Menu

The sidebar creates the container, but you need a button to toggle it. Here is how to wire a "Hamburger" button to open/close the sidebar smoothly using a Timer.

C# - Toggle Logic

// Timer field for animation
private Timer _sidebarTimer;
private bool _isSidebarExpanded = true;
private const int SidebarWidth = 250;
private const int SidebarMin = 60;

private void SetupSidebarAnimation()
{
    _sidebarTimer = new Timer();
    _sidebarTimer.Interval = 10;
    _sidebarTimer.Tick += SidebarTimer_Tick;
}

private void BtnHamburger_Click(object sender, EventArgs e)
{
                // Start animation
    _sidebarTimer.Start();
}

private void SidebarTimer_Tick(object sender, EventArgs e)
{
                if (_isSidebarExpanded)
    {
                // Collapsing
        siticoneLeftSidebar1.Width -= 20;
                if (siticoneLeftSidebar1.Width <= SidebarMin)
        {
            siticoneLeftSidebar1.Width = SidebarMin;
            _isSidebarExpanded = false;
            _sidebarTimer.Stop();
        }
    }
                else
    {
                // Expanding
        siticoneLeftSidebar1.Width += 20;
                if (siticoneLeftSidebar1.Width >= SidebarWidth)
        {
            siticoneLeftSidebar1.Width = SidebarWidth;
            _isSidebarExpanded = true;
            _sidebarTimer.Stop();
        }
    }
}

Example 3: Auto-Close on Outside Click

Useful for mobile-style layouts where the menu should disappear when the user interacts with the main content.

C# - Auto-Close

private void ConfigureAutoClose()
{
                // Enable the built-in message filter
    siticoneLeftSidebar1.AutoCloseOnOutsideClick = true;
    
                // Set the state it returns to when clicked outside
    siticoneLeftSidebar1.MinimumSize = new Size(0, 0); // Collapse fully
                // OR
                // siticoneLeftSidebar1.MinimumSize = new Size(60, 0); // Collapse to icon bar
}

Example 4: Dark Mode Theme

Quickly apply a modern dark aesthetic to the sidebar.

C# - Dark Theme

private void ApplyDarkTheme()
{
    siticoneLeftSidebar1.BackColor = Color.FromArgb(30, 30, 30);
    siticoneLeftSidebar1.ForeColor = Color.WhiteSmoke;
    
                // Subtle dark border
    siticoneLeftSidebar1.RightBorderColor = Color.FromArgb(50, 50, 50);
    
                // Deep shadow for contrast
    siticoneLeftSidebar1.ShadowColor = Color.Black;
    siticoneLeftSidebar1.ShadowDepth = 25;
}