Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/zleao/zoft.mauiextensions.autocompleteentry
AutoComplete Entry control for .Net MAUI that provides a list of suggestions as the user types
https://github.com/zleao/zoft.mauiextensions.autocompleteentry
autocomplete csharp dotnet8 entry maui nuget nuget-package
Last synced: about 2 months ago
JSON representation
AutoComplete Entry control for .Net MAUI that provides a list of suggestions as the user types
- Host: GitHub
- URL: https://github.com/zleao/zoft.mauiextensions.autocompleteentry
- Owner: zleao
- License: mit
- Created: 2022-11-27T20:24:28.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-09-24T11:18:00.000Z (3 months ago)
- Last Synced: 2024-10-14T03:03:34.367Z (3 months ago)
- Topics: autocomplete, csharp, dotnet8, entry, maui, nuget, nuget-package
- Language: C#
- Homepage:
- Size: 4.73 MB
- Stars: 32
- Watchers: 1
- Forks: 8
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# zoft.MauiExtensions.Controls.AutoCompleteEntry
Entry control that makes suggestions to users as they type.
**NOTE:** This control is based on the awesome [dotMortem/XamarinFormsControls/AutoSuggestBox](https://github.com/dotMorten/XamarinFormsControls/tree/main/AutoSuggestBox). with some simplifications and modifications of my own.
[](https://www.nuget.org/packages/zoft.MauiExtensions.Controls.AutoCompleteEntry/)
## Getting Started
### Instalation
Add NuGet Package to your project:
```
dotnet add package zoft.MauiExtensions.Controls.AutoCompleteEntry`
```
You can find the nuget package here [zoft.MauiExtensions.Controls.AutoCompleteEntry](https://www.nuget.org/packages/zoft.MauiExtensions.Controls.AutoCompleteEntry/)
Initialize the library in your `MauiProgram.cs` file:
```csharp
using CommunityToolkit.Maui;
using zoft.MauiExtensions.Controls;
namespace AutoCompleteEntry.Sample
{
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp()
.UseMauiCommunityToolkit()
.UseZoftAutoCompleteEntry()
.ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
});
return builder.Build();
}
}
}
```
### How to Use
The filtering of results, happens as the user types and you'll only need to respond to 2 actions:
**Binding based**
- `TextChangedCommand`: Triggered every time the user changes the text. Receives the current text as parameter;
- `SelectedSuggestion`: Holds the currently selected option;
**Event based**
- `TextChanged`: Event raised every time the user changes the text. The current text is part of the event arguments;
- `SuggestionChosen`: Event raised every time a suggestion is chosen. The selected option is part of the event arguments;
### XAML Usage
In order to make use of the control within XAML you can use this namespace:
```xml
xmlns:zoft="http://zoft.MauiExtensions/Controls"
```
### Sample Using Bindings
```xml
```
```csharp
internal partial class ListItem : ObservableObject
{
[ObservableProperty]
public string _group;
[ObservableProperty]
public string _country;
}
internal partial class SampleViewModel : CoreViewModel
{
private readonly List Teams = new List() { ... };
[ObservableProperty]
private ObservableCollection _filteredList;
[ObservableProperty]
private ListItem _selectedItem;
[ObservableProperty]
private int _cursorPosition;
public SampleViewModel()
{
FilteredList = new(Teams);
SelectedItem = null;
}
private void FilterList(string filter)
{
SelectedItem = null;
FilteredList.Clear();
FilteredList.AddRange(Teams.Where(t => t.Group.Contains(filter, StringComparison.CurrentCultureIgnoreCase) ||
t.Country.Contains(filter, StringComparison.CurrentCultureIgnoreCase)));
}
[RelayCommand]
private void TextChanged(string text)
{
FilterList(text);
}
}
```
### Sample Using Events
```xml
```
```csharp
private void AutoCompleteEntry_TextChanged(object sender, zoft.MauiExtensions.Controls.AutoCompleteEntryTextChangedEventArgs e)
{
// Filter only when the user is typing
if (e.Reason == zoft.MauiExtensions.Controls.AutoCompleteEntryTextChangeReason.UserInput)
{
//Filter the ItemsSource, based on text
ViewModel.FilterList((sender as zoft.MauiExtensions.Controls.AutoCompleteEntry).Text);
}
}
private void AutoCompleteEntry_SuggestionChosen(object sender, zoft.MauiExtensions.Controls.AutoCompleteEntrySuggestionChosenEventArgs e)
{
//Set the SelectedItem provided by the event arguments
ViewModel.SelectedItem = e.SelectedItem as ListItem;
}
```
#### Windows
|||||
|:---:|:---:|:---:|:---:|
#### Android
|||||
|:---:|:---:|:---:|:---:|
#### iOS
|||||
|:---:|:---:|:---:|:---:|
#### MacCatalyst
|||||
|:---:|:---:|:---:|:---:|