Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Xamarin Forms Entry with coloured border on Android

I have made a custom rendered entry for my app that at the minute just adds padding to the text. I would also like the border color to always be blue, even when the user focuses on the entry. I have this code at the minute in my Android custom entry (taken from here, but it doesn't work, it simply adds just a blue background):

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

        if (Control != null)
        {
            var view = (BlueBorderEntry)Element;
            GradientDrawable gd = new GradientDrawable();

            //Below line is useful to give border color
            gd.SetColor(global::Android.Graphics.Color.Rgb(45, 192, 232));


            this.Control.SetBackgroundDrawable(gd);
            this.Control.SetPadding(40, 40, 40, 40);


            this.Control.SetRawInputType(InputTypes.TextFlagNoSuggestions);
        }
    }

I have explored what could possibly set the border color and found:

this.Control.SetCompoundDrawables();

Which is described as:

Sets the drawables to appear to the left, above, right and below the text.

However after passing in a Drawable with the blue color, it did absolutely nothing to my entry.

I can't seem to figure out how to get the border to be a blue color, if someone could please help me?

EDIT: I need the border to be on the bottom of the entry and about 5px thick.

like image 668
Matt Ward Avatar asked Feb 06 '26 04:02

Matt Ward


2 Answers

You can, without a renderer, use a Frame and put the Entry inside the frame, and set the border color for the frame.This is the easy way.

Or you can modify your renderer:

public class CustomEntryRenderer : EntryRenderer
        {
            protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
            {
                base.OnElementChanged(e);
                if (e.OldElement == null)
                {
                    var nativeEditText = (global::Android.Widget.EditText)Control;
                    var shape = new ShapeDrawable(new Android.Graphics.Drawables.Shapes.RectShape());
                    shape.Paint.Color = Xamarin.Forms.Color.Red.ToAndroid();
                    shape.Paint.SetStyle(Paint.Style.Stroke);
                    nativeEditText.Background = shape;
                }
            }
        }
like image 96
Bruno Caceiro Avatar answered Feb 07 '26 23:02

Bruno Caceiro


Usually, I don't like workarounds but this just too hard to ignore :

<FooLayout BackgroundColor="White">
  <StackLayout BackgroundColor="Black" Padding="1">
      <Entry BackgroundColor="White" />
  </StackLayout>
    ...
 </FooLayout>

Where FooLayout is analogy for any layout

like image 42
FreakyAli Avatar answered Feb 07 '26 22:02

FreakyAli



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!