ScrollingCardView 0.1.1

ScrollingCardView 0.1.1

测试已测试
语言语言 SwiftSwift
许可 自定义
发布最后发布2017年3月
SwiftSwift 版本3.0
SPM支持 SPM

Michael Comella维护。




  • 作者:
  • Michael Comella

ScrollingCardView

ScrollingCardView 是一个 iOS 的卡片视图小部件

  • 它会拥抱内容,当内容高度扩展时,动态调整高度
  • 内容高度超过卡片时,会滚动内容

在以下示例中,卡片视图的高度被限制为小于或等于屏幕大小。首先,内容不会填满屏幕,卡片视图也不会

随着内容的增长,卡片视图将扩展到屏幕大小,此时启用滚动,如下所示

卡片的角度半径、背景颜色和阴影是可定制的。

动机

据我们所知,没有现有的库能满足我们描述的卡片视图要求。

我们可以重新利用现有的卡片视图库,并在其之上构建增长/滚动的功能,但这将难以扩展且容易出故障。

ScrollingCardView 最初是为在 Mozilla 的 Project Prox 项目中使用而创建的。

使用方法

// 1. Create your view, enable autolayout, and add it to the view hierarchy.
let cardView = ScrollingCardView()
cardView.translatesAutoresizingMaskIntoConstraints = false
parentView.addSubview(cardView) // e.g. parent could be the ViewController's view


// 2. Constrain the card view as you would any other view.
NSLayoutConstraint.activate([
    cardView.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor, constant: 16),
    cardView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 16),
    cardView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -16),

    // If you don't constrain the height, the card will grow to match its
    // intrinsic content size.

    // Or use lessThanOrEqualTo to allow your card view to grow only until a
    // certain size, e.g. the size of the screen.
    cardView.bottomAnchor.constraint(lessThanOrEqualTo: bottomLayoutGuide.topAnchor, constant: -16),

    // Or you can constrain it to a particular height:
    // cardView.bottomAnchor.constraint(equalTo: bottomLayoutGuide.topAnchor, constant: -16),
    // cardView.heightAnchor.constraint(equalToConstant: 300),
])


// 3. Set your card view's content.
let content = UILabel()
content.text = "Hello world!"
content.numberOfLines = 0

cardView.contentView = content

内容可以是任何具有内在高度的视图,如果您提供了 heightAnchor,则可以是任何视图。

您还可以自定义卡片视图的外观

cardView.backgroundColor = .white

cardView.cornerRadius = 2

cardView.layer.shadowOffset = CGSize(width: 0, height: 2)
cardView.layer.shadowRadius = 2
cardView.layer.shadowOpacity = 0.4

要查看实际效果,请运行示例项目!

要求

  • iOS 9.0+
  • Swift 3

安装

ScrollingCardView 通过 CocoaPods 提供。将以下内容添加到您的 Podfile 中

pod "ScrollingCardView"

注意

  • 此项目未使用 Interface Builder 进行测试
  • 此项目不太可能与非约束布局一起工作

示例

要运行示例项目

pushd Example/
pod install
popd
open Example/ScrollingCardView.xcworkspace

Xcode 将打开:从那里运行。

开发

按照上面说明的方式打开示例项目。库文件可以在以下位置找到

Pods -> 开发Pods -> ScrollingCardView -> ScrollingCardView -> 类

针对外部应用的测试

如果您正在开发针对外部应用的项目,您可以从应用的podfile指定到您此库分支的相对路径

pod "ScrollingCardView", :path => "../ScrollingCardView"

在外部应用的目录中运行 pod install