November 21, 2016

Xamarin Form Frame outline color display issue in android

This is the quick glance on the issue i have faced during the use of Frame control in Xamarin form project and sharing here hoping that may helpful to somebody with the same issue.

Using Xamarin form Frame controls shows some strange behaviour in android platform where as it shows elegant look in iOS.
We can notice this difference in below screenshot.[Nexus S (KitKat) and Simulator iPhone6 iOS9.3]



     

This is also reported bug in xamarin bugzilla [https://bugzilla.xamarin.com/show_bug.cgi?id=27460 ]
To solve this frame border issue in android we can think of using two approaches. 

1)Having the custom renderer class with overriding method Draw and private method DrawOutline.
By adding below custom renderer class we can change the frame border corner radius, border color and border stroke.
2)Update the Frame background with rounded corner selector xml by providing stroke, corner radius and color.


After adding above Frame renderer:



Reference: https://github.com/xamarin/Xamarin.Forms/blob/master/Xamarin.Forms.Platform.Android/Renderers/FrameRenderer.cs  
Explore complete code base @ https://github.com/suchithm/FrameBugPoc Keep visiting for more exciting stuffs on mobile application development. Happy coding :)