Skip to content
A container view that responds to scrolling of UIScrollView
Swift Other
  1. Swift 98.2%
  2. Other 1.8%
Branch: master
Clone or download
Latest commit e5906e5 Aug 11, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
Example Update scheme name of Example Aug 10, 2019
FlexibleHeader.xcodeproj Update scheme name of Example Aug 10, 2019
Sources Initial commit Aug 9, 2019
.gitignore Initial commit Aug 9, 2019
.travis.yml Update .travis.yml Aug 10, 2019
FlexibleHeader.h Initial commit Aug 9, 2019
FlexibleHeader.podspec Initial commit Aug 9, 2019
Info.plist Update scheme name of Example Aug 10, 2019
LICENSE Initial commit Aug 9, 2019 Update Aug 10, 2019


Build Status Swift Cocoapods Carthage compatible Platform License

A container view that responds to scrolling of UIScrollView.

normal threshold


The enum used in the FlexibleHeader class to determine the header type.

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

1. normal

Header appears when offset Y of scroll is 0. In other cases, the Header is disappeared.

2. threshold

Unlike the normal type, the header can be appeared or disappeared in the middle of the scroll by the threshold.

3. customThreshold

You can set hidden threshold and show threshold to threshold type. The unit of threshold is the offset of UIScrollView.

Getting Started


The container view that contains the UIScrollView and the FlexibleHeader is the easiest way to implement a FlexibleHeader.

  1. Create an instance of FlexibleHeaderScrollView.
let flexibleHeaderScrollView = FlexibleHeaderScrollView(headerMaxHeight: 64, headerMinHeight: 0, headerExecutantType: .threshold)
flexibleHeaderScrollView.translatesAutoresizingMaskIntoConstraints = false
  1. Add subviews to the contentView in FlexibleHeaderScrollView.
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


If you want to implement the FlexibleHeader functionality in your UIScrollView, use the FlexibleHeader class.

  1. Create an instance of UIScrollView.
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
  1. Create an instance of FlexibleHeader using an instance of UIScrollView.
let flexibleHeader = FlexibleHeader(scrollView: scrollView, maxHeight: 64, minHeight: 0, executantType: .threshold)
flexibleHeader.translatesAutoresizingMaskIntoConstraints = false
  1. Configure a height NSLayoutConstraint of an instance of FlexibleHeader.
let flexibleHeaderHeight = flexibleHeader.heightAnchor.constraint(equalToConstant: 50)
flexibleHeaderHeight.isActive = true

flexibleHeader.configure(heightConstraint: flexibleHeaderHeight)


You can change the value(view properties, constant of NSLayoutConstraint) based on the start and end points as the scroll progress.


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)


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


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'

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

Carthage (iOS 9+)

github "k-lpmg/FlexibleHeader"


These works are available under the MIT license. See the LICENSE file for more info.

You can’t perform that action at this time.