Xamarin iOS ignoring padding style for ContentPage

Question

Im try to set padding for ContentPage in different ways:

1. Direct in ContentPage tag

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                x:Class="SkeletonApp.Example.MainPage"
                Padding="10,15,10,15">
<!-- Content -->
</ContentPage>

2. Separate define in xaml-file

<ContentPage ...>
                <ContentPage.Padding>
                     <OnPlatform x:TypeArguments="Thickness">
                          <On Platform="iOS" Value="0,80,0,0" />
                     </OnPlatform>
                </ContentPage.Padding>
<!-- Content -->
</ContentPage>

3. In Application.Resources block

<Style TargetType="ContentPage" ApplyToDerivedTypes="True"> 
    <Setter Property="BackgroundColor" Value="{AppThemeBinding Light=#FFFFFF, Dark=#000000}" />
    <Setter Property="Padding" Value="10,15,10,15"/>
</Style>

But in all cases iOS(Simulator or device) ignored this styles while the Android shows everything is fine.

Moreover, the iOS only ignores padding and applies color styles o_O

Im tested styling padding for other element(Label) - is fine

I guessed what UseSafeArea=True create a trouble but no. If set UseSafeArea=False or remove nothing to change

Why does this happen and how to deal with it?

---

UPD

---

App.xaml

<?xml version="1.0" encoding="utf-8" ?>
<Application
    x:Class="SkeletonApp.App"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:customePage="clr-namespace:SkeletonApp.View.Page;assembly=SkeletonApp"
    >
    <Application.Resources>
        <Style TargetType="ContentPage" ApplyToDerivedTypes="True"> 
            <Setter Property="Padding" Value="10,15,10,15"/>
        </Style>
    </Application.Resources>
</Application>

App.xaml.cs

using Xamarin.Forms;
using SkeletonApp.Example;

namespace SkeletonApp
{
    public partial class App : Application
    {
        public App()
        {
            InitializeComponent();

            MainPage = new TabBarNagivation();
        }

        protected override void OnStart() { }
        protected override void OnSleep() { }
        protected override void OnResume() { }
    }
}

TabBarNavigation.xaml

<?xml version="1.0" encoding="utf-8" ?>
<Shell
    x:Class="SkeletonApp.Example.TabBarNagivation"
    xmlns:local="clr-namespace:SkeletonApp.Example"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

    <TabBar x:Name="TabBarMain">
        <ShellContent Title="Casual Page" Icon="icon_feed.png" ContentTemplate="{DataTemplate local:CasualPage}" />
        <ShellContent Title="Main Page" Icon="icon_about.png" ContentTemplate="{DataTemplate local:MainPage}"/>
        <ShellContent Title="Additional Page" Icon="icon_feed.png" ContentTemplate="{DataTemplate local:AdditionalPage}" />
    </TabBar>
</Shell>

TabBarNavigation.xaml.cs

namespace SkeletonApp.Example
{
    public partial class TabBarNagivation : Xamarin.Forms.Shell
    {
        public TabBarNagivation()
        {
            InitializeComponent();
        }
    }
}

CasualPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:views="clr-namespace:SkeletonApp.View.Page;assembly=SkeletonApp"
    x:Class="SkeletonApp.Example.CasualPage"
    Title="Casual Page">
    
    <ContentPage.ToolbarItems> 
        <ToolbarItem IconImageSource="icon_about.png" Text="Change theme" Clicked="changeTheme_onCLicked"/>
    </ContentPage.ToolbarItems>

    <StackLayout Spacing="10">
        <Button
            x:Name="buttonLoadingPage1Timer"
            Margin="10,0,10,0"
            Clicked="timeCalculation_OnClicked"
            HeightRequest="55"
            Text="Run time calculation"
            VerticalOptions="Center" />
        <Label
            x:Name="calculatedTime"
            Margin="10,0,10,0"
            FontSize="Medium"
            HorizontalTextAlignment="Center"
            Text="Time not yet calculated" />
    </StackLayout>
</ContentPage>

CasualPage.xaml.cs

namespace SkeletonApp.Example
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class CasualPage : ContentPage
    {
        public CasualPage()
        {
            InitializeComponent();
        }

        private void timeCalculation_OnClicked(object sender, EventArgs e)
        {
            ((Label) FindByName("calculatedTime")).Text = DateTime.Now.ToString();
        }

        private void changeTheme_onCLicked(object sender, EventArgs e)
        {
            OSAppTheme currentTheme = Application.Current.RequestedTheme;

            Application.Current.UserAppTheme = currentTheme == OSAppTheme.Dark ? OSAppTheme.Light : OSAppTheme.Dark;
        }
    }
}

Screenshot with little colorfill

Answer 1

This may relate to [Bug] Shell content padding on iOS default. And for iOS, the SetPaddingInsets api has been removed. That means we could not set the padding for the ContentPage in a Shell app.

Though we cannot set the Padding for a ContentPage, we could set the Padding for the layout, such as <StackLayout Spacing="10" Padding="10,15,10,15">

By the way, Xamarin will be end of support from May. It is recommend that you migrate Xamarin App to MAUI.

Xamarin Support Policy

Upgrade from Xamarin to .NET