Working RoundedBoxView for alll Platforms!!!

Hello,

i was looking for a working RoundedBoxView Renderer and couldnt find one, so i had to do it by my own. In case someone need it here it is, for iOS, Android, Windows UWP and Windows 8.1 (Phone).

// Portable Class
using Xamarin.Forms;

namespace ROIDU
{
    public class RoundedBoxView : BoxView
    {
        public static readonly BindableProperty CornerRadiusProperty = BindableProperty.Create<RoundedBoxView, double>(p => p.CornerRadius, 0);

        public double CornerRadius
        {
            get { return (double)GetValue(CornerRadiusProperty); }
            set { SetValue(CornerRadiusProperty, value); }
        }
    }
}

// iOS
using ROIDU;
using ROIDU.iOS;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(RoundedBoxView), typeof(RoundedBoxViewRenderer))]
namespace ROIDU.iOS
{
    public class RoundedBoxViewRenderer : BoxRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<BoxView> e)
        {
            base.OnElementChanged(e);

            RoundedBoxView rbv = (RoundedBoxView)this.Element;
            if (Element != null)
            {
                Layer.MasksToBounds = true;
                Layer.CornerRadius = (float)rbv.CornerRadius;
            }
        }
    }
}

// Android
using Android.Graphics;
using ROIDU;
using ROIDU.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(RoundedBoxView), typeof(RoundedBoxViewRenderer))]
namespace ROIDU.Droid
{
    public class RoundedBoxViewRenderer : BoxRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<BoxView> e)
        {
            base.OnElementChanged(e);

            SetWillNotDraw(false);
            Invalidate();
        }

        public override void Draw(Canvas canvas)
        {
            var box = Element as RoundedBoxView;
            var rect = new Rect();
            var paint = new Paint()
            {
                Color = box.Color.ToAndroid(),
                AntiAlias = true,
            };

            GetDrawingRect(rect);
            var radius = (float)(rect.Width() / box.Width * box.CornerRadius);
            canvas.DrawRoundRect(new RectF(rect), radius, radius, paint);
        }
    }
}

// UWP
using ROIDU;
using ROIDU.UWP;
using Xamarin.Forms;
using Xamarin.Forms.Platform.UWP;

[assembly: ExportRenderer(typeof(RoundedBoxView), typeof(RoundedBoxViewRenderer))]
namespace ROIDU.UWP
{
    public class RoundedBoxViewRenderer : BoxViewRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<BoxView> e)
        {
            base.OnElementChanged(e);

            RoundedBoxView rbv = (RoundedBoxView)this.Element;
            if (Control != null)
            {
                Control.RadiusX = rbv.CornerRadius;
                Control.RadiusY = rbv.CornerRadius;
            }
        }
    }
}

// Windows 8.1 and Phone 8.1
using ROIDU;
using ROIDU.Windows;
using Xamarin.Forms;
using Xamarin.Forms.Platform.WinRT;

[assembly: ExportRenderer(typeof(RoundedBoxView), typeof(RoundedBoxViewRenderer))]
namespace ROIDU.Windows
{
    public class RoundedBoxViewRenderer : BoxViewRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<BoxView> e)
        {
            base.OnElementChanged(e);

            RoundedBoxView rbv = (RoundedBoxView)this.Element;
            if (Control != null)
            {
                Control.RadiusX = rbv.CornerRadius;
                Control.RadiusY = rbv.CornerRadius;
            }
        }
    }
}

Answers

  • Thank you. I tested it on iOS and Android and it's working fine. But I made a small change in Droid.RoundedBoxViewRenderer.

    From:

    Color = box.Color.ToAndroid(),

    to:

    Color = box.BackgroundColor.ToAndroid()

  • Thank you. I tested it on iOS and Android and it's working fine. But I made a small change in Droid.RoundedBoxViewRenderer.

    From:

    Color = box.Color.ToAndroid(),

    to:

    Color = box.BackgroundColor.ToAndroid()

Sign In or Register to comment.