Skip to content

It is used to indicate the item selected by the user. Compared with the text, Tag has additional interaction.

cs
public class Tag : ContentControl

Attributes

PropertyDescriptionDefault ValueRemarks
ShowCloseButtonWhether to display the delete (close) buttontrue
SelectableWhether to support selectionfalse
IsSelectedIs selectedfalse
HeaderTemplate
HeaderTemplateSelector
HeaderStringFormat
TagContainer.ShowCloseButton
Header

Events

NameDescription
SelectedTriggered when the label is selected
ClosingTriggered when the label is closed
ClosedTriggered after the label is closed

Attributes

PropertyDescriptionDefault ValueRemarks
ShowAddButtonWhether to display the new label buttonfalse
TagMarginTag MarginThickness(5)

Events

NameDescription
AddTagButtonClickTriggered when a tag is added

Case

xml
<hc:TagContainer Name="Container1" Margin="11" Width="420" Padding="5">
                <hc:Tag Margin="5" ShowCloseButton="False" Content="Text"/>
                <hc:Tag Header="H" hc:TitleElement.Background="{DynamicResource PrimaryBrush}" Margin="5" ShowCloseButton="False" Content="Text"/>
                <hc:Tag Margin="5" Selectable="True" Content="Text"/>
                <hc:Tag Margin="5" ShowCloseButton="False" Content="Text"/>
                <hc:Tag Margin="5" Content="Text"/>
                <hc:Tag Margin="5" IsSelected="True" Selectable="True" ShowCloseButton="False" Content="Text"/>
                <hc:Tag Margin="5" Content="Text"/>
                <hc:Tag Margin="5" ShowCloseButton="False" Content="Text"/>
                <hc:Tag Margin="5" IsSelected="True" Selectable="True" Content="Text"/>
                <hc:Tag Margin="5" ShowCloseButton="False" Content="Text">
                    <hc:Tag.Header>
                        <Image Source="/Resources/Img/Album/1.jpg"/>
                    </hc:Tag.Header>
                </hc:Tag>
                <hc:Tag Margin="5" IsSelected="True" Selectable="True" Content="Text">
                    <hc:Tag.Header>
                        <Image Source="/Resources/Img/Avatar/avatar2.png"/>
                    </hc:Tag.Header>
                </hc:Tag>

Tag

Released under the MIT License.