Intro
Drawer
is a framework that enables you to easily embed a UIViewController
in a drawer and display it on top of another UIViewController
.
📝 Requirements
- iOS 11
- Swift 4.0+
📦 Installation
Carthage
github "nodes-ios/Drawer"
Cocoapods
pod 'NDrawer'
💻 Usage
Requirements
- A
UIViewController
for the drawer to be displayed over. ThisViewController
is referred to as thebackgroundViewController
in the following steps - A
UIViewController
to act as the content of the drawer. ThisViewController
is referred to as thecontentViewController
in the following steps.
Steps
Creating a Drawer
Start by conforming your contentViewController
to the Embeddable
protocol. This exposes several delegate functions to the contentViewController
.
extension ContentViewController: Embeddable {}
Furthermore an instance of EmbeddableContentDelegate
is exposed. This delegate
can be used to instruct the drawer to perform various tasks by calling the handle
function on it.
The handle
function takes an enum
of type Drawer.Action
which allows these actions:
layoutUpdated(config: Drawer.Configuration)
to update the layout of your drawerchangeState(to: MovementState)
to show/hide your drawer.
After creating the contentViewController
, initialize an instance of DrawerCoordinator
in your backgroundViewController
to initialize the drawer.
let drawer = DrawerCoordinator(contentViewController: contentVC,
backgroundViewController: self,
drawerBackgroundType: .withColor(UIColor.black.withAlphaComponent(0.5)))
Displaying a Drawer
After your content's views have finished creating and you are ready to display the drawer, create an instance of Drawer.Configuration
to set the drawer state and properties.
let options: [Drawer.Configuration.Key : Any] = [
.animationDuration: 0.5,
.fullHeight: maxHeight,
.minimumHeight: minHeight,
.initialState: Drawer.State.minimized,
.cornerRadius: Drawer.Configuration.CornerRadius(fullSize: 20,
minimized: 0)
]
let contentConfiguration = Drawer.Configuration(options: options,
dismissCompleteCallback: nil)
Communication with the EmbeddableContentDelegate
is managed by calling the handle
function, which takes an enum
of type Drawer.Action
as a parameter.
Finally call the EmbeddableContentDelegate
handle
function to update the drawer's layout to the new Configuration
embedDelegate?.handle(action: .layoutUpdated(config: contentConfiguration))
Expanding and Collapsing a Drawer
To expand and collapse the drawer programatically, call the EmbeddableContentDelegate
handle
function with a changeState
action containing the state which the drawer should transition to.
embedDelegate?.handle(action: .changeState(to: .fullScreen))
Example Project
To learn more, please refer to the example project contained in this repository.
👥 Credits
Made with
📄 License
Drawer is available under the MIT license. See the LICENSE file for more info.