使用步骤:

  1. 在项目中创建一个 MyComboBox 类,并将其继承自 ComboBox。

  2. 在 MyComboBox 类中添加 ColumnCount、AllowFuzzyQuery、DataSource 和 FuzzyQuery 等属性和方法。

  3. 在 MyComboBox 类中重写下拉框的模板,以实现分列显示。

  4. 在 XAML 中使用 MyComboBox 控件,并设置其属性和数据源。

  5. 在需要使用模糊查询功能时,调用 MyComboBox 的 FuzzyQuery 方法即可。

完整代码:

MyComboBox.cs

public class MyComboBox : ComboBox
{
    static MyComboBox()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(MyComboBox), new FrameworkPropertyMetadata(typeof(MyComboBox)));
    }

    public int ColumnCount { get; set; }
    public bool AllowFuzzyQuery { get; set; }

    private List<string> _dataSource;
    public List<string> DataSource
    {
        get { return _dataSource; }
        set
        {
            _dataSource = value;
            ItemsSource = _dataSource;
        }
    }

    public void FuzzyQuery(string keyword)
    {
        if (string.IsNullOrEmpty(keyword))
        {
            ItemsSource = _dataSource;
            IsDropDownOpen = true;
            return;
        }

        var query = from item in _dataSource
                    where item.Contains(keyword)
                    select item;

        ItemsSource = query.ToList();
        IsDropDownOpen = true;
    }
}

Generic.xaml

<Style TargetType="{x:Type local:MyComboBox}">
    <Setter Property="SnapsToDevicePixels" Value="true"/>
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
    <Setter Property="MinWidth" Value="120"/>
    <Setter Property="MinHeight" Value="20"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:MyComboBox}">
                <Grid>
                    <ToggleButton x:Name="ToggleButton"
                                  Template="{StaticResource ComboBoxToggleButton}"
                                  Grid.Column="2"
                                  Focusable="false"
                                  IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
                                  ClickMode="Press"/>

                    <ContentPresenter x:Name="ContentSite"
                                      IsHitTestVisible="False"
                                      Content="{TemplateBinding SelectionBoxItem}"
                                      ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                                      ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                      Margin="3,3,23,3"
                                      VerticalAlignment="Center"
                                      HorizontalAlignment="Left"/>

                    <Popup x:Name="Popup"
                           Placement="Bottom"
                           IsOpen="{TemplateBinding IsDropDownOpen}"
                           AllowsTransparency="True"
                           Focusable="False"
                           PopupAnimation="Slide">

                        <Grid x:Name="DropDown"
                              SnapsToDevicePixels="True"
                              MinWidth="{TemplateBinding ActualWidth}"
                              MaxHeight="{TemplateBinding MaxDropDownHeight}">

                            <Border x:Name="DropDownBorder"
                                    Background="{StaticResource WindowBackgroundBrush}"
                                    BorderThickness="1"
                                    BorderBrush="{StaticResource SolidBorderBrush}"/>

                            <ScrollViewer Margin="4,6,4,6"
                                          SnapsToDevicePixels="True">

                                <StackPanel Orientation="Horizontal">
                                    <WrapPanel Orientation="Vertical" 
                                               IsItemsHost="True"
                                               ItemWidth="{Binding ActualWidth, ElementName=DropDown, Mode=OneWay}">
                                        <WrapPanel.Resources>
                                            <Style TargetType="ContentPresenter">
                                                <Setter Property="Margin" Value="2"/>
                                            </Style>
                                        </WrapPanel.Resources>
                                    </WrapPanel>
                                </StackPanel>

                            </ScrollViewer>

                        </Grid>

                    </Popup>

                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

使用示例:

<local:MyComboBox ColumnCount="3" AllowFuzzyQuery="True" DataSource="{Binding Data}">
    <local:MyComboBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}"/>
        </DataTemplate>
    </local:MyComboBox.ItemTemplate>
</local:MyComboBox>

在这个示例中,我们设置了 ColumnCount 属性为 3,表示下拉框中要显示 3 列数据。同时,我们还设置了 AllowFuzzyQuery 属性为 True,表示启用模糊查询功能。最后,我们使用了数据绑定,将数据源绑定到了一个名为 Data 的属性上。在需要使用模糊查询功能时,调用 MyComboBox 的 FuzzyQuery 方法即可


原文地址: https://www.cveoy.top/t/topic/c3t5 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录