0

In my Xamarin.Forms application I use a custom renderer for entries, since I want them to be made of a single, bottom border. The problem is that I can't find out the right code to make the custom renderer use the element's width. Currently, the situation is like this:

enter image description here

As you can see, the bottom border goes far beyond the real element's width, but I don't understand why. Here I found something, but still I don't understand how to fix this and why this happens. My current code for the renderer class is:

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

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

            var view = Element as CustomEntry;

            var borderLayer = new CALayer
            {
                Frame = new CGRect(0f, Frame.Height + 5, Frame.Width, 1f),
                BorderColor = UIColor.Gray.CGColor,
                BackgroundColor = UIColor.Magenta.CGColor,
                BorderWidth = 13,
                MasksToBounds = true
            };

            Control.Layer.AddSublayer(borderLayer);
        }
    }
}

The problem seems to be in that Frame.Width. If I set it to 100, for example, the width of the bottom line of the entry is set to 100, but the problem is that, doing so, I'm not able to horizontally center the line. I want this outcome:

enter image description here

Pine Code
  • 2,466
  • 3
  • 18
  • 43
  • Did you try to use the width of text instead of the Frame.Width ? – Leo Zhu Mar 31 '21 at 06:36
  • @LeoZhu-MSFT would you be so kind to tell me what I should write instead of `Frame.Width`? Keep in mind that the four bottom lines must have the same width. I'm sorry if my question was not clear enough: I updated it! – Pine Code Mar 31 '21 at 08:02

0 Answers0