FlexibleHeader 1.0.0

FlexibleHeader 1.0.0

×

由 DongHee Kang 维护。

FlexibleHeader 1.0.0

  • 作者
  • DongHee Kang

FlexibleHeader

Build Status Swift Cocoapods Carthage compatible Platform License

A Container view that responds to scrolling of the UIScrollView.

常规 阈值

FlexibleHeaderExecutantType

FlexibleHeader 类中用作确定头类型枚举。

public enum FlexibleHeaderExecutantType {
    case normal
    case threshold
    case customThreshold(hiddenThreshold: CGFloat, showThreshold: CGFloat)
}

1. normal

Header 出现在滚动偏移 Y 为 0 时。在其他情况下，Header 被隐藏。

2. threshold

与常规类型不同，通过阈值在滚动过程中可以显示或隐藏头。

3. customThreshold

您可以设置隐藏阈值和显示阈值，阈值为阈值类型。阈值单位是 UIScrollView 的偏移量。

开始使用

FlexibleHeaderScrollView

包含UIScrollView和FlexibleHeader的容器视图是实现FlexibleHeader的最简单方式。

  1. 创建FlexibleHeaderScrollView的一个实例。
let flexibleHeaderScrollView = FlexibleHeaderScrollView(headerMaxHeight: 64, headerMinHeight: 0, headerExecutantType: .threshold)
flexibleHeaderScrollView.translatesAutoresizingMaskIntoConstraints = false
  1. 将子视图添加到FlexibleHeaderScrollView的contentView中。
let topView = UIView()
topView.translatesAutoresizingMaskIntoConstraints = false

let bottomView = UIView()
bottomView.translatesAutoresizingMaskIntoConstraints = false

topView.leadingAnchor.constraint(equalTo: flexibleHeaderScrollView.contentView.leadingAnchor).isActive = true
topView.topAnchor.constraint(equalTo: flexibleHeaderScrollView.contentView.topAnchor).isActive = true
topView.trailingAnchor.constraint(equalTo: flexibleHeaderScrollView.contentView.trailingAnchor).isActive = true
topView.heightAnchor.constraint(equalToConstant: 550).isActive = true

bottomView.leadingAnchor.constraint(equalTo: flexibleHeaderScrollView.contentView.leadingAnchor).isActive = true
bottomView.topAnchor.constraint(equalTo: topView.bottomAnchor).isActive = true
bottomView.trailingAnchor.constraint(equalTo: flexibleHeaderScrollView.contentView.trailingAnchor).isActive = true
bottomView.heightAnchor.constraint(equalToConstant: 550).isActive = true
bottomView.bottomAnchor.constraint(equalTo: flexibleHeaderScrollView.contentView.bottomAnchor).isActive = true

FlexibleHeader

如果您想在UIScrollView中实现FlexibleHeader功能，请使用FlexibleHeader类。

  1. 创建UIScrollView的一个实例。
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
  1. 使用UIScrollView的实例创建FlexibleHeader的一个实例。
let flexibleHeader = FlexibleHeader(scrollView: scrollView, maxHeight: 64, minHeight: 0, executantType: .threshold)
flexibleHeader.translatesAutoresizingMaskIntoConstraints = false
  1. 配置FlexibleHeader实例的高度NSLayoutConstraint。
let flexibleHeaderHeight = flexibleHeader.heightAnchor.constraint(equalToConstant: 50)
flexibleHeaderHeight.isActive = true

flexibleHeader.configure(heightConstraint: flexibleHeaderHeight)

渐进式

您可以根据滚动进度（起始点和结束点）更改值（视图属性、NSLayoutConstraint的常量）。

ProgressiveViewAttribute

let flexibleHeader = FlexibleHeader(scrollView: scrollView, maxHeight: 128, minHeight: 0, executantType: .threshold)

let initialAttribute = ProgressiveViewAttribute(view: flexibleHeader, progress: 0.0, alpha: 1.0)
let finalAttribute = ProgressiveViewAttribute(view: flexibleHeader, progress: 1.0, alpha: 0.0)
flexibleHeader.appendProgressiveViewAttribute(with: initialAttribute)
flexibleHeader.appendProgressiveViewAttribute(with: finalAttribute)

ProgressiveLayoutConstraintConstant

let headerContentView = UIView()
headerContentView.translatesAutoresizingMaskIntoConstraints = false
headerContentView.backgroundColor = .yellow

flexibleHeader.addSubview(headerContentView)

headerContentView.centerXAnchor.constraint(equalTo: flexibleHeader.centerXAnchor).isActive = true
headerContentView.centerYAnchor.constraint(equalTo: flexibleHeader.centerYAnchor).isActive = true
headerContentView.heightAnchor.constraint(equalToConstant: 64).isActive = true
let headerContentViewWidth = headerContentView.widthAnchor.constraint(equalToConstant: 0)
headerContentViewWidth.isActive = true

let initialConstraintConstant = ProgressiveLayoutConstraintConstant(constraint: headerContentViewWidth, progress: 0.0, constant: 320)
let finalConstraintConstant = ProgressiveLayoutConstraintConstant(constraint: headerContentViewWidth, progress: 1.0, constant: 0)
flexibleHeader.appendProgressiveConstraintConstant(with: initialConstraintConstant)
flexibleHeader.appendProgressiveConstraintConstant(with: finalConstraintConstant)

安装

CocoaPods (iOS 9以上)

platform :ios, '9.0'
use_frameworks!

target '<Your Target Name>' do
    pod 'FlexibleHeader'
end

Carthage (iOS 9以上)

github "k-lpmg/FlexibleHeader"

许可证

这些作品受MIT许可证的保护。更多信息请参阅许可证文件。