Skip to content

FreakyAutoCompleteView

Jump to bottom
Gulam Ali H edited this page Oct 1, 2023 · 1 revision

FreakyAutoCompleteView

The FreakyAutoCompleteView class is a versatile auto-complete text input view designed for use in .NET MAUI applications. It offers a wide range of customization options and events for creating interactive and dynamic auto-complete experiences.

Properties

Text

  • Type: string
  • Description: Gets or sets the text displayed in the auto-complete input field.

Threshold

  • Type: int
  • Default Value: 1
  • Description: Gets or sets the minimum number of characters the user must type before auto-complete suggestions are displayed.

TextColor

  • Type: Color
  • Default Value: Colors.Gray
  • Description: Gets or sets the text color of the auto-complete input field.

Placeholder

  • Type: string
  • Default Value: string.Empty
  • Description: Gets or sets the placeholder text displayed in the input field when it's empty.

PlaceholderColor

  • Type: Color
  • Default Value: Colors.Gray
  • Description: Gets or sets the color of the placeholder text.

TextMemberPath

  • Type: string
  • Default Value: string.Empty
  • Description: Gets or sets the binding path for the text content of each suggestion item.

DisplayMemberPath

  • Type: string
  • Default Value: string.Empty
  • Description: Gets or sets the binding path for the display content of each suggestion item.

IsSuggestionListOpen

  • Type: bool
  • Default Value: false
  • Description: Gets or sets whether the auto-complete suggestion list is currently open.

UpdateTextOnSelect

  • Type: bool
  • Default Value: true
  • Description: Gets or sets whether the text input should be updated when a suggestion is selected.

ItemsSource

  • Type: System.Collections.IList
  • Description: Gets or sets the collection of items to be used as suggestions for auto-complete.

AllowCopyPaste

  • Type: bool
  • Default Value: false
  • Description: Gets or sets whether the user is allowed to copy and paste text in the input field.

ImageSource

  • Type: ImageSource
  • Description: Gets or sets the image to be displayed within the auto-complete view.

ImageHeight

  • Type: int
  • Default Value: 25
  • Description: Gets or sets the height of the image within the auto-complete view.

ImageWidth

  • Type: int
  • Default Value: 25
  • Description: Gets or sets the width of the image within the auto-complete view.

ImageAlignment

  • Type: ImageAlignment
  • Default Value: ImageAlignment.Right
  • Description: Gets or sets the alignment of the image within the auto-complete view.

ImagePadding

  • Type: int
  • Default Value: 5
  • Description: Gets or sets the padding around the image within the auto-complete view.

ImageCommand

  • Type: ICommand
  • Description: Gets or sets the command to be executed when the image is tapped.

ImageCommandParameter

  • Type: object
  • Description: Gets or sets the command parameter to be passed to the image command.

Events

TextChanged

  • Description: Occurs when the text in the auto-complete input field changes. Use this event to respond to text changes.

SuggestionChosen

  • Description: Occurs when a suggestion from the auto-complete list is chosen. Use this event to handle item selection.

QuerySubmitted

  • Description: Occurs when a query is submitted, typically when the user presses the Enter key. Use this event to handle query submissions.

Usage

To use the FreakyAutoCompleteView in your MAUI application, follow these steps:

  1. Initialize the FreakyAutoCompleteView instance.
  2. Customize its appearance and behavior using the available properties.
  3. Subscribe to the TextChanged, SuggestionChosen, and QuerySubmitted events to handle user interactions.
  4. Add the FreakyAutoCompleteView to your MAUI layout.

Example:

// Initialize the auto-complete view
var autoCompleteView = new FreakyAutoCompleteView
{
    ItemsSource = yourSuggestionsCollection,
    Threshold = 2,
    TextColor = Color.Black,
    Placeholder = "Type to search...",
    // Customize other properties as needed
};

// Handle events
autoCompleteView.TextChanged += (sender, e) =>
{
    // Handle text changes
};

autoCompleteView.SuggestionChosen += (sender, e) =>
{
    // Handle suggestion chosen
};

autoCompleteView.QuerySubmitted += (sender, e) =>
{
    // Handle query submitted
};
Clone this wiki locally