Siticone Logo
Siticone UI
DOCS
v2025.12.15
Docs Pinnable Panel Host

Siticone Pinnable Panel Host

The SiticonePinnablePanelHost is an intelligent container that acts as a manager for SiticonePinnablePanel controls. It automatically sorts child panels into two groups: Pinned (important) and Unpinned (standard). The host handles smooth reordering animations, layout flow (Vertical, Horizontal, or Grid), and collision detection.

Layout Configuration

Configure how panels are arranged within the host container.

Property Type Description & Usage Example
LayoutMode PanelLayout host.LayoutMode = PanelLayout.Vertical; Controls arrangement strategy. Options:
  • Vertical: Standard stacked list.
  • Horizontal: Side-by-side flow.
  • Grid: Auto-calculating responsive grid.
PinnedPanelSpacing int host.PinnedPanelSpacing = 15; Gap in pixels between panels in the Pinned section.
UnpinnedPanelSpacing int host.UnpinnedPanelSpacing = 10; Gap in pixels between panels in the Unpinned section.
PreserveOriginalOrder bool host.PreserveOriginalOrder = true; If true, when a panel is unpinned, it returns to its original relative position among other unpinned items, rather than being appended to the end.

Section Headers

Visual separators that categorize content into Pinned and Unpinned areas.

Property Type Description & Usage Example
ShowSectionHeaders bool host.ShowSectionHeaders = true; Enables drawing of section titles above the Pinned and Unpinned groups.
PinnedSectionTitle string host.PinnedSectionTitle = "Favorites"; Text displayed above the pinned panels group.
UnpinnedSectionTitle string host.UnpinnedSectionTitle = "More Widgets"; Text displayed above the unpinned panels group.
SectionHeaderFont Font host.SectionHeaderFont = new Font("Segoe UI", 12, FontStyle.Bold);
PinnedSectionHeaderBackColor Color host.PinnedSectionHeaderBackColor = Color.AliceBlue;

Animation & Behavior

Settings for smooth reordering transitions when panels change state.

Property Type Description & Usage Example
AnimateReordering bool host.AnimateReordering = true; If true, panels slide to their new positions. If false, they snap instantly.
AnimationDuration int host.AnimationDuration = 300; Time in milliseconds for the reorder animation to complete.
AnimationEasing EasingType host.AnimationEasing = AnimationEasingPbfx.EaseOutQuad; Acceleration curve: Linear, EaseIn, EaseOut, Bounce, etc.
IsOverlappingDetectionEnabled bool host.IsOverlappingDetectionEnabled = true; Automatically runs a background check to fix panel overlaps caused by rapid resizing.

Public Methods

Programmatic control over panel ordering and state.

AddPanel(SiticonePinnablePanel)
// Adds a new panel to the host and automatically arranges it.
host.AddPanel(myNewPanel);
MovePanelUp(panel) / MovePanelDown(panel)
// Reorders a panel within its current section (Pinned or Unpinned).
host.MovePanelUp(panel1);
host.MovePanelDown(panel2);
PinAllPanels() / UnpinAllPanels()
// Bulk operation to change the state of all managed panels.
host.PinAllPanels();   // Moves everything to top
host.UnpinAllPanels(); // Moves everything to bottom
SaveCurrentOrderAsOriginal()
// Updates the internal "default order" to match the current arrangement.
// Useful for persisting user customizations.
host.SaveCurrentOrderAsOriginal();
ResetLayout()
// Forces a complete recalculation of panel positions.
// Use this if panels become misaligned due to external size changes.
host.ResetLayout(true); // true = animate to new positions

Events

Event Description
PanelPinned Fired when a child panel's IsPinned property becomes true.
PanelUnpinned Fired when a child panel's IsPinned property becomes false.
PanelsReordered Fired after the layout engine has finished moving panels to new positions.
PanelMoved Fired when a specific panel changes its index order (via MovePanelUp/Down).

Detailed Usage Examples

Example 1: Dashboard with Grid Layout

Sets up a responsive grid of widgets where users can pin their favorites to the top.

C# - Dashboard Grid
private void InitializeDashboard()
{
                // Configure Host for Grid Mode
    hostDashboard.LayoutMode = SiticonePinnablePanelHost.PanelLayout.Grid;
    hostDashboard.ShowSectionHeaders = true;
    hostDashboard.PinnedSectionTitle = "Priority Widgets";
    hostDashboard.UnpinnedSectionTitle = "All Widgets";
    
                // Add 10 widgets
                for (int i = 1; i <= 10; i++)
    {
                var panel = new SiticonePinnablePanel();
        panel.Size = new Size(250, 150); // Fixed size for grid cells
        panel.BackgroundColor = Color.White;
        
                // Add content
                var lbl = new Label { Text = $"Widget {i}", Location = new Point(10, 10) };
        panel.Controls.Add(lbl);
        
                // Add to host
        hostDashboard.AddPanel(panel);
    }
}

Example 2: Vertical Task List

Manages a To-Do list where pinned items act as "High Priority" tasks.

C# - Task Manager
private void SetupTaskList()
{
    hostTasks.LayoutMode = SiticonePinnablePanelHost.PanelLayout.Vertical;
    
                // Styling Headers
    hostTasks.ShowSectionHeaders = true;
    hostTasks.PinnedSectionHeaderBackColor = Color.MistyRose;
    hostTasks.PinnedSectionTitle = "URGENT TASKS";
    hostTasks.UnpinnedSectionTitle = "Backlog";
    
                // Smooth Animation
    hostTasks.AnimateReordering = true;
    hostTasks.AnimationDuration = 400;
    hostTasks.AnimationEasing = SiticonePinnablePanelHost.AnimationEasingPbfx.Bounce;
    
                // Handle pinning event to log changes
    hostTasks.PanelPinned += (s, e) => {
                Console.WriteLine($"Task '{e.PanelName}' marked as Urgent");
    };
}

Example 3: Dynamic Panel Management

Adding and removing panels at runtime with proper cleanup.

C# - Dynamic Add/Remove
private void btnAdd_Click(object sender, EventArgs e)
{
                // Create new panel
                var newPnl = new SiticonePinnablePanel();
    newPnl.Height = 100;
    
                // Add button to remove itself
                var btnClose = new Button { Text = "X", Dock = DockStyle.Right, Width = 30 };
    btnClose.Click += (s, args) => {
        hostMain.RemovePanel(newPnl); // Safe removal from host
        newPnl.Dispose(); // Clean up resources
    };
    
    newPnl.Controls.Add(btnClose);
    
                // Add to host - it will slide into place
    hostMain.AddPanel(newPnl);
}