I've a question about the use of safe area for iOS.
I use a background image through a RelativeLayout
, and I display a form on this background image. I use a margin
for iOS on the form's container: this works fine, but the render on a iPhone X is not very nice.
<RelativeLayout>
<Image Source="background.jpg" Opacity="0.75"
Aspect="AspectFill"
RelativeLayout.WidthConstraint =
"{ConstraintExpression Type=RelativeToParent, Property=Width}"
RelativeLayout.HeightConstraint =
"{ConstraintExpression Type=RelativeToParent, Property=Height}" />
<ScrollView RelativeLayout.WidthConstraint =
"{ConstraintExpression Type=RelativeToParent, Property=Width}"
RelativeLayout.HeightConstraint =
"{ConstraintExpression Type=RelativeToParent, Property=Height}">
<ScrollView.Margin>
<OnPlatform x:TypeArguments="Thickness">
<On Platform="iOS" Value="0, 20, 0, 0" />
</OnPlatform>
</ScrollView.Margin>
<StackLayout>
<!-- Header -->
<StackLayout VerticalOptions="Start">
<fnc:HunterHeader />
</StackLayout>
<!-- Form -->
<StackLayout VerticalOptions="CenterAndExpand"
Spacing="6" Margin="20">
<!-- ... -->
</StackLayout>
</StackLayout>
</RelativeLayout>
So I've tried to set the UseSafeArea
to true, but I got top and bottom margins.
Is it possible to fix this, and to combine UseSafeArea and a background image?
Or is there a way to add specific margin for the iPhone X only?