Skip to main content
Version: 11.0.0

Auto-complete Box

The auto-complete box presents a text box for user input and a drop-down that contains possible matches from an items source collection, for the text typed in. The drop-down shows when the user starts to type, and the match is updated for each character typed. The user can select from the drop-down.

The way in which the text is matched to possible items in the items source is configurable.

Useful Properties

You will probably use these properties most often:

PropertyDescription
ItemsThe list of items to match from.
FilterModeOption for how the matching is to be done. See table below.
AsyncPopulatorAn asynchronous function that can can provide the list of matches for a given (string) criteria. This

These are the options for the filter mode property:

Filter ModeDescription
StartsWithA culture-sensitive, case-insensitive filter where the returned items start with the specified text.
StartsWithCaseSensitiveA culture-sensitive, case-sensitive filter where the returned items start with the specified text.
StartsWithOrdinalAn ordinal, case-insensitive filter where the returned items start with the specified text.
StartsWithOrdinalCaseSensitiveAn ordinal, case-sensitive filter where the returned items start with the specified text.
ContainsA culture-sensitive, case-insensitive filter where the returned items contain the specified text.
ContainsCaseSensitiveA culture-sensitive, case-sensitive filter where the returned items contain the specified text.
ContainsOrdinalAn ordinal, case-insensitive filter where the returned items contain the specified text.
ContainsOrdinalCaseSensitiveAn ordinal, case-sensitive filter where the returned items contain the specified text.
EqualsA culture-sensitive, case-insensitive filter where the returned items equal the specified text.
EqualsCaseSensitiveA culture-sensitive, case-sensitive filter where the returned items equal the specified text.
EqualsOrdinalAn ordinal, case-insensitive filter where the returned items equal the specified text.
EqualsOrdinalCaseSensitiveAn ordinal, case-sensitive filter where the returned items equal the specified text.
info

In an ordinal string comparison, each character is compared using its simple byte value (independent of language).

Examples

This example has a fixed items source (array) that is set in the C# code-behind.

<StackPanel Margin="20">
<TextBlock Margin="0 5">Choose an animal:</TextBlock>
<AutoCompleteBox x:Name="animals" FilterMode="StartsWith" />
</StackPanel>
C#
using Avalonia.Controls;
using System.Linq;

namespace AvaloniaControls.Views
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
animals.Items = new string[]
{"cat", "camel", "cow", "chameleon", "mouse", "lion", "zebra" }
.OrderBy(x=>x);
}
}
}

More Information

info

For the complete API documentation about this control, see here.

info

View the source code on GitHub AutoCompleteBox.cs