Incremental Search Demo (.NET/WPF)

[kirupa]

Hey everyone,
I was browsing through some programs I wrote for fun, and one such program is an Incremental Search demo that filters through a list of words as characters are entered into an input field. Here are the screenshots of the app in Vista and XP:

http://img388.imageshack.us/img388/4698/incrementalsearchvistaxa6.th.png (http://img388.imageshack.us/my.php?image=incrementalsearchvistaxa6.png)

http://img388.imageshack.us/img388/2092/incrementalsearchxpws4.th.jpg (http://img388.imageshack.us/my.php?image=incrementalsearchxpws4.jpg)

I also went ahead and used ClickOnce (http://www.kirupa.com/net/clickOnce.htm)[tutorial] to create an automatic installer, so those of you on XP/Vista can test it out on your own machines: http://www.kirupafx.com/IncrementalSearch/publish.htm (http://www.kirupafx.com/IncrementalSearch/publish.htm)

The source files for this can be accessed from the following location: http://www.kirupa.com/net/code/IncrementalSearch.zip (http://www.kirupa.com/net/code/IncrementalSearch.zip)

The XAML code:

<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xml:lang="en-US"
x:Class="IncrementalSearch.Window1"
x:Name="Window"
Title="Incremental Search"
Width="262" Height="365" Icon="\text_align_left.png" ResizeMode="NoResize" WindowStyle="SingleBorderWindow">
<Window.Background>
<LinearGradientBrush EndPoint="0.555,1.098" StartPoint="0.274,0.258" SpreadMethod="Pad">
<GradientStop Color="#FFF6F6F8" Offset="0"/>
<GradientStop Color="#FFCADEF6" Offset="0.779"/>
</LinearGradientBrush>
</Window.Background>
<Grid x:Name="LayoutRoot">
<Label Margin="19,3,5,0" x:Name="lblInfo" VerticalAlignment="Top" Height="29" FontSize="14" FontWeight="Normal" Content="Start typing a word below:" Background="#00F4C2C2"/>
<TextBox Margin="20,36,19,0" x:Name="txtInput" VerticalAlignment="Top" Height="23" Background="#BFFFFFFF" BorderThickness="2,2,2,2" Text="" TextWrapping="NoWrap" TextChanged="inputChanged"/>
<ListView Margin="20,76,19,16" x:Name="lstResults" IsSynchronizedWithCurrentItem="True">
<ListView.View>
<GridView>
<GridViewColumn Header="GridViewColumn"/>
</GridView>
</ListView.View>
</ListView>
<Image HorizontalAlignment="Left" Margin="5,10,0,0" VerticalAlignment="Top" Width="16" Height="16" Source="magnifier.png" Stretch="Fill"/>
</Grid>
</Window>


And the C# code is:

using System;
using System.IO;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Navigation;
using System.Collections.Generic;
using System.Resources;
using System.Reflection;
namespace IncrementalSearch
{
public partial class Window1
{
List<string> wordList;
public Window1()
{
this.InitializeComponent();

// Insert code required on object creation below this point.
loadText();
setupColumn();
}
private void inputChanged(object sender, TextChangedEventArgs e)
{
string searchString = txtInput.Text.ToLower();
lstResults.Items.Clear();
foreach (string currentWord in wordList)
{
if (currentWord.IndexOf(searchString) != -1)
{
displayWord(currentWord);
}
}
}
private void displayWord(string wordToAdd)
{
lstResults.Items.Add(wordToAdd);
}
private void loadText()
{
TextReader tr = new StreamReader(Assembly.GetExecutingAssembly().GetMa nifestResourceStream("IncrementalSearch.words.txt"));
string currentLine = tr.ReadLine();
wordList = new List<string>();
while (currentLine != null)
{
wordList.Add(currentLine.ToLower());
displayWord(currentLine.ToLower());
currentLine = tr.ReadLine();
}
}
private void setupColumn()
{
GridViewColumn column = (lstResults.View as GridView).Columns[0];
column.Header = "Results";
column.Width = 150;
}
}
}
For the XAML, I used Expression Blend (http://www.microsoft.com/products/expression/en/Expression-Blend/default.mspx), and for the C#, I used Visual Studio with the WPF Extensions (http://www.microsoft.com/downloads/details.aspx?familyid=F54F5537-CC86-4BF5-AE44-F5A1E805680D&displaylang=en). The WPF Extensions are required if you want to open the entire project in Visual Studio.

If there are any questions, feel free to ask!

Cheers!
Kirupa :)

[darkmotion]

That is sweet kirupa! I wish I understood any of it...

[kirupa]

Which parts exactly are you not sure about? Most of the things in this program will find their way into future tutorials, so knowing what exactly is causing you difficulty can help out a lot.

:bandit:

[darkmotion]

:) the whole coding gig. :) hahah
I'm embarrased- I've been around here for a while and still know no AS. Let alone .NET and C# :lol:

[t0mm0]

THANKYOU
i have been looking for somthing like that
becasue i really liked the way that itunes automatically does it when you use the search feature
THNX

[gvozden]

nice example ! I appriciate if you continue (start) series of WPF / .NET examples

[kirupa]

gvoz - that is the plan. Right now I am just covering the basics of .NET on the site, but eventually I will take most of my example programs and go back to targeting designers using WPF.

t0mm0 - if you plan on using something like that in a real application, you might want to look into using a trie structure instead of the List approach I used. A trie is more efficient than a list for what you would be trying to do.

:P

[Seb Hughes]

What does it exactly do where does it look?

[kirupa]

There is a words.txt file that the program scans through for matching words.

[Al6200]

What's a trie. Who'd know Computer science would have so much vocabulary!

A stack is a list (first in last out)
A heap has something to do with structs (which are used to combine data types).
And a dictionary is a series of hashes. Hashes are series of arrays!?? Sry, I don't know my Perl too well.

[gvozden]

http://en.wikipedia.org/wiki/Trie

ordered tree, nice

[kirupa]

A stack is a list (first in last out)
A heap has something to do with structs (which are used to combine data types).
And a dictionary is a series of hashes. Hashes are series of arrays!?? Sry, I don't know my Perl too well.
Not quite. A stack is LIFO - last in first out. A heap has little to do with structs. You can create heap-allocated structs, but you might as well use classes instead. My recent blog posts talk about structs, heaps, and stacks: http://blog.kirupa.com/ For info on what a hash function does, you can see here: http://en.wikipedia.org/wiki/Hash_function

These are general topics not related to any particular language such as Perl :flower:

[Esherido]

Neato! I might try to understand it when I'm bored. :P