SkillAgentSearch skills...

ContainerController

👉↕️📱ContainerController 🧩✨⚙️ is a UI Component Swipe-Panel (Customizable). 💡 The idea is copied from the app: Apple Maps, Stocks. Swift version

Install / Use

/learn @mrustaa/ContainerController

README

image(Landscape)

ContainerController

Version License Platform Swift 5.0 Swift 5.1 Swift 5.2

UI Component. This is a copy swipe-panel from app: https://www.apple.com/ios/maps/

It can:

  • Animately move top / middle / bottom
  • Add multiple ContainerControlleron top of each other in self.view
  • Add any type of ScrollView: Table / Collection / Text
  • Control Gesture or Scroll
  • Pin HeaderView to top / pin FooterView to bottom,
  • Add Background Color / background blur transparency
  • Adjust cornerRadius edges
  • Adjust container shadow
  • When raised to top = Add background shadow -
  • Has the ability to adjust Left / Right margins
  • And adjust Left / Right margins for landscape state.

Preview

image image image(Landscape)

About the project

Examples of use (ui swipe component ContainerController) in popular design applications.

It is used in different categories apps:

  • Maps / Menu / Player Music / Market / Sports News / Taxi / Finance Banks Stock / Wallets / Analytics / Notes
  • Alerts / Popups / Notifications

Features

<!-- TOC --> <!-- /TOC -->

Requirements

✏️ ContainerController is written in Swift 5.0+. It can be built by Xcode 11 or later. Compatible with iOS 13.0+.

Installation

CocoaPods

ContainerControllerSwift is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'ContainerControllerSwift'

Swift Package Manager with Xcode 11

dependencies: [
    .package(url: "https://github.com/mrustaa/ContainerController.git")
]

Follow this doc.

Design examples

Designs are borrowed from Dribbble

To get the design, you need to add a branch ui_examples

git clone https://github.com/mrustaa/ContainerController.git
cd ContainerController/
git checkout ui_examples

URLs Author:

GIF Previews:

image image image image

image image image image

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 = UICo

Related Skills

View on GitHub
GitHub Stars502
CategoryDevelopment
Updated8d ago
Forks47

Languages

Swift

Security Score

100/100

Audited on Mar 15, 2026

No findings