Outline color of the Frame is not displayed in Xamarin Forms Android Project using MvvmCross

Question

Currently I am working on a Xamarin Forms Android project using MvvmCross. I have a strange problem regarding the Frame. Whenever I set the OutlineColor, it is displayed only in iOS and not in Android. I've tried with a different Xamarin Forms projects and it is displayed by both platforms without any problems. I don't have any indications why this is happening. Could MvvmCross somehow related with the issue?

Here is a sample:

  <core:BasePage
        xmlns="http://xamarin.com/schemas/2014/forms"
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
        xmlns:core="clr-namespace:Core.Base.Views;assembly=Core"
        x:Class="Views.TestPage"
        BackgroundImage="background_secret.png"
        Title="Test">

        <ContentPage.Content>
            <Grid
                HorizontalOptions="FillAndExpand"
                Padding="12,20,12,20"
                VerticalOptions="FillAndExpand">
                <Frame
                    HasShadow="false"
                    VerticalOptions="Fill"
                    BackgroundColor="White"
                    OutlineColor="#1961ac">
                    <StackLayout>
                        <Frame
                                VerticalOptions="Start"
                                Padding="8,4,8,4"
                                HasShadow="false"
                                OutlineColor="#9DB0BB">
                                <Label Text="Test"></Label>
                            </Frame>
                    </StackLayout>
        </Frame>
            </Grid>
        </ContentPage.Content>
    </core:BasePage>

Xamarin Forms Version 2.1 MvvmCross Version 4.1

Answer 1

Even i got the same issue, to solve this i have added custom renderer for Frame control. In framerenderer need to override method Draw and private method DrawOutline as follows,

public override void Draw(ACanvas canvas)
{
    base.Draw(canvas);
    DrawOutline(canvas, canvas.Width, canvas.Height, 4f);//set corner radius
}
void DrawOutline(ACanvas canvas, int width, int height, float cornerRadius)
{
    using (var paint = new Paint { AntiAlias = true })
    using (var path = new Path())
    using (Path.Direction direction = Path.Direction.Cw)
    using (Paint.Style style = Paint.Style.Stroke)
    using (var rect = new RectF(0, 0, width, height))
    {
        float rx = Forms.Context.ToPixels(cornerRadius);
        float ry = Forms.Context.ToPixels(cornerRadius);
        path.AddRoundRect(rect, rx, ry, direction);

        paint.StrokeWidth = 2f;  //set outline stroke
        paint.SetStyle(style);
        paint.Color = Color.ParseColor("#A7AE22");//set outline color //_frame.OutlineColor.ToAndroid(); 
        canvas.DrawPath(path, paint);
    }
} 

And in another approach you can also consider using the android selector xml of rounded corner as a background resource. For more detail on this check my blog post: http://www.appliedcodelog.com/2016/11/xamarin-form-frame-outline-color_21.html