在 Windows 窗体/C# 中创建动态折叠面板

Question

我需要编写一个 Windows 窗体，用户可以在其中查看按“客户”分组的许多“合同”。每个客户必须是一个展开-折叠面板，并且客户的合同必须在相应的面板内。

我已经尝试了很棒的ExpandCollapsePanel，但是当客户数量很大时，即使将 AutoScroll 属性设置为 true，面板也不会自动滚动.

有人知道其他的选择吗？请记住，面板必须是动态创建的，因为有很多客户，并且每个客户都有很多合同。

谢谢！

Answer 1

好的，我创建了一个示例，使用 ElementHost 来托管 WPF UserControl，它看起来像这样：

我已经上传了完整的源代码Here，但无论如何这些都是最相关的部分：

表格1：

public partial class Form1 : Form
{
    public CustomerContractsViewModel ContractsVM { get; set; }

    public Form1()
    {
        InitializeComponent();

        ContractsVM  = new CustomerContractsViewModel();

        var customercontractsview = new CustomerContractsView(){DataContext = ContractsVM};

        var elementHost = new ElementHost() { Dock = DockStyle.Fill };
        elementHost.Child = customercontractsview;

        panel1.Controls.Add(elementHost);
    }

    private void button1_Click(object sender, EventArgs e)
    {
        ContractsVM.LoadCustomers(DataSource.GetCustomers());
    }
}

（为简洁起见，省略了设计器代码）

WPF 视图：

<UserControl x:Class="ElementHostSamples.CustomerContractsView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <!-- This style is applied to all Label elements within the UserControl-->
        <Style TargetType="Label">
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="HorizontalAlignment" Value="Right"/>
        </Style>

        <!-- This DataTemplate will be used to render the Contract items-->
        <DataTemplate x:Key="ContractTemplate">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>

                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <Label Grid.Row="0" Grid.Column="0" Content="Contract Date:"/>
                <Label Grid.Row="1" Grid.Column="0" Content="Amount:"/>

                <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding ContractDate, StringFormat='MM/dd/yyyy'}" VerticalAlignment="Center"/>
                <TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding Amount, StringFormat=C}" VerticalAlignment="Center"/>
            </Grid>
        </DataTemplate>

        <!-- This DataTemplate will be used to render the Customer Items -->
        <DataTemplate x:Key="CustomerTemplate">
            <Expander Header="{Binding Name}">
                <ListBox ItemsSource="{Binding Contracts}" ItemTemplate="{StaticResource ContractTemplate}">
                    <ListBox.Template>
                        <ControlTemplate TargetType="ListBox">
                            <ItemsPresenter/>
                        </ControlTemplate>
                    </ListBox.Template>
                </ListBox>
            </Expander>
        </DataTemplate>
    </UserControl.Resources>

    <ListBox ItemsSource="{Binding Customers}"
             ItemTemplate="{StaticResource CustomerTemplate}"/>
</UserControl>

代码背后：

public partial class CustomerContractsView : UserControl
{
    public CustomerContractsView()
    {
        InitializeComponent();
    }
}

视图模型：

public class CustomerContractsViewModel:PropertyChangedBase
{
    public List<Customer> Customers { get; set; }

    public void LoadCustomers(List<Customer> customers)
    {
        Customers = customers;
        OnPropertyChanged("Customers");
    }
}

1234563调用”（不管那是什么意思）或背后可怕的庞大代码。并且不会强迫您在 DevExpress 或 Telerik 等第三方组件上花费大量资金。这就是为什么 WPF 是所有 .Net Windows 桌面应用程序开发的最佳选择，无论它是不是简单的 Hello World 类型的东西。

• 我使用ItemsControl 来托管Customer 项目，在这些项目中我使用带有自定义DataTemplate 的列表框来显示Contract 项目。

• ItemsControl（外部和内部）都是Virtualized，即使有 200,000 个项目，也可以立即响应。

• 请注意，没有一行代码与 UserControls 的 UI 元素交互，一切都在 XAML 中定义，并通过 DataBinding 填充数据。这使得大量的可扩展性和可维护性成为可能，因为 UI 与应用程序逻辑/业务逻辑完全解耦。这就是 WPF 的方式。

• Form代码（初始化代码除外）只与ViewModel交互，无需与WPF View交互。

• 从 winforms 升级到 WPF 时，您非常需要接受 The WPF Mentality，也就是说，如前所述，您几乎从不在过程代码中操作 UI 元素，或者使用过多隐藏代码，而是对所有内容都使用 DataBinding 并接受 The MVVM Pattern

• WPF 摇滚。下载链接的源代码并亲自查看结果。

• 如果您需要进一步的帮助，请告诉我。