It’s been a while since Apple redesigned App Store in 2017.
The beautifully redesigned App Store is packed with original stories and editorial, updated daily in a new Today tab, as well as new Games and Apps tabs.
I am still learning good UI designs from it today. One of the interesting UI comes to my mind is the slider view under Games/Apps tab.
Unlike the old design with full screen width slider, app store reduced the width so that user can see a little bit content of previous and next view, this gives a hit to user that there are content available on previous/next view.
This design literally solved a problem that some user does not know a view can scroll horizontally if a view is full screen width.
However, Apple does not provide any SDK that can generate this UI directly. This is why the QKSliderView comes.
- It allows user to generate App Store like layout, by customising total number of rows, columns and etc.
- Storyboard friendly: user can simple config all parameters in storyboard.
- Supporting both Objective-C and Swift.
- Supporting cocoapods.
It’s basically an
UICollectionVew, with customised
UICollectionViewLayout that can help generate UI for given rows and columns.
- The calculation: as it calculate cell’s
frameby given rows, columns, horizontal gap, vertical gap, how much width of previous/next cell do you like to display on the screen.
- Paging: Since it’s not full width cell, the default
pagingEnabledwill NOT work. I need to provide logics in some of the
UIScrollViewdelegate functions, by calculating what is the nearest cell should stop after user release finger from dragging.
- Delegation forwarding: Since I use some
UIScrollViewdelegate functions, it’s not convenient for users who still want to implement the delegate. Here use a delegation forwarding technic to solve this problem.
It’s still beta, I’ll try to improve it. If any feedback is appreciated. If any bug, please feel free to log issue.