Different grid sizes(height) on platforms

I have a grid where in Android RowDefinition(heigh)t is 100, on iOs will be 120. How can I do this per plataform identification inside Xaml.

 <ContentPage.Resources>
        <ResourceDictionary>
            <OnPlatform x:Key="GridSize"   x:TypeArguments="GridLength"  iOS="120"  Android="100"  />
        </ResourceDictionary>
    </ContentPage.Resources>


    <Grid RowSpacing="0" x:Name="grid" AbsoluteLayout.LayoutFlags="All" 
            <Grid.RowDefinitions>
                <RowDefinition Height="{StaticResource GridSize}" />
            <RowDefinition Height="60" />
                <RowDefinition Height="280" />
            </Grid.RowDefinitions>
       </Grid>

This way it is not working.

2 answers

  • answered 2018-11-12 10:39 Gerald Versluis

    Have you tried doing it directly and not through a resource?

    <Grid RowSpacing="0" x:Name="grid" AbsoluteLayout.LayoutFlags="All" 
            <Grid.RowDefinitions>
                <RowDefinition>
                    <RowDefinition.Height>
                        <OnPlatform x:TypeArguments="GridLength">
                           <On Platform="Android">100</On>
                           <On Platform="iOS"120/On>
                        </OnPlatform>
                    </RowDefinition.Height>
                </RowDefinition>
                <RowDefinition Height="60" />
                <RowDefinition Height="280" />
            </Grid.RowDefinitions>
       </Grid>
    

    Or, you can use the newer markup extension: <RowDefinition Height="{OnPlatform 100, iOS=120, Android=100}" />

  • answered 2018-11-12 10:55 Depechie

    Not sure if this is due to a different Xamarin forms version? I've tested with v 3.1 and 3.3 and with following ContentPage I get following simulator screens... so it seems it just should work.

    Any details about your setup?

    <?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:local="clr-namespace:TestGrid" x:Class="TestGrid.MainPage">
        <ContentPage.Resources>
            <ResourceDictionary>
                <OnPlatform x:Key="GridSize" x:TypeArguments="GridLength" iOS="220" Android="50" />
            </ResourceDictionary>
        </ContentPage.Resources>
    
            <Grid RowSpacing="0" x:Name="grid">
                <Grid.RowDefinitions>
                    <RowDefinition Height="{StaticResource GridSize}" />
                <RowDefinition Height="60" />
                    <RowDefinition Height="280" />
                </Grid.RowDefinitions>
    
            <BoxView Grid.Row="0" BackgroundColor="Lime" Color="Lime" />
            <BoxView Grid.Row="1" BackgroundColor="Yellow" Color="Yellow" />
    
           </Grid>
    </ContentPage>
    

    simulator