Iglistkit: Display pagination data from endpoint with IGListKit

[twentyseven]

New issue checklist

• [ ] I have reviewed the README and documentation
• [ ] I have searched existing issues and this is not a duplicate

General information

• IGListKit version:
• iOS version(s):
• CocoaPods/Carthage version:
• Xcode version:
• Devices/Simulators affected:
• Reproducible in the demo project? (Yes/No):
• Related issues:

[twentyseven]

Hi, firstly thank you for great work on this library!
This is rather a question than an issue, I have to display json data that returned from an endpoint with page/max parameter support, new page data is loading as user scroll, pretty much like many feed page of social apps so I think it should be common case but I cannot figure out how to do this from the example. Can anyone help point the right direction use this greate library to work with pagination endpoint?

[rnystrom]

Sure thing @twentyseven! We do exactly this in Instagram, using a cursor for the "next page" of data, sending a request w/ that cursor, then loading the data in the feed.

Take a look at the Load More example we included. In Instagram we do something _really_ similar where our tail-load spinner is actually a section controller. When the feed is loading, we append it, when its not, we don't include it. Notice how we check the loading state in the data source method so there's not much to track.

As far as order of operations go, I would:

• Keep an immutable collection of objects: [IGListDiffable] for your feed
• Track loading state in a var loading: Bool somewhere
• In objects(for listAdapter:) return objects
  
  
  
  • If loading == true append an object representing your tail loader
  
  
• Match objects and section controllers in your data source
• Attach an object to listAdapter.scrollViewDelegate
• When scrolling will end, calculate the distance from the bottom of the screen
  
  
  
  • If within a distance, trigger a "next page load" network request
  
  
  • Check out our example logic as a place to get started
  
  
• When networking finishes:
  
  
  
  • Update your objects objects = objects + responseObjects or w/e
  
  
  • Call listAdapter.performUpdates(animated: true)
  
  

Hopefully that gives you some place to start?

[jessesquires]

🎉

[jessesquires]

@twentyseven - Let us know if this helps! 😄

[twentyseven]

Yay, I see where to go now, thanks so much great guys!

[Ricardo1980]

Hello @rnystrom

You said:
"When scrolling will end, calculate the distance from the bottom of the screen
If within a distance, trigger a "next page load" network request"

Is it possible to do something to trigger that before? I mean, load more data when you are close the bottom, so the user experience would be better.

Is this related with workingRangeSize in IGListAdapter?

Thanks for suggestions.

[rnystrom]

Hey @Ricardo1980. When I talked about

When scrolling will end, calculate the distance from the bottom of the screen. If within a distance, trigger a "next page load" network request"

I mean use what we'd call a threshold and calculate when your scrollview is within that threshold before firing the request. For instance, if you're within 1 "screen" height of the bottom, fire the request. That way ideally you're never hitting the bottom as you scroll.

We don't have any mechanism built in for this yet (and working ranges are for prefetching content).

In Instagram, we do something similar to how AsyncDisplayKit tail loads (which I actually wrote 😄)

[harishprabhakaran]

@rnystrom I have to develop an application related to Tail Loading, I love the examples from IGL. I just wanted to know how to use my model object in place of items array. My Model is Codable.! Please help.

[rnystrom]

@harishprabhakaran please open another issue with much more description and we might be able to help. Make sure you try a few things first too 😉

_{Sent with GitHawk}