Custom Bottom UIActionSheet like Google iOS swift

A Google like UIActionSheet for iOS written in Swift.

Material UIActionSheet Controller

Lightweight and totally customizable. Create and present it the way you do with UIAlertController.

In this detailed tutorial, we will explore how to implement a custom ActionSheet in iOS Swift, giving you complete control over the appearance and functionality of your action sheet. With our step-by-step instructions and code examples, you’ll learn how to create a fully customizable MaterialActionSheetController that perfectly aligns with your app’s design and user experience goals.

We’ll cover various aspects of customization, including modifying the title and button styles, adding custom actions, and incorporating personalized icons or images.

By the end of this tutorial, you’ll have the knowledge and skills to create a visually stunning and user-friendly UIActionSheet that enhances the overall experience of your iOS app.

Whether you’re a beginner or an experienced Swift developer, this tutorial is designed to provide you with actionable insights and practical examples. Join us on this journey to master the art of creating custom UIActionSheets in iOS Swift and take your app’s user interface to new heights. Get ready to impress your users with a tailored and visually appealing UIActionSheet that truly stands out.

Version
License
Platform

Features

  •  Using closures to configure actions
  •  Action with optional icon and accessory view
  •  Handling touch on accessory view
  •  Separate long action list in sections
  •  Using closures to callback when controller is about to dismiss
  •  2 built-in themes: light & dark
  •  Customizable header
  •  Swift 3 compliant
uiactionsheet
Default light theme Action Sheet

uiactionsheet
Dark theme Action Sheet

uiactionsheet
Custom header UIActionSheet

Todos

  • Present on iPad as a pop-up
  • Documenting

Requirements

  • iOS 8.0+
  • Xcode 8
  • Swift 3

Installation

CocoaPods

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

pod 'MaterialActionSheetController'

Manually

Add MaterialActionSheetController.swift to your project

Usage

Import MaterialActionSheetController if you’re using CocoaPods

import MaterialActionSheetController

Create an action

let lightBulbAction = MaterialAction(
        icon: UIImage(named: "lightbulb"),
        title: "Action with UISwitch as an accessory view", handler: { [unowned self] (accessoryView) in
            self.doSomething()
        }, 
        accessoryView: UISwitch(), 
        dismissOnAccessoryTouch: true, 
        accessoryHandler: { [unowned self] (accessoryView) in
            if let lightBulbSwitch = accessoryView as? UISwitch {
                if accessoryView.on {
                    print("Light is ON!")
                } else {
                    print("Light is OFF!")
                }
            }
            self.doSomeOtherThing()
    })

Create your Material ActionSheet Controller

// parameter sections is a variadic which take a flexible list of section
let materialActionSheetController = MaterialActionSheetController(
        title: "A nice title",
        message: "A friendly message",
        actionSections: [aCoolAction, anotherCoolAction], [cancelAction])

Other create UIActionSheetController

let materialActionSheetController = MaterialActionSheetController()
materialActionSheetController.title = "A nice title"
materialActionSheetController.message = "A friendly message"
materialActionSheetController.actionSections.append([aCoolAction, anotherCoolAction])
materialActionSheetController.actionSections.append([cancelAction])

Customize theme and header view

// Customize theme
materialActionSheetController.theme = MaterialActionSheetTheme.dark()

// Custom header view
let imageView = UIImageView(image: UIImage(named: "myimage"))
imageView.bounds = CGRect(origin: CGPoint.zero, size: CGSize(width: 300, height: 100))
materialActionSheetController.customHeaderView = imageView

// Handler on "will dismiss" and "did dismiss" event
materialActionSheetController.willDismiss = { [unowned self] in
    print("I will dismiss.")
    self.doSomething()
}

// Finally present it
materialActionSheetController.didDismiss = { [unowned self] in
    print("I did dismiss.")
    self.doSomething()
}

presentViewController(materialActionSheetController, animated: true, completion: nil)

See code in demo for more detailed examples.

Download

Material Action Sheet Controller

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *