These days, not a lot of work gets done without the help of the open-source community. We acknowledge this at Snap and always make an effort to give back - by either helping others on programming communities such as Stackoverflow or releasing tools and components that we develop as open source projects on Github®.
This post covers an iOS component that we recently released as open-source that replaces the default indicator that the UIScrollView provides. As you would expect from the apple engineering team, the default indicator is already very functionally and aesthetically pleasing as seen below:
However, wouldn’t it be nice to also be able to show more information in context to your current position while scrolling through a large data set? For example, when scrolling through a list of people sorted by their distance from your current location, we could also indicate the distance of the last visible row – this way if you scroll quickly trying to find a particular row, you can quickly identify how close you are to that row.
In addition, you could also provide an animation of a person walking forward to indicate that distance is increasing as you scroll down, and vice versa when you scroll up. The speed of the animation can also be relative to the speed the user is scrolling.
In just a few seconds, these contextual indicators help the user quickly understand your data, in both the way it is sorted, as well as the range of the data set.
We’ve extracted out our implementation of this into a single class so that can be re-used by others with just a couple of lines of code. We’ve even taken care of the subtle animations and conditions when the indicator appears/disappear ensuring that it is unobtrusive to your app’s UI.
You can pretty much re-use what we have built to indicate a variety of things – we’ve used it for time (using an animated clock) and distance, but there are plenty of other use cases that this could be useful. Hopefully your project can also find it useful whether you use it as-is or as a starting point or even just a reference when building a similar feature.
Check it out on Github®: https://github.com/SnapInteractive/SNAPScrollStroll
Check it out in action in our app: https://itunes.apple.com/us/app/are-you-interested/id307930478?mt=8
- Authored by Edwin - https://github.com/eiskandar
Github is a registered trademark of Github, LLC.