CODEWITHSUNDEEP
c#xamlxamarinxamarin.forms
Daniel Soutar
Daniel Soutar

Reputation: 886

xamarin.forms set thickness in xaml

I have the following XAML:

<ContentPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:Foo"
    x:Class="Foo.MainPage">
<ContentPage.Padding>
    <OnPlatform x:TypeArguments="Thickness">
        <OnPlatform.iOS>0, 20, 0, 0</OnPlatform.iOS>
    </OnPlatform>
</ContentPage.Padding>
<StackLayout BindingContext="{x:Reference slider}"
             HorizontalOptions="Center">
    <BoxView Color="Green"
             Opacity="{Binding Value}" />
    <Label Text="{Binding Value,
           StringFormat='Value is {0:F2}' }"
           Opacity="{Binding Value }"/>
    <Slider x:Name="slider"/>
</StackLayout>

It is attempting - and failing - to set the padding to 20 pixels at the top on iOS. Perfectly straightforward, exactly as suggested online - does not work. The padding is still clearly 0 - see below. I really cannot see what the issue would be - this is a completely reasonable bit of XAML, and before you ask, no, something like:

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

does not work either. The generated code:

// MainPage.xaml.g.cs

[global::Xamarin.Forms.Xaml.XamlFilePathAttribute("MainPage.xaml")]
public partial class MainPage : global::Xamarin.Forms.ContentPage {

    [global::System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.Tasks.XamlG", "2.0.0.0")]
    private global::Xamarin.Forms.Slider slider;

    [global::System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.Tasks.XamlG", "2.0.0.0")]
    private void InitializeComponent() {
        global::Xamarin.Forms.Xaml.Extensions.LoadFromXaml(this, typeof(MainPage));
        slider = global::Xamarin.Forms.NameScopeExtensions.FindByName<global::Xamarin.Forms.Slider>(this, "slider");
    }
}

Image:

enter image description here

Any suggestions? For what it's worth, I know I can override OnAppearance in C#, but I'm trying to follow better practice by keeping appearance in XAML and logic in C#, which this is making unnecessarily difficult. I really wish XAML were better documented, that issues like this were caught at compile-time, and the code in the docs actually did what it says it does :(

Upvotes: 1

Views: 2528

Answers (2)

Mando
Mando

Reputation: 11712

The padding you are trying to handle is controlled by iOS + Xamarin.Forms, called Safe Area and you can control it by asking Xamarin.Forms to take this area into account:

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

enter image description here

<ContentPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:Foo"
    x:Class="Foo.MainPage"
    xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
    ios:Page.UseSafeArea="true"
    BackgroundColor="Yellow">    
    <StackLayout BindingContext="{x:Reference slider}"
                 HorizontalOptions="Center"
                 BackgroundColor="Blue">
        <BoxView Color="Green"
                 Opacity="{Binding Value}"/>
        <Label Text="{Binding Value,
               StringFormat='Value is {0:F2}' }"
               Opacity="{Binding Value }"/>
        <Slider x:Name="slider"/>
    </StackLayout>
</ContentPage>

Upvotes: 4

Daniel Soutar
Daniel Soutar

Reputation: 886

After some playing around, I've realised this is an actual bug: the problem goes away when you set the second value to anything other than 20.

...why on Earth that is a bug, I will likely never know. Anyone reading this, you are more than welcome to correct me/give a better answer.

Upvotes: 0

Related Questions