Xamarin.Forms custom renderer for Android control from .axml layout

Question

I'm trying to figure out how to use an .axml layout file for a custom control in Xamarin.Forms. Can anyone provide an example of using an .axml file in a custom renderer? For example, I want to create a custom Entry control, (EnhancedEntry). I want it to have configurable background and border colors as well as configurable border width.

I've created background shape,

drawable/enchancedEntryBackground.xml:

<?xml version="1.0" encoding="UTF-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
        <corners android:bottomLeftRadius="3dp" android:bottomRightRadius="3dp" android:topLeftRadius="3dp" android:topRightRadius="3dp" />
        <stroke android:width="0.5dp" android:color="@android:color/holo_blue_dark" />
        <solid android:color="@android:color/white" />
    </shape>

I have a layout defined in an .axml file thus,

layout/EnhancedEntry.axml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/enhancedEntry"
        android:background="@drawable/enhancedentrybackground" />
</LinearLayout>

Given a custom renderer skeleton and a class with properties to support the enhancements, is it possible to use the xml and axml specifications to create the new look?

[assembly: ExportRenderer(typeof(EnhancedEntry), typeof(EnhancedEntryRenderer))]
namespace eSiteMobile.Droid.CustomRenderers
{

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

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);
        }        
    }
}

public class EnhancedEntry : Entry
    {
        public static BindableProperty BorderColorProperty = BindableProperty.Create(nameof(BorderColor), typeof(Color),
            typeof(EnhancedEntry), default(Color), defaultBindingMode: BindingMode.OneWay);

        public static BindableProperty BorderWidthProperty = BindableProperty.Create(nameof(BorderWidth), typeof(int),
            typeof(EnhancedEntry), default(int), defaultBindingMode: BindingMode.OneWay);

        public Color BorderColor
        {
            get { return (Color) GetValue(BorderColorProperty); }
            set { SetValue(BorderColorProperty, value); }
        }

        public int BorderWidth
        {
            get { return (int) GetValue(BorderWidthProperty); }
            set { SetValue(BorderWidthProperty, value); }
        }
    }

B Best B Best · Accepted Answer · 2017-07-11T22:39:53

You can configure the properties you are talking about in OnElementChanged() referring to the rendered Entry as Control. It's not in axml or xml but its still possible.

Apparently in the Solution Explorer in VS you can click "Show All Files" and it will show the Android.Resource.Layout folder to add custom layout files. I say apparently because this did not work for me, but it is worth a try if you still are wanting to it in xml.

Once that is done you should be able to reference the layout file where you customized the View in the OnElementChanged() method but I find it easier to do it all in one place!

Xamarin.Forms custom renderer for Android control from .axml layout

1 Answers