SfExpander within a ListView doesn't expand on iOS

[Robert]

Hi, when I try to have an SfExpander within a ListView, the Expander won't expand at iOS (works on Android like a charm). When I use SfListView instead of ListView, the app freezes completely, without any exceptions. 

This is the XAML-Code:

<ListView CachingStrategy="RecycleElement"

                        ItemsSource="{Binding InfoText}"

                        HasUnevenRows="True"

                        BackgroundColor="Transparent"

                        SelectionMode="None"

                        SeparatorVisibility="None">

                    <ListView.ItemTemplate>

                        <DataTemplate>

                            <ViewCell>

                                <sfExpander:SfExpander HeaderIconPosition="Start" DynamicSizeMode="Content" Margin="0,0,0,20">

                                    <sfExpander:SfExpander.Header>

                                        <StackLayout>

                                            <Label Text="{Binding Novene}" FontSize="Large" FontAttributes="Bold" />

                                        </StackLayout>

                                    </sfExpander:SfExpander.Header>

                                    <sfExpander:SfExpander.Content>

                                        <StackLayout Spacing="30">

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

                                            <Label Text="{Binding Zeitraum}" TextColor="Red" FontSize="Medium" FontAttributes="Italic" Margin="0,5,0,0" HorizontalTextAlignment="Center" />

                                            <Label Text="Datum auswählen:" Margin="5,0,0,-15" />

                                            <DatePicker MinimumDate="{Binding MinDate}" MaximumDate="{Binding MaxDate}" Date="{Binding Erinnerung}" Format="D">

                                            </DatePicker>

                                            <StackLayout Spacing="10" Orientation="Horizontal" HorizontalOptions="Center">

                                                <Label Text="Erinnerung hier speichern" FontAttributes="Italic" VerticalOptions="Center"/>

                                                <Label Text="{x:Static fontawesome:FontAwesomeIcons.HandPointRight}" FontFamily="FA-S" FontSize="28" Margin="0,0,10,0"

                                                        VerticalOptions="Center" />

                                                <ImageButton Command="{Binding Source={RelativeSource AncestorType={x:Type vm:InfoPageViewModel}}, Path=SendNotificationCommand}"

                                                            CommandParameter="{Binding Novene}" Source="button" HeightRequest="75" BackgroundColor="Transparent" Margin="0,0,0,5" />

                                            </StackLayout>

                                        </StackLayout>

                                    </sfExpander:SfExpander.Content>

                                    <VisualStateManager.VisualStateGroups>

                                        <VisualStateGroupList>

                                            <VisualStateGroup>

                                                <VisualState Name="Expanded">

                                                    <VisualState.Setters>

                                                        <Setter Property="HeaderBackgroundColor" Value="LightGray"/>

                                                        <Setter Property="IconColor" Value="Black"/>

                                                        <Setter Property="BackgroundColor" Value="White"/>

                                                    </VisualState.Setters>

                                                </VisualState>

                                                <VisualState Name="Collapsed">

                                                    <VisualState.Setters>

                                                        <Setter Property="HeaderBackgroundColor" Value="Gold"/>

                                                        <Setter Property="IconColor" Value="Black"/>

                                                    </VisualState.Setters>

                                                </VisualState>

                                            </VisualStateGroup>

                                        </VisualStateGroupList>

                                    </VisualStateManager.VisualStateGroups>

                                </sfExpander:SfExpander>

                            </ViewCell>

                        </DataTemplate>

                    </ListView.ItemTemplate>

                </ListView>

[Robert]

PS: This is, how I used it with SfListView instead of ListView (I used the AutoFitMode="DynamicHeight"):

 <sfListView:SfListView

                        ItemsSource="{Binding InfoText}"

                        BackgroundColor="Transparent"

                        SelectionMode="None"

                        AutoFitMode="DynamicHeight">

                    <sfListView:SfListView.ItemTemplate>

                        <DataTemplate>

                            <ViewCell>

                                <sfExpander:SfExpander HeaderIconPosition="Start" DynamicSizeMode="Content" Margin="0,0,0,20">

                                    <sfExpander:SfExpander.Header>

                                        <StackLayout>

                                            <Label Text="{Binding Novene}" FontSize="Large" FontAttributes="Bold" />

                                        </StackLayout>

                                    </sfExpander:SfExpander.Header>

                                    <sfExpander:SfExpander.Content>

                                        <StackLayout Spacing="30">

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

                                            <Label Text="{Binding Zeitraum}" TextColor="Red" FontSize="Medium" FontAttributes="Italic" Margin="0,5,0,0" HorizontalTextAlignment="Center" />

                                            <Label Text="Datum auswählen:" Margin="5,0,0,-15" />

                                            <DatePicker MinimumDate="{Binding MinDate}" MaximumDate="{Binding MaxDate}" Date="{Binding Erinnerung}" Format="D">

                                            </DatePicker>

                                            <StackLayout Spacing="10" Orientation="Horizontal" HorizontalOptions="Center">

                                                <Label Text="Erinnerung hier speichern" FontAttributes="Italic" VerticalOptions="Center"/>

                                                <Label Text="{x:Static fontawesome:FontAwesomeIcons.HandPointRight}" FontFamily="FA-S" FontSize="28" Margin="0,0,10,0"

                                                        VerticalOptions="Center" />

                                                <ImageButton Command="{Binding Source={RelativeSource AncestorType={x:Type vm:InfoPageViewModel}}, Path=SendNotificationCommand}"

                                                            CommandParameter="{Binding Novene}" Source="button" HeightRequest="75" BackgroundColor="Transparent" Margin="0,0,0,5" />

                                             </StackLayout>

                                        </StackLayout>

                                    </sfExpander:SfExpander.Content>

                                    <VisualStateManager.VisualStateGroups>

                                        <VisualStateGroupList>

                                            <VisualStateGroup>

                                                <VisualState Name="Expanded">

                                                    <VisualState.Setters>

                                                        <Setter Property="HeaderBackgroundColor" Value="LightGray"/>

                                                        <Setter Property="IconColor" Value="Black"/>

                                                        <Setter Property="BackgroundColor" Value="White"/>

                                                    </VisualState.Setters>

                                                </VisualState>

                                                <VisualState Name="Collapsed">

                                                    <VisualState.Setters>

                                                        <Setter Property="HeaderBackgroundColor" Value="Gold"/>

                                                        <Setter Property="IconColor" Value="Black"/>

                                                    </VisualState.Setters>

                                                </VisualState>

                                            </VisualStateGroup>

                                        </VisualStateGroupList>

                                    </VisualStateManager.VisualStateGroups>

                                </sfExpander:SfExpander>

                            </ViewCell>

                        </DataTemplate>

                    </sfListView:SfListView.ItemTemplate>

                </sfListView:SfListView>

[Robert Komarek]

I've just seen that u also have the ExpandableListView. I will try this one! 

[Lakshmi Natarajan]

Hi Robert, 

 

Thank you for using Syncfusion products. 

 

We have checked the reported query “SfExpander within a ListView doesn't expand on iOS” from our side. We would like to inform you that we are unable to reproduce the reported scenario at our side. We have tested the sample in the following sample in iPhone 12 Pro Max – iOS 14.4 simulator and the SfExpander works fine as expected.  

 

Please find the sample in the following document, 

KB link: https://www.syncfusion.com/kb/12159/how-to-bring-the-entire-item-to-view-when-the-expander-sfexpander-is-expanding-in-xamarin 

 

Also, we suspect that the reported scenario occurs due to the renderer initialization. We would like to inform you that we need to initialize the Syncfusion controls for iOS platform. Please refer to the following user guidance documents to initialize the renderers for iOS platform. 

 

ListView: https://help.syncfusion.com/xamarin/listview/getting-started#ios 

Expander: https://help.syncfusion.com/xamarin/expander/getting-started#ios 

 

Please refer to the following document to use the ExpandableListView and related documents in the following link, 

UG link: https://help.syncfusion.com/xamarin/listview/viewappearance#accordion-view 

KB link: https://www.syncfusion.com/kb/10111/how-to-bring-the-entire-item-into-view-on-tapping-an-item-in-xamarin-forms-expandable 

 

Please let us know if you need further assistance. 

 

Regards, 

Lakshmi Natarajan 

 

[Robert]

Dear Lakshmi,

thank you for your answer and the links! I missed the method submission in the constructor of the content page.

Have a great day!  Best, Rob 

[Lakshmi Natarajan]

Hi Robert, 

 

Thank you for the update. 

 

We are glad that your requirement has been met at your side. Please let us know if you need further assistance. As always we are happy to help you out. 

 

Regards, 

Lakshmi Natarajan