WPF 显示文件列表中使用 ListBox 变到ListView 最后使用DataGrid

时间:2023-03-08 21:31:22
WPF 显示文件列表中使用 ListBox 变到ListView 最后使用DataGrid

      WPF 显示文件列表中使用 ListBox 变到ListView 最后使用DataGrid

故事背景:

  需要检索某目录下文件,并列出来,提供选择和其他功能。

第一版需求:

  列出文件供选择即可,代码如下:

<ListBox Name="multiSelectFileLst" ItemsSource="{Binding FileList}" Grid.Row="" Grid.Column="" >
<ListBox.ItemTemplate >
<DataTemplate >
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Border Margin="5,1,5,1" Padding="" BorderBrush="Green" BorderThickness="" CornerRadius="">
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="" ></ColumnDefinition>
<ColumnDefinition Width="Auto" ></ColumnDefinition>
<ColumnDefinition Width="" ></ColumnDefinition>
</Grid.ColumnDefinitions> <CheckBox Content="{Binding FileName}" ToolTip="{Binding FileName}" IsChecked="{Binding IsSelected}"/>
<Button Content="查看" Width="" HorizontalAlignment="Left" Grid.Column=""
Command="{Binding DataContext.OpenFileCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}" CommandParameter="{Binding ExcelFilePath}" /> </Grid>
</Border>
</Grid> </DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

可取之处:

  使用Border 画的边框还不错。

第二版需求:

  需要添加文件的目录一项,因此要添加列标题,该用ListView实现,改动较小:

  

<ListView Name="multiSelectFileLst" ItemsSource="{Binding FileList}" Grid.Row="" Grid.Column="" >
<ListView.View>
<GridView >
<GridViewColumn Header="文件名">
<GridViewColumn.CellTemplate>
<DataTemplate>
<CheckBox Content="{Binding FileName}" ToolTip="{Binding FileName}" IsChecked="{Binding IsSelected}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="文件目录">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding FolderPath}" ToolTip="{Binding FolderPath}" Foreground="Black" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="查看文件">
<GridViewColumn.CellTemplate>
<DataTemplate>
<Button Content="查看" Width="" HorizontalAlignment="Left"
Command="{Binding DataContext.OpenFileCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}" CommandParameter="{Binding ExcelFilePath}" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>

最后,个人觉得默认样式不好看,改为使用actiprosoftware的ThemedDataGrid:

  

<datagrid:ThemedDataGrid Name="multiSelectFileLst" ItemsSource="{Binding FileList}" Grid.Row="" Grid.Column=""
AutoGenerateColumns="False" CanUserAddRows="False" CanUserResizeRows="False" CanUserDeleteRows="False"
AreRowDetailsFrozen="False" CanUserSortColumns="False" CanUserReorderColumns="False"
HeadersVisibility="Column" SelectionUnit="FullRow"
> <datagrid:ThemedDataGrid.Columns>
<DataGridTemplateColumn Header="文件名" IsReadOnly="True" Width="auto">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<CheckBox Content="{Binding FileName}" ToolTip="{Binding FileName}" IsChecked="{Binding IsSelected}" Margin="0,0,20,0" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn >
<DataGridTemplateColumn Header="文件目录" IsReadOnly="True" Width="auto" >
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding FolderPath}" ToolTip="{Binding FolderPath}" Margin="20,0,20,0" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn >
<DataGridTemplateColumn Header="查看文件" IsReadOnly="True" Width="" >
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button Content="查看" HorizontalAlignment="Left" Width=""
Command="{Binding DataContext.OpenFileCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}"
CommandParameter="{Binding ExcelFilePath}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn >
</datagrid:ThemedDataGrid.Columns>
</datagrid:ThemedDataGrid>

其中存在疑问:ListBox中的模板长度设置,没有随界面缩放,后续解决了补上。