a TableView have thumbnail cell only, and you can use gesture let it expands other expansionView, all diy

Overview

ZYThumbnailTableView

#####可展开型预览TableView,开放接口,完全自由定制 #####An expandable preview TableView, custom-made all the modules completely with open API you can.
######Design by Sergii Ganushchak


Carthage compatible

a TableView have thumbnail cell only, and you can use gesture let it expands other expansionView, all DIY
高度自由定制可扩展TableView, 其中tableViewCell,topExpansionView,bottomExpansionView均提供接口自由定制,功能堪比小型阅读app



#####If you have updated Xcode 7.3 yet, please use the branch named 'Xcode7.3-Handle'.
#####如果已更新Xcode7.3,请下载分支Xcode7.3-Handle使用即可。

#英文文档 ##Summary
With TableView skin, the powerful heart similar to a small app, decoupling arms and legs and support highly customized there are. Every cell as a whole with the vocational work. you can expand more extension views through slide up&down with your finger, and that the cell and extension views you can custom-made completely with open API, which carry the param can meet your needs to make interaction.

  • Working characteristics: TableViewCell act as a container with thumbnail content, the contents of the initial display be limited to 'cellHeight',it will recalculate the complete height when you click it, and you can slide to expand the extension views after that.
  • Custom-made: tableViewCell, topExtensionView, bottomExtensionView all you can provide to thumbnailTableView.
  • Simple to use: alloc a ZYThumbnailTableViewController object, assign your tableViewCell, ExtensionView(top or bottom), and your can uses the indexPath that the param with the assign Block to come true your demand.

##CocoaPods

pod 'ZYThumbnailTableView', '~> 1.0.5'

Setting up with Carthage

Carthage is a decentralized dependency manager that automates the process of adding frameworks to your Cocoa application.

You can install Carthage with Homebrew using the following command:

$ brew update
$ brew install carthage

To integrate ZYThumbnailTableView into your Xcode project using Carthage, specify it in your Cartfile:

github "Dershowitz011/ZYYT"

##Usage
You can consult the Demo to complete your own thumbnailTableView. Have fun.
create a ZYThumbnailTableView object:

zyThumbnailTableVC = ZYThumbnailTableViewController()

configure the necessary param of tableViewCell, cellHeight, reused identification, dataSource...

zyThumbnailTableVC.tableViewCellReuseId = "DIYTableViewCell"
zyThumbnailTableVC.tableViewCellHeight = 100.0
zyThumbnailTableVC.tableViewDataList = dataList
//you can modify the cellHeight & dataList all the place dynamically
//you must ensure the dataSource newest, dont forget to update it in network callback .
zyThumbnailTableVC.tableViewBackgroudColor = UIColor.whiteColor()
//default backgroundColor is white.

and then configure your tableViewCell

//--------insert your custom tableview cell
zyThumbnailTableVC.configureTableViewCellBlock = {
    return DIYTableViewCell.createCell()
}

configure the update cell function

zyThumbnailTableVC.updateTableViewCellBlock =  { [weak self](cell: UITableViewCell, indexPath: NSIndexPath) -> Void in
    let myCell = cell as? DIYTableViewCell
    //Post is my datasource model
    guard let dataSource = self?.zyThumbnailTableVC.tableViewDataList[indexPath.row] as? Post else {
        print("ERROR: illegal tableview dataSource")
        return
    }
    myCell?.updateCell(dataSource)
}

configure your expansionView(Top or bottom) - Both two Block provides the 'indexPath' as a param, i omit the param indexPath in Demo because of it`s no used to my BottomView. - it is an assignment about zyThumbnailTableVC.keyboardAdaptiveView, becouse of there are a TestField in my BottomView, assign to keyboardAdaptiveView, [ZYKeyboardUtil](https://github.com/liuzhiyi1992/ZYKeyboardUtil) will handle the event that keyboard cover the TextField.(Take care: there are the same object i assign to zyThumbnailTableVC.keyboardAdaptiveView and deliver to the createBottomExpansionViewBlock)
//--------insert your diy TopView
zyThumbnailTableVC.createTopExpansionViewBlock = { [weak self](indexPath: NSIndexPath) -> UIView in
    //Post是我的数据model
    let post = self?.zyThumbnailTableVC.tableViewDataList[indexPath.row] as! Post
    let topView = TopView.createView(indexPath, post: post)!
    topView.delegate = self;
    return topView
}

let diyBottomView = BottomView.createView()!
//--------let your inputView component not cover by keyboard automatically (animated) (ZYKeyboardUtil)
zyThumbnailTableVC.keyboardAdaptiveView = diyBottomView.inputTextField;
//--------insert your diy BottomView
zyThumbnailTableVC.createBottomExpansionViewBlock = { _ in
    return diyBottomView
}

The effects working with ZYKeyboardUtil

In general, your own thumbnailtableView is completed, you can produce the Interaction in your custom view file, and use 'indexPath' to connected them.

how i used 'indexPath' in my Interaction

  • mark as read, the green dot disappear.
  • mark as favorite, show a star on the edge of the cell.

I save the param 'indexpath' in my topView object while createView, if the favorite button be clicked, i modify the dataSource according to ‘indexPath' with delegate, and zyThumbnailTableVC.reloadMainTableView().

//TopView---------------------------------------------
class func createView(indexPath: NSIndexPath, post: Post) -> TopView? {
    //--------do something
    view.indexPath = indexPath
    return view
}

//touch up inside---------------------------------------------
@IBAction func clickFavoriteButton(sender: UIButton) {
    //--------do something
    delegate.topViewDidClickFavoriteBtn?(self)
}

//delegate func    in   ViewController---------------------------
func topViewDidClickFavoriteBtn(topView: TopView) {
    let indexPath = topView.indexPath
    //Post is my dataSource model
    let post = zyThumbnailTableVC.tableViewDataList[indexPath.row] as! Post
    post.favorite = !post.favorite
    zyThumbnailTableVC.reloadMainTableView()
}

For NavigationBar, i deal with navigationItem of zyThumbnailTableView object in ViewController in Demo, eh, maybe you can let ZYThumbnailTabelViewController inherit your communal Controller in the my Source Code.

//------------ViewController------------
func configureZYTableViewNav() {
        let titleView = UILabel(frame: CGRectMake(0, 0, 200, 44))
        titleView.text = "ZYThumbnailTabelView"
        titleView.textAlignment = .Center
        titleView.font = UIFont.systemFontOfSize(20.0);
        //503f39
        titleView.textColor = UIColor(red: 63/255.0, green: 47/255.0, blue: 41/255.0, alpha: 1.0)
        zyThumbnailTableVC.navigationItem.titleView = titleView
    }


#For Chinese ##Summary:
tableView的皮肤,类似一个小型app的强大交互心脏,四肢高度解耦高度自由定制,每个cell其实都是一个业务的缩略view,原谅我语文不太好不懂表达,这样的缩略view下文就叫做thumbnailView,可以根据上下手势展开更多的功能视图块,这些视图块已经开放了接口,支持使用者自己diy提供创建,同时接口中带的参数基本满足使用者需要的交互,当然tableviewCell也是完全自由diy的

  • 工作特点:tableViewCell充当一个缩略内容的容器,初始内容展示局限于cellHeight,当cell被点击后,根据缩略view内容重新计算出完整的高度,装入另外一个容器中完整展示出来,并且可以上下拖拽扩展出上下功能视图。

  • 自由定制:看见的除了功能以外,全部视图都开放接口灵活Diy,tableViewCell,头部扩展视图(topView),底部扩展视图(bottomView)都是自己提供。

  • 使用简单:只需要把自己的tableViewCell,topView,bottomView配置给ZYThumbnailTableViewController对象。

##CocoaPods:
未来会更新oc版

pod 'ZYThumbnailTableView', '~> 1.0.5'

##Usage:
------结合Demo介绍使用方法,手把手定制自己的ThumbnailTableView:
创建ZYThumbnailTableViewController对象:

zyThumbnailTableVC = ZYThumbnailTableViewController()

配置tableViewCell必须的参数:cell高,cell的重用标志符,tableView的数据源等

zyThumbnailTableVC.tableViewCellReuseId = "DIYTableViewCell"
zyThumbnailTableVC.tableViewCellHeight = 100.0
//当然cell高可以在任何时候动态配置
zyThumbnailTableVC.tableViewDataList = dataList
zyThumbnailTableVC.tableViewBackgroudColor = UIColor.whiteColor()
//背景颜色可不设置,默认为白色

接下来给ZYTableView配置你自己的tableViewCell,当然除了createCell外还可以在里面进行其他额外的操作,不过这个Block只会在需要生成cell的时候被调用,而重用cell并不会 ```swift //--------insert your diy tableview cell zyThumbnailTableVC.configureTableViewCellBlock = { return DIYTableViewCell.createCell() } ```

配置cell的update方法,tableView配置每个cell必经之处,除了updateCell可以添加额外的操作。这里要注意updateCell的时候建议尽量使用zyThumbnailTableVC对象里的数据源datalist,同时要注意时刻保证VC对象里的数据源为最新,接口回调更改数据源时不要忘了对zyThumbnailTableVC.tableViewDataList的更新。

zyThumbnailTableVC.updateTableViewCellBlock =  { [weak self](cell: UITableViewCell, indexPath: NSIndexPath) -> Void in
    let myCell = cell as? DIYTableViewCell
    //Post是我的数据model
    guard let dataSource = self?.zyThumbnailTableVC.tableViewDataList[indexPath.row] as? Post else {
        print("ERROR: illegal tableview dataSource")
        return
    }
    myCell?.updateCell(dataSource)
}

配置你自己的顶部扩展视图 & 底部扩展视图(expansionView) - 两个Block均提供indexPath参数,只是因为我的BottomView的业务暂时不需要识别对应的是哪个cell,所以使用时把参数省略掉了。 - 这里还有一个对zyThumbnailTableVC.keyboardAdaptiveView的赋值,是因为我的BottomView中包含有TextField,正如上文所说,```ZYKeyboardUtil```会自动帮我处理键盘遮挡事件。(==注意==:赋值给keyboardAdaptiveView的和我往Block里送的是同一个对象) ```swift //--------insert your diy TopView zyThumbnailTableVC.createTopExpansionViewBlock = { [weak self](indexPath: NSIndexPath) -> UIView in //Post是我的数据model let post = self?.zyThumbnailTableVC.tableViewDataList[indexPath.row] as! Post let topView = TopView.createView(indexPath, post: post)! topView.delegate = self; return topView }

let diyBottomView = BottomView.createView()! //--------let your inputView component not cover by keyboard automatically (animated) (ZYKeyboardUtil) zyThumbnailTableVC.keyboardAdaptiveView = diyBottomView.inputTextField; //--------insert your diy BottomView zyThumbnailTableVC.createBottomExpansionViewBlock = { _ in return diyBottomView }



结合[ZYKeyboardUtil](https://github.com/liuzhiyi1992/ZYKeyboardUtil)工作的效果:  

![](https://raw.githubusercontent.com/liuzhiyi1992/MyStore/master/ZYThumbnailTableView/ZYThumbnailTableView%E9%85%8D%E5%90%88ZYKeyboardUtil%E6%BC%94%E7%A4%BAgif.gif)  



就这样,属于你自己的thumbnailtableView就完成了。展开,关闭,基本功能上都能使用,但是如果在topView,bottomView中有什么交互功能之类的,就要在自己的头部尾部扩展控件和自定义的tableViewCell里面完成了,ZYThumbnailTableView提供cell的```indexPath```贯通三者通讯交流。  



回看下Demo中的交互是怎样利用```indexPath```的:  
![](https://raw.githubusercontent.com/liuzhiyi1992/MyStore/master/ZYThumbnailTableView/zyTableView%E4%B8%A4%E4%B8%AA%E4%BA%A4%E4%BA%92%E6%BC%94%E7%A4%BAgif.gif)  

- 标记为已读后,小圆点会消失  
- 标识为喜欢后,会在对应的cell旁边出现一个星星  

createView的时候我将从createTopExpansionViewBlock参数中得到的indexPath储存在我的topView对象中,当favorite按钮被点击时就可以indexPath为凭据利用代理改变对应数据源里的对应状态,同时在下次createView时根据indexPath取得对应的数据源来显示。如果这些交互会更新一些与cell相关的数据,还可以在代理方法中调用```zyThumbnailTableVC.reloadMainTableView()```让tableView重新加载一遍。
```swift
//TopView---------------------------------------------
class func createView(indexPath: NSIndexPath, post: Post) -> TopView? {
    //--------do something
    view.indexPath = indexPath
    return view
}

//touch up inside---------------------------------------------
@IBAction func clickFavoriteButton(sender: UIButton) {
    //--------do something
    delegate.topViewDidClickFavoriteBtn?(self)
}

//代理方法---------------------------------------------
func topViewDidClickFavoriteBtn(topView: TopView) {
    let indexPath = topView.indexPath
    //Post是我的数据model
    let post = zyThumbnailTableVC.tableViewDataList[indexPath.row] as! Post
    post.favorite = !post.favorite
    zyThumbnailTableVC.reloadMainTableView()
}

还有对于导航条样式处理的话,Demo中直接在外面对zyThumbnailTableView对象的navigationItem做处理,亦或者可以在我的源代码中让ZYThumbnailTabelViewController继承你封装过导航栏样式的父类。

func configureZYTableViewNav() {
        let titleView = UILabel(frame: CGRectMake(0, 0, 200, 44))
        titleView.text = "ZYThumbnailTabelView"
        titleView.textAlignment = .Center
        titleView.font = UIFont.systemFontOfSize(20.0);
        //503f39
        titleView.textColor = UIColor(red: 63/255.0, green: 47/255.0, blue: 41/255.0, alpha: 1.0)
        zyThumbnailTableVC.navigationItem.titleView = titleView
    }

##profile: **Block:** - ConfigureTableViewCellBlock = () -> UITableViewCell? - UpdateTableViewCellBlock = (cell: UITableViewCell, -indexPath: NSIndexPath) -> Void - CreateTopExpansionViewBlock = (indexPath: NSIndexPath) -> UIView - CreateBottomExpansionViewBlock = () -> UIView

Define:

  • NOTIFY_NAME_DISMISS_PREVIEW
    通知名(让展现出来的thumbnailView消失)
  • MARGIN_KEYBOARD_ADAPTATION
    自动处理键盘遮挡输入控件后,键盘与输入控件保持的间距(自动处理键盘遮挡事件使用ZYKeyboardUtil实现
  • TYPE_EXPANSION_VIEW_TOP
    处理展开抖动事件时,顶部扩展控件的标识
  • TYPE_EXPANSION_VIEW_BOTTOM
    处理展开抖动事件时,底部扩展控件的标识

Property:
开放:

  • tableViewCellHeight
  • tableViewDataList
  • tableViewCellReuseId
  • tableViewBackgroudColor
  • keyboardAdaptiveView 你自定义控件里如果有希望不被键盘遮挡的输入控件,赋值给他,会帮你==自动处理遮盖事件==

私有:

  • mainTableView
  • clickIndexPathRow 记录被点击cell的indexPath row
  • spreadCellHeight 存储thumbnailCell展开后的真实高度
  • cellDictionary 存储所有存活中的cell
  • thumbnailView 缩略view
  • thumbnailViewCanPan 控制缩略view展开(扩展topView&buttomView)手势是否工作
  • animator UI物理引擎控制者
  • expandAmplitude view展开时抖动动作的振幅
  • keyboardUtil 自动处理键盘遮挡事件工具对象ZYKeyboardUtil

Delegate func:

  • optional func zyTableViewDidSelectRow(tableView: UITableView, indexPath: NSIndexPath)

对外会用到的func:

  • dismissPreview() 让thumbnailView消失,在TopView,BottomView等没有zyThumbnailTableView对象的地方可以使用通知NOTIFY_NAME_DISMISS_PREVIEW
  • reloadMainTableView() 重新加载tableView

##Relation:
@liuzhiyi1992 on Github

##License:
ZYThumbnailTableView is released under the MIT license. See LICENSE for details.

有什么问题可以在github中提交issues交流,谢谢

Comments
  • Errors Xcode 7.3

    Errors Xcode 7.3

    Hi I just tried to run this in Xcode 7.3 and I got these errors.

    Thanks in advance for your help.

    Command /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/swiftc failed with exit code 1

    Command failed due to signal: Segmentation fault: 11

    Command /usr/bin/ditto failed with exit code 1

    opened by Ged2323 1
  • 文档格式太乱了,可读性很差

    文档格式太乱了,可读性很差

    原谅我提了一个和技术本身无关的issue,但项目的README格式实在太乱了,估计是你使用了某款markdown编辑器的语法渲染与github与比较大的出入,所以最好还是根据github上的效果做一些调整,这样对初次接触、想了解你的repo的人会有很大的帮助,说不定可以新增一大波star :P

    另外,建议把中英文的文档分开,别说分成两个单独的文件,至少是同一个文件的独立两部分,现在这种“中英文对照”的可读性挺差的,懂中文的人不太会去读你上面的英文,不懂中文的人也看不懂你下面是什么意思,何必呢是吧。

    Repo本身还是挺不错的,👍

    opened by maxhis 0
  • Cannot convert value of type '() -> ()' to specified type 'UpdateTableViewCellBlock' (aka '(UITableViewCell, IndexPath) -> ()')

    Cannot convert value of type '() -> ()' to specified type 'UpdateTableViewCellBlock' (aka '(UITableViewCell, IndexPath) -> ()')

    Hi I tried running this with swift 3.1 and I'm getting this issue on this func.

    open lazy var updateTableViewCellBlock: UpdateTableViewCellBlock = { return { print("ERROR: You must configure the updateTableViewCellBlock") } }()

    Cannot convert value of type '() -> ()' to specified type 'UpdateTableViewCellBlock' (aka '(UITableViewCell, IndexPath) -> ()')

    Thanks in advance for your help.

    Yours Sincerely Gerard Grundy

    opened by Ged2323 1
  • constraints top bar and bottom bar

    constraints top bar and bottom bar

    @liuzhiyi1992 @Dershowitz011 The constraints for the bottom bar and top bar are messed up. When you slide up the top bar is cut short and when you slide down the message bar nearly takes up the entire screen. Can you fix it to look the way you have it on github.

    opened by jackpaster 0
  • Clearer Description of how to Create Expandable Cells

    Clearer Description of how to Create Expandable Cells

    I've just been using the ZY Thumbnail Table View and love what its capable of. One issue I was stuck on was designing custom table view cells that expanded correctly when clicked on.

    I finally managed to get expanding table cells by ensuring the text label had 'Lines' set to 0, and Line Breaks set to 'Word Wrap'. In the hierarchy I had a single child view of the Content View which was pinned to the top, bottom, left and right of the superview. Inside the view were the child elements, including the text block I wanted to expand. Each of these child elements was separated by a vertical spacer. The last two elements were my expanding text label, and a 'dummy' image view (as shown in the Demo).

    I thought it might be helpful to future users trying to make their table cells expand correctly, as I've spent a few hours trying to get it right.

    opened by tjw0051 2
Owner
null
Easy UITableView drag-and-drop cell reordering

SwiftReorder NOTE: Some users have encountered compatibility issues when using this library with recent versions of iOS. For apps targeting iOS 11 and

Adam Shin 378 Dec 13, 2022
A UITableView extension that enables cell insertion from the bottom of a table view.

ReverseExtension UITableView extension that enabled to insert cell from bottom of tableView. Concept It is difficult to fill a tableview content from

Taiki Suzuki 1.7k Dec 15, 2022
ClassicPhotos is a TableView App demos how to optimize image download and filter with operation queue.

ClassicPhotos ClassicPhotos is a TableView App demos how to optimize image download and filter with operation queue. With Operation and Operation Queu

Kushal Shingote 2 Dec 18, 2021
BaseTableViewOriginal - Base TableView Original With Swift

BaseTableViewOriginal Example To run the example project, clone the repo, and ru

Viacheslav 0 Feb 2, 2022
MultiplyTypeCellExample - An example of the implementation of different types of cells in a tableview

MultiplyTypeCellExample An example of the implementation of different types of c

Marina Demchenko 0 Feb 13, 2022
A cells of UITableView can be rearranged by drag and drop.

TableViewDragger This is a demo that uses a TableViewDragger. Appetize's Demo Requirements Swift 4.2 iOS 8.0 or later How to Install TableViewDragger

Kyohei Ito 515 Dec 28, 2022
Use Yelp API to fetch restuarants around a location and show them in a table view

Yelp Use Yelp API to fetch restuarants around a location and show them in a table view - Infinite scrolling, Prefetching, Image Caching. Design Patter

null 0 Nov 1, 2021
Simple and beautiful stacked UIView to use as a replacement for an UITableView, UIImageView or as a menu

VBPiledView simple but highly effective animation and interactivity! By v-braun - viktor-braun.de. Preview Description Very simple and beautiful stack

Viktor Braun 168 Jan 3, 2023
An easy to use UITableViewCell subclass that allows to display swippable buttons with a variety of transitions.

MGSwipeTableCell MGSwipeTableCell is an easy to use UITableViewCell subclass that allows to display swipeable buttons with a variety of transitions. T

Imanol Fernandez 7k Dec 26, 2022
An easy-to-use UITableViewCell subclass that implements a swippable content view which exposes utility buttons (similar to iOS 7 Mail Application)

SWTableViewCell An easy-to-use UITableViewCell subclass that implements a swipeable content view which exposes utility buttons (similar to iOS 7 Mail

Christopher Wendel 7.2k Dec 31, 2022
APDynamicGrid is a SwiftUI package that helps you create consistent and animatable grids.

APDynamicGrid Overview APDynamicGrid is a SwiftUI package that helps you create consistent and animatable grids. The DynamicGrid View preserves the sa

Antonio Pantaleo 29 Jul 4, 2022
Framework to help you better manage UITableViews

UITableView made simple ?? Main Features ?? Skip the UITableViewDataSource & UITableViewDelegate boilerplate and get right to building your UITableVie

null 84 Feb 4, 2022
This framework allows you to build Table views using UIKit with syntax similar to SwiftUI

This framework allows you to build Table views using UIKit with syntax similar to SwiftUI

Fun 60 Dec 17, 2022
Display list of Marvel comic Characters and its detail view

Marvel Universe Display list of Marvel comic Characters and its detail view Installation Dependencies in this project are provided via Xcodegen (proje

null 1 Oct 19, 2021
A PageView, which supporting scrolling to transition between a UIView and a UITableView

YXTPageView ##A Page View, which support scrolling to transition between a UIView and a UITableView UIView (at the top) UITableView (at the bottom) In

Hanton Yang 68 May 25, 2022
A no-nonsense way to write cleaner UITableViewDelegate and UITableViewDataSource in Swift.

CascadingTableDelegate A no-nonsense way to write cleaner UITableViewDelegate and UITableViewDataSource. Why is this library made? In common iOS devel

Ricardo Pramana Suranta 920 Dec 14, 2022
Protocol-oriented UITableView management, powered by generics and associated types.

DTTableViewManager Features Powerful mapping system between data models and cells, headers and footers Automatic datasource and interface synchronizat

Denys Telezhkin 454 Nov 9, 2022
Elegant and easy way to integrate pagination with dummy views

AZTableView Controller Features Automatic pagination handling No more awkward empty TableView screen AZ TableView controller give you advantage to con

Afroz Zaheer 73 Oct 17, 2022
A UIKit based geotagging app that let's you save places you have visited with images.

My Locations Getting Started Using Core Location A CLLocationManager() performs the location updating It sends its updates to its delegate, so make su

Xiao Quan 全笑 0 Jan 4, 2022
A beautiful app that will let you know how much sun you have today.

Daylight A beautiful app that will let you know how much sun you have today. Running the project Open Project.xcodeproj and run What's interesting abo

Bakken & Bæck 118 Jan 2, 2023