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/ContainerControllerREADME

ContainerController
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

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 -->- Requirements
- Installation
- Design examples
- Getting Started
- Action
- Adding possible custom subviews in ContainerController view
- Settings ⚙️
- ContainerController
Delegate - Author
- License
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:


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
node-connect
333.3kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
82.0kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
333.3kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
commit-push-pr
82.0kCommit, push, and open a PR
