Siticone Horizontal Separator

The SiticoneHSeparator is a specialized visual component for creating horizontal dividers. Unlike standard separators, it offers advanced features like segmentation, multiple parallel lines, custom dash patterns, and interactive hover animations. It is ideal for organizing complex forms, creating ruler-like scales, or simply adding stylistic breaks between content.

Visual Styling

Core properties for defining the separator's line appearance and color.

Property	Type	Description & Usage Example
`SeparatorDashStyle`	CustomDashStyle	sep.SeparatorDashStyle = CustomDashStyle.DashDot; Sets the pattern of the line. Supports standard styles (Solid, Dot) and complex patterns (DashDotDot, SparseDash).
`LineColor`	Color	sep.LineColor = Color.LightGray; The primary color of the separator line.
`LineWidth`	int	sep.LineWidth = 2; Thickness of the line in pixels.
`GradientMode`	LinearGradientMode	sep.GradientMode = LinearGradientMode.LeftToRight; Enables gradient rendering along the separator.
`GradientStartColor`	Color	The starting color for the gradient.
`GradientEndColor`	Color	The ending color for the gradient.

Structure & Geometry

Unique properties that transform a simple line into complex structures like grids or rulers.

Property	Type	Description
`Segments`	int	sep.Segments = 5; Splits the separator into distinct sections separated by gaps.
`SegmentSpacing`	int	Pixel distance between segments.
`ShowSegmentNumbers`	bool	Displays numeric labels (1, 2, 3...) below each segment.
`ParallelLines`	int	sep.ParallelLines = 3; Draws multiple copies of the line stacked vertically.
`ParallelLineSpacing`	int	Vertical distance between parallel lines.

Animation & Performance

Controls for interactive effects and rendering optimization.

Property	Type	Description
`EnableHoverAnimation`	bool	sep.EnableHoverAnimation = true; Smoothly transitions the line color to `HoverColor` when the mouse enters the control.
`HoverColor`	Color	The target color during the hover state.
`UltraFastMode`	bool	sep.UltraFastMode = true; Disables gradients and animations to maximize rendering speed. Useful for controls with many segments.

Enumerations

CustomDashStyle Enum

public enum CustomDashStyle
{
    Solid,                 // _________________
    Dash,                  // --- --- --- --- ---
    Dot,                   // . . . . . . . . . .
    DashDot,               // -.-.-.-.-.-.-.-.-.
    DoubleDash,            // == == == == == == ==
    TripleDash,            // === === === === ===
    SparseDot,             // .   .   .   .   .  
    CustomPattern1,        // --..--..--..--..--
                // ... and more
}

GradientScopeHS Enum

public enum GradientScopeHS
{
                // The gradient spans the entire width of the control.
    FullControl,
    
                // The gradient restarts for each individual segment.
    PerSegment
}

Usage Examples

Example 1: Basic Section Divider

A standard gray line used to separate form sections.

C# - Basic Divider

private void CreateSectionDivider()
{
    siticoneHSeparator1.LineColor = Color.LightGray;
    siticoneHSeparator1.LineWidth = 1;
    siticoneHSeparator1.SeparatorDashStyle = CustomDashStyle.Solid;
    siticoneHSeparator1.Size = new Size(300, 10);
}

Example 2: Interactive Gradient

A stylish gradient separator that lights up on hover.

C# - Gradient & Animation

private void SetupInteractiveDivider()
{
    separator.GradientMode = LinearGradientMode.LeftToRight;
    separator.GradientStartColor = Color.Violet;
    separator.GradientEndColor = Color.Blue;
    
                // Animate to a solid bright color on hover
    separator.EnableHoverAnimation = true;
    separator.HoverColor = Color.Cyan;
}

Example 3: Ruler / Scale Display

Using segments and numbering to create a visual scale or timeline indicator.

C# - Ruler Mode

private void CreateTimeline()
{
                // Configure segments
    rulerSep.Segments = 12; // e.g., 12 months
    rulerSep.SegmentSpacing = 5;
    
                // Show numbers
    rulerSep.ShowSegmentNumbers = true;
    rulerSep.SegmentNumberColor = Color.Gray;
    rulerSep.SegmentNumberFont = new Font("Segoe UI", 7);
    
                // Visual style
    rulerSep.SeparatorDashStyle = CustomDashStyle.Solid;
    rulerSep.LineWidth = 2;
}

Example 4: Triple-Line Decorative Border

Creating a complex border effect using parallel lines and a custom dash pattern.

C# - Decorative Style

private void SetupDecorativeBorder()
{
    decoSep.ParallelLines = 3;
    decoSep.ParallelLineSpacing = 3;
    decoSep.LineWidth = 1;
    decoSep.SeparatorDashStyle = CustomDashStyle.Dot;
    decoSep.LineColor = Color.DimGray;
}

Designer Support

Includes a comprehensive Smart Tag panel for quick configuration. Check the smart tags or properties to see the available options.