讓WPF中的DataGrid像Excel一樣可以篩選

来源:https://www.cnblogs.com/hsiang/archive/2023/02/28/17162319.html
-Advertisement-
Play Games

在預設情況下，WPF提供的DataGrid僅擁有數據展示等簡單功能，如果要實現像Excel一樣複雜的篩選過濾功能，則相對比較麻煩。本文以一個簡單的小例子，簡述如何通過WPF實話DataGrid的篩選功能，僅供學習分享使用，如有不足之處，還請指正。 ...


在預設情況下，WPF提供的DataGrid僅擁有數據展示等簡單功能，如果要實現像Excel一樣複雜的篩選過濾功能，則相對比較麻煩。本文以一個簡單的小例子，簡述如何通過WPF實話DataGrid的篩選功能，僅供學習分享使用，如有不足之處，還請指正。

涉及知識點

在本示例中，從數據綁定，到數據展示，涉及知識點如下所示：

  • DataGrid，要WPF提供的進行二維數據展示在列表控制項，預設功能非常簡單，但是可以通過數據模板或者控制項模板進行擴展和美化，可伸縮性很強。
  • MVVM，是Model-View-ViewModel的簡寫，主要進行數據和UI進行前後端分離，在本示例中，主要用到的MVVM第三方庫為CommunityToolkit.Mvvm，大大簡化原生MVVM的實現方式。
  • 集合視圖， 要對 DataGrid 中的數據進行分組、排序和篩選，可以將其綁定到支持這些函數的 CollectionView。 然後，可以在不影響基礎源數據的情況下處理 CollectionView 中的數據。 集合視圖中的更改反映在 DataGrid 用戶界面 (UI) 中。
  • Popup控制項，直接繼承FrameworkElement，提供了一種在單獨的視窗中顯示內容的方法，該視窗相對於指定的元素或屏幕坐標，浮動在當前Popup應用程式視窗上，可用於懸浮視窗。

示例截圖

本示例主要模仿Excel的篩選功能進行實現，右鍵標題欄打開浮動視窗，懸浮於標題欄下方，既可以通過文本框進行篩選，也可以通過篩選按鈕彈出右鍵菜單，選擇具體篩選方式，截圖如下所示：

 

選擇篩選方式，彈出視窗，如下所示：

 

 輸入篩選條件，點擊確定，或者取消篩選。如篩選學號裡面包含2的，效果如下所示：

 

 註意：以上篩選都是客戶端篩選，不會修改數據源，也不會重連資料庫。

核心源碼

在本示例中，核心源碼主要包含以下幾個部分：

前端視圖【MainWindow.xaml】源碼

主要實現了按學號，姓名，年齡三列進行篩選，既可以單列篩選，又可以組合篩選。且三列的篩選實現方式一致，僅是綁定列有差異。

  1 <Window x:Class="DemoDataGrid.MainWindow"
  2         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  5         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  6         xmlns:local="clr-namespace:DemoDataGrid"
  7         mc:Ignorable="d"
  8         Title="DataGrid篩選示例" Height="650" Width="800">
  9     <Window.Resources>
 10         <ResourceDictionary>
 11             <CollectionViewSource x:Key="ItemsSource" Source="{Binding Path=Students}"></CollectionViewSource>
 12             <CollectionViewSource x:Key="Names" Source="{Binding Path=Names}"></CollectionViewSource>
 13             <CollectionViewSource x:Key="Nos" Source="{Binding Path=Nos}"></CollectionViewSource>
 14             <CollectionViewSource x:Key="Ages" Source="{Binding Path=Ages}"></CollectionViewSource>
 15             <Style x:Key="ListBoxStyle" TargetType="{x:Type ListBox}">
 16                 <Setter Property="ScrollViewer.CanContentScroll" Value="True"></Setter>
 17                 <Setter Property="Template">
 18                     <Setter.Value>
 19                         <ControlTemplate TargetType="{x:Type ListBox}">
 20                             <ScrollViewer x:Name="ScrollViewer" CanContentScroll="True">
 21                                 <ItemsPresenter></ItemsPresenter>
 22                             </ScrollViewer>
 23                         </ControlTemplate>
 24                     </Setter.Value>
 25                 </Setter>
 26             </Style>
 27             <Geometry x:Key="Icon_Filter">
 28                 M608 864C588.8 864 576 851.2 576 832L576 448c0-6.4 6.4-19.2 12.8-25.6L787.2 256c6.4-6.4 6.4-19.2 0-19.2 0-6.4-6.4-12.8-19.2-12.8L256 224c-12.8 0-19.2 6.4-19.2 12.8 0 6.4-6.4 12.8 6.4 19.2l198.4 166.4C441.6 428.8 448 441.6 448 448l0 256c0 19.2-12.8 32-32 32S384 723.2 384 704L384 460.8 198.4 307.2c-25.6-25.6-32-64-19.2-96C185.6 179.2 217.6 160 256 160L768 160c32 0 64 19.2 76.8 51.2 12.8 32 6.4 70.4-19.2 89.6l-192 160L633.6 832C640 851.2 627.2 864 608 864z
 29             </Geometry>
 30             <ContextMenu x:Key="queryConditionMenu" MouseLeave="ContextMenu_MouseLeave" MenuItem.Click="ContextMenu_Click">
 31                 <MenuItem FontSize="12" Header="等於" Tag="Equal"></MenuItem>
 32                 <MenuItem FontSize="12" Header="不等於"  Tag="NotEqual"></MenuItem>
 33                 <MenuItem FontSize="12" Header="開頭"  Tag="Begin"></MenuItem>
 34                 <MenuItem FontSize="12" Header="結尾"  Tag="End"></MenuItem>
 35                 <MenuItem FontSize="12" Header="包含"  Tag="In"></MenuItem>
 36                 <MenuItem FontSize="12" Header="不包含"  Tag="NotIn"></MenuItem>
 37             </ContextMenu>
 38         </ResourceDictionary>
 39         
 40     </Window.Resources>
 41     <Grid Margin="10">
 42         <Grid.RowDefinitions>
 43             <RowDefinition Height="20"></RowDefinition>
 44             <RowDefinition Height="*"></RowDefinition>
 45         </Grid.RowDefinitions>
 46         <DataGrid Grid.Row="1" x:Name="dgStudents" ItemsSource="{Binding Source={StaticResource ItemsSource} }" AutoGenerateColumns="False"
 47                               CanUserReorderColumns="True" CanUserDeleteRows="False" CanUserAddRows="False" HeadersVisibility="Column"
 48                               CanUserSortColumns="True"
 49                               VirtualizingPanel.VirtualizationMode="Recycling"
 50                               EnableColumnVirtualization="True" VirtualizingPanel.IsVirtualizingWhenGrouping="True" GridLinesVisibility="All" RowHeight="25"
 51                               SelectionUnit="FullRow" SelectionMode="Single" IsReadOnly="True" FontSize="12" 
 52                               SelectedIndex="{Binding SelectTaskItemIndex}" SelectedItem="{Binding SelectTaskItem}"
 53                               CanUserResizeColumns="True">
 54             <DataGrid.Columns>
 55                 <DataGridTextColumn Binding="{Binding Id}" Header="Id" Width="*">
 56                     
 57                 </DataGridTextColumn>
 58                 <DataGridTextColumn Binding="{Binding No}" Width="*">
 59                     <DataGridTextColumn.Header>
 60                         <TextBlock Text="學號" FontWeight="Regular" MouseRightButtonDown="TextBlock_MouseRightButtonDown" Tag="No"></TextBlock>
 61                     </DataGridTextColumn.Header>
 62                 </DataGridTextColumn>
 63                 <DataGridTextColumn Binding="{Binding Name}" Width="*">
 64                     <DataGridTextColumn.Header>
 65                         <TextBlock Text="姓名" FontWeight="Regular" MouseRightButtonDown="TextBlock_MouseRightButtonDown" Tag="Name"></TextBlock>
 66                     </DataGridTextColumn.Header>
 67                 </DataGridTextColumn>
 68                 <DataGridTextColumn Binding="{Binding Age}" Width="*">
 69                     <DataGridTextColumn.Header>
 70                         <TextBlock Text="年齡" FontWeight="Regular" MouseRightButtonDown="TextBlock_MouseRightButtonDown" Tag="Age"></TextBlock>
 71                     </DataGridTextColumn.Header>
 72                 </DataGridTextColumn>
 73             </DataGrid.Columns>
 74         </DataGrid>
 75         <Popup x:Name="popupNo" Width="135" MaxHeight="500" Height="Auto" PopupAnimation="Slide" AllowsTransparency="False" MouseLeave="popup_MouseLeave">
 76             <Border BorderBrush="LightBlue" BorderThickness="1" Padding="5" Background="AliceBlue">
 77                 <Grid>
 78                     <Grid.ColumnDefinitions>
 79                         <ColumnDefinition></ColumnDefinition>
 80                         <ColumnDefinition></ColumnDefinition>
 81                     </Grid.ColumnDefinitions>
 82                     <Grid.RowDefinitions>
 83                         <RowDefinition></RowDefinition>
 84                         <RowDefinition></RowDefinition>
 85                         <RowDefinition></RowDefinition>
 86                     </Grid.RowDefinitions>
 87                     <StackPanel Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Orientation="Horizontal">
 88                         <TextBox Height="25" x:Name="txtNo" MinWidth="60" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Tag="No" TextChanged="TextBox_TextChanged"></TextBox>
 89                         <Button x:Name="btnNoFilter"  Tag="No" ClickMode="Press" Click="ButtonFilter_Click" ContextMenu="{StaticResource queryConditionMenu}">
 90                             <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
 91                                 <Path Data="{StaticResource Icon_Filter}" Stroke="Gray" StrokeThickness="1" 
 92                        Height="12" Width="12" Stretch="Fill"></Path>
 93                                 <TextBlock Margin="2,0" Text="篩選" FontSize="12"></TextBlock>
 94                             </StackPanel>
 95                         </Button>
 96                     </StackPanel>
 97                     <ListBox x:Name="lbNos" ItemsSource="{Binding Source={StaticResource Nos}}" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" VirtualizingPanel.VirtualizationMode="Recycling" VirtualizingPanel.IsVirtualizing="True" Style="{StaticResource ListBoxStyle}">
 98                         <ListBox.ItemTemplate>
 99                             <DataTemplate>
100                                 <CheckBox Content="{Binding FilterText}" IsChecked="{Binding IsChecked}"></CheckBox>
101                             </DataTemplate>
102                         </ListBox.ItemTemplate>
103                     </ListBox>
104 
105                     <Button Tag="No" Content="取消" Width="60" HorizontalAlignment="Left" Grid.Row="2" Grid.Column="0" Click="btnCancel_Click"></Button>
106                     <Button Content="確定" Width="60" HorizontalAlignment="Right" Grid.Row="2" Grid.Column="1" Click="btnOk_Click"></Button>
107                 </Grid>
108             </Border>
109         </Popup>
110         <Popup x:Name="popupName" Width="135" MaxHeight="500" Height="Auto" PopupAnimation="Slide" AllowsTransparency="False" MouseLeave="popup_MouseLeave">
111             <Border BorderBrush="LightBlue" BorderThickness="1" Padding="5" Background="AliceBlue">
112                 <Grid>
113                     <Grid.ColumnDefinitions>
114                         <ColumnDefinition></ColumnDefinition>
115                         <ColumnDefinition></ColumnDefinition>
116                     </Grid.ColumnDefinitions>
117                     <Grid.RowDefinitions>
118                         <RowDefinition></RowDefinition>
119                         <RowDefinition></RowDefinition>
120                         <RowDefinition></RowDefinition>
121                     </Grid.RowDefinitions>
122                     <StackPanel Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Orientation="Horizontal">
123                         <TextBox Height="25" x:Name="txtName" MinWidth="60" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Tag="Name" TextChanged="TextBox_TextChanged"></TextBox>
124                         <Button x:Name="btnNameFilter"  Tag="Name" Click="ButtonFilter_Click" ContextMenu="{StaticResource queryConditionMenu}">
125                             <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
126                                 <Path Data="{StaticResource Icon_Filter}" Stroke="Gray" StrokeThickness="1" 
127                        Height="12" Width="12" Stretch="Fill"></Path>
128                                 <TextBlock Margin="2,0" Text="篩選" FontSize="12"></TextBlock>
129                             </StackPanel>
130                         </Button>
131                     </StackPanel>
132                     <ListBox x:Name="lbNames" ItemsSource="{Binding Source={StaticResource Names}}" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" VirtualizingPanel.VirtualizationMode="Recycling" VirtualizingPanel.IsVirtualizing="True" Style="{StaticResource ListBoxStyle}">
133                         <ListBox.ItemTemplate>
134                             <DataTemplate>
135                                 <CheckBox Content="{Binding FilterText}" IsChecked="{Binding IsChecked}"></CheckBox>
136                             </DataTemplate>
137                         </ListBox.ItemTemplate>
138                     </ListBox>
139 
140                     <Button Tag="No" Content="取消" Width="60" HorizontalAlignment="Left" Grid.Row="2" Grid.Column="0" Click="btnCancel_Click"></Button>
141                     <Button Content="確定" Width="60" HorizontalAlignment="Right" Grid.Row="2" Grid.Column="1" Click="btnOk_Click"></Button>
142                 </Grid>
143             </Border>
144
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 04if分支語句
    if條件語句 if語句 if條件語法結構： if 條件語句: 滿足條件運行的代碼1 滿足條件運行的代碼2 ... ps：條件語句（可以是單個數據，即本身就是布爾類型）需返回一個布爾類型，判斷是否進入條件分支語句 if True: print('條件成⽴執⾏的代碼1') print('條件成⽴執⾏的代 ...
  • Lambda表達式和Collection集合
    Lambda表達式 Lambda表達式理解 Lambda表達式是Jdk 8 開始新增的一種語法形式；作用：用於簡化匿名內部類的代碼寫法 註意：Lambda表達式只能簡化函數式介面的匿名內部類！！！ 什麼是函數式介面？ 有且僅有一個抽象方法的介面。 註意：大部分函數式介面，上面可能會有一個@Funct ...
  • 【深入淺出 Yarn 架構與實現】4-5 RM 行為探究 - 啟動 ApplicationMaster
    本節開始，將對 ResourceManager 中一些常見行為進行分析探究，看某些具體關鍵的行為，在 RM 中是如何流轉的。本節將深入源碼探究「啟動 ApplicationMaster」的具體流程。 ...
  • 【SpringCloud】feign.codec.EncodeException: No qualifying bean of type
    錯誤描述 在 Spring Cloud 項目中通過 Open Feign 遠程調用時出現如下錯誤： feign.codec.EncodeException: No qualifying bean of type 'org.springframework.boot.autoconfigure.http ...
  • 使用java原生方法file.renamoTo調用返回false
    之前在做某個業務中，寫了個文件傳輸的程式，程式邏輯很簡單：掃描某個目錄下的文件，對文件進行一些處理，然後把文件移動到另一個目錄。 此前在大多數運行環境里，該程式一直正常運行，直到最近在一個新環境下，出現問題：文件移動失敗。查詢日誌發現在調用file.renameTo方法返回false。我第一反應是查 ...
  • C語言 記憶體分區
    C語言對記憶體的使用劃分為以下區域： 棧區（stack）、堆區（heap）、全局區（靜態區）、常量區、代碼區。 棧區： 由編譯器自動分配釋放，按記憶體地址從高（地址）到低（地址）存儲； 棧區內容的作用域為其所定義的函數內，生命周期為函數執行期間，函數結束自動釋放； 存放局部變數、const局部變數、函數 ...
  • Apache HttpClient使用和源碼分析
    在上文中分析了 HttpURLConnection的用法，功能還是比較簡單的，沒有什麼封裝 接下來看看Apache HttpClient是如何封裝httpClient的 組成 HttpClient 5 的系統架構主要由以下幾個部分組成： HttpCore：核心包，包含了 HTTP 協議的核心抽象和實 ...
  • 一次k8s docker下.net程式的異常行為dump診斷
    背景 昨天，一位朋友找到我尋求幫助。他的項目需要調用一個第三方項目的webAPI。這個webAPI本身可從header, query string中取相關信息，但同事發現他在調用時，無法按期望的那樣從query string中傳參數給到第三方webAPI (webAPI仿佛忽略了從query str ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類