FoldingCell 5.0.2

FoldingCell 5.0.2

×

测试已测试✗
语言语言 SwiftSwift
许可 MIT
发布最新发布2019年11月
SPM支持 SPM✗

由Alex Kalinkin、Abdurahim Jauzee、Igor Kolpachkov、Adaptive Controller 维护。

FoldingCell 5.0.2

  • 作者：
  • Juri Vasylenko

FOLDING CELL

受折叠纸张卡片材料设计启发的可扩展内容单元格动画。

专注于移动应用和网站的自定义 UI 设计和编码。

保持关注以获取最新更新

为您的项目获取免费原型 →

CocoaPods CocoaPods Twitter Travis codebeat badge Carthage compatible Swift 4.0 Analytics Donate

需求

  • iOS 8.0+
  • Xcode 10.2

安装

只需将 FoldingCell.swift 文件添加到您的项目中。

或者使用 Podfile 和 CocoaPods

pod 'FoldingCell'

Carthage 的用户可以将 Mantle 添加到他们的 Cartfile

github "Ramotion/folding-cell"

或通过添加以下内容到 Package.swift

dependencies: [
.package(url: "https://github.com/Ramotion/folding-cell.git", from: "5.0.2")
]

来使用 Swift 包管理器

或者直接将 FoldingCell.swift 文件拖拽到您的项目中

解决方案

Solution

用法

  1. 创建一个新的继承自 FoldingCell 的单元格

  2. 在您的 storyboard 或 nib 文件中向单元格添加一个 UIView，继承自 RotatedView。将此视图的引脚连接到单元格的 foregroundView 属性。从该视图添加约束到父视图，如图所示

1.1

（约束的常量可能不同）。将顶约束的引脚连接到单元格属性 foregroundViewTop。 （此视图在单元格处于正常状态时显示。）

  1. 向您的单元格添加其他的 UIView，将此视图的引脚连接到单元格属性 containerView。将此视图添加约束到父视图，如图所示

1.2

（约束的常量可能不同）。将顶约束的引脚连接到单元格属性 containerViewTop。 （此视图在单元格打开时显示。）

您的结果应类似于下图

1.3

  1. 设置 @IBInspectable var itemCount: NSInteger 属性是折叠的计数（如果您使用 IBInspectable，您可以在故事板中设置它）。范围至少为2。默认值为2

好的，我们已经完成了单元格的配置。

  1. 在您的 UITableViewController 中添加代码

5.1) 添加常量

fileprivate struct C {
  struct CellHeight {
    static let close: CGFloat = *** // equal or greater foregroundView height
    static let open: CGFloat = *** // equal or greater containerView height
  }
}

5.2) 添加用于计算单元格高度的属性

     var cellHeights = (0..<CELLCOUNT).map { _ in C.CellHeight.close }

5.3) 覆盖方法

    override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
        return cellHeights[indexPath.row]
    }

5.4) 在方法中添加代码

    override func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        guard case let cell as FoldingCell = tableView.cellForRowAtIndexPath(indexPath) else {
          return
        }

        var duration = 0.0
        if cellIsCollapsed {
            cellHeights[indexPath.row] = Const.openCellHeight
            cell.unfold(true, animated: true, completion: nil)
            duration = 0.5
        } else {
            cellHeights[indexPath.row] = Const.closeCellHeight
            cell.unfold(false, animated: true, completion: nil)
            duration = 0.8
        }

        UIView.animateWithDuration(duration, delay: 0, options: .CurveEaseOut, animations: { _ in
            tableView.beginUpdates()
            tableView.endUpdates()
        }, completion: nil)
    }

5.5) 控制单元格是打开还是关闭

  override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {

        if case let cell as FoldingCell = cell {
            if cellHeights![indexPath.row] == C.cellHeights.close {
                foldingCell.selectedAnimation(false, animated: false, completion:nil)
            } else {
                foldingCell.selectedAnimation(true, animated: false, completion: nil)
            }
        }
    }
  1. 将此代码添加到您的新的单元格类中
    override func animationDuration(itemIndex:NSInteger, type:AnimationType)-> NSTimeInterval {

        // durations count equal it itemCount
        let durations = [0.33, 0.26, 0.26] // timing animation for each view
        return durations[itemIndex]
    }

如果不用故事板和xib文件

从代码中创建 foregroundView 和 containerView（步骤2-3），示例：Folding-cell-programmatically

🗂在其他语言上查看此库

📄许可

折叠单元格采用MIT许可证发布。详见 LICENSE

本库是我们一系列优秀UI开源项目之一：我们的最佳UI开源项目。

如果您在项目中使用了开源库，请确保引用并回链至 www.ramotion.com

📱下载Showroom iOS应用试一试

在我们的iOS应用程序中尝试此UI组件和其他类似组件。如果您感兴趣，请联系我们。