MAUI: Entry text and placeholders are not visible when using a custom entry on Android 11 and Android 13

Sreejith Sreenivasan 1,001 Reputation points
2023-11-01T15:47:57.8766667+00:00

In my MAUI application, the entry and editor placeholder color and text color are not working, showing blank in UI. It is working fine on Android 10 and Android 12, but not working on Android 11 and Android 13. I am using a custom entry and custom editor. Adding its codes below:

Custom Entry

public class CustomEntryRenderer : EntryRenderer
{
    public CustomEntryRenderer(Context context) : base(context)
    {
    }

    protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            GradientDrawable gd = new GradientDrawable();
            gd.SetColor(global::Android.Graphics.Color.Transparent);
            this.Control.Background = gd;
            this.Control.SetRawInputType(InputTypes.TextFlagNoSuggestions);
        }
    }
}

Custom Editor

public class CustomNoUnderLineEditorRenderer : EditorRenderer
{
    public CustomNoUnderLineEditorRenderer(Context context) : base(context)
    {
    }

    protected override void OnElementChanged(ElementChangedEventArgs<Editor> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            GradientDrawable gd = new GradientDrawable();
            gd.SetColor(global::Android.Graphics.Color.Transparent);
            this.Control.SetBackgroundDrawable(gd);
            this.Control.SetRawInputType(InputTypes.TextFlagNoSuggestions);
            Control.SetHintTextColor(ColorStateList.ValueOf(global::Android.Graphics.Color.Gray));
        }
    }
}

Xaml

<Frame 
     x:Name="titleentry_frame"
     Margin="0,5,0,5"
     Style="{StaticResource CreateRequest_Editor_FrameStyle}">

    <renderer:CustomEntry
     x:Name="title_entry"
     Keyboard="Default"
     Placeholder="Enter title"
     Style="{StaticResource CreateRequest_EntryStyle}"/>
</Frame>

<Frame 
     x:Name="requesteditor_frame"
     Margin="0,11,0,11"
     Style="{StaticResource CreateRequest_Editor_FrameStyle}">

    <renderer:CustomNoUnderLineEditor
        x:Name="description_editor"
        AutoSize="TextChanges"
        Placeholder="Enter description"
        Style="{StaticResource CreateRequest_EditorStyle}">
    </renderer:CustomNoUnderLineEditor>
</Frame>

I am adding a sample project here for reproducing this issue.

Update:

Custom Entry For iOS

public class CustomEntryRenderer : EntryRenderer
{
	protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
	{
		base.OnElementChanged(e);

		if (Control != null)
		{
			Control.BorderStyle = UITextBorderStyle.None;
		}
	}
}

Custom Editor For iOS

public class CustomEditorRenderer : EditorRenderer
{
    public CustomEditorRenderer()
    {
        UIKeyboard.Notifications.ObserveWillShow((sender, args) =>
        {
            if (Element != null)
            {
                Element.Margin = new Thickness(0, 0, 0, args.FrameEnd.Height);
            }
        });

        UIKeyboard.Notifications.ObserveWillHide((sender, args) =>
        {
            if (Element != null)
            {
                Element.Margin = new Thickness(0);
            }
        });
    }
	
    protected override void OnElementChanged(ElementChangedEventArgs<Editor> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            Control.BorderStyle = UITextBorderStyle.None;
            Control.Layer.CornerRadius = 10;
            Control.TextColor = UIColor.Black;
        }
    }
}

When migrating to handler, how can I add the iOS entry and editor renderers to the code, could you please show me the sample of that too?

Developer technologies | .NET | .NET MAUI
0 comments No comments
{count} votes

Accepted answer
  1. Anonymous
    2023-11-02T04:07:52.99+00:00

    Hello,

    EntryRenderer and EditorRenderer is deprecated, please use handler to implement it. you can add following code to your layout background code to make a test. It works in Android 11 or 13

    Microsoft.Maui.Handlers.EntryHandler.Mapper.AppendToMapping(nameof(Entry), (handler, view) =>
    {
            if (view is CustomEntry)
            {
    #if ANDROID
                           handler.PlatformView.SetBackgroundColor(Android.Graphics.Color.Transparent);                 handler.PlatformView.SetRawInputType(InputTypes.TextFlagNoSuggestions);
    #endif
             }
    });
    
            Microsoft.Maui.Handlers.EditorHandler.Mapper.AppendToMapping(nameof(Editor), (handler, view) =>
    {
          if (view is CustomNoUnderLineEditor)
          {
    #if ANDROID
    handler.PlatformView.SetBackgroundColor(Android.Graphics.Color.Transparent);           handler.PlatformView.SetRawInputType(Android.Text.InputTypes.TextFlagNoSuggestions);
    handler.PlatformView.SetHintTextColor(Android.Graphics.Color.Gray);
    
    #endif
            }
    });
    

    By the way, if you use custom renderer and set Background="Transparent", you will get the blank result, if you remove Background="Transparent", it is working as well.

    >entry text is not visible.

    You can set text color in the handler with handler.PlatformView.SetTextColor(Android.Graphics.Color.ParseColor("Black"));,

    Best Regards,

    Leon Lu


    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.


0 additional answers

Sort by: Most helpful

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.