This is a migrated thread and some comments may be shown as answers.

List view crashes on ios when pull to refresh

3 Answers 475 Views

ListView

This is a migrated thread and some comments may be shown as answers.

RR asked on 18 Jul 2018, 01:10 PM

Following list view I am implementing pull to refresh and set the Itemsource by adding more items to the current list when the user pull downthe list.

This works fine is Android. But crashes in ios when pulling for loading.

Is there any known issues in LoadOnDemandMode or PullToRefresh in ios? thank you in advance

<telerikDataControls:RadListView x:Name="EventList"

BackgroundColor="{StaticResource DarkGray}"

ItemsSource="{Binding CalendarEvents,Mode=TwoWay}"

VerticalOptions="FillAndExpand"

HorizontalOptions="FillAndExpand"

IsLoadOnDemandEnabled="false"

LoadOnDemandMode="Automatic"

IsPullToRefreshEnabled="True"

RefreshRequested="EventList_RefreshRequested"

IsPullToRefreshActive="{Binding IsBusy,Mode=TwoWay}" >

<telerikDataControls:RadListView.ItemTemplate>

<DataTemplate>

<telerikListView:ListViewTemplateCell>

<telerikListView:ListViewTemplateCell.View>

<Grid RowSpacing="0" BackgroundColor="{StaticResource MediumGray}">

<Grid.RowDefinitions>

<RowDefinition Height="10"/>

<RowDefinition Height="Auto"/>

<RowDefinition Height="20"/>

<RowDefinition Height="Auto"/>

<RowDefinition Height="15"/>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="5"/>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="4*"/>

<ColumnDefinition Width="*"/>

<ColumnDefinition Width="5"/>

</Grid.ColumnDefinitions>

<StackLayout Grid.Row="1" Grid.Column="1" Orientation="Horizontal" VerticalOptions="Center">

<Image Source="ic_red_circle.png" HeightRequest="8" WidthRequest="8" VerticalOptions="Center"/>

<Label Text="{Binding EventDate}" FontFamily="{StaticResource RegularFont}" FontSize="Small"

TextColor="{StaticResource BaseTextColor}" LineBreakMode="TailTruncation" VerticalOptions="Center"/>

</StackLayout>

<Label Grid.Row="2" Grid.Column="1" Text="{Binding EventTime}" Margin="15,0,0,0"

FontFamily="{StaticResource RegularFont}" FontSize="Micro" VerticalOptions="Center"

TextColor="{StaticResource BaseTextColor}" LineBreakMode="TailTruncation"/>

<Label Grid.Row="1" Grid.Column="2" Text="{Binding Subject}" VerticalOptions="Center"

FontFamily="{StaticResource RegularFont}" FontSize="Medium"

TextColor="{StaticResource BaseTextColor}" LineBreakMode="TailTruncation"/>

<StackLayout Grid.Row="2" Grid.Column="2" Orientation="Horizontal">

<Label Text="{Binding EventLocationCaption}" FontFamily="{StaticResource RegularFont}" FontSize="Micro"

TextColor="{StaticResource BaseTextColor}" LineBreakMode="TailTruncation" VerticalOptions="Center"/>

<Image Source="ic_location_mark.png" VerticalOptions="Center" HeightRequest="12" WidthRequest="12"/>

</StackLayout>

<telerikDataControls:RadListView

Grid.Row="4" Grid.Column="2"

ItemsSource="{Binding FunctionsList,Mode=TwoWay}"

SelectionMode="None" BackgroundColor="{StaticResource MediumGray}" HeightRequest="{Binding HeightFuncList}">

<telerikDataControls:RadListView.ItemTemplate>

<DataTemplate>

<telerikListView:ListViewTemplateCell>

<telerikListView:ListViewTemplateCell.View>

<Grid BackgroundColor="{StaticResource MediumGray}" RowSpacing="0">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="2*"/>

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<Label Grid.Column="0" Grid.Row="0" Text="{Binding FunctionName,Mode=TwoWay}" FontFamily="{StaticResource RegularFont}" FontSize="Small"

VerticalOptions="Center" TextColor="{StaticResource BaseTextColor}" LineBreakMode="TailTruncation"/>

<Frame Grid.Column="1" Grid.Row="0" CornerRadius="5"

BackgroundColor="{Binding IsAlreadyInMarketPlace,Converter={StaticResource BooleanToBackGroundColorConverter}}"

Padding="4" VerticalOptions="Center" HasShadow="False" BorderColor="Transparent"

IsEnabled="{Binding IsAlreadyInMarketPlace, Converter={StaticResource BooleanInvertConverter}}">

<Label Text="{i18n:Translate COMMON_SWAP}" FontFamily="{StaticResource RegularFont}" FontSize="Micro" HorizontalTextAlignment="Center"

TextColor="White" LineBreakMode="TailTruncation" Margin="0"/>

<Frame.GestureRecognizers>

<TapGestureRecognizer Tapped="ChangeFunction_Tapped" NumberOfTapsRequired="1" CommandParameter="{Binding}" ClassId="{Binding F_FunctionId}"/>

</Frame.GestureRecognizers>

</Frame>

</Grid>

</telerikListView:ListViewTemplateCell.View>

</telerikListView:ListViewTemplateCell>

</DataTemplate>

</telerikDataControls:RadListView.ItemTemplate>

<telerikDataControls:RadListView.LayoutDefinition>

<telerikListView:ListViewLinearLayout Orientation="Vertical" VerticalItemSpacing="5"/>

</telerikDataControls:RadListView.LayoutDefinition>

</telerikDataControls:RadListView>

3 Answers, 1 is accepted

answered on 18 Jul 2018, 04:44 PM

Hello Roshan,

What are the parent elements of the RadListView? For example, it is inside a RadBusyIndicator, like this?

<primitives:RadBusyIndicator >

<primitives:RadBusyIndicator.Content>

<Grid>

<dataControls:RadListView ItemsSource="{Binding MyItems}" />

</Grid>

</primitives:RadBusyIndicator.Content>

</primitives:RadBusyIndicator>

This is a scenario that would cause an exception on iOS when IsBusy=True. This occurs because the RadBusyIndincator removes the Content elements from visual tree when busy, which will cause an exception on IOS.

If this is the case, you can fix it by moving the BusyIndicator on top of the RadListView, like this:

<Grid>

<dataControls:RadListView ItemsSource="{Binding MyItems}" />

<primitives:RadBusyIndicator BackgroundColor="#AAFFFFFF"

IsBusy="{Binding IsBusy}"

IsVisible="{Binding IsBusy}"/>

</Grid>

Further Investigation

If this is not the case, we'll need to investigate the exception first-hand in a runnable reproducible app because the XAML below isn't enough to determine what is occurring. The TwoWay binding of the nested RadListView.ItemsSource looks a bit suspicious, is there a reason why the nested RadListView would need to update the FunctionsList collection?

In any case, I'm unable to give you a definitive answer without the rest of your implementation. I will certainly attempt to replicate the issue with the known markup, but in the meantime please follow these steps to provide us with isolated reproducible:

1 - Use the Telerik Project Wizard to create a new project (already has the dependencies referenced)
2 - Copy over the relevant XAML into MainPage
3 - Copy over the C# code to support the scenario (i.e. any model or view models)
4 - Send that project back to us and we'll be able to investigate further.

Note: If the app uses an inaccessible data source, like an internal database, then just hard-code a couple lines of sample data as the ItemsSource/refreshed Items.

I understand that this may take a few minutes to prepare, but I find it always results in a faster final solution as we're able to get down the the actual issue quickly. I look forward to your reply.

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items

answered on 18 Jul 2018, 07:09 PM

MainPage.zip

Hi Roshan,

I wanted to provide an update as I've built a test app using the XAML provided and was not able to replicate the issue. Attached are the relevant files from my test, Pull to Refresh works on iOS and Android as expected.

I did notice a couple things, which I changed in the attached demo:

- Frame doesn't have a BorderColor property. Instead use OutlineColor instead.
- There's no need to use TwoWay binding for Label.Text and the nested RadListView.ItemsSource (this can null the bound property value depending on when it's set).

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik