Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Alex.k
|
836c4f80e5 | ||
|
Alex.k
|
b6525b5dde | ||
|
Alex.k
|
6474edec91 | ||
|
Alex.k
|
e6818ed0d4 | ||
|
Alex.k
|
f2c31da3b5 | ||
|
Alex.k
|
c87b5f5892 |
+1
-1
@@ -1,6 +1,6 @@
|
||||
Pod::Spec.new do |s|
|
||||
s.name = 'FoldingCell'
|
||||
s.version = '0.8.6'
|
||||
s.version = '0.8.7'
|
||||
s.summary = 'UITableViewCell with folding animation.'
|
||||
s.homepage = 'https://github.com/Ramotion/folding-cell'
|
||||
s.license = 'MIT'
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="9532" systemVersion="15D21" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="0cn-rv-Emg">
|
||||
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="10117" systemVersion="15F34" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="0cn-rv-Emg">
|
||||
<dependencies>
|
||||
<deployment identifier="iOS"/>
|
||||
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="9530"/>
|
||||
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="10085"/>
|
||||
</dependencies>
|
||||
<customFonts key="customFonts">
|
||||
<mutableArray key="OpenSans-Light.ttf">
|
||||
@@ -50,28 +50,28 @@
|
||||
<!--Main Table View Controller-->
|
||||
<scene sceneID="Q2d-BE-geS">
|
||||
<objects>
|
||||
<tableViewController storyboardIdentifier="MainTableViewController" id="0cn-rv-Emg" customClass="MainTableViewController" customModule="FoldingCell" customModuleProvider="target" sceneMemberID="viewController">
|
||||
<tableViewController storyboardIdentifier="MainTableViewController" id="0cn-rv-Emg" customClass="MainTableViewController" customModule="FoldingCellDemo" customModuleProvider="target" sceneMemberID="viewController">
|
||||
<tableView key="view" clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" showsHorizontalScrollIndicator="NO" showsVerticalScrollIndicator="NO" dataMode="prototypes" style="plain" separatorStyle="none" showsSelectionImmediatelyOnTouchBegin="NO" rowHeight="667" sectionHeaderHeight="28" sectionFooterHeight="28" id="MwZ-K3-six">
|
||||
<rect key="frame" x="0.0" y="0.0" width="600" height="695"/>
|
||||
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
|
||||
<color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
|
||||
<color key="sectionIndexBackgroundColor" white="0.0" alpha="0.0" colorSpace="calibratedWhite"/>
|
||||
<prototypes>
|
||||
<tableViewCell clipsSubviews="YES" contentMode="scaleToFill" selectionStyle="none" indentationWidth="10" reuseIdentifier="FoldingCell" rowHeight="667" id="fgm-B1-nUi" customClass="DemoCell" customModule="FoldingCell" customModuleProvider="target">
|
||||
<tableViewCell clipsSubviews="YES" contentMode="scaleToFill" selectionStyle="none" indentationWidth="10" reuseIdentifier="FoldingCell" rowHeight="667" id="fgm-B1-nUi" customClass="DemoCell" customModule="FoldingCellDemo" customModuleProvider="target">
|
||||
<rect key="frame" x="0.0" y="28" width="600" height="667"/>
|
||||
<autoresizingMask key="autoresizingMask"/>
|
||||
<tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="fgm-B1-nUi" id="MxP-E5-nua">
|
||||
<rect key="frame" x="0.0" y="0.0" width="600" height="667"/>
|
||||
<autoresizingMask key="autoresizingMask"/>
|
||||
<subviews>
|
||||
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="CQr-i9-7br" userLabel="Foreground" customClass="RotatedView" customModule="FoldingCell" customModuleProvider="target">
|
||||
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="CQr-i9-7br" userLabel="Foreground" customClass="RotatedView" customModule="FoldingCellDemo" customModuleProvider="target">
|
||||
<rect key="frame" x="20" y="7" width="560" height="165"/>
|
||||
<subviews>
|
||||
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="UhV-pr-kw4" userLabel="LeftView">
|
||||
<rect key="frame" x="0.0" y="0.0" width="88" height="165"/>
|
||||
<subviews>
|
||||
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="£25" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="uWG-zH-Vjo">
|
||||
<rect key="frame" x="19" y="31" width="42" height="33"/>
|
||||
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="#25" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="uWG-zH-Vjo">
|
||||
<rect key="frame" x="19" y="31" width="43" height="33"/>
|
||||
<fontDescription key="fontDescription" name="OpenSans-Light" family="Open Sans" pointSize="24"/>
|
||||
<color key="textColor" red="1" green="1" blue="1" alpha="0.8008604307432432" colorSpace="calibratedRGB"/>
|
||||
<nil key="highlightedColor"/>
|
||||
@@ -375,7 +375,7 @@
|
||||
<constraint firstItem="O5y-fi-aEI" firstAttribute="leading" secondItem="sdL-VL-QmS" secondAttribute="trailing" constant="1" id="vn1-SH-zt8"/>
|
||||
</constraints>
|
||||
</view>
|
||||
<view tag="1" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="stA-YF-Roj" userLabel="SecondContanerView" customClass="RotatedView" customModule="FoldingCell" customModuleProvider="target">
|
||||
<view tag="1" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="stA-YF-Roj" userLabel="SecondContanerView" customClass="RotatedView" customModule="FoldingCellDemo" customModuleProvider="target">
|
||||
<rect key="frame" x="0.0" y="165" width="560" height="165"/>
|
||||
<subviews>
|
||||
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="SENDER" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="W63-7b-X8w">
|
||||
@@ -518,7 +518,7 @@
|
||||
<constraint firstAttribute="height" constant="165" id="zna-xw-SZ3"/>
|
||||
</constraints>
|
||||
</view>
|
||||
<view tag="2" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="dXA-2m-h6U" userLabel="ThirdContanerView" customClass="RotatedView" customModule="FoldingCell" customModuleProvider="target">
|
||||
<view tag="2" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="dXA-2m-h6U" userLabel="ThirdContanerView" customClass="RotatedView" customModule="FoldingCellDemo" customModuleProvider="target">
|
||||
<rect key="frame" x="0.0" y="330" width="560" height="72"/>
|
||||
<subviews>
|
||||
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="4an-5P-hxw" userLabel="fromView">
|
||||
@@ -596,7 +596,7 @@
|
||||
<constraint firstItem="xej-CM-tIb" firstAttribute="top" secondItem="dXA-2m-h6U" secondAttribute="top" id="xOe-NP-ZG0"/>
|
||||
</constraints>
|
||||
</view>
|
||||
<view tag="3" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="073-FT-8Xc" userLabel="BottomContanerView" customClass="RotatedView" customModule="FoldingCell" customModuleProvider="target">
|
||||
<view tag="3" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="073-FT-8Xc" userLabel="BottomContanerView" customClass="RotatedView" customModule="FoldingCellDemo" customModuleProvider="target">
|
||||
<rect key="frame" x="0.0" y="402" width="560" height="72"/>
|
||||
<subviews>
|
||||
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="7hv-c7-TPM" userLabel="line">
|
||||
@@ -688,8 +688,12 @@
|
||||
</userDefinedRuntimeAttribute>
|
||||
</userDefinedRuntimeAttributes>
|
||||
<connections>
|
||||
<outlet property="closeNumberLabel" destination="uWG-zH-Vjo" id="4Fq-wZ-nFd"/>
|
||||
<outlet property="containerView" destination="CGm-93-iX0" id="gSm-z4-RdG"/>
|
||||
<outlet property="containerViewTop" destination="wys-AY-Zdw" id="Exs-1v-4Jn"/>
|
||||
<outlet property="foregroundView" destination="CQr-i9-7br" id="88q-9Z-PtA"/>
|
||||
<outlet property="foregroundViewTop" destination="9tL-QY-I0e" id="shI-yB-FgY"/>
|
||||
<outlet property="openNumberLabel" destination="7eb-NE-XLS" id="mrT-hs-afw"/>
|
||||
</connections>
|
||||
</tableViewCell>
|
||||
</prototypes>
|
||||
|
||||
@@ -10,12 +10,20 @@ import UIKit
|
||||
|
||||
class DemoCell: FoldingCell {
|
||||
|
||||
@IBOutlet weak var closeNumberLabel: UILabel!
|
||||
@IBOutlet weak var openNumberLabel: UILabel!
|
||||
|
||||
var number: Int = 0 {
|
||||
didSet {
|
||||
closeNumberLabel.text = String(number)
|
||||
openNumberLabel.text = String(number)
|
||||
}
|
||||
}
|
||||
override func awakeFromNib() {
|
||||
|
||||
foregroundView.layer.cornerRadius = 10
|
||||
foregroundView.layer.masksToBounds = true
|
||||
|
||||
|
||||
super.awakeFromNib()
|
||||
}
|
||||
|
||||
|
||||
@@ -28,9 +28,11 @@ public class FoldingCell: UITableViewCell {
|
||||
|
||||
/// UIView whitch display when cell open
|
||||
@IBOutlet weak public var containerView: UIView!
|
||||
@IBOutlet weak public var containerViewTop: NSLayoutConstraint!
|
||||
|
||||
/// UIView whitch display when cell close
|
||||
@IBOutlet weak public var foregroundView: RotatedView!
|
||||
@IBOutlet weak public var foregroundViewTop: NSLayoutConstraint!
|
||||
var animationView: UIView?
|
||||
|
||||
/// the number of folding elements. Default 2
|
||||
@@ -84,21 +86,17 @@ public class FoldingCell: UITableViewCell {
|
||||
// MARK: configure
|
||||
|
||||
func configureDefaultState() {
|
||||
let foregroundTopConstraint = self.contentView.constraints.filter{ $0.identifier == "ForegroundViewTop"}.first
|
||||
let containerViewTopConstraint = self.contentView.constraints.filter{ $0.identifier == "ContainerViewTop"}.first
|
||||
|
||||
guard let foregroundConstraint = foregroundTopConstraint else {
|
||||
fatalError("set identifier")
|
||||
}
|
||||
guard let containerConstraint = containerViewTopConstraint else {
|
||||
fatalError("set identifier")
|
||||
guard let foregroundViewTop = self.foregroundViewTop,
|
||||
let containerViewTop = self.containerViewTop else {
|
||||
fatalError("set constratins outlets")
|
||||
}
|
||||
|
||||
containerConstraint.constant = foregroundConstraint.constant
|
||||
containerViewTop.constant = foregroundViewTop.constant
|
||||
containerView.alpha = 0;
|
||||
|
||||
foregroundView.layer.anchorPoint = CGPoint.init(x: 0.5, y: 1)
|
||||
foregroundConstraint.constant += foregroundView.bounds.height / 2
|
||||
foregroundViewTop.constant += foregroundView.bounds.height / 2
|
||||
foregroundView.layer.transform = foregroundView.transform3d()
|
||||
|
||||
createAnimationView();
|
||||
|
||||
@@ -53,17 +53,20 @@ class MainTableViewController: UITableViewController {
|
||||
}
|
||||
|
||||
override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
|
||||
|
||||
if cell is FoldingCell {
|
||||
let foldingCell = cell as! FoldingCell
|
||||
foldingCell.backgroundColor = UIColor.clearColor()
|
||||
|
||||
if cellHeights[indexPath.row] == kCloseCellHeight {
|
||||
foldingCell.selectedAnimation(false, animated: false, completion:nil)
|
||||
} else {
|
||||
foldingCell.selectedAnimation(true, animated: false, completion: nil)
|
||||
}
|
||||
}
|
||||
|
||||
guard case let cell as DemoCell = cell else {
|
||||
return
|
||||
}
|
||||
|
||||
cell.backgroundColor = UIColor.clearColor()
|
||||
|
||||
if cellHeights[indexPath.row] == kCloseCellHeight {
|
||||
cell.selectedAnimation(false, animated: false, completion:nil)
|
||||
} else {
|
||||
cell.selectedAnimation(true, animated: false, completion: nil)
|
||||
}
|
||||
|
||||
cell.number = indexPath.row
|
||||
}
|
||||
|
||||
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
|
||||
|
||||
# FoldingCell
|
||||
[](https://cocoapods.org/pods/FoldingCell)
|
||||
[](http://cocoapods.org/pods/FoldingCell)
|
||||
@@ -10,7 +10,7 @@
|
||||
[](https://github.com/Carthage/Carthage)
|
||||
|
||||
[shot on dribbble](https://dribbble.com/shots/2121350-Delivery-Card):
|
||||
|
||||
|
||||
|
||||
|
||||
The [iPhone mockup](https://store.ramotion.com/product/iphone-6-mockups?utm_source=gthb&utm_medium=special&utm_campaign=folding-cell) available [here](https://store.ramotion.com/product/iphone-6-mockups?utm_source=gthb&utm_medium=special&utm_campaign=folding-cell).
|
||||
@@ -34,7 +34,7 @@ github "Ramotion/folding-cell"
|
||||
```
|
||||
|
||||
## Solution
|
||||
|
||||
|
||||
## Usage
|
||||
|
||||
1) Create a new cell inheriting from `FoldingCell`
|
||||
@@ -42,21 +42,23 @@ github "Ramotion/folding-cell"
|
||||
2) Add a UIView to your cell in your storyboard or nib file, inheriting from `RotatedView`.
|
||||
Connect the outlet from this view to the cell property `foregroundView`.
|
||||
Add constraints from this view to the superview, as in this picture:
|
||||
|
||||
|
||||
(constants of constraints may be different). Add the identifier `ForegroundViewTop`
|
||||
for the top constraint. (This view will be shown when the cell is in its normal state).
|
||||
|
||||
|
||||
(constants of constraints may be different). Connect the outlet from this top constraint to the cell property `foregroundViewTop`
|
||||
. (This view will be shown when the cell is in its normal state).
|
||||
|
||||
3) Add other UIViews to your cell, connect the outlet from this view to the cell
|
||||
property `containerView`. Add constraints from this view to the superview like in the picture:
|
||||
|
||||
|
||||
|
||||
|
||||
(constants of constraints may be different). Add the identifier "ContainerViewTop" for the top constraint.
|
||||
(constants of constraints may be different). Connect the outlet from this top constraint to the cell property `containerViewTop`.
|
||||
(This view will be shown when the cell is opened)
|
||||
|
||||
Your result should be something like this picture:
|
||||
|
||||
|
||||
|
||||
|
||||
[Demonstration adding constraints for foregroundView, containerView](https://vimeo.com/154954299)
|
||||
|
||||
@@ -143,6 +145,12 @@ Ok, we've finished configuring the cell.
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
#### if don't use storyboard and xib files
|
||||
|
||||
Create foregroundView and containerView from code (steps 2 - 3) look example:
|
||||
[Folding-cell-programmatically](https://github.com/ober01/Folding-cell-programmatically)
|
||||
|
||||
## Licence
|
||||
|
||||
Folding cell is released under the MIT license.
|
||||
|
||||
+2
-2
@@ -13,7 +13,7 @@
|
||||
<a title="Classes Reference"></a>
|
||||
<header>
|
||||
<div class="content-wrapper">
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (50% documented)</p>
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (47% documented)</p>
|
||||
</div>
|
||||
</header>
|
||||
<div class="content-wrapper">
|
||||
@@ -79,7 +79,7 @@
|
||||
</section>
|
||||
</section>
|
||||
<section id="footer">
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-09)</p>
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-10)</p>
|
||||
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.5.0</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
<a title="FoldingCell Class Reference"></a>
|
||||
<header>
|
||||
<div class="content-wrapper">
|
||||
<p><a href="../index.html">FoldingCellDemo Docs</a> (50% documented)</p>
|
||||
<p><a href="../index.html">FoldingCellDemo Docs</a> (47% documented)</p>
|
||||
</div>
|
||||
</header>
|
||||
<div class="content-wrapper">
|
||||
@@ -320,7 +320,7 @@
|
||||
</section>
|
||||
</section>
|
||||
<section id="footer">
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-09)</p>
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-10)</p>
|
||||
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.5.0</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
<a title="Classes Reference"></a>
|
||||
<header>
|
||||
<div class="content-wrapper">
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (50% documented)</p>
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (47% documented)</p>
|
||||
</div>
|
||||
</header>
|
||||
<div class="content-wrapper">
|
||||
@@ -79,7 +79,7 @@
|
||||
</section>
|
||||
</section>
|
||||
<section id="footer">
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-09)</p>
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-10)</p>
|
||||
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.5.0</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
+2
-2
@@ -14,7 +14,7 @@
|
||||
<a title="FoldingCell Class Reference"></a>
|
||||
<header>
|
||||
<div class="content-wrapper">
|
||||
<p><a href="../index.html">FoldingCellDemo Docs</a> (50% documented)</p>
|
||||
<p><a href="../index.html">FoldingCellDemo Docs</a> (47% documented)</p>
|
||||
</div>
|
||||
</header>
|
||||
<div class="content-wrapper">
|
||||
@@ -320,7 +320,7 @@
|
||||
</section>
|
||||
</section>
|
||||
<section id="footer">
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-09)</p>
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-10)</p>
|
||||
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.5.0</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
<a title="FoldingCellDemo Reference"></a>
|
||||
<header>
|
||||
<div class="content-wrapper">
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (50% documented)</p>
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (47% documented)</p>
|
||||
</div>
|
||||
</header>
|
||||
<div class="content-wrapper">
|
||||
@@ -40,7 +40,7 @@
|
||||
<section>
|
||||
<section class="section">
|
||||
|
||||
<p><img src="./header.png" alt="header"></p>
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/header.png" alt="header"></p>
|
||||
<a href='#foldingcell' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h1 id='foldingcell'>FoldingCell</h1>
|
||||
|
||||
<p><a href="https://cocoapods.org/pods/FoldingCell"><img src="https://img.shields.io/cocoapods/p/FoldingCell.svg" alt="CocoaPods"></a>
|
||||
@@ -53,7 +53,7 @@
|
||||
<a href="https://github.com/Carthage/Carthage"><img src="https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat" alt="Carthage compatible"></a></p>
|
||||
|
||||
<p><a href="https://dribbble.com/shots/2121350-Delivery-Card">shot on dribbble</a>:
|
||||
<img src="Screenshots/folding-cell.gif" alt="Animation"></p>
|
||||
<img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Screenshots/folding-cell.gif" alt="Animation"></p>
|
||||
|
||||
<p>The <a href="https://store.ramotion.com/product/iphone-6-mockups?utm_source=gthb&utm_medium=special&utm_campaign=folding-cell">iPhone mockup</a> available <a href="https://store.ramotion.com/product/iphone-6-mockups?utm_source=gthb&utm_medium=special&utm_campaign=folding-cell">here</a>.</p>
|
||||
<a href='#requirements' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h2 id='requirements'>Requirements</h2>
|
||||
@@ -77,15 +77,16 @@ github "Ramotion/folding-cell"
|
||||
</code></p>
|
||||
<a href='#solution' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h2 id='solution'>Solution</h2>
|
||||
|
||||
<p><img src="/Tutorial-resources/Solution.png" alt="Solution"></p>
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/Solution.png" alt="Solution"></p>
|
||||
<a href='#usage' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h2 id='usage'>Usage</h2>
|
||||
|
||||
<p>1) Create a new cell inheriting from <code>FoldingCell</code></p>
|
||||
|
||||
<p>2) Add a UIView to your cell in your storyboard or nib file, inheriting from <code>RotatedView</code>.
|
||||
Connect the outlet from this view to the cell property <code>foregroundView</code>.
|
||||
Add constraints from this view to the superview, as in this picture:
|
||||
<img src="/Tutorial-resources/1.1.png" alt="1.1"></p>
|
||||
Add constraints from this view to the superview, as in this picture:</p>
|
||||
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/1.1.png" alt="1.1"></p>
|
||||
|
||||
<p>(constants of constraints may be different). Add the identifier <code>ForegroundViewTop</code>
|
||||
for the top constraint. (This view will be shown when the cell is in its normal state).</p>
|
||||
@@ -93,13 +94,14 @@ for the top constraint. (This view will be shown when the cell is in its normal
|
||||
<p>3) Add other UIViews to your cell, connect the outlet from this view to the cell
|
||||
property <code>containerView</code>. Add constraints from this view to the superview like in the picture:</p>
|
||||
|
||||
<p><img src="/Tutorial-resources/1.2.png" alt="1.2"></p>
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/1.2.png" alt="1.2"></p>
|
||||
|
||||
<p>(constants of constraints may be different). Add the identifier <q>ContainerViewTop</q> for the top constraint.
|
||||
(This view will be shown when the cell is opened)</p>
|
||||
|
||||
<p>Your result should be something like this picture:
|
||||
<img src="/Tutorial-resources/1.3.png" alt="1.3"></p>
|
||||
<p>Your result should be something like this picture:</p>
|
||||
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/1.3.png" alt="1.3"></p>
|
||||
|
||||
<p><a href="https://vimeo.com/154954299">Demonstration adding constraints for foregroundView, containerView</a></p>
|
||||
|
||||
@@ -181,6 +183,12 @@ property <code>containerView</code>. Add constraints from this view to the super
|
||||
}
|
||||
</code></pre>
|
||||
<pre class="highlight plaintext"><code>
|
||||
|
||||
#### if don't use storyboard and xib files
|
||||
|
||||
Create foregroundView and containerView from code (steps 2 - 3) look example:
|
||||
[Folding-cell-programmatically](https://github.com/ober01/Folding-cell-programmatically)
|
||||
|
||||
## Licence
|
||||
|
||||
Folding cell is released under the MIT license.
|
||||
@@ -198,7 +206,7 @@ See our other [open-source projects](https://github.com/ramotion) or [hire](http
|
||||
</section>
|
||||
</section>
|
||||
<section id="footer">
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-09)</p>
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-10)</p>
|
||||
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.5.0</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
FoldingCell.swift
|
||||
case Open
|
||||
case Close
|
||||
override public init(style: UITableViewCellStyle, reuseIdentifier: String?)
|
||||
required public init?(coder aDecoder: NSCoder)
|
||||
override public func awakeFromNib()
|
||||
public func isAnimating()->Bool
|
||||
|
||||
Binary file not shown.
+18
-10
@@ -13,7 +13,7 @@
|
||||
<a title="FoldingCellDemo Reference"></a>
|
||||
<header>
|
||||
<div class="content-wrapper">
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (50% documented)</p>
|
||||
<p><a href="index.html">FoldingCellDemo Docs</a> (47% documented)</p>
|
||||
</div>
|
||||
</header>
|
||||
<div class="content-wrapper">
|
||||
@@ -40,7 +40,7 @@
|
||||
<section>
|
||||
<section class="section">
|
||||
|
||||
<p><img src="./header.png" alt="header"></p>
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/header.png" alt="header"></p>
|
||||
<a href='#foldingcell' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h1 id='foldingcell'>FoldingCell</h1>
|
||||
|
||||
<p><a href="https://cocoapods.org/pods/FoldingCell"><img src="https://img.shields.io/cocoapods/p/FoldingCell.svg" alt="CocoaPods"></a>
|
||||
@@ -53,7 +53,7 @@
|
||||
<a href="https://github.com/Carthage/Carthage"><img src="https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat" alt="Carthage compatible"></a></p>
|
||||
|
||||
<p><a href="https://dribbble.com/shots/2121350-Delivery-Card">shot on dribbble</a>:
|
||||
<img src="Screenshots/folding-cell.gif" alt="Animation"></p>
|
||||
<img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Screenshots/folding-cell.gif" alt="Animation"></p>
|
||||
|
||||
<p>The <a href="https://store.ramotion.com/product/iphone-6-mockups?utm_source=gthb&utm_medium=special&utm_campaign=folding-cell">iPhone mockup</a> available <a href="https://store.ramotion.com/product/iphone-6-mockups?utm_source=gthb&utm_medium=special&utm_campaign=folding-cell">here</a>.</p>
|
||||
<a href='#requirements' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h2 id='requirements'>Requirements</h2>
|
||||
@@ -77,15 +77,16 @@ github "Ramotion/folding-cell"
|
||||
</code></p>
|
||||
<a href='#solution' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h2 id='solution'>Solution</h2>
|
||||
|
||||
<p><img src="/Tutorial-resources/Solution.png" alt="Solution"></p>
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/Solution.png" alt="Solution"></p>
|
||||
<a href='#usage' class='anchor' aria-hidden=true><span class="header-anchor"></span></a><h2 id='usage'>Usage</h2>
|
||||
|
||||
<p>1) Create a new cell inheriting from <code>FoldingCell</code></p>
|
||||
|
||||
<p>2) Add a UIView to your cell in your storyboard or nib file, inheriting from <code>RotatedView</code>.
|
||||
Connect the outlet from this view to the cell property <code>foregroundView</code>.
|
||||
Add constraints from this view to the superview, as in this picture:
|
||||
<img src="/Tutorial-resources/1.1.png" alt="1.1"></p>
|
||||
Add constraints from this view to the superview, as in this picture:</p>
|
||||
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/1.1.png" alt="1.1"></p>
|
||||
|
||||
<p>(constants of constraints may be different). Add the identifier <code>ForegroundViewTop</code>
|
||||
for the top constraint. (This view will be shown when the cell is in its normal state).</p>
|
||||
@@ -93,13 +94,14 @@ for the top constraint. (This view will be shown when the cell is in its normal
|
||||
<p>3) Add other UIViews to your cell, connect the outlet from this view to the cell
|
||||
property <code>containerView</code>. Add constraints from this view to the superview like in the picture:</p>
|
||||
|
||||
<p><img src="/Tutorial-resources/1.2.png" alt="1.2"></p>
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/1.2.png" alt="1.2"></p>
|
||||
|
||||
<p>(constants of constraints may be different). Add the identifier <q>ContainerViewTop</q> for the top constraint.
|
||||
(This view will be shown when the cell is opened)</p>
|
||||
|
||||
<p>Your result should be something like this picture:
|
||||
<img src="/Tutorial-resources/1.3.png" alt="1.3"></p>
|
||||
<p>Your result should be something like this picture:</p>
|
||||
|
||||
<p><img src="https://raw.githubusercontent.com/Ramotion/folding-cell/master/Tutorial-resources/1.3.png" alt="1.3"></p>
|
||||
|
||||
<p><a href="https://vimeo.com/154954299">Demonstration adding constraints for foregroundView, containerView</a></p>
|
||||
|
||||
@@ -181,6 +183,12 @@ property <code>containerView</code>. Add constraints from this view to the super
|
||||
}
|
||||
</code></pre>
|
||||
<pre class="highlight plaintext"><code>
|
||||
|
||||
#### if don't use storyboard and xib files
|
||||
|
||||
Create foregroundView and containerView from code (steps 2 - 3) look example:
|
||||
[Folding-cell-programmatically](https://github.com/ober01/Folding-cell-programmatically)
|
||||
|
||||
## Licence
|
||||
|
||||
Folding cell is released under the MIT license.
|
||||
@@ -198,7 +206,7 @@ See our other [open-source projects](https://github.com/ramotion) or [hire](http
|
||||
</section>
|
||||
</section>
|
||||
<section id="footer">
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-09)</p>
|
||||
<p>© 2016 <a class="link" href="" target="_blank" rel="external">AlexKalinkin</a>. All rights reserved. (Last updated: 2016-06-10)</p>
|
||||
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external">jazzy ♪♫ v0.5.0</a>, a <a class="link" href="http://realm.io" target="_blank" rel="external">Realm</a> project.</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
FoldingCell.swift
|
||||
case Open
|
||||
case Close
|
||||
override public init(style: UITableViewCellStyle, reuseIdentifier: String?)
|
||||
required public init?(coder aDecoder: NSCoder)
|
||||
override public func awakeFromNib()
|
||||
public func isAnimating()->Bool
|
||||
|
||||
Reference in New Issue
Block a user