Pull To Refresh Works on iOS and Not Android

9 posts, 0 answers
  1. Trevor
    Trevor avatar
    18 posts
    Member since:
    Feb 2017

    Posted 18 Sep Link to this post

    I have a pull to refresh defined, and it renders and works properly on iOS, but when I run on Android, the ListView doesn't render at all. If I remove the "RefreshRequested" and "IsPullToRefreshEnabled", it starts rendering again. Any idea why?? I am using the newest release of UI for Xamarin.Forms. This is how I defined the list:

    `<telerikDataControls:RadListView  x:Name="listView" ItemTapped="ListView_ItemTappedAsync" LoadOnDemandMode="Automatic" IsLoadOnDemandEnabled="True" LoadOnDemand="listView_LoadOnDemand" LoadOnDemandBufferItemsCount="5" RefreshRequested="listView_RefreshRequestedAsync" IsPullToRefreshEnabled="True">`

  2. Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1236 posts

    Posted 21 Sep Link to this post

    Hello Trevor,

    Thank you for contacting us on that matter. We tested the reported behavior on our side but to no avail. We modified the SDK example ListView/Gestures/Pull To Refresh with the code you provided and the RadListView component is visualized as expected.

    Could you please share more details about your setup? Is there anything special implemented in the event handlers? Is it possible for you to isolate the behavior in a small repro project and send it over?

    Thank you for your cooperation.

    Regards,
    Pavel R. Pavlov
    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
  3. Trevor
    Trevor avatar
    18 posts
    Member since:
    Feb 2017

    Posted 21 Sep in reply to Pavel R. Pavlov Link to this post

    <telerikDataControls:RadListView x:Name="listView" BackgroundColor="White" ItemTapped="listView_ItemTappedAsync" LoadOnDemandMode="Automatic" IsLoadOnDemandEnabled="True" LoadOnDemand="listView_LoadOnDemand" LoadOnDemandBufferItemsCount="5" IsPullToRefreshEnabled="True" RefreshRequested="listView_RefreshRequestedAsync">
      <telerikDataControls:RadListView.LayoutDefinition>
        <telerikListView:ListViewLinearLayout ItemLength="64"/>
      </telerikDataControls:RadListView.LayoutDefinition>
      <telerikDataControls:RadListView.ItemTemplate>
        <DataTemplate>
          <telerikListView:ListViewTemplateCell>
            <telerikListView:ListViewTemplateCell.View>
              <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <StackLayout.Padding>
                  <OnPlatform x:TypeArguments="Thickness">
                    <On Platform="Android" Value="0, 0, 0, 0"/>
                    <On Platform="iOS" Value="10, 5, 0, 5"/>
                  </OnPlatform>
                </StackLayout.Padding>
                <ContentView>
                  <ContentView.Padding>
                    <OnPlatform x:TypeArguments="Thickness">
                      <On Platform="Android" Value="0, 0, 0, 0"/>
                      <On Platform="iOS" Value="0, 0, 0, 7"/>
                    </OnPlatform>
                  </ContentView.Padding>
                  <Image x:Name="assetImage" Source="{Binding AssetImage, Converter={StaticResource base64Converter}}" VerticalOptions="Center"/>
                </ContentView>
                <StackLayout Orientation="Vertical" Spacing="5" VerticalOptions="Center">
                  <Label x:Name="primarySecondaryId" Text="{Binding PrimarySecondaryId}"/>
                  <Label x:Name="siteName" Text="{Binding SiteName}"/>
                </StackLayout>
              </StackLayout>
            </telerikListView:ListViewTemplateCell.View>
          </telerikListView:ListViewTemplateCell>
        </DataTemplate>
      </telerikDataControls:RadListView.ItemTemplate>
    </telerikDataControls:RadListView>

     

    That is how my RadListView is defined.  And these are my handlers:

    /// <summary>
    /// OnRefresh method
    /// </summary>
    private async void listView_RefreshRequestedAsync(object sender, Telerik.XamarinForms.DataControls.ListView.PullToRefreshRequestedEventArgs e)
    {
        await Task.Run(() => ReloadData());
        listView.IsPullToRefreshActive = false;
        listView.IsLoadOnDemandEnabled = App.ShouldInfiniteScroolBeEnabled(assetsViewModel.ListOfAssets.Count);
    }
     
    /// <summary>
    /// Reloads the data back to the default, remaking the API call. This will fetch the newest data.
    /// </summary>
    private void ReloadData()
    {
        assetsViewModel.PageNumber = 1;
        assetsViewModel.GetAssets();
        listView.ItemsSource = assetsViewModel.ListOfAssets;
        SearchCollection = listView.ItemsSource as ObservableCollection<AssetsListModel>;
    }

     

  4. Trevor
    Trevor avatar
    18 posts
    Member since:
    Feb 2017

    Posted 21 Sep in reply to Pavel R. Pavlov Link to this post

    I am using Android support library versions 25.4.0.2 and the current release of Telerik.UI.for.Xamarin (2017.2.818.1)
  5. Stefan Nenchev
    Admin
    Stefan Nenchev avatar
    498 posts

    Posted 26 Sep Link to this post

    Hi, Trevor,

    Unfortunately, we are still not able to reproduce the undesired behavior. I have attached a sample project for your reference. Can you please test if the behavior is observed with it? If so, please record a short video from your end. Otherwise, modifying the sample so that the undesired effects are observed will be highly appreciated.

    Have a great rest of the week.

    Regards,
    Stefan Nenchev
    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
  6. Trevor
    Trevor avatar
    18 posts
    Member since:
    Feb 2017

    Posted 02 Oct in reply to Stefan Nenchev Link to this post

    Hi,

    I was able to reproduce the issue in the sample project you attached. I attached the project with the issue.

    Project Files

  7. Trevor
    Trevor avatar
    18 posts
    Member since:
    Feb 2017

    Posted 02 Oct in reply to Stefan Nenchev Link to this post

    Thanks for looking into this Stefan!
  8. Stefan Nenchev
    Admin
    Stefan Nenchev avatar
    498 posts

    Posted 05 Oct Link to this post

    Hello, Trevor,

    Thank you for modifying the sample.

    Actually, the issue is caused due to positioning the ListView within a StackLayout which seems to break the functionality. We will consider adding notes in the documentation that would suggest to not put the control in such container as it causes such undesired behavior. In the meantime, you can achieve the desired behavior by placing it within a Grid:

    <ContentView.Content>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition />
            </Grid.RowDefinitions>
     
            <ContentView Padding="0,-6, 0, 0" Grid.Row="0">
                <SearchBar .../>
            </ContentView>
                 
            <Grid Padding="0, -6, 0, 0" Grid.Row="1">
                <telerikDataControls:RadListView ... />
            </Grid>
        </Grid>
    </ContentView.Content>

    I have updated the sample for your reference.

    Regards,
    Stefan Nenchev
    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
  9. Stefan Nenchev
    Admin
    Stefan Nenchev avatar
    498 posts

    Posted 05 Oct Link to this post

    Hello, Trevor,

    Thank you for modifying the sample.

    Actually, the issue is caused due to positioning the ListView within a StackLayout which seems to break the functionality. We will consider adding notes in the documentation that would suggest to not put the control in such container as it causes such undesired behavior. In the meantime, you can achieve the desired behavior by placing it within a Grid:

    <ContentView.Content>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition />
            </Grid.RowDefinitions>
     
            <ContentView Padding="0,-6, 0, 0" Grid.Row="0">
                <SearchBar .../>
            </ContentView>
                 
            <Grid Padding="0, -6, 0, 0" Grid.Row="1">
                <telerikDataControls:RadListView ... />
            </Grid>
        </Grid>
    </ContentView.Content>

    I have updated the sample for your reference.

    Regards,
    Stefan Nenchev
    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
Back to Top