Siticone GroupChip

The SiticoneGroupChip is an advanced interactive element designed for filtering, choice selection, and categorization. Unlike the standard Chip, the GroupChip includes features specifically designed for grouped layouts, such as integrated badges, checkmark positioning, and automatic corner rounding.

While it can be used standalone, it is designed to work seamlessly with the SiticoneGroupChipPanel for managing selection logic automatically.

Visual Customization

Control the shape and color palette of the chip.

Property	Type	Description & Usage Example
`RoundedCorners`	bool	chip.RoundedCorners = true; If true, automatically maximizes the corner radius to create a pill/capsule shape. Overrides individual corner radius properties.
`FillColor`	Color	chip.FillColor = Color.WhiteSmoke; Background color in the normal (unselected) state.
`SelectedFillColor`	Color	chip.SelectedFillColor = Color.DodgerBlue; Background color when `IsSelected` is true.
`AccentColor`	Color	chip.AccentColor = Color.DodgerBlue; Primary theme color used for borders, ripples, and focus states.

Badge System

The GroupChip includes a built-in notification badge, ideal for displaying counts (e.g., "Messages [5]") or status indicators.

Property	Type	Description & Usage Example
`BadgeText`	string	chip.BadgeText = "5"; The text/number inside the badge. If empty, the badge is hidden.
`BadgeBackColor`	Color	chip.BadgeBackColor = Color.Red; Background color of the badge pill.
`BadgeAlign`	BadgeAlignment	chip.BadgeAlign = BadgeAlignment.AfterText; Position of the badge relative to the main text (`BeforeText` or `AfterText`).

Selection & Checkmarks

Configure how the selection state is visually represented.

Property	Type	Description & Usage Example
`IsSelected`	bool	chip.IsSelected = true; Current selection state. Toggles visual colors and checkmark visibility.
`ShowCheckmark`	bool	chip.ShowCheckmark = true; If true, an animated checkmark appears when selected.
`CheckmarkPosition`	CheckmarkPositionEnum	chip.CheckmarkPosition = CheckmarkPositionEnum.BeforeText; Controls where the checkmark appears: `BeforeText`: Standard left-side icon. `AfterText`: Right-side icon.
`CheckmarkHandleLength`	float	chip.CheckmarkHandleLength = 1.2f; Adjusts the visual style of the checkmark tick (0.5 to 1.5).

Performance

UltraFastPerformance

// Enable for lists containing hundreds of items
groupChip1.UltraFastPerformance = true;

When enabled, disables high-cost animations (ripples, smooth opacity fades) and uses optimized GDI+ rendering settings. Essential for large data grids.

Detailed Examples

Example 1: Filter Chip with Badge

Creates a filter chip that shows a count of results.

C# - Badge Configuration

private void CreateCategoryChip()
{
    var chip = new SiticoneGroupChip();
    chip.Text = "Notifications";
    chip.RoundedCorners = true;
    
                // Visuals
    chip.FillColor = Color.WhiteSmoke;
    chip.SelectedFillColor = Color.DodgerBlue;
    chip.SelectedTextColor = Color.White;
    
                // Configure Badge
    chip.BadgeText = "12";
    chip.BadgeBackColor = Color.Red;
    chip.BadgeForeColor = Color.White;
    chip.BadgeAlign = SiticoneGroupChip.BadgeAlignment.AfterText;
    
                // Selection settings
    chip.ShowCheckmark = true;
    chip.CheckmarkPosition = SiticoneGroupChip.CheckmarkPositionEnum.BeforeText;
    
    this.Controls.Add(chip);
}

Example 2: Customizing the Checkmark

Demonstrates how to alter the checkmark style for a unique look.

C# - Checkmark Styling

// Create a "Done" chip style
chip.Text = "Task Completed";
chip.IsSelected = true;

// Custom checkmark styling
chip.CheckmarkColor = Color.LightGreen;
chip.CheckmarkWidth = 24;
chip.CheckmarkThickness = 3.0f;
chip.CheckmarkHandleLength = 1.2f; // Longer "tail" on the check

// Positioning
chip.TextAlign = HorizontalAlignment.Left;
chip.CheckmarkPosition = SiticoneGroupChip.CheckmarkPositionEnum.AfterText;

Example 3: Event Handling

C# - Events

// Handle selection changes
chip.SelectionChanged += (sender, e) => 
{
                var c = sender as SiticoneGroupChip;
                if (c.IsSelected)
    {
                Console.WriteLine($"Filter Applied: {c.Text}");
                // Example: Update database query
    }
};

// Handle close button (if enabled)
chip.ShowCloseButton = true;
chip.CloseClicked += (sender, e) => 
{
                // Logic to remove filter
                RemoveFilter(((SiticoneGroupChip)sender).Text);
};