Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 33 additions & 0 deletions controls/autocomplete/keyboard-support.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
---
title: Keyboard Support
meta_title: .NET MAUI AutoComplete Documentation - Keyboard Support for WinUI and MacCatalyst
description: Learn more about the available keyboard combinations as part of the supported Telerik UI for .NET MAUI AutoComplete accessibility standards.
position: 6
slug: autocomplete-keyboard-support
---

# .NET MAUI AutoComplete Keyboard Support

[Telerik UI for .NET MAUI AutoComplete]({%slug autocomplete-overview%}) provides keyboard navigation support on WinUI and Mac Catalyst.

The following table lists the actions and keyboard combinations that are available in the AutoComplete control:

| Hotkey Combinations | Action |
| -------------------- | ------ |
| `Tab` | Focuses the control and opens the suggestion view. |
| `Enter` | Commits the selected item from the suggestion view and closes the suggestion view. |
| `Esc` | Takes effect only when the suggestion view is opened. It closes the suggestion view of the AutoComplete control. |
| `Up Arrow` / `Down Arrow` | When the suggestion view is opened, pressing `Up/Down Arrows` changes the highlighted item in the suggestion view list. |
| `PageUp` / `PageDown` | When the suggestion view is opened, pressing `PageUp/PageDown` changes the highlighted item. `PageUp` navigates to the first item in the visible area, `PageDown` navigates to the last item in the visible area. |

## See Also

- [Suggest Mode]({%slug autocomplete-suggest-mode%})
- [Display Text]({%slug autocomplete-display-text-formatter%})
- [Tokens Support]({%slug autocomplete-tokens-support%})
- [Remote Search]({%slug autocomplete-remote-search%})
- [Filtering]({%slug autocomplete-filtering%})
- [Events]({%slug autocomplete-events%})
- [Methods]({%slug autocomplete-methods%})
- [Templates]({%slug autocomplete-custom-templates%})
- [Styling]({%slug autocomplete-styling%})
3 changes: 2 additions & 1 deletion controls/autocomplete/overview.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Overview
page_title: .NET MAUI AutoComplete Documentation - Overview
meta_title: .NET MAUI AutoComplete Documentation - Overview
description: "Check our "Overview" documentation article for Telerik AutoComplete for .NET MAUI"
position: 0
slug: autocomplete-overview
Expand All @@ -25,6 +25,7 @@ The Telerik UI for .NET MAUI AutoComplete can automatically complete user input
* [Suggestion view visibility]({%slug autocomplete-configuration%}#suggestionview-visibility)—AutoComplete provides the ability to hide the view with the suggestions.
* [Suggestion view position]({%slug autocomplete-configuration%}#suggestionview-position)—AutoComplete gives you the option to specify whether the `SuggestionView` will be displayed—above or under the control.
* [Highlight customization]({%slug autocomplete-styling%}#hightlight-customization)—You can customize the highlight color of the suggestion items.
* [Keyboard navigation]({%slug autocomplete-keyboard-support%}) support—Use keyboard keys for navigation in the .NET MAUI AutoComplete suggestion view. This feature is available on WinUI and Mac Catalyst.
* [Nested properties support]({%slug autocomplete-data-binding%})—This allows binding of a complex object to the `TextSearchPath` property.
* [Styling options]({%slug autocomplete-styling%})—For changing the control's border brush and thickness, font options, suggestion item highlight text color and more.

Expand Down
17 changes: 12 additions & 5 deletions controls/autocomplete/styling.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
---
title: Styling
page_title: .NET MAUI AutoComplete Documentation - Styling
meta_title: .NET MAUI AutoComplete Documentation - Styling
description: Change the Telerik .NET MAUI AutoComplete look using its flexible styling API.
position: 16
slug: autocomplete-styling
Expand All @@ -10,11 +11,11 @@ slug: autocomplete-styling

The Telerik UI for .NET MAUI AutoComplete control provides the following Style properties for customizing its look:

* `TextColor`(`Color`)—Defines the text color of the control.
* `PlaceholderColor`(`Color`)—Defines the color for the placeholder text.
* `Font Options`(`FontAttributes`, `FontFamily`, `FontSize`)—Defines the font options for the text of the AutoComplete.
* `BorderBrush`(`Brush`)—Defines the brush of the border around the control.
* `BorderThickness`(`Thickness`)—Defines the thickness of the border around the control.
* `TextColor` (`Color`)—Defines the text color of the control.
* `PlaceholderColor` (`Color`)—Defines the color for the placeholder text.
* `Font Options` (`FontAttributes`, `FontFamily`, `FontSize`)—Defines the font options for the text of the AutoComplete.
* `BorderBrush` (`Brush`)—Defines the brush of the border around the control.
* `BorderThickness` (`Thickness`)—Defines the thickness of the border around the control.
* `ClearButtonStyle` (of type `Style` with target type `Telerik.Maui.Controls.RadTemplatedButton`)—Defines the style for the clear button.

The AutoComplete control uses the [`RadTextInput`]({%slug entry-textinput%}) control internally. To style the input control (`RadTextInput`), use the `TextInputStyle` (of type `Style` with target type `Telerik.Maui.Controls.RadTextInput`).
Expand All @@ -29,6 +30,12 @@ The following properties style the AutoComplete SuggestionView (the dropdown wit
* `SuggestionViewBorderColor`(`Color`)—Defines the color of the SuggestionView border.
* `SuggestionViewBorderThickness`—Defines the thickness of the border that surrounds the SuggestionView.
* `SuggestionViewCornerRadius`—Defines the corner radius applied to the SuggestionView.

## Suggestion Item Styling

The following properties style the AutoComplete SuggestionItem (the item inside the dropdown with the suggestions):

* `SuggestionItemStyle` (of type `Style` with target type `Telerik.Maui.Controls.RadCollectionViewItemView`)—Defines the style of the suggestion item. When using keyboard navigation, you can apply style for the currently focused item. Review the [CollectionView Visual States]({%slug collectionview-visual-states%}) article.
* `SuggestionItemHighlightTextColor`—Defines the highlight color of the selection items.

### Example for AutoComplete Styling
Expand Down
2 changes: 0 additions & 2 deletions controls/combobox/keyboard-support.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,6 @@ slug: combobox-keyboard-support

The [Telerik UI for .NET MAUI ComboBox]({%slug combobox-overview%}) provides keyboard navigation support on `WinUI` and `MacCatalyst`.

>important Keyboard support is available only on .NET 8.0.

The following table lists the actions and keyboard combinations that are available in the ComboBox:

| Hotkey Combinations | Action |
Expand Down