ContainerController

Preview

Requirements

Installation

CocoaPods

pod 'ContainerControllerSwift'

Swift Package Manager with Xcode 11

Getting Started

import UIKit
import ContainerControllerSwift
class ViewController: UIViewController, ContainerControllerDelegate {
 
 var container: ContainerController!
 
 override func viewDidLoad() {
 super.viewDidLoad()
 
 // Create ContainerController Layout object
 let layout = ContainerLayout()
 layout.startPosition = .hide
 layout.backgroundShadowShow = true
 layout.positions = ContainerPosition(top: 70, middle: 250, bottom: 70)
 
 // Create ContainerController object, along with the container.view
 // Pass the current UIViewController 
 let container = ContainerController(addTo: self, layout: layout)
 container.view.cornerRadius = 15
 container.view.addShadow()
 
 // Create subclass scrollView
 let tableView = UITableView()
 tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
 tableView.delegate = self
 tableView.dataSource = self
 
 // Add scrollView to container
 container.add(scrollView: tableView)
 
 // Finishing settings ContainerController,
 // Animated move position Top
 container.move(type: .top)
 }
 
 override func viewDidDisappear(_ animated: Bool) {
 super.viewDidDisappear(animated)
 
 // Remove the subviews ContainerController
 container.remove()
 container = nil
 }
}

Action

Move position with an animation

container.move(type: .top)
container.move(type: .middle)
container.move(type: .bottom)

Adding possible custom subviews in ContainerController view

Add ScrollView

let tableView = UITableView()
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
tableView.backgroundColor = .clear
tableView.tableFooterView = UIView()
tableView.delegate = self
tableView.dataSource = self
// Add scrollView to container
container.add(scrollView: tableView)

Delegate to self 👆

If you implement delegate ScrollView (TableView, CollectionView, TextView) to self, then you need to call 4 functions in ContainerController

extension ViewController: UIScrollViewDelegate {
 
 func scrollViewDidScroll(_ scrollView: UIScrollView) {
 container.scrollViewDidScroll(scrollView)
 }
 
 func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
 container.scrollViewWillBeginDragging(scrollView)
 }
 
 func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
 container.scrollViewDidEndDecelerating(scrollView)
 }
 
 func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
 container.scrollViewDidEndDragging(scrollView, willDecelerate: decelerate)
 }
}
extension ViewController: UITableViewDelegate {
 ...
}
extension ViewController: UITableViewDataSource {
 ...
}

Add HeaderView

let headerView = ExampleHeaderGripView()
headerView.height = 20
container.add(headerView: headerView)

Add FooterView

let tabBarView = HeaderTabBarView()
tabBarView.height = 49.0
container.add(footerView: tabBarView)

Add Custom View

// Add custom shadow
let layer = container.view.layer
layer.shadowOpacity = 0.5
layer.shadowColor = UIColor.red.cgColor
layer.shadowOffset = CGSize(width: 1, height: 4)
layer.shadowRadius = 5
// Add view in container.view
let viewRed = UIView(frame: CGRect(x: 50, y: 50, width: 50, height: 50))
viewRed.backgroundColor = .systemRed
container.view.addSubview(viewRed)
// Add view under scrollView container.view
let viewGreen = UIView(frame: CGRect(x: 25, y: 25, width: 50, height: 50))
viewGreen.backgroundColor = .systemGreen
container.view.insertSubview(viewGreen, at: 0)

Settings ⚙️

Layout

Customize the layout with create subclass ContainerLayout on initialization

class NewContainerLayout: ContainerLayout {
 
 override init() {
 super.init()
 
 // Initialization start position.
 startPosition = .hide
 
 // Disables any moving with gestures.
 movingEnabled = true
 
 // Sets the new value for positions of animated movement (top, middle, bottom).
 positions = ContainerPosition(top: 70, middle: 250, bottom: 70)
 
 // Sets insets container.view (left, right).
 insets = ContainerInsets(right: 20, left: 20)
 }
}
class ViewController: UIViewController {
 var container: ContainerController!
 
 override func viewDidLoad() {
 super.viewDidLoad()
 
 container = ContainerController(addTo: self, layout: NewContainerLayout())
 container.move(type: .top)
 }
}

Or create object ContainerLayout

override func viewDidLoad() {
 super.viewDidLoad()
 
 // Create ContainerController Layout object
 let layout = ContainerLayout()
 layout.startPosition = .hide
 layout.backgroundShadowShow = true
 layout.positions = ContainerPosition(top: 70, middle: 250, bottom: 70)
 
 container = ContainerController(addTo: self, layout: layout)
}

Change settings right away

// Properties
container.set(movingEnabled: true)
container.set(trackingPosition: false)
container.set(footerPadding: 100)
// Add ScrollInsets Top/Bottom
container.set(scrollIndicatorTop: 5) // ↓
container.set(scrollIndicatorBottom: 5) // ↑
// Positions
container.set(top: 70) // ↓
container.set(middle: 250) // ↑
container.set(bottom: 80) // ↑
// Middle Enable/Disable
container.set(middle: 250)
container.set(middle: nil)
// Background Shadow
container.set(backgroundShadowShow: true)
// Insets View
container.set(left: 5) // →
container.set(right: 5) // ←
// Landscape params
container.setLandscape(top: 30)
container.setLandscape(middle: 150)
container.setLandscape(bottom: 70)
container.setLandscape(middle: nil)
container.setLandscape(backgroundShadowShow: false)
container.setLandscape(left: 10)
container.setLandscape(right: 100)

ContainerController View

Use a ready-made solution

Change CornerRadius

// Change cornerRadius global for all subviews
container.view.cornerRadius = 15 

Add Layer Shadow

container.view.addShadow(opacity: 0.1) 

Add Background Blur

// add blur UIVisualEffectView
container.view.addBlur(style: .dark) 

More details

Change positions on screen Top Middle Bottom

// These parameters set the new position value.
container.layout.positions = ContainerPosition(top: 70, middle: 250, bottom: 70)
// Change settings right away
container.set(top: 70) // ↓
container.set(middle: 250) // ↑
container.set(bottom: 80) // ↑

Customize indentations for View

// Sets insets container.view (left, right).
container.layout.insets = ContainerInsets(right: 20, left: 20)
container.layout.landscapeInsets = ContainerInsets(right: 20, left: 100)
// Change settings right away
container.set(left: 5) // →
container.set(right: 5) // ←
container.setLandscape(left: 10)
container.setLandscape(right: 100)

Customize for landscape orientation

// Sets the background shadow under container. (Default: backgroundShadowShow).
container.layout.landscapeBackgroundShadowShow = false
// Sets the new value for positions of animated movement (top, middle, bottom). (Default: positions).
container.layout.landscapePositions = ContainerPosition(top: 20, middle: 150, bottom: 70)
// Sets insets container.view (left, right). (Default: insets).
container.layout.landscapeInsets = ContainerInsets(right: 20, left: 100)
// Change settings right away
container.setLandscape(top: 30)
container.setLandscape(middle: 150)
container.setLandscape(bottom: 70)
container.setLandscape(middle: nil)
container.setLandscape(backgroundShadowShow: false)
container.setLandscape(left: 10)
container.setLandscape(right: 100)

Parameters for control footerView

// Padding-top from container.view, if headerView is added, then its + height is summed.
container.layout.footerPadding = 100
// Tracking position container.view during animated movement.
container.layout.trackingPosition = false
// Change settings right away
container.set(footerPadding: 100)
container.set(trackingPosition: false)

ContainerController Delegate

class ViewController: UIViewController, ContainerControllerDelegate {
 override func viewDidLoad() {
 super.viewDidLoad()
 
 let container = ContainerController(addTo: self, layout: layout)
 container.delegate = self
 }
}
/// Reports rotation and orientation changes
func containerControllerRotation(_ containerController: ContainerController) {
 ...
}
/// Reports a click on the background shadow
func containerControllerShadowClick(_ containerController: ContainerController) {
 ...
}
/// Reports the changes current position of the container, after its use
func containerControllerMove(_ containerController: ContainerController, position: CGFloat, type: ContainerMoveType, animation: Bool) {
 ...
}

Author

License