NDrawer 1.0.4

NDrawer 1.0.4

Maintained by Nodes Agency.



NDrawer 1.0.4

  • By
  • Nodes Agency - iOS

Carthage Compatible Plaforms GitHub license CircleCI

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. This ViewController is referred to as the backgroundViewController in the following steps
  • A UIViewController to act as the content of the drawer. This ViewController is referred to as the contentViewController 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 drawer
  • changeState(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 ❤️ at Nodes.

📄 License

Drawer is available under the MIT license. See the LICENSE file for more info.