-2

ComboBox 可能有很多项目。

这是我想要实现的场景：

我必须创建一个自定义ComboBox，它有一个位于最后一个ComboBox项目的“更多”按钮。如果ComboBox包含 20 项，最初ComboBox单击 并显示下拉列表时，只有 10 项，并显示第 10 项下的“更多”按钮。

每当单击“更多”按钮项目时，“更多”按钮将变为“更少”，下拉列表将显示总共 20 个项目。因此，当单击“减少”按钮时，显示项目将反转回 10 个项目，另外 10 个项目将被隐藏。

10 个初始显示项目只是一个示例。实际上，ComboBox's可以通过属性设置初始显示项的总数。

例如： <local:CustomComboBox x:Name="CustomComboBox" InitialDisplayItem="10" />

我是 wpf 的新手......我怎样才能做到这一点？

4

1 回答 1

3

创建一个自定义控件，例如：

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

    public int InitialDisplayItem
    {
        get { return (int)GetValue(InitialDisplayItemProperty); }
        set { SetValue(InitialDisplayItemProperty, value); }
    }

    // Using a DependencyProperty as the backing store for InitialDisplayItem.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty InitialDisplayItemProperty =
        DependencyProperty.Register("InitialDisplayItem", typeof(int), typeof(CrazyCombo), new UIPropertyMetadata(0));

    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();

        var moreLessButton = Template.FindName("moreLessButton", this) as Button;

        moreLessButton.Click += new RoutedEventHandler(moreLessButton_Click);
    }

    void moreLessButton_Click(object sender, RoutedEventArgs e)
    {
        var moreLessButton = Template.FindName("moreLessButton", this) as Button;

        if (moreLessButton.Content.ToString() == "More")
        {
            var icv = CollectionViewSource.GetDefaultView(Items);

            icv.Filter = null;
            moreLessButton.Content = "Less";
        }
        else
        {
            var icv = CollectionViewSource.GetDefaultView(Items);

            icv.Filter += o => Items.OfType<object>().Take(InitialDisplayItem).Contains(o);

            moreLessButton.Content = "More";
        }
    }

    protected override void OnItemsSourceChanged(System.Collections.IEnumerable oldValue, System.Collections.IEnumerable newValue)
    {
        base.OnItemsSourceChanged(oldValue, newValue);

        var icv = CollectionViewSource.GetDefaultView(Items);

        icv.Filter += o => Items.OfType<object>().Take(InitialDisplayItem).Contains(o);
    }

}

在 generic.xaml 中，您需要为标准组合框输入整个样式，您可以使用 blend 来获取它。我不会发布它，因为它是huuuuuggge。您将需要更改以下部分：

更改样式以指向您的自定义控件，即

 <Style TargetType="{x:Type local:CrazyCombo}">

在组合框中弹出添加更多/更少按钮

<Popup x:Name="PART_Popup" AllowsTransparency="true" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom">
                        <Microsoft_Windows_Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{Binding ActualWidth, ElementName=MainGrid}">
                            <Border x:Name="DropDownBorder" BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" BorderThickness="1" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
                                <StackPanel>
                                    <ScrollViewer x:Name="DropDownScrollViewer">
                                        <Grid RenderOptions.ClearTypeHint="Enabled">
                                            <Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
                                                <Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=DropDownBorder}" Height="{Binding ActualHeight, ElementName=DropDownBorder}" Width="{Binding ActualWidth, ElementName=DropDownBorder}"/>
                                            </Canvas>
                                            <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                        </Grid>
                                    </ScrollViewer>
                                    <Button Name="moreLessButton" Content="More"/>
                                </StackPanel>
                            </Border>
                        </Microsoft_Windows_Themes:SystemDropShadowChrome>
                    </Popup>

标准组合框控件模板的唯一添加是行

<Button Name="moreLessButton" Content="More"/>

然后，您可以使用自定义控件，例如

<Window x:Class="WpfApplication4.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfApplication4"
    Title="MainWindow" Height="350" Width="525" Foreground="red">

<StackPanel>

    <local:CrazyCombo x:Name="bah" ItemsSource="{Binding Foo}" InitialDisplayItem="1"/>

</StackPanel>

如果您要真正执行此操作，您将向按钮添加一些触发器，以便它仅在有更多项目时才显示，然后是“InitialDisplayItem”。您可能还会将该按钮设置为切换按钮，而不是我愚蠢的开关代码。

于 2012-07-27T04:58:28.463 回答