Shrlalgo.RvKits/Melskin/Controls/MultiComboBox.xaml

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:assists="clr-namespace:Melskin.Assists"
    xmlns:controls="clr-namespace:Melskin.Controls"
    xmlns:converters="clr-namespace:Melskin.Converters">
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="/Melskin;component/Controls/ComboBox.xaml" />
    </ResourceDictionary.MergedDictionaries>
    <Style x:Key="MultiComboBoxItemStyle" TargetType="{x:Type ListBoxItem}">
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="Padding" Value="12,4,8,4" />
        <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
        <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="FocusVisualStyle" Value="{DynamicResource FocusVisual}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                    <Grid>
                        <!--<ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center" />-->
                        <Border
                            x:Name="Bd"
                            Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="4"
                            SnapsToDevicePixels="True">
                            <ContentPresenter
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                        </Border>
                        <Border
                            x:Name="Indicator"
                            CornerRadius="4"
                            Visibility="Hidden">
                            <Border
                                Width="4"
                                Margin="2,4"
                                HorizontalAlignment="Left"
                                Background="{DynamicResource PrimaryNormalBrush}"
                                CornerRadius="2" />
                        </Border>
                        <!--<controls:IconElement
         x:Name="CheckMark"
         HorizontalAlignment="Right"
         VerticalAlignment="Center"
         FontWeight="Bold"
         Foreground="{DynamicResource PrimaryNormalBrush}"
         Symbol="Check"
         Visibility="Collapsed" />-->
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ControlBackgroundSelectedBrush}" />
                            <Setter TargetName="Indicator" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ControlBackgroundHoverBrush}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="{x:Type controls:MultiComboBox}">
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundNormalBrush}" />
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="FontSize" Value="14" />
        <Setter Property="Padding" Value="12,7" />
        <Setter Property="VerticalAlignment" Value="Center" />
        <Setter Property="assists:InputAssist.Clearable" Value="True" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.CanContentScroll" Value="True" />
        <Setter Property="ScrollViewer.PanningMode" Value="Both" />
        <Setter Property="Stylus.IsFlicksEnabled" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type controls:MultiComboBox}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="10" />
                        </Grid.ColumnDefinitions>
                        <ToggleButton
                            x:Name="PART_ToggleButton"
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            IsChecked="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                            Style="{DynamicResource ComboBoxToggleButton}" />
                        <Grid
                            x:Name="templateRoot"
                            Grid.Column="0"
                            Margin="{TemplateBinding BorderThickness}"
                            VerticalAlignment="Center"
                            ClipToBounds="True">

                            <!--  占位符 水印  -->
                            <TextBlock
                                x:Name="PlaceholderTextBlock"
                                Margin="{TemplateBinding BorderThickness}"
                                Padding="{TemplateBinding Padding}"
                                VerticalAlignment="Center"
                                Foreground="{DynamicResource TextPlaceholderBrush}"
                                IsHitTestVisible="False"
                                Text="{Binding PlaceHolderText, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}}">
                                <TextBlock.Style>
                                    <Style TargetType="TextBlock">
                                        <Setter Property="Visibility" Value="Collapsed" />
                                        <Style.Triggers>
                                            <!--  多选：无标签  -->
                                            <MultiDataTrigger>
                                                <MultiDataTrigger.Conditions>
                                                    <Condition Binding="{Binding SelectionMode, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}}" Value="{x:Static SelectionMode.Multiple}" />
                                                    <Condition Binding="{Binding HasItems, ElementName=TagItemsControl}" Value="False" />
                                                    <!--<Condition Binding="{Binding SelectedItems.Count, RelativeSource={RelativeSource AncestorType=local:NeuComboBox}, TargetNullValue=0}" Value="0" />-->
                                                </MultiDataTrigger.Conditions>
                                                <Setter Property="Visibility" Value="Visible" />
                                            </MultiDataTrigger>
                                            <!--  单选：未选  -->
                                            <MultiDataTrigger>
                                                <MultiDataTrigger.Conditions>
                                                    <Condition Binding="{Binding SelectionMode, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}}" Value="{x:Static SelectionMode.Single}" />
                                                    <Condition Binding="{Binding SelectedItem, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}}" Value="{x:Null}" />
                                                </MultiDataTrigger.Conditions>
                                                <Setter Property="Visibility" Value="Visible" />
                                            </MultiDataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </TextBlock.Style>
                            </TextBlock>

                            <!--  多选 Tag 列表  -->
                            <!--<ItemsControl x:Name="TagItemsControl" ItemsSource="{Binding SelectedItems, Mode=OneWay, RelativeSource={RelativeSource AncestorType=local:NeuComboBox}}">-->
                            <ItemsControl x:Name="TagItemsControl" ItemsSource="{Binding ElementName=PART_ListBox, Path=SelectedItems}">
                                <ItemsControl.Style>
                                    <Style TargetType="ItemsControl">
                                        <Setter Property="Visibility" Value="Collapsed" />
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding SelectionMode, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}}" Value="{x:Static SelectionMode.Multiple}">
                                                <Setter Property="Visibility" Value="Visible" />
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </ItemsControl.Style>
                                <!--  标签滚动，但是有bug 影响选择  -->
                                <!--<ItemsControl.Template>
                                        <ControlTemplate>
                                            <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
                                                <ItemsPresenter />
                                            </ScrollViewer>
                                        </ControlTemplate>
                                    </ItemsControl.Template>-->
                                <ItemsControl.ItemsPanel>
                                    <ItemsPanelTemplate>
                                        <WrapPanel IsItemsHost="True" />
                                    </ItemsPanelTemplate>
                                </ItemsControl.ItemsPanel>
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <controls:Tag
                                            Margin="1"
                                            Closable="True"
                                            Content="{Binding}" />
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                            <ContentPresenter
                                Margin="{TemplateBinding Padding}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Content="{Binding SelectedItem, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}}"
                                ContentStringFormat="{Binding DisplayMemberPath, RelativeSource={RelativeSource TemplatedParent}}"
                                IsHitTestVisible="False"
                                Visibility="{Binding SelectionMode, RelativeSource={RelativeSource AncestorType=controls:MultiComboBox}, Converter={x:Static converters:ComparisionToVisibilityConverter.Instance}, ConverterParameter={x:Static SelectionMode.Single}}" />
                        </Grid>
                        <Popup
                            x:Name="dropDownBorder"
                            Grid.Column="0"
                            MinWidth="{Binding ActualWidth, ElementName=PART_ToggleButton}"
                            Margin="-8"
                            assists:BehaviorAssist.SimulateNativeBehavior="True"
                            AllowsTransparency="True"
                            IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}"
                            Placement="Bottom"
                            PlacementTarget="{Binding ElementName=PART_ToggleButton}"
                            PopupAnimation="Slide"
                            StaysOpen="True"
                            VerticalOffset="4">
                            <Border
                                MinWidth="{Binding ActualWidth, ElementName=templateRoot}"
                                MaxHeight="{TemplateBinding MaxDropDownHeight}"
                                Margin="8"
                                Background="{DynamicResource BackgroundLayoutBrush}"
                                BorderBrush="{DynamicResource BorderNormalBrush}"
                                BorderThickness="1"
                                CornerRadius="4"
                                Effect="{DynamicResource PopupShadow}">
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                        <!--  用于 TextBox  -->
                                        <RowDefinition Height="*" />
                                        <!--  用于 ListBox，占据剩余空间  -->
                                    </Grid.RowDefinitions>

                                    <TextBox
                                        x:Name="PART_FilterTextBox"
                                        Grid.Row="0"
                                        Margin="6,6,6,2"
                                        Padding="4,2"
                                        VerticalAlignment="Top"
                                        assists:InputAssist.Clearable="{TemplateBinding assists:InputAssist.Clearable}"
                                        Text="{Binding FilterText, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}"
                                        Visibility="{Binding IsFilteringEnabled, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static converters:BooleanToVisibilityConverter.CollapsedInstance}}">
                                        <assists:InputAssist.Suffix>
                                            <controls:IconElement
                                                Width="16"
                                                Height="16"
                                                Margin="4,2,2,0"
                                                Foreground="{DynamicResource TextSecondaryBrush}"
                                                Symbol="Search" />
                                        </assists:InputAssist.Suffix>
                                    </TextBox>
                                    <ListBox
                                        x:Name="PART_ListBox"
                                        Grid.Row="1"
                                        Background="{DynamicResource BackgroundFloatingBrush}"
                                        BorderThickness="0"
                                        DisplayMemberPath="{Binding DisplayMemberPath, RelativeSource={RelativeSource TemplatedParent}}"
                                        ItemContainerStyle="{StaticResource MultiComboBoxItemStyle}"
                                        ItemsSource="{Binding FilteredItems, RelativeSource={RelativeSource TemplatedParent}}"
                                        SelectionMode="{Binding SelectionMode, RelativeSource={RelativeSource TemplatedParent}}" />
                                </Grid>
                            </Border>
                        </Popup>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>