expanding-collection
所属分类:前端开发
开发工具:Swift
文件大小:29699KB
下载次数:0
上传日期:2020-04-06 06:53:36
上 传 者:
sh-1993
说明: ![:octocat:](https:github.githubassets.com images icons emoji octocat.png)ExpandingCollection是一款动画材质设计UI卡预览弹出控制器。[@Ramotion]制作的iOS库(https:github.com Ramotion)
(![:octocat:](https: github.githubassets.com images icons emoji octocat.png) ExpandingCollection is an animated material design UI card peek pop controller. iOS library made by [@Ramotion](https: github.com Ramotion))
文件列表:
.swift-version (3, 2020-04-06)
.travis.yml (241, 2020-04-06)
CONTRIBUTING.md (3525, 2020-04-06)
DemoExpandingCollection (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\project.pbxproj (36418, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\project.xcworkspace (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\project.xcworkspace\contents.xcworkspacedata (168, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\project.xcworkspace\xcshareddata (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\project.xcworkspace\xcshareddata\IDEWorkspaceChecks.plist (238, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\xcshareddata (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\xcshareddata\xcschemes (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection.xcodeproj\xcshareddata\xcschemes\ExpandingCollection.xcscheme (2970, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\AppDelegate.swift (1126, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\AppIcon.appiconset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\AppIcon.appiconset\Contents.json (848, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\BackgroundImage.imageset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\BackgroundImage.imageset\Contents.json (304, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\BackgroundImage.imageset\pngIcon.png (614709, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\CloseButton.imageset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\CloseButton.imageset\Contents.json (343, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\CloseButton.imageset\close.png (1140, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\Contents.json (62, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\Title.imageset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\Title.imageset\Contents.json (303, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\Title.imageset\text-1.png (2983, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\dots.imageset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\dots.imageset\Contents.json (301, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\dots.imageset\dots.png (476, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\face1.imageset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\face1.imageset\Contents.json (302, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\face1.imageset\face1.png (8094, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\face2.imageset (0, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\face2.imageset\Contents.json (302, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\face2.imageset\face2.png (7857, 2020-04-06)
DemoExpandingCollection\DemoExpandingCollection\Assets.xcassets\heand.imageset (0, 2020-04-06)
... ...
EXPANDING COLLECTION
An animated material design UI card peek/pop controller
___
We specialize in the designing and coding of custom UI for Mobile Apps and Websites.
Stay tuned for the latest updates:
[![Twitter](https://img.shields.io/badge/Twitter-@Ramotion-blue.svg?style=flat)](http://twitter.com/Ramotion)
[![CocoaPods](https://img.shields.io/cocoapods/p/expanding-collection.svg)](https://cocoapods.org/pods/expanding-collection)
[![CocoaPods](https://img.shields.io/cocoapods/v/expanding-collection.svg)](http://cocoapods.org/pods/expanding-collection)
[![Carthage compatible](https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat)](https://github.com/Ramotion/expanding-collection)
[![Travis](https://travis-ci.org/Ramotion/expanding-collection.svg?branch=master)](https://travis-ci.org/Ramotion/expanding-collection)
[![codebeat badge](https://codebeat.co/badges/6a009992-5bf2-4730-aa35-f3b20ce7693d)](https://codebeat.co/projects/github-com-ramotion-expanding-collection)
[![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/Ramotion)
## Requirements
- iOS 9.0+
- Xcode 9.0+
## Installation
Just add the Source folder to your project.
or use [CocoaPods](https://cocoapods.org) with Podfile:
``` ruby
pod 'expanding-collection'
```
or [Carthage](https://github.com/Carthage/Carthage) users can simply add to their `Cartfile`:
```
github "Ramotion/expanding-collection"
```
## Usage
```swift
import expanding_collection
```
#### Create CollectionViewCell
![cell](https://raw.githubusercontent.com/Ramotion/expanding-collection/master/images/image2.png)
1) Create UICollectionViewCell inherit from `BasePageCollectionCell` (recommend create cell with xib file)
2) Adding FrontView
- add a view to YOURCELL.xib and connect it to `@IBOutlet weak var frontContainerView: UIView!`
- add width, height, centerX and centerY constraints (width and height constranints must equal cellSize)
![cell](https://raw.githubusercontent.com/Ramotion/expanding-collection/master/images/image1.png)
- connect centerY constraint to `@IBOutlet weak var frontConstraintY: NSLayoutConstraint!`
- add any desired uiviews to frontView
3) Adding BackView
- repeat step 2 (connect outlets to `@IBOutlet weak var backContainerView: UIView!`, `@IBOutlet weak var backConstraintY: NSLayoutConstraint!`)
4) Cell example [DemoCell](https://github.com/Ramotion/expanding-collection/tree/master/DemoExpandingCollection/DemoExpandingCollection/ViewControllers/DemoViewController/Cells)
###### If set `tag = 101` for any `FrontView.subviews` this view will be hidden during the transition animation
#### Create CollectionViewController
1) Create a UIViewController inheriting from `ExpandingViewController`
2) Register Cell and set Cell size:
``` swift
override func viewDidLoad() {
itemSize = CGSize(width: 214, height: 460) //IMPORTANT!!! Height of open state cell
super.viewDidLoad()
// register cell
let nib = UINib(nibName: "NibName", bundle: nil)
collectionView?.registerNib(nib, forCellWithReuseIdentifier: "CellIdentifier")
}
```
3) Add UICollectionViewDataSource methods
``` swift
extension YourViewController {
override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return items.count
}
override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCellWithReuseIdentifier("CellIdentifier"), forIndexPath: indexPath)
// configure cell
return cell
}
}
```
4) Open Cell animation
```swift
override func viewDidLoad() {
itemSize = CGSize(width: 214, height: 2***)
super.viewDidLoad()
// register cell
let nib = UINib(nibName: "CellIdentifier", bundle: nil)
collectionView?.registerNib(nib, forCellWithReuseIdentifier: String(DemoCollectionViewCell))
}
```
``` swift
func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
cell.cellIsOpen(!cell.isOpened)
}
```
###### if you use this delegates method:
```Swift
func collectionView(collectionView: UICollectionView, willDisplayCell cell: UICollectionViewCell, forItemAtIndexPath indexPath: NSIndexPath)
func scrollViewDidEndDecelerating(scrollView: UIScrollView)
```
###### must call super method:
```Swift
func collectionView(collectionView: UICollectionView, willDisplayCell cell: UICollectionViewCell, forItemAtIndexPath indexPath: NSIndexPath) {
super.collectionView(collectionView: collectionView, willDisplayCell cell: cell, forItemAtIndexPath indexPath: indexPath)
// code
}
func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
super.scrollViewDidEndDecelerating(scrollView: scrollView)
// code
}
```
#### Transition animation
1) Create a UITableViewController inheriting from `ExpandingTableViewController`
2) Set header height default 236
``` swift
override init(nibName nibNameOrNil: String?, bundle nibBundleOrNil: Bundle?) {
super.init(nibName: nibNameOrNil, bundle: nibBundleOrNil)
headerHeight = ***
}
```
OR
``` swift
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
headerHeight = ***
}
```
3) Call the push method in YourViewController to YourTableViewController
``` swift
if cell.isOpened == true {
let vc: YourTableViewController = // ... create view controller
pushToViewController(vc)
}
```
4) For back transition use `popTransitionAnimation()`
## — Check this library on other language:
## “ License
Expanding Collection is released under the MIT license.
See [LICENSE](./LICENSE) for details.
This library is a part of a
selection of our best UI open-source projects.
If you use the open-source library in your project, please make sure to credit and backlink to www.ramotion.com
## “± Get the Showroom App for iOS to give it a try
Try this UI component and more like this in our iOS app. Contact us if interested.
近期下载者:
相关文件:
收藏者: