使用 WPF 创建类似于 Windows 资源管理器的 GUI答案

【问题标题】：Create GUI similar to Windows Explorer using WPF使用 WPF 创建类似于 Windows 资源管理器的 GUI
【发布时间】：2010-09-16 02:50:14
【问题描述】：

您将如何实现类似于 Windows 资源管理器中“我的电脑”视图的 GUI？

尤其是“图标”视图模式。包括不同项目类型的分组（如存储在此计算机上的文件/硬盘驱动器/Windows 资源管理器中具有可移动存储组的设备）

在 WinForms 中，我会为此使用 ListView，但在 WPF 中，唯一接近的是带有自定义 ControlTemplate 的列表框，但这似乎太费力了！

【问题讨论】：

标签： .net wpf user-interface

【解决方案1】：

为您的 FileSystem 类定义一个带有 HeirarchichalDataTemplate 的 TreeView

【讨论】：

【解决方案2】：

需要大量输入（约 50 行），但当您完成基本功能后，您可以轻松地执行更改项目显示或为组添加展开/折叠功能等操作，这里有一个示例（带有展开/折叠，只是为了好玩）：

首先是我们的数据对象：

public class Item
{
    public string Type { get; set; }
    public string Name { get; set; }
    public ImageSource Icon { get; set; }
}

在您的代码中创建它们并将它们的列表设置为以下窗口的 DataContext：

<Window x:Class="ListViewTest.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300" Name="W">
    <Window.Resources>
        <CollectionViewSource x:Key="Items" Source="{Binding}">
            <CollectionViewSource.GroupDescriptions>
                <PropertyGroupDescription PropertyName="Type"/>
            </CollectionViewSource.GroupDescriptions>
        </CollectionViewSource>
        <DataTemplate x:Key="ItemTemplate">
            <Grid Width="128">
                <Grid.RowDefinitions>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="12"/>
                </Grid.RowDefinitions>
                <Image Source="{Binding Icon}"/>
                <TextBlock Text="{Binding Name}" Grid.Row="1"/>
            </Grid>
        </DataTemplate>
        <ItemsPanelTemplate x:Key="ItemPanel">
            <WrapPanel Orientation="Horizontal" Width="{Binding ElementName=W, Path=ActualWidth}"/>
        </ItemsPanelTemplate>
        <DataTemplate x:Key="HeaderTemplate">
            <StackPanel Margin="0 15">
                <TextBlock Text="{Binding Name}"/>
                <Rectangle Height="1" Fill="Blue"/>
            </StackPanel>
        </DataTemplate>
        <Style x:Key="ContainerStyle" TargetType="{x:Type GroupItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Expander Header="{Binding Name}" IsExpanded="True">
                            <ItemsPresenter/>
                        </Expander>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <Grid>
        <ListBox 
            ItemsSource="{Binding Source={StaticResource Items}}"
            ItemTemplate="{StaticResource ItemTemplate}"
            ItemsPanel="{StaticResource ItemPanel}">
            <ListBox.GroupStyle>
                <GroupStyle 
                    HeaderTemplate="{StaticResource HeaderTemplate}"
                    ContainerStyle="{StaticResource ContainerStyle}"/>
            </ListBox.GroupStyle>
        </ListBox>
    </Grid>
</Window>

其中可能存在一些错误，但这是一个好的开始。

【讨论】：

【解决方案3】：

查看来自Shell MegaPack.WPF的FolderView、FileView等控件

它支持分组和图标模式（还有很多其他的东西）。

【讨论】：

【解决方案4】：

查看 Windows API 代码包： http://archive.msdn.microsoft.com/WindowsAPICodePack

还有 FolderView 和 FileView： http://visualstudiogallery.msdn.microsoft.com/E544A5BA-49EF-469D-B926-6DF9E55D9D64/ 和 http://visualstudiogallery.msdn.microsoft.com/0850E431-344D-4464-96A4-695D9A93E4A6/

【讨论】：