Xamarin IOS CollectionView: cannot vertically align items - ios

Question

I'm using CollectionView with DataTemplate
<DataTemplate x:Key="tileTemplate">
<StackLayout VerticalOptions="FillAndExpand" BackgroundColor="Red" Padding="5" x:Name="ItemContainer">
<StackLayout Padding="5" HorizontalOptions="CenterAndExpand" WidthRequest="{Binding Width, Source={x:Reference ItemContainer}}" HeightRequest="{Binding Width, Source={x:Reference ItemContainer}}">
<Image Source="{Binding LogoID}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Aspect="AspectFit" />
</StackLayout>
</StackLayout>
</DataTemplate>
<CollectionView x:Name="ItemsCollectionView" ItemsSource="{Binding Items}" ItemTemplate="{StaticResource itemsDataTemplateSelector}">
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical"/>
</CollectionView.ItemsLayout>
</CollectionView>
On Android they align vertically from the top:
But on IOS they align rather chaotically:
I can't figure out how to align them from the top like in Android.
--== UPDATE ==-- :
The problem is with HeightRequest of inner StackLayout
HeightRequest="{Binding Width, Source={x:Reference ItemContainer}}"
(same result if you use OnSizeAllocated)
protected override void OnSizeAllocated(double width, double height)
{
base.OnSizeAllocated(width, height);
HeightRequest = Width;
}
How to keep proportions and prevent tiles from popping on IOS is still opened question.

Answer 1

It may caused by the layout in your stacklayout, I wrote a sample and it works well in iOS:
<CollectionView >
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical" Span="3"/>
</CollectionView.ItemsLayout>
<CollectionView.ItemsSource>
<x:Array Type="{x:Type x:String}">
<x:String>Baboon</x:String>
<x:String>Capuchin Monkey Capuchin MonkeyCapuchin MonkeyCapuchin MonkeyCapuchin MonkeyCapuchin MonkeyCapuchin MonkeyCapuchin Monkey</x:String>
<x:String>Blue Monkey</x:String>
</x:Array>
</CollectionView.ItemsSource>
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout VerticalOptions="FillAndExpand" BackgroundColor="Red">
<Frame BackgroundColor="Green" WidthRequest="100" HeightRequest="90">
<Image Source="Images.png"/>
</Frame>
<Label Text="{Binding .}" HorizontalTextAlignment="Center"/>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>

Answer 2

Try using StartAndExpand instead of FillAndExpand on the StackLayouts VerticalOptions