Xamarin Forms multiply CollectionViews Horizontal and Vertical

Question

I try to use a CollectionView in a other CollectionView like this. My problem is there wont display me the second CV like there dont have a source. I guess the BindingContex can be the problem but i dont have a idea how i fix it.

      <CollectionView 
       SelectionMode="Single"
       ItemsSource="{Binding MainInfo}">

        <CollectionView.ItemsLayout>
            <LinearItemsLayout ItemSpacing="10" Orientation="Vertical" />
        </CollectionView.ItemsLayout>

        <CollectionView.ItemTemplate>
            <DataTemplate>

                <StackLayout>

                    <Label Text="{Binding UserName}"/>

                    <!--Horizontal CV-->
                    <CollectionView 
                        SelectionMode="Single"
                        ItemsSource="{Binding MainInfo}"
                        >
                        <CollectionView.ItemsLayout>
                            <LinearItemsLayout ItemSpacing="10" Orientation="Horizontal" />
                        </CollectionView.ItemsLayout>

                        <CollectionView.ItemTemplate>
                            <DataTemplate>

                                <StackLayout>

                                    <Label Text="{Binding ImageUrl}"/>
                                    <Label Text="{Binding FullName}"/>

                                </StackLayout>

                            </DataTemplate>
                        </CollectionView.ItemTemplate>

                    </CollectionView>

                </StackLayout>

            </DataTemplate>
        </CollectionView.ItemTemplate>

    </CollectionView>

nesting CV like this is a bad idea and you should really avoid it — Jason, Feb 24 '21 at 10:21
okey thanks what is the better way to reach the same result ? — JdDEV, Feb 24 '21 at 10:34

score 0 · Accepted Answer · answered Feb 24 '21 at 11:23

0

I guess the BindingContext can be the problem but i don't have a idea how i fix it.

In your case the ItemsSource and model should like the following

    public class MyDetails
    {
        public string ImageUrl { get; set; }
        public string FullName { get; set; }
    }

    public class MyObject
    {
        public string UserName { get; set; }
        public ObservableCollection<MyDetails> MainInfo { get; set; }
    }

    public class MyViewModel: INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public ObservableCollection<MyObject> MainInfo { get; set; }

        protected virtual void NotifyPropertyChanged([CallerMemberName] string propertyName = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));        
        }

        
    }

In addition , agree with @Jason . In your case if want to display an collection in cell, you could use Bindable Layouts instead of putting a CollectionView in another . In this way you just need to set the Viewmodel and model like the above code .

answered Feb 24 '21 at 11:23

Lucas Zhang

18,630
3
12
22

Thank you @Lucas Bindable Layouts its what i search but i am still not able to use a horizontal Collection in da vertical Collection. I need the same like instagramm – JdDEV Feb 25 '21 at 09:22
Set the Orientation of the StackLayout – Lucas Zhang Feb 25 '21 at 09:23
how i can accept it ? i am new at stackoverlow – JdDEV Feb 25 '21 at 09:57
Click the “✔” in the upper left corner of this answer – Lucas Zhang Feb 25 '21 at 10:41
I completely overlooked this symbol – JdDEV Feb 25 '21 at 10:48

Xamarin Forms multiply CollectionViews Horizontal and Vertical

1 Answers1