WPF——GridView

24 篇文章 16 订阅

一、前言

项目中要用到一个数据分页栏,虽然自己没有实现过,但凭经验感觉它和ListBox/ListView有关。于是去网上搜了下WPF 数据分页栏,果然很多实现都用到了ListView。于是拣了一种比较简单的实现学习,其中包含下面代码:

		<ListView Grid.Row="1" ItemsSource="{Binding UserList}">
            <ListView.View>
                <GridView>
                    <GridView.Columns>
                        <GridViewColumn DisplayMemberBinding="{Binding UserName}" Header="用户名"/>
                        <GridViewColumn DisplayMemberBinding="{Binding Password}" Header="密码"/>
                        <GridViewColumn DisplayMemberBinding="{Binding Level}" Header="权限等级"/>
                    </GridView.Columns>
                </GridView>
            </ListView.View>
        </ListView>

ListView.View的标签内出现了GridView。
在我印象中Grid是网格式的,而List是列表式的,所以我很好奇两者为什么可以混到一起。当然从类的关系上来看,应该是两者都继承了一个共同的父类。那么为了能使用起来更“自如”,对GridView有个系统的了解,还是有必要学习一下。

二、GridView

2.1. 概述

GridView视图模式是ListView控件的视图模式中的一种。GridView及其辅助类能让你在表中来查看集合中的数据项,且可以通过表头来进行交互(表头是个按钮,可以给它加各种交互功能,如排序)。

2.2. GridView是什么?

GridView视图模式通过给列绑定数据字段和显示列标题来标识字段来显示数据项列表(说白了就是给一列数据加个标题header来说明这列数据是什么,然后将数据集合绑定到这列数据下面,一列数据就自动呈现出来了)。默认的GridView样式将按钮实现为列标题。

列标题header
成员1P1

所谓列标题可以理解为表头。
通过对列标题使用按钮,你能实现用户交互功能。例如,单击列标题来给某一列的内容进行排序。

注意:
GridView给列标题使用的Button控件就是ButtonBase的派生类。

下图是一个ListView的GridView视图展示:
在这里插入图片描述
下面介绍它的常用功能(或者说特性),如果你用过Excel的话,会发现这些都是熟悉的功能。

  • GridView列由GridViewColumn对象表示,能根据其内容自动调整大小,你也可以显示地指定GridViewColumn的宽度。
  • 你可以在表头间拖动来调整列的大小。
  • 可以动态的增、删、替换和重新排列,这些都是GridView内置的功能

不过,GridView不能直接更新它显示的数据。

下面示例展示了如何定义一个显示employee类型数据的GridView。本例中,ListView将EmployeeInfoDataSource定义为ItemsSource。DisplayMemberBinding属性定义将GridViewColumn的内容绑定到EmployeeInfoDataSource的数据成员。

注意:
上面这段话用“定义”这个词,而不是设置(其实从理解角度讲都行)。
转换成后端代码表示的话,定义就更加好理解了。
后文也有反复出现定义一词,有时候换成设置更好理解。
<ListView ItemsSource="{Binding Source={StaticResource EmployeeInfoDataSource}}">

    <ListView.View>

        <GridView AllowsColumnReorder="true" ColumnHeaderToolTip="Employee Information">

            <GridViewColumn DisplayMemberBinding="{Binding Path=FirstName}" Header="First Name" Width="100"/>

            <GridViewColumn DisplayMemberBinding="{Binding Path=LastName}" Width="100">
                <GridViewColumnHeader>Last Name
                    <GridViewColumnHeader.ContextMenu>
                        <ContextMenu MenuItem.Click="LastNameCM_Click" Name="LastNameCM">
                            <MenuItem Header="Ascending" />
                            <MenuItem Header="Descending" />
                        </ContextMenu>
                    </GridViewColumnHeader.ContextMenu>
                </GridViewColumnHeader>
            </GridViewColumn>

            <GridViewColumn DisplayMemberBinding="{Binding Path=EmployeeNumber}" Header="Employee No." Width="100"/>
        </GridView>

    </ListView.View>
</ListView>

下图展示了上面示例创建的表。GridView控件显示了来自ItemSource的数据:
在这里插入图片描述

2.3. GridView布局与样式

GridViewColumn的列单元格和列标题具有相同的宽度。默认情况下,每个列都会调整其宽度以适应其内容。当然,你也可以为其设置固定宽度。相关数据内容显示在水平行中。例如,在上面图示中,每个员工(employee类型)的姓(last name)、名(first name)和ID都作为一个集合被显示,因为它们在一个行中。

其实就是把集合元素中的数据平铺到一行来显示。
employee
{
	FirstName
	LastName     => FirstName | LastName | ID
	ID
}

2.3.1. 在GridView中定义与样式化列

当定义数据字段在GridViewColumn中显示时,使用DisplayMemberBinding、CellTemplate或CellTemplateSelector属性。优先使用DisplayMemberBinding属性。

要指定GridView列中的内容对齐方式,需定义CellTemplate。不要对使用GridView显示的ListView内容使用HorizontalContentAlignment和VerticalContentAlignment属性。

若要为列标题(表头)指定模板和样式属性,需使用GridViewGridViewColumn和GridViewColumnHeader类。

2.3.2. 添加可视化元素到GridView

要在GridView视图中添加可视化元素,如CheckBox和Button控件,需使用模板或样式。

若你显式地将可视化元素定义为数据项,则它只能在GridView中出现一词。存在这种限制是因为一个元素只能有一个父亲。

2.3.3. GridView中设置行样式

使用GridViewRowPresenter 和GridViewHeaderRowPresenter 类来格式化和显示GridView的行。

2.3.4. ItemContainerStyle中的对齐问题

为了防止列标题和单元格之间的对齐问题,不要设置或指定影响ItemContainerStyle中项宽度的属性或模板。例如,不要设置Margin属性或指定一个ControlTemplate来将CheckBox添加到定义在ListView控件上的ItemContainerStyle中。取而代之,应该在定义GridView视图模式的类上指定属性或模板来直接影响列宽。

例如,要将CheckBox添加到GridView视图模式的行中,请将CheckBox添加到DataTemplate中,然后将CellTemplate属性设置为该DataTemplate。

2.4. 与GridView进行用户交互

当你在程序中使用了GridView时,用户可以与GridView交互并修改其格式。例如,用户可以重新排序列(拖动表头使整列移动)、调整列的大小、选中表中的项和滚动内容。你还可以定义用户单击列标题时响应的事件处理程序。事件处理程序可以执行类似于根据列内容对显示在GridView中的数据进行排序的操作。

下面列表详细讨论了使用GridView进行用户交互的功能:

  • 通过拖放对列重新排序
    当光标位于表头上时,用户可以按下鼠标左键,然后将该列拖动到新位置,从而对GridView的列进行重新排序。当用户拖动表头时,会显示标题的浮动列以及一条显示插入位置的实线。
    若你想要修改标题的浮动列样式,可以为GridViewColumnHeader指定一个ControlTemplate,当Role属性设置为Floating时将触发。
  • 根据列中内容调整列大小
    用户可以双击列标题右侧的钳子来调整列的大小以适应其内容。
    你可以将Width属性设置为Double.NaN来产生同样的效果。
  • 选中行项
    用户可以选择GridView的一个或多个项。
    如果要更改选中项的样式,请参见ListView中使用触发器对选中项进行样式设置。
  • 滚动查看内容
    若GridView的大小不足以显示所有项,用户可以使用ScrollViewer控件提供的滚动条水平或垂直滚动。若所有内容一开始都可见,滚动条将被隐藏。
  • 通过单击列标题按钮与列交互
    当用户单击列标题按钮时,如果你提供了排序算法,则可以对列中显示的数据进行排序。
    你可以自定义标题按钮的Click事件,以便提供排序算法之类的功能。若要为单个列表头处理Click事件,需在GridViewColumnHeader上设置事件处理程序。若要为所有列表头设置处理Click事件的事件处理程序,可在ListView控件上设置该处理程序。

2.5. 其它自定义View

GridView类派生自ViewBase抽象类,它只是ListView类的视图模式之一。你可以通过派生自ViewBase类来为ListView创建其它自定义的View。

三、结语

本文主要是功能上的介绍,并没有对其辅助类、方法实现、代码层面进行细致分析。
不过对于应用来讲,这种轮廓型的学习应该优先,而后遇到细节上的问题,再逐渐深入。
另外我以前用过Qt中的数据模型(Model)&数据视图(View),现在给我的感觉就是这类官方提供的View类型,通常内部帮你实现了许多方法,对于简单的使用,你只需要把数据源丢进去即可。

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在WPF中实现GridView的行合并可以通过使用DataTemplateSelector和GridViewGroupStyle来实现。 首先,我们需要创建一个继承自DataTemplateSelector的类,该类将用于根据数据项的特定条件选择合适的数据模板。在这个类中,我们可以重写SelectTemplate方法,根据需要合并的行来选择不同的数据模板。 接下来,在XAML中定义GridView时,我们可以使用ItemsPanel来定义GridView的布局,例如使用StackPanel来垂直排列行。然后,我们需要使用GroupStyle属性来定义合并行的样式。在GroupStyle中,我们可以使用HeaderTemplate来定义组的标题,同时还可以设置HeaderContainerStyle来自定义标题的样式。 在数据绑定方面,我们需要使用CollectionViewSource来对数据进行分组。我们可以使用GroupDescription属性来指定分组的属性,同时还可以使用GroupStyleSelector属性来指定分组的样式。 最后,在合适的位置使用我们定义的DataTemplateSelector类,将其赋值给GridView的ItemTemplateSelector属性,以便根据条件选择合适的数据模板来实现行的合并效果。 通过以上的步骤,我们就可以实现在WPF中使用GridView实现行合并的效果了。注意,具体的实现可能会因具体的业务需求而有所不同,以上只是一个大致的指导思路。 ### 回答2: 在WPF中,GridView(网格视图)是用于显示和管理数据的控件之一。虽然GridView本身并不直接支持行合并的功能,但我们可以通过一些技巧和代码逻辑来实现行合并的效果。 首先,我们可以使用DataTemplateSelector来自定义每个单元格的显示方式。通过继承DataTemplateSelector并重写SelectTemplate方法,我们可以根据数据项的不同来选择不同的数据模板。在数据模板中,我们可以将需要合并的行的单元格设置为透明或者空白,以达到行合并的效果。 其次,我们可以使用自定义的GroupStyle来实现行合并。我们可以通过创建一个名为"GroupStyle"的GroupStyleCollection,并向其中添加一个自定义的GroupStyle。在该GroupStyle中,我们可以指定该分组的HeaderTemplate,并在HeaderTemplate中使用Grid控件来实现合并行的效果。通过调整Grid控件的行和列的合并方式以及合并的单元格范围,我们可以将多行合并为一行。 最后,我们还可以使用第三方的扩展库来实现行合并的功能。例如,可以使用Syncfusion公司的WPF控件库中的GridGroupingControl控件来实现行合并效果。该控件具有内置的行合并功能,并且可以通过简单的设置和配置来实现。 总之,要在WPF中实现GridView的行合并效果,我们可以通过使用DataTemplateSelector、自定义GroupStyle或者借助第三方的扩展库来达到我们的目的。根据具体的需求和项目的复杂程度,我们可以选择合适的方法来实现行合并功能。 ### 回答3: WPFGridView控件是用于显示和编辑数据的强大工具,但是它本身不支持行的合并操作。但是我们可以通过一些技巧来实现合并行的效果。 一种常见的实现合并行的方法是使用自定义DataTemplate。我们可以通过使用Grid或StackPanel等容器控件来自定义每个单元格的布局,并使用数据绑定来填充每个单元格的数据。然后,根据需要合并行的内容,我们可以使用多个数据绑定来显示相同的内容。 另一种实现合并行的方法是使用自定义的数据逻辑。我们可以通过从数据源中检查相邻行的值来判断行是否应该合并。然后,我们可以在GridView的LoadingRow事件中动态设置RowSpan属性来实现行的合并操作。 以下是一个示例展示如何使用自定义的数据逻辑来实现行的合并: ``` private void GridView_LoadingRow(object sender, DataGridRowEventArgs e) { // 获取当前行和上一行的数据 YourData currentItem = e.Row.DataContext as YourData; YourData previousItem = (YourData)GridView.Items[GridView.Items.Count - 1]; if (previousItem != null && currentItem != null) { // 检查行是否应该合并 if (currentItem.SomeProperty == previousItem.SomeProperty) { // 设置前一行的RowSpan属性 e.Row.Header = ""; e.Row.HeaderTemplate = null; e.Row.HeaderStyle = null; Grid.SetRowSpan(e.Row, 2); } } } ``` 以上是使用两种常见的方法来合并行的示例。当然,具体的实现方式还可以根据具体需求进行调整。希望能对你有所帮助!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值