How to eliminate the WinUI3 TextBox underscore at runtime?

Question

I've been scratching my head over what should be a very simple problem. I've been developing GUIs for decades, but I'm something of a tyro with WinUI 3. I'm developing a Maui custom Entry (WinUI TextBox) control, and have access at runtime to the native control. It displays a rather annoying underscore character I want to get rid of since I'm implementing my own border; I want to either eliminate it programmatically, or render it invisible by setting its color to Transparent. I cannot, for the life of me, figure out how to do this simple task. Can anyone suggest an appropriate path? I've been Googling and Binging everywhere and even ChatGPT doesn't offer a solution.

I have no idea what to try at this point. I see no way to influence the underscore without also changing the text.

Do you mean the bottom border (usually skyblue) of the `TextBox` that appears when you edit the text? — Andrew KeepCoding, Jul 05 '23 at 00:47
Yes, that is what I mean. I want to make it transparent without affecting the color of any text entered. I'm wrapping it inside an animation. — Gary Lewis, Jul 05 '23 at 00:53

score 0 · Accepted Answer · answered Jul 05 '23 at 01:06

The line at the bottom border of TextBox is a Border named "BorderElement".

In order to access this element inside TextBox, you can use the VisualTreeHelper but it's easier using the CommunityToolkit.WinUI.UI NuGet package.

private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
    if (this.TextBoxControl
        .FindDescendants()
        .OfType<Border>()
        .FirstOrDefault(x => x.Name is "BorderElement") is Border borderElement)
    {
        borderElement.Visibility = Visibility.Collapsed;
    }
}

You can see how this "BorderElement" is in the "DefaultTextBoxStyle" in the generic.xaml.

Thanks! In Maui I don't have access to generic.xaml, but C# code I can use to alter the control at runtime. If your suggestion works, I'll mark it as answered. — Gary Lewis, Jul 05 '23 at 01:24

score 0 · Answer 2 · answered Jul 05 '23 at 03:51

Andrew above offered a potential solution that unfortunately did not pan out since the code I was attempting to interact with returned null to FindDescendants. However, Andrew did get me aimed at the proper part of the WinUI 3 docs that resulting in my finding a solution.

Given a WinUI TextBox control, the best way to eliminate the border is:

textBox.BorderThickness = default;

Since the default border thickness is zero, this offers the solution I needed. Thank you, Andrew, for pointing me in the right direction.

How to eliminate the WinUI3 TextBox underscore at runtime?

2 Answers2