1

In Xamarin Forms, I am using 

<ContentPage 
    xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
    ios:Page.UseSafeArea="true" >

to make the Application UI compatible with iPhone X, but its working only in iOS 11. Anyone have a suggestion on how to make this work on all iOS devices?

Paul Kertscher
  • 9,416
  • 5
  • 32
  • 57
user1983104
  • 81
  • 2
  • 10
  • https://stackoverflow.com/questions/47779937/how-to-allow-for-ios-status-bar-and-iphone-x-notch-in-xamarin-forms may help. – ColeX Feb 08 '18 at 09:09

1 Answers1

6

The concept of the safe area is exclusive to iPhone X, hence to iOS 11+. Anyway, per default an app uses the whole phones screen (as opposed to Android), hence, if the status bar is shown (you can hide it if you need, but that's another story), your app will overlap it.

Xamarin.Forms NavigationPage will automatically adapt to the available area (others maybe too), but if you are using a bare ContentPage for example, you'll have to take care of by yourself.

To handle things differently on different platforms, there is the OnPlatform tag in XAML (see here). With that you can add a platform-dependent padding to your ContentPage

<ContentPage.Padding>
    <OnPlatform x:TypeArguments="Thickness">
        <On Platform="iOS" Value="0,20,0,0" />
    </OnPlatform>
</ContentPage.Padding>

which will prevent your page overlapping the status bar.

Paul Kertscher
  • 9,416
  • 5
  • 32
  • 57
  • 2
    I have try this solution too, but padding 20 is not enough for iphone X's Top, then if added both solutions (padding 20 and UseSafeArea) then iphone X will have too much of spacing. – user1983104 Feb 08 '18 at 06:34