Click here to Skip to main content
16,021,211 members
Articles / Desktop Programming / WPF

WPF SearchAll Control (Basic)

Rate me:
Please Sign up or sign in to vote.
5.00/5 (5 votes)
11 Apr 2017CPOL5 min read 18.2K   35   9   4
A basic WPF SearchAll control

Introduction

SearchAll is a WPF control to make search easy and quick. SearchAll reduces time and effort with a very cool template and friendly interface. It is based in a web search control of Pluralsight site, but SearchAll control is valid for any type, it is a generic control.

Background

I have always searched a technique to save time, resources and space in the filter action of forms. All those TextBox, Combobox, DateTimePickers, events controls, etc., which never accomplish your task completely. SearchAll covers all possible cases with a minimal code and with a great result.

SearchAll doesn’t save all cases, but it helps ours on many occasions.

Image 1

Prerequisites

SearchAll supports 4.5.2 .NET Framework version and newest.

We don’t have test SearchAll control in UWA, but the idea is include in the future.

SearchAll is open source and it is available for Nuget.

The Control

SearchAll control is a very simple component and it has formed for three principals elements:

Image 2

  • Text to search. Is the part when we introduce the text to filter. In a usually use, when we click in this zone, will appear all window popup to fill the word or words to filtered, this popup gave us matches found.
  • Cancel Filter Button. This button is available when we have done a filter, and will allow us to cancel the filter.
  • Filter Button. Your function is to filter the source data, but this is only useful when Text to Search has been assigned for code.

A single running flash:

Image 3

Installation

The installation of SearchAll control is through package Nuget:

  1. We install the package.

    Image 4

    Or run the following command in the Package Manager Console:

    Image 5

    Install-Package MoralesLarios.CustomsControls:

    Image 6

  2. In the WPF Toolbox, we will select ‘Choose Items’ >> Browse. We will search MoralesLarios.CustomControls.dll in our installation path. It is necessary to build the project.

    Image 7

    Image 8

    Image 9

    Click Open:

    Image 10

    Click OK, and it is now available.

    Image 11

    In moving.

    Image 12

    All we need is drag the component in our window.

    Image 13

    SearchAll is a very easy control and only need to setup the ItemSource property to run. Usually, its data source is the same as ItemsControls (DataGrid, ListBox, ListView, ComboBox, etc.) which will filter. We can do it through MVVM or Code Behind.

    If you leave null the ItemsSource property, the SearchControl will be UnEnabled.

XAML

XML
<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication17"
        xmlns:CustomsControls="clr-namespace:MoralesLarios.CustomsControls;
        assembly=MoralesLarios.CustomsControls" 
        x:Class="WpfApplication17.MainWindow"
        mc:Ignorable="d"
        Title="MainWindow" Height="261.112" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="46"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        
        <CustomsControls:SearchAll x:Name="searchAll"
                                   HorizontalAlignment="Left" 
                                   Margin="50,10,0,0" 
                                   VerticalAlignment="Top" 
                                   Height="29" 
                                   Width="270"
                                   />

        <DataGrid x:Name="dgData" Grid.Row="1" AutoGenerateColumns="True" />
    </Grid>
</Window>

Code behind:

C#
using System.Linq;
using System.Windows;

namespace WpfApplication17
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            var data = typeof(Enumerable).GetMethods();

            dgData.ItemsSource = data;

            searchAll.ItemsSource = data;
        }
    }
}

In action:

Image 14

In the first time to filter, press the Enter key Image 15. In the second time, click in option.

It Works

SearchAll works in a simple explain searching a letter/word in all properties of all elements of a data sequence:

For default only instance the ItemsSource property.

Image 16

In moving:

Image 17

The SearchAll control filters the data sequence through the ICollectionView associated to ItemsSource collection property.

The Most Important Properties

To show the most important properties of control, we will use another application test. This application is cooler, and in its interface, shows the SearchAll properties.

The DataSource of Application tests consists by all Windows NT Service (services.msc) of target machine. The domain class in .NET for this purpose is System.ServiceProcess.ServiceController:

C#
 public class ServiceController
{
    public bool                    CanPauseAndContinue  { get; }
    public bool                    CanShutdown          { get; }
    public bool                    CanStop              { get; }
    public ServiceController[]     DependentServices    { get; }
    public string                  DisplayName          { get; set; }
    public string                  MachineName          { get; set; }
    public SafeHandle              ServiceHandle        { get; }
    public string                  ServiceName          { get; set; }
    public ServiceController[]     ServicesDependedOn   { get; }
    public ServiceType             ServiceType          { get; }
    public ServiceControllerStatus Status               { get; }
}

UI:

Image 18

ItemSource

C#
public IEnumerable<object> ItemsSource { get; set; }

The ItemsSource dependency property gets or sets the collection source to filter. It is the only property necessary to work.

If you don’t assign this property, the control will remain disabled.

Text

public string Text { get; set; }

The Text dependency property gets or sets the content of search to filter.

When the Text property is clear, the buttons Filter Button and Cancel Button are disabled.

NumberSugerencyElements

C#
public int NumberSugerencyElements { get; set; }

The NumberSugerencyElements dependency property gets or sets the number maximum of suggestions displayed in the PopupSearch. This property can be important at performance level, because if the source collection is big, and the text to search unlikely, the search task and filter task can be long.

Image 19

20 is default value.

Image 20

In moving:

Image 21

FilterClass

C#
public FilterType FilterClass { get; set; }

The FilterClass dependency property gets or sets the filter type applied to search.

The enum FilterType may have five values:

  • StartWith
  • EndWith
  • Contains
  • Equals
  • Custom

Image 22

Contains is default value.

Image 23

In the application test, we have implemented a friendly way to change this property through double-click in the textblocks with the enum FilterTypes values.

Image 24

In moving:

Image 25

In the FilterType enum, there is a finish value named custom. We will see this value in another article, with the advanced aspects of SearchAll control.

FieldsSugerenciesSearch

C#
public IEnumerable<string> FieldsSugerenciesSearch { get; set; }

The FieldsSugerenciesSearch Dependency Property gets or sets the names and order of properties of type of DataSource (ItemsSource) for suggestions matches in the popup search.

Null is a default value. When FieldSuggerenciesSearch is null, the SearchAll control engine finds in all properties of type.

Image 26

These are very simple examples in MVVM, because in both cases, we have configured an only field to search. The example of left side for DisplayName field and the example of left side for ServiceName field.

In our application tests, we have developed a dynamic change of this property by a popup setup. This popup will emerge clicking in ‘FieldSearch / SugrenceSearch label.

So we go to see it in moving.

Image 27

Another example with more fields in codebehind:

Image 28

FieldsSearch

C#
public IEnumerable<string> FieldsSearch { get; set; }

The Dependency Property FieldsSearch is equals to FieldsSugerenciesSearch. They differ in that it applies to the suggestions match in the popup search and FieldsSearch is applied in the result of filter datasource (ItemsSource).

Usually, the values of these two properties will be the same.

Complete example with many properties:

Image 29

Query Filtered Data

If we want to query filtered data, we can do:

In CodeBehind:

C#
public void QueryFilterData()
{
    /// Use de ReadOnly Dependency Property FilteredItemsSource
 
    /// --> ServiceController is a data of mi DataSource 
    /// (ObservableCollection in ItemsSource)
 
    var filteredData = searchAll.FilteredItemdSource.OfType<ServiceController>().ToList();
}

MVVM in ViewModel:

C#
public void QueryFilterData()
{
    /// Use the ICollectionView of our DataSource
 
    /// --> ServiceController is a data of mi DataSource 
    ///     (ObservableCollection in ItemsSource)
 
    var filteredData = CollectionViewSource.GetDefaultView
                       (Services).OfType<ServiceController>().ToList();
}

Limitations

SearchAll control filter is based in Reflection, for this reason in the access to certain properties values, .NET Framework throws different exceptions.

In these cases, the SearchAll control shows a message with the info of incompatibility Property:

In moving:

Image 30

The Next Chapter

We have been trying to explain the SearchAll control essential part. For the next chapter, we will tell the advance part: Events, Custom Type FilterClass and another tips.

History

  • 9th February, 2017: Initial version

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior) Cecabank
Spain Spain
MVP C# Corner 2017

MAP Microsoft Active Professional 2014

MCPD - Designing and Developing Windows Applications .NET Framework 4
MCTS - Windows Applications Development .NET Framework 4
MCTS - Accessing Data Development .NET Framework 4
MCTS - WCF Development .NET Framework 4

Comments and Discussions

 
QuestionAbout the Links Pin
Nelek11-Apr-17 9:08
protectorNelek11-Apr-17 9:08 
AnswerRe: About the Links Pin
Juan Francisco Morales Larios11-Apr-17 20:37
Juan Francisco Morales Larios11-Apr-17 20:37 
Questionhmm Pin
Member 1048548710-Feb-17 0:45
Member 1048548710-Feb-17 0:45 
AnswerRe: hmm Pin
Juan Francisco Morales Larios10-Feb-17 12:47
Juan Francisco Morales Larios10-Feb-17 12:47 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.