nested sfListview not showing

I understand that nesting a listview within a listview is not best practice, however, for our use case, we are simply listing a number of items, and then a number of subitems beside them in a horizontal row, like this:  ITEM 1 mod 1 mod 2 mod 3 ITEM 2 mod 1 mod2 ITEM 3 mod 1 etc....

We are using a horiztonal sfListivew to accomplish the first listview of items and then within that listview, we're using another nested sfListview to display the modifiers.  The parent sfListivew is displaying as expected.  However, the modifier list does not show up.  I know the data is there because if I move the label around, I can see the letters overlay on the first listview, but in our below code, the modifier listview disappears.

Can you tell me why that might be?
```
<ListView HorizontalOptions="Center"
                          VerticalOptions="StartAndExpand"
                          BackgroundColor="White"
                          HasUnevenRows="True"
                          ItemsSource="{Binding Archived}"
                          ItemTapped="ItemTapped">
<ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <StackLayout>
                                    <Grid IsEnabled="False"
                                          HorizontalOptions="FillAndExpand"
                                          VerticalOptions="FillAndExpand">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="Auto" />
                                        </Grid.ColumnDefinitions>
                                        <Label Text="{Binding Name}"
                                               TextColor="Black"
                                               Grid.Column="0"
                                               HorizontalOptions="Start"
                                               VerticalOptions="Center"
                                               FontSize="18" />
                                        <Label Text="{Binding OrderedAt}"
                                               TextColor="Black"
                                               Grid.Column="1"
                                               HorizontalOptions="Start"
                                               VerticalOptions="Center"
                                               FontSize="18" />
                                        <StackLayout
                                                     VerticalOptions="FillAndExpand"
                                                     HorizontalOptions="FillAndExpand"
                                                     Grid.Column="2"
                                                     HeightRequest="40">
                                          <syncfusion:SfListView Orientation="Horizontal"
                                                                   ItemsSource="{Binding Items}"
                                                                   AutoFitMode="Height"
                                                                   ItemSpacing="2">
                                                <syncfusion:SfListView.ItemTemplate>
                                                    <DataTemplate>
                                                        <ViewCell>
                                                            <Grid HorizontalOptions="FillAndExpand"
                                                                  VerticalOptions="FillAndExpand">
                                                                <Grid.ColumnDefinitions>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                    <ColumnDefinition Width="Auto"/>
                                                                </Grid.ColumnDefinitions>
                                                                <Label Grid.Column="0"
                                                                       TextColor="Black"
                                                                       FontSize="18"
                                                                       FontAttributes="Bold"
                                                                       VerticalOptions="Center"
                                                                       HorizontalOptions="Start"
                                                                       Text="{Binding Name}" />
                                                                     <syncfusion:SfListView Grid.Column="1"
                                                                                       VerticalOptions="Center"
                                                                                       Orientation="Horizontal"
                                                                                       ItemsSource="{Binding Modifiers}"
                                                                                       WidthRequest="200">
                                                                    <syncfusion:SfListView.ItemTemplate>
                                                                                <DataTemplate>
                                                                            <ViewCell>
                                                                                <Label TextColor="LightGray"
                                                                                       VerticalOptions="Center"
                                                                                       HorizontalOptions="Start"
                                                                                       FontSize="16"
                                                                                       Text="{Binding Name}" />
                                                                            </ViewCell>
                                                                                </DataTemplate>
                                                                            </syncfusion:SfListView.ItemTemplate>
                                                                        </syncfusion:SfListView>
                                                           </Grid>
                                                        </ViewCell>
                                                    </DataTemplate>
                                                </syncfusion:SfListView.ItemTemplate>
                                            </syncfusion:SfListView>
                                        </StackLayout>
                                         </Grid>
</StackLayout>
</ViewCell>
</DataTemplate>
<ListView




6 Replies

MK Muthu Kumaran Gnanavinayagam Syncfusion Team February 12, 2018 12:58 PM UTC

Hi Tommy, 
 
We have checked the reported query “”We would like to let you know that the ItemSize (both height and width) for each items in View will be got from the respective renderers by passing the desired content(underlying data) as View and layout the measured size as ListViewItem based on ItemIndex in SfListView. We regret to inform you that while measuring the size(both height and width) for the nested SfListView(inner list as one ItemData) as content in respective renderers, the size is measured as 1 because the SfListView content does not contain any data and it uses ScrollView as child. So, both height and width is returned as 1 from the respective renderers and this is the actual behavior. We have also ensured with Xamarin ListView too by using the same scenario with HasUnEvenRows as “true” and behaves as mentioned. To overcome the issue, either you need to define the size for each inner SfListView or set the inner SfListView’s AutoFitMode as “Height” and define the ItemSize for outer ListView. In our sample we have checked whether the items are loaded in the View when defining ItemSize as mentioned above. 
 
 For your reference, we have attached the sample and you can download it from the below link.  
 
 
Please let us know if you require further assistance. 
 
Regards, 
G.Muthu kumaran. 



PU pumaprog February 12, 2018 02:56 PM UTC

Thank you for the response.  However, in your example, it appears that the listview is not nested in the same way as I'm describing.  In my example, I have a Listview and then an sfListview within that.  Then, in the ItemTemplate of the sfListview, I have another nested Listview.  

I don't see that level of nesting in your example. That is to say that I tried to autofitmode with setting the outer size and it still does not work.


PU pumaprog February 12, 2018 08:34 PM UTC

We fixed the issue ourselves by writing our own Repeater.  Thanks anyway, though.


MK Muthu Kumaran Gnanavinayagam Syncfusion Team February 13, 2018 04:32 AM UTC

Hi Tommy, 
 
Thanks for your valuable response. 
 
Regards, 
G.Muthu kumaran. 



PR Praddy May 3, 2018 06:00 AM UTC

Hi Muthu,

I have used SFListView for displaying a nested list view with expand and close option.
The list view expands to the correct row size on first click, but doesn't expand fully from the second time.

I have used AutoFitMode as true, as my list item template heights are dynamic.

Any help please?


MK Muthu Kumaran Gnanavinayagam Syncfusion Team May 4, 2018 04:57 AM UTC

Hi Praddy, 
 
As we have mentioned earlier,  you need to define the size for each inner SfListView or set the inner SfListView’s AutoFitMode as “Height” and define the ItemSize for outer ListView to overcome the reported behavior. Please find the limitation link below. 
 
  
Regards, 
G.Muthu kumaran. 


Loader.
Up arrow icon