ChipGroup

A Chip Group gathers together a set of Chips.

Properties

SelectedValues - IEnumerable

Gets the values where IsToggled is true.

MaxRowsBeforeOverflow - int

Gets or sets the number of rows before overflow occurs. Default is -1.

IsOverflow - bool

Gets or sets a value that indicates whether the group is set to overflow or not.

IsSingleSelection - bool

Gets or sets a value that indicates if the group can only have one chip selected at a time.

Spacing - Thickness

Gets or sets the spacing of the chips within the group. Default is Thickness(8,8,8,0).

Example Styles

var chipGroup = new ChipGroup
            {
                MaxRowsBeforeOverflow = 3,
                Children = {
                    chip1, chip2
                }
            };

<aurora:ChipGroup x:Name="chipGroup" MaxRowsBeforeOverflow="2">
                <aurora:Chip x:Name="Chip0" Text="All" EmbeddedImageName="device.svg" IsSingleSelection="True" />
                <aurora:Chip x:Name="Chip1" Text="Item 1" EmbeddedImageName="device.svg" IsRemovable="True" />
                <aurora:Chip x:Name="Chip2" Text="Item 2 More" Shape="RoundedRectangle" CornerRadius="3" BackgroundColor="Blue" BorderSize="2" BorderColor="Fuchsia" />
                <aurora:Chip x:Name="Chip3" Shape="Rectangle" IsIconifiedText="True" Text="I {{icofont.ttf ec1e color=ff0000}} to {{icofont.ttf eeea}}" BorderColor="Yellow" BackgroundColor="Blue" />
                <aurora:Chip x:Name="Chip4" Text="Item 423" BorderColor="Pink" BackgroundColor="Silver" />
                <aurora:Chip x:Name="Chip5" IsIconifiedText="True" Text="I {{icofont.ttf ec1e color=ff0000}} to {{icofont.ttf eeea}}" BorderColor="Yellow" BackgroundColor="Purple" />
            </aurora:ChipGroup>