Latest 1.0.0
Homepage https://github.com/iKiKi/KTMosaicLayout
License MIT
Platforms ios 9.0, tvos 9.0
Authors

Reusable

Xcode 9.0+
iOS 9.0+
tvOS 9.0+
Swift 4.0+
Version
Carthage compatible
License
Twitter

KTMosaicLayout is a Swift UICollectionViewLayout being able to display UICollectionView items on different columns.

KTMosaicLayout

Features

In case at least 3 columns is defined for a section, KTMosaicLayout can display the first item of this section in a big style. When a section displays the first item as big, it means that the first row of this section displays all the last items on a single column, to layout the first as a big.

KTMosaicLayout

💡 In case you don’t really need to display big styled items in sections as illustrated above, this layout can be replaced by a usual UICollectionViewFlowLayout.

📱Example

KTMosaicLayoutKTMosaicLayoutKTMosaicLayout

💡 To run the example project, clone the repo, pod install, and run the iOS application.

Installation

CocoaPods

The preferred installation method is with CocoaPods. Add the following to your Podfile:

pod 'KTMosaicLayout'

Carthage

For Carthage, add the following to your Cartfile:

github "iKiKi/KTMosaicLayout"

Usage

You just need to set a KTMosaicLayout to your UICollectionView layout (using IB or code), set a MosaicLayoutDelegate to this layout and implement the necessary methods:

public protocol MosaicLayoutDelegate: class {
  func collectionView(_ collectionView: UICollectionView, numberOfColumnsInSection section: Int) -> Int
  func collectionView(_ collectionView: UICollectionView, shouldShowBigInSection section: Int) -> Bool
  func collectionView(_ collectionView: UICollectionView, heightForItemInSection section: Int) -> CGFloat // Called in case more than 1 column
  func collectionView(_ collectionView: UICollectionView, heightForItemAt indexPath: IndexPath) -> CGFloat // Called in case only 1 column

  func collectionView(_ collectionView: UICollectionView, insetForSectionAt section: Int) -> UIEdgeInsets
  func collectionView(_ collectionView: UICollectionView, minimumLineSpacingForSectionAt section: Int) -> CGFloat
  func collectionView(_ collectionView: UICollectionView, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat

  func collectionView(_ collectionView: UICollectionView, referenceSizeForHeaderInSection section: Int) -> CGSize
  func collectionView(_ collectionView: UICollectionView, referenceSizeForFooterInSection section: Int) -> CGSize
}

💡 heightForItemInSection is called in case a section has more than 1 column. heightForItemAt is called in case the section has only 1 column (to layout items with different heights).

License

KTMosaicLayout is released under the MIT license. See LICENSE for details.

Latest podspec

{
    "name": "KTMosaicLayout",
    "version": "1.0.0",
    "swift_version": "4.0",
    "cocoapods_version": ">= 1.4.0",
    "authors": {
        "Killian THORON": "[email protected]"
    },
    "social_media_url": "http://twitter.com/kthoron",
    "license": {
        "type": "MIT",
        "file": "LICENSE"
    },
    "homepage": "https://github.com/iKiKi/KTMosaicLayout",
    "source": {
        "git": "https://github.com/iKiKi/KTMosaicLayout.git",
        "tag": "1.0.0"
    },
    "summary": "A Swift UICollectionViewLayout to layout items on different columns",
    "description": "KTMosaicLayout is a Swift UICollectionViewLayout being able to display UICollectionView items on different columns.nIn case at least 3 columns is defined for a section. KTMosaicLayout can display the first item of this section in a "big" style.",
    "static_framework": true,
    "module_name": "KTMosaicLayout",
    "platforms": {
        "ios": "9.0",
        "tvos": "9.0"
    },
    "ios": {
        "frameworks": [
            "Foundation",
            "UIKit"
        ],
        "source_files": "Sources/*.swift"
    },
    "tvos": {
        "frameworks": [
            "Foundation",
            "UIKit"
        ],
        "source_files": "Sources/*.swift"
    }
}

Pin It on Pinterest

Share This