All Projects → nemecek-filip → Compositionaldiffableplayground.ios

nemecek-filip / Compositionaldiffableplayground.ios

Licence: mit
Examples showing Compositional Layout, Diffable Data Sources and more!

Programming Languages

swift
15916 projects

Projects that are alternatives of or similar to Compositionaldiffableplayground.ios

Collectionnode
a collectionView made for Sprite Kit
Stars: ✭ 96 (-58.08%)
Mutual labels:  collectionview
Jxsegmentedview
A powerful and easy to use segmented view (segmentedcontrol, pagingview, pagerview, pagecontrol, categoryview) (腾讯新闻、今日头条、QQ音乐、网易云音乐、京东、爱奇艺、腾讯视频、淘宝、天猫、简书、微博等所有主流APP分类切换滚动视图)
Stars: ✭ 1,905 (+731.88%)
Mutual labels:  collectionview
Vbpiledview
Simple and beautiful stacked UIView to use as a replacement for an UITableView, UIImageView or as a menu
Stars: ✭ 164 (-28.38%)
Mutual labels:  collectionview
Wbcollectionviewlayout
Library used to provide different type of custom Layouts within 30 second of time
Stars: ✭ 105 (-54.15%)
Mutual labels:  collectionview
Planadscrollview
使用CollectionView实现的轮播图,丝滑的流畅,支持网络图片和本地图片轮播,混合也是支持的!
Stars: ✭ 117 (-48.91%)
Mutual labels:  collectionview
Rxrealmdatasources
An easy way to bind an RxRealm observable to a table or collection view
Stars: ✭ 154 (-32.75%)
Mutual labels:  collectionview
Jotify
Sticky notes reimagined - written in Swift
Stars: ✭ 79 (-65.5%)
Mutual labels:  collectionview
Pinterestlayout
Custom collection view layout inspired by Pinterest layout. Written in Swift.
Stars: ✭ 219 (-4.37%)
Mutual labels:  collectionview
Emptykit
A lightweight, swift library for displaying emptyView whenever the view(tableView/collectionView) has no content to display, just like DZNEmptyDataSet
Stars: ✭ 117 (-48.91%)
Mutual labels:  collectionview
Zkcarousel
A simple carousel implementation written in Swift
Stars: ✭ 163 (-28.82%)
Mutual labels:  collectionview
Collectionview
An easy to use, highly customizable replacement for NSCollectionView.
Stars: ✭ 107 (-53.28%)
Mutual labels:  collectionview
Pull To Refresh
ESPullToRefresh is developed and maintained by Vincent Li. If you have any questions or issues in using ESPullToRefresh, welcome to issue. If you want to contribute to ESPullToRefresh, Please submit Pull Request, I will deal with it as soon as possible.
Stars: ✭ 1,591 (+594.76%)
Mutual labels:  collectionview
Infinitescrolling
Add infinite scrolling to collection view.
Stars: ✭ 156 (-31.88%)
Mutual labels:  collectionview
Cardsstack
An awesome set of cards at your disposal ✌️ ⚡️
Stars: ✭ 97 (-57.64%)
Mutual labels:  collectionview
Chatlayout
ChatLayout is an alternative solution to MessageKit. It uses custom UICollectionViewLayout to provide you full control over the presentation as well as all the tools available in UICollectionView. It supports dynamic cells and supplementary view sizes.
Stars: ✭ 184 (-19.65%)
Mutual labels:  collectionview
Flowlayout
UICollectionView WaterFlowLayout. 瀑布流.
Stars: ✭ 94 (-58.95%)
Mutual labels:  collectionview
Squareflowlayout
🌄 UICollectionViewLayout subclass inspired by Instagram Discover page style layout.
Stars: ✭ 142 (-37.99%)
Mutual labels:  collectionview
Async Expandable List
Stars: ✭ 221 (-3.49%)
Mutual labels:  collectionview
Swipetableview
Both scroll horizontal and vertical for segment scrollview which have a same header. — 类似半糖、美丽说主页与QQ音乐歌曲列表布局效果,实现不同菜单的左右滑动切换,同时支持类似tableview的顶部工具栏悬停(既可以左右滑动,又可以上下滑动)。兼容下拉刷新,自定义 collectionview实现自适应 contentSize 还可实现瀑布流功能
Stars: ✭ 2,252 (+883.41%)
Mutual labels:  collectionview
Collectionviewslantedlayout
A CollectionView Layout displaying a slanted cells
Stars: ✭ 2,029 (+786.03%)
Mutual labels:  collectionview

Dynamic TypeEvent KitQuick LookApp IdeasKeyboard PreviewModern Collection Views


Modern Collection Views

Twitter: @nemecek_f License

My playground for trying stuff with compositional collection view layout and diffable data source.

The goal is to showcase different compositional layouts and how to achieve them. Feel free to use any code you can find and if you have interesting layout idea - open PR!

Please don't take these examples as the only correct way how to work with these APIs. I am still figuring them out and experimenting.

Check out my blog for posts about Compositional Layout and Diffable Data Sources or any other iOS development topics :-)

For more about NSCollectionLayoutGroup which lets you create layouts as shown below, check out this post.

CL-groups-example

Included examples

The project currently offers these example screens.

Layout examples

  • List layout - list created with Compositional Layout (CL) for iOS 13+
  • Simple grid - grid layout with option to change sizing and see it animate the change (see GIF below)
  • Lazy grid example - this grid starts with 12 items and when you scroll at the end it "loads" more (see GIF below)
  • Background decoration - this shows how to add background views to section in CL layout. For example you can use this to create layout similar to inset & grouped TableView [article]
  • System list - quick example of creating list layout with the API available from iOS 14
  • Onboarding flow - simple example showcasing creating onboarding with Compositional Layout [article]
  • Sticky headers - example showing how to configure headers to be pinned or sticky. Similarly what UITableView offers [article]
  • Responsive layout - example how to create responsive layout such that the items will retain approximately the same size across various devices [article]

More complete examples

  • Jokes list - this is more an example of Diffable Data Source that is used to display random jokes from an API and also favorited ones that are stored using Core Data. This also shows how to add headers to CL and loading effect. There is also context menu on the items and text-to-speech (because why not?)
  • Badges example - example showcasing adding badges to collection view cells and their positioning [article]
  • Instagram profile screen - this practical example shows how to build screen similar to Instagram profile with Compositional Layout and Diffable. You can read more on my blog

Free free to reach out over at @nemecek_f with issues, questions or anything else.

Apple Photos inspired layout with animations

Compositional Layout - Photos optimized

Instagram profile

Instantgram comparisson

Resizable grid

Resizable Grid Example

Lazy loaded grid - ideal for paging

Lazy Grid

Jokes list with loading indicators

Jokes Loading Shimmer

Badges

Compositional Layout - supplementary views example

Onboarding

Compositional Layout - onboarding example

Sticky headers

Compositional Layout - Sticky headers

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].