Latest 0.1.1
Homepage https://github.com/ijinmao/JMMaterialTableView
License MIT
Platforms ios 8.0
Authors

JMMaterialTableView License MIT

Version
Platform

Overview

JMMaterialTableView is a material design tableView inspired by Primer iOS app in Swift.

The UX of Primer iOS app is amazing, and Google’s Primer team wrote a great article about how they approached UX.

The cell transformation part is modified from StickyCollectionView.

Video

The demo in this project looks like this:

screenshot1

You can build a card table view like this:

screenshot1

Installation

Add this to your Podfile to use JMMaterialTableView:

pod 'JMMaterialTableView', '~> 0.1.1'

Alternatively you can directly add the JMMaterialLayout.swift and JMMaterialTableView.swift to your project.

Usage

Notice that JMMaterialTableView is actually an UICollectionView. After initialization, you can use it as a normal UICollectionView.

Initialize JMMaterialLayout and JMMaterialTableView in your viewController:

    let layout = JMMaterialLayout()
    let tableView = JMMaterialTableView(frame: frame, collectionViewLayout: layout) 

Set the cell size:

    tableView.cellSize = CGSizeMake(cellWidth, cellHeight)

Then you can use JMMaterialTableView just as a normal UICollectionView.

Restrictions

JMMaterialTableView is not supported dynamic cell height yet.

I don’t recommend dynamic cell height tableView to use this actually, the UX is not pretty I think.

Demo

You can customize collectionView and cell by modifying JMMaterialCell.swift and TableViewDataSource.swift in the demo.

Configuration

You can customize following properties in JMMaterialTableView.swift to change the default view:

  • cellSize
  • isTransformEnabled
    • when set false, the cell size will not reduce after scrolling
  • enableAutoScroll
    • when set true, the tableView will always scroll to a cell top position
  • enableCellShadow
  • scrollDecelerationRate
  • shadowOffset
  • shadowRadius
  • shadowOpacity
  • shadowColor
  • transformCoef

Latest podspec

{
    "name": "JMMaterialTableView",
    "version": "0.1.1",
    "summary": "JMMaterialTableView is a tableView inspired by Primer iOS app in Swift.",
    "description": "The UX of Primer iOS app is amazing, and Google's Primer team wrote an great article(https://medium.com/google-design/designing-a-ux-for-learning-ebed4fa0a798#.2ee2djini) about how they approached UX. JMMaterialTableView is inspired by them.",
    "homepage": "https://github.com/ijinmao/JMMaterialTableView",
    "license": "MIT",
    "authors": {
        "ijinmao": "[email protected]"
    },
    "platforms": {
        "ios": "8.0"
    },
    "source": {
        "git": "https://github.com/ijinmao/JMMaterialTableView.git",
        "tag": "0.1.1"
    },
    "source_files": [
        "JMMaterialTableView",
        "JMMaterialTableView/*.swift"
    ],
    "exclude_files": "JMMaterialTableView/Exclude"
}

Pin It on Pinterest

Share This