Sreejith Sree
Sreejith Sree

Reputation: 3681

Xamarin Forms: CollectionView is not working in ios

I am using CollectionView for the horizontal listview. It is working fine in android but in ios, the items are showing on one top of another. Attaching a screenshot below:

enter image description here

XAML

<CollectionView 
             HeightRequest="30"
             SelectionMode="Single"
             SelectionChanged="ItemTapped"
        ItemsSource="{Binding Items}"
             x:Name="collectionview"
             ItemsLayout="HorizontalList">
             <CollectionView.ItemTemplate>
                   <DataTemplate>
                          <StackLayout Margin="5">
                                  <Label
                                       TextColor="Black"
                                       FontSize="Large"
                                       HorizontalTextAlignment="Center"
                                       VerticalTextAlignment="Center"
                                       Text="{Binding title}"/>
                             </StackLayout>
                        </DataTemplate>
                 </CollectionView.ItemTemplate>
          </CollectionView>

Xaml.cs

public async void ItemTapped(object sender, SelectionChangedEventArgs e)
        {
            var selectedItem = (e.CurrentSelection.FirstOrDefault() as MyModel);
            if (selectedItem != null)
            {
                //Do action
            }
        }

Add below code in AppDelegate class on iOS and MainActivity class on Android, before calling Forms.Init:

Forms.SetFlags("CollectionView_Experimental");

Am I missing something in IOS?

Upvotes: 1

Views: 1620

Answers (2)

Lucas Zhang
Lucas Zhang

Reputation: 18861

It seems an existing issue of Xamarin.Forms . As workaround you can update the version of Xamarin.Forms to 4.4 pre2 .

enter image description here

And you can check the Xamarin.forms release notes .

Upvotes: 2

FreakyAli
FreakyAli

Reputation: 16459

I would suggest you add a LinearItemsLayout which would give you some control over how these items look:

 <CollectionView.ItemsLayout>  
 <LinearItemsLayout ItemSpacing="5" Orientation="Horizontal" />
 </CollectionView.ItemsLayout>

Let me know in case if you face any issues!

Upvotes: 0

Related Questions