Parent Custom Renderer not being called on iOS - ios

Question

I use a base content page for all pages in my app. I want to add a gradient to the content page so I created LocalGradientContentPage and had BaseContentPage inherit LocalGradientContentPage. Each platform has a custom renderer and everything works perfectly on Android. The android custom renderer is called when BaseContentPage is used. The issue is with iOS. iOS never calls the custom renderer when using BaseContentPage. It only calls the custom renderer if I use LocalGradientContentPage directly. All my classes follow.
LocalGradientContentPage.cs
namespace MyNamespace.Forms
{
public class LocalGradientContentPage : ContentPage
{
public static readonly BindableProperty EndColorProperty = BindableProperty.Create(
nameof(EndColor),
typeof(Color),
typeof(LocalGradientContentPage),
Color.White);
public Color EndColor
{
get => (Color)GetValue(EndColorProperty);
set => SetValue(EndColorProperty, value);
}
public static readonly BindableProperty StartColorProperty = BindableProperty.Create(
nameof(StartColor),
typeof(Color),
typeof(LocalGradientContentPage),
Color.Black);
public Color StartColor
{
get => (Color)GetValue(StartColorProperty);
set => SetValue(StartColorProperty, value);
}
}
}
Android: LocalGradientContentPageRenderer.cs
[assembly: ExportRenderer(typeof(LocalGradientContentPage),typeof(LocalGradientContentPageRenderer))]
namespace MyNamespace.DroidRenderers
{
public class LocalGradientContentPageRenderer : PageRenderer
{
public LocalGradientContentPageRenderer(Context context) : base(context)
{
}
private Xamarin.Forms.Color StartColor { get; set; }
private Xamarin.Forms.Color EndColor { get; set; }
protected override void DispatchDraw(Canvas canvas)
{
var gradient = new LinearGradient(0, 0, 0, Height,
StartColor.ToAndroid(),
EndColor.ToAndroid(),
Shader.TileMode.Mirror);
var paint = new Paint()
{
Dither = true,
};
paint.SetShader(gradient);
canvas.DrawPaint(paint);
base.DispatchDraw(canvas);
}
protected override void OnElementChanged(ElementChangedEventArgs<Page> e)
{
base.OnElementChanged(e);
if (e.OldElement != null || Element == null)
{
return;
}
if (!(e.NewElement is LocalGradientContentPage page)) return;
StartColor = page.StartColor;
EndColor = page.EndColor;
}
}
}
iOS:LocalGradientContentPage.cs
[assembly: ExportRenderer(typeof(LocalGradientContentPage), typeof(LocalGradientContentPageRenderer))]
namespace MyNamespace.iOSRenderers
{
public class LocalGradientContentPageRenderer : PageRenderer
{
protected override void OnElementChanged(VisualElementChangedEventArgs e)
{
base.OnElementChanged(e);
if (e.OldElement != null) return;
if (e.NewElement is LocalGradientContentPage page)
{
var gradientLayer = new CAGradientLayer
{
Frame = View.Bounds,
Colors = new CGColor[] { page.StartColor.ToCGColor(), page.EndColor.ToCGColor() }
};
View.Layer.InsertSublayer(gradientLayer, 0);
}
}
}
}
BaseContentPage.cs
public partial class BaseContentPage : LocalGradientContentPage
{
public BaseContentPage() : base()
{
InitializeComponent();
}
}
Using like this works:
<views:LocalGradientContentPage
StartColor="Blue"
EndColor="HotPink">
</views:LocalGradientContentPage>
Using like this does not work and the iOS LocalGradientContentPageRenderer is never called:
<views:BaseContentPage
StartColor="Blue"
EndColor="HotPink">
</views:LocalGradientContentPage>
I've do not have linking but just in case I did instantiate LocalGradientContentPage in AppDelegate.cs. It does hit the constructor when instantiated this way.
_ = new LocalGradientContentPage();
Also, as stated earlier, this is working fine in Android and calls the custom renderer when BaseContentPage is used.
I'm really at a loss as to why this isn't working. Any help would be appreciated.

Answer 1

Well, I use you code and add the views:BaseContentPage to a tabbedPage, it works well.
I use it like:
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:views="clr-namespace:App629"
mc:Ignorable="d"
x:Class="App629.TabbedPage1">
<!--Pages can be added as references or inline-->
<views:BaseContentPage
StartColor="Blue"
EndColor="HotPink"/>
<ContentPage Title="Tab 2" />
<ContentPage Title="Tab 3" />
<views:BaseContentPage StartColor="Red" EndColor="HotPink">
</views:BaseContentPage>
</TabbedPage>
Some suggestions:
I'm using the latest Xamarin.forms version.
Check if there are any other codes in the BaseContentPage that affect the custom renderer?
Try the code as me to check if it works?
Add a breakPoint there in the custom renderer to check if it hit the code.