To achieve this effect, you need to create a custom TabbedPageRenderer.
On Android:
public class EnhancedTabbedPageRenderer : TabbedPageRenderer
{
private BottomNavigationView _bottomNavigationView;
public EnhancedTabbedPageRenderer(Context context) : base(context)
{
}
protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
{
base.OnElementChanged(e);
if (e.NewElement != null)
{
_bottomNavigationView = ((RelativeLayout)GetChildAt(0)).GetChildAt(1) as BottomNavigationView;
}
}
protected override void OnLayout(bool changed, int l, int t, int r, int b)
{
base.OnLayout(changed, l, t, r, b);
GradientStrokeDrawable topBorderLine = new GradientStrokeDrawable();
// Change it to the color you want.
topBorderLine.SetStroke(1, Color.FromRgb(0x00, 0x00, 0x00).ToAndroid());
// Set alpha if needed.
topBorderLine.Alpha = 0x33;
LayerDrawable layerDrawable = new LayerDrawable(new Drawable[] { topBorderLine });
layerDrawable.SetLayerInset(0, 0, 0, 0, _bottomNavigationView.Height - 2);
_bottomNavigationView.SetBackground(layerDrawable);
}
}
On iOS:
Work in progress