-
Notifications
You must be signed in to change notification settings - Fork 18
Added new kb article change-entry-cursor-color-dotnet-maui #1299
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
didiyordanova
merged 2 commits into
master
from
new-kb-change-entry-cursor-color-dotnet-maui-8287b6d6bb204bc88baf17f188260650
Dec 3, 2025
Merged
Changes from all commits
Commits
Show all changes
2 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
106 changes: 106 additions & 0 deletions
106
knowledge-base/change-entry-cursor-color-dotnet-maui.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,106 @@ | ||
| --- | ||
| title: Changing Entry Cursor Color on Android and iOS | ||
| description: Learn how to change the cursor color of the Entry control on Android and on iOS to match the application's input field styling. | ||
| type: how-to | ||
| page_title: Adjusting Cursor Color for Entry Control in UI for .NET MAUI | ||
| meta_title: Adjusting Cursor Color for Entry Control in UI for .NET MAUI | ||
| slug: change-entry-cursor-color-dotnet-maui | ||
| tags: entry, ui for .net maui, cursor color, android, radtextinput, handlerchanged, native customization | ||
| res_type: kb | ||
| --- | ||
|
|
||
| ## Environment | ||
|
|
||
| | Version | Product | Author | | ||
| | --- | --- | ---- | | ||
| | 8.0.0 and above | Telerik UI for .NET MAUI Entry | [Dobrinka Yordanova](https://www.telerik.com/blogs/author/dobrinka-yordanova) | | ||
|
|
||
| ## Description | ||
|
|
||
| I am trying to change the cursor color of the [UI for .NET MAUI Entry ](https://www.telerik.com/maui-ui/documentation/controls/entry/overview) control on Android and on iOS to match the color of other input fields in the application. However, the available documentation for customizing the cursor is for versions 5.2.0 to 7.0.0 and is incompatible with the current version. Since version 8.0.0, the control uses `RadTextInput` internally instead of `RadEntry`, which requires different logic for cursor customization. | ||
|
|
||
| This knowledge base article also answers the following questions: | ||
| - How to update Entry cursor color on mobile? | ||
| - How to handle breaking changes for cursor customization in Entry after version 8.0.0? | ||
| - How to apply native logic to change cursor color in Entry control? | ||
|
|
||
| ## Solution | ||
|
|
||
| To modify the cursor color in the Entry control, follow these steps: | ||
|
|
||
| 1. Handle the `Loaded` event of the Entry control to locate the internal `RadTextInput` control and apply the necessary native logic. | ||
| 2. Use the `Handler` property of `RadTextInput` to update the cursor color for Android and iOS. | ||
|
|
||
| ```csharp | ||
| private void entry_Loaded(object sender, EventArgs e) | ||
| { | ||
| var textInput = ChildOfType<RadTextInput>(this.entry); | ||
| if (textInput != null) | ||
| { | ||
| var handler = textInput.Handler; | ||
| if (handler == null) | ||
| { | ||
| textInput.HandlerChanged += this.OnTextInputHandlerChanged; | ||
| } | ||
| else | ||
| { | ||
| this.UpdateNativeElement(handler); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| private void OnTextInputHandlerChanged(object sender, EventArgs e) | ||
| { | ||
| var textInput = (RadTextInput)sender; | ||
| this.UpdateNativeElement(textInput.Handler); | ||
| textInput.HandlerChanged -= this.OnTextInputHandlerChanged; | ||
| } | ||
|
|
||
| private void UpdateNativeElement(IViewHandler handler) | ||
| { | ||
| var nativeEntry = handler.PlatformView as Telerik.Maui.Platform.RadMauiTextInput; | ||
| if (nativeEntry != null) | ||
| { | ||
| #if ANDROID | ||
| nativeEntry.TextCursorDrawable?.SetColorFilter(new Android.Graphics.PorterDuffColorFilter(Android.Graphics.Color.Red, Android.Graphics.PorterDuff.Mode.Darken)); | ||
| #elif __IOS__ | ||
| nativeEntry.TintColor = UIKit.UIColor.Red; | ||
| #endif | ||
| } | ||
| } | ||
|
|
||
| internal static T ChildOfType<T>(View visualElement) where T : View | ||
| { | ||
| if (visualElement == null) | ||
| { | ||
| return null; | ||
| } | ||
|
|
||
| foreach (var item in VisualTreeElementExtensions.GetVisualTreeDescendants(visualElement)) | ||
| { | ||
| if (item is T targetElement) | ||
| { | ||
| return targetElement; | ||
| } | ||
| } | ||
|
|
||
| return null; | ||
| } | ||
| ``` | ||
|
|
||
| 3. Add sample Entry definition in XAML: | ||
|
|
||
| ```xaml | ||
| <VerticalStackLayout> | ||
| <telerik:RadEntry x:Name="entry" | ||
| Loaded="entry_Loaded" /> | ||
| </VerticalStackLayout> | ||
| ``` | ||
|
|
||
|
|
||
| ## See Also | ||
|
|
||
| - [Breaking Changes in UI for .NET MAUI 8.0.0](https://www.telerik.com/maui-ui/documentation/upgrade/breaking-changes/8-0-0) | ||
| - [Feature Request: Change Cursor Color in Entry](https://feedback.telerik.com/maui/1609886-entry-provide-an-option-to-change-the-cursor-caret-color) | ||
| - [UI for .NET MAUI Entry Overview](https://www.telerik.com/maui-ui/components/entry/overview) | ||
|
|
||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.