Latest 1.0-beta.3
Homepage https://github.com/peppesapienza/Rocket-Alert
License Apache-2.0
Platforms ios 10.0, requires ARC
Authors

Rockert Alert resolve the problem of being distracted by a boring AlertView with a user-friendly boarding process similar to a Chat Bot.

alt textalt text

Would you like to improve your User Experience’s while asking user to do some action?

With a modern style and a powerful personalization RocketAlert could help you to increase your conversion rate.

Installation

CocoaPods

platform :ios, '10.0'
use_frameworks!

target '<Your Target Name>' do
    pod 'RocketAlert', '1.0-beta.3'
end

Then, run the following command:

$ pod install

Communication

  • If you need help, use Stack Overflow. (Tag ‘rocketalert’)
  • If you found a bug or you have a feature request open an issue.
  • If you are an :it: iOS Italian Developer follow us on Slack or Facebook Group
  • If you want to contribute, submit a pull request.

Usage

You can instantiate a Rocket by passing to his parameters a RocketAuthor and a RocketBlock object. After that, you can present the Rocket by performing the method show():

import RocketAlert

let author = RocketAuthor.init(image: yourUIImage, style: RocketImageStyle.round)
let textBlock = TextRocketBlock.init(text: "This is your first Block")
let rocket = Rocket.init(author: author, block: textBlock)

rocket.show()

You can destroy the alert by invoking the method dismiss() on the same rocket object:

rocket.dismiss()

RocketBlock

RocketBlock is a container of data and functionality and under the hood RocketBlock is nothing else a simple UITableViewCell.

Depends on block type a user can interact with a block by Tap, Control Events (for example button click) and Input Events (at the moment only text input). After an event Rocket could show the next block that has been attached to the interacted block.

RocketBlock is a protocol that gives to all blocks a var id: String? {get set} property (created to be used in some advanced circumstances). There is also a var cellIdentifier: String {get} which is used internally to match the block with a reusable cell.

public protocol RocketBlock {
    var id: String? { get set }
    var cellIdentifier: String { get }
}

The RocketBlock protocol is never used as the base protocol of the implemented class. Instead, you will use the inherited protocols that give to the blocks some useful stuff.

IMPORTANT: When a next block has been presented the interaction over the previous block will be disabled.

TappableRocketBlock

The TappableRocketBlock is an inherited protocol from RocketBlock. The TappableRocketBlock protocol describes the block that could be tapped by the user. He gives to the implemented class two properties:

protocol TappableRocketBlock: RocketBlock {
    var next: RocketBlock? { get set }
    var showNextAfter: TimeInterval? { get set }
}
  1. The next property represents the next RocketBlock that will be shown after the tap.
  2. The showNextAfter property allows the next block, if presented, to be shown automatically after an amount of time. If you provide a value the TapGestureRecognizer will be disabled.

TextRocketBlock

You can use TextRocketBlock object to show a line or multiline string. The TextRocketBlock is an implemented class of the TappableRocketBlock protocol.

You can create a TextRocketBlock by using one of these init:

TextRocketBlock.init(text: String, next: RocketBlock, showNextAfter: TimeInterval? = nil)
TextRocketBlock.init(text: String, showNextAfter: TimeInterval)
TextRocketBlock.init(text: String, next: RocketBlock? = nil, showNextAfter: TimeInterval? = nil, id: String? = nil, font: RocketFont = .text)

And you can use it like that:

let secondBlock = TextRocketBlock.init(text: "This is your second block")
let firstBlock = TextRocketBlock.init(text: "This is your first block", next: secondBlock)

let rocket = Rocket.init(author: author, block: firstBlock)
rocket.show()

The secondBlock will be presented after the tap on the firstBlock. Note that I passed the firstBlock to the rocket.

Flat style

Use this style when you have a lot of blocks and you want maintain your code clear:

let firstBlock = TextRocketBlock.init(text: "First")
let secondBlock = TextRocketBlock.init(text: "Second")
let thirdBlock = TextRocketBlock.init(text: "Third")

firstBlock.next = second 

secondBlock.next = third
secondBlock.font = RocketFont.textBold

showNextAfter property

let firstBlock = TextRocketBlock.init(text: "First")
let secondBlock = TextRocketBlock.init(text: "Second")

firstBlock.next = second 
firstBlock.showNextAfter = 2.0

secondBlock.font = RocketFont.textBold

The thirdBlock will be shown automatically after 2.0 seconds and after the secondBlock.

Screenshot

RocketFont

You can change the UIFont by providing a RocketFont object to the font property.

let firstBlock = TextRocketBlock.init(text: "First", next: secondBlock)
firstBlock.font = RocketFont.init(font: UIFont, color: UIColor)
// or 
firstBlock.font = RocketFont.text // the default

The RocketFont provide some default styles:

block.font = RocketFont.emoji
block.font = RocketFont.text
block.font = RocketFont.textBold
block.font = RocketFont.button
block.font = RocketFont.lightButton
block.font = RocketFont.cancel

ImageRocketBlock

You can use ImageRocketBlock object to show an Image with or without text. The ImageRocketBlock is a subclass of TextRocketBlock class, so you can editing the same properties.

You can create an ImageRocketBlock by using one of these init:

ImageRocketBlock.init(image: UIImage, text: String?)
ImageRocketBlock.init(image: UIImage, text: String?, next: RocketBlock?, showNextAfter: TimeInterval?, id: String?)

You can add a padding to the internal ImageView by editing the properties paddingLeft and paddingRight. The default padding value is 0:

imageBlock.paddingLeft = 10
imageBlock.paddingRight = 10 

And you can round the corners of the ImageView by assigning a RocketImageStyle to the imageStyle property. The default value is .square:

imageBlock.imageStyle = .circular
imageBlock.imageStyle = .round
imageBlock.imageStyle = .square

Screenshot

ControlRocketBlock

The ControlRocketBlock is an inherited protocol from RocketBlock. The ControlRocketBlock protocol describes the interactable blocks.

ButtonRocketBlock

Use ButtonRocketBlock object to show a single button. You can’t define a nextblock directly. Instead you need to provide a TapRocketHandler that let you define a custom action and the next block that will be fired after the TouchUpInside event.

You can create a ButtonRocketBlock using one of these init:

ButtonRocketBlock.init(title: String, tapHandler: TapRocketHandler) 
ButtonRocketBlock.init(title: String, tapHandler: TapRocketHandler, font: RocketFont)
ButtonRocketBlock.init(title: String, tapHandler: TapRocketHandler? = nil, font: RocketFont? = RocketFont.button, id: String? = nil)

The default RocketFont is .button.

TapRocketHandler

let button = ButtonRocketBlock.init(title: "PRESS THERE")
let afterTheTapOnButton = TextRocketBlock.init(text: "You press the button!!")

button.tapHandler = TapRocketHandler.init(next: afterTheTapOnButton, action: {
    print("the user click the button")

    UNUserNotificationCenter.current().requestAuthorization(options:[.badge, .alert, .sound]) { (granted, error) in

    }
})

let rocket = Rocket.init(author: author, block: button)
rocket.show()

alt text

DoubleButtonRocketBlock

Use the DoubleButtonRocketBlock when you want to show two options. You can initialize a DoubleButtonRocketBlock passing to it init two ButtonRocketBlock. It’s important to know that when a user taps to one of the buttons the touch over the block will be disabled.

let leftButton = ButtonRocketBlock.init(title: "Left Button")
leftButton.font = .button // the default

let rightButton = ButtonRocketBlock.init(title: "Right Button")
rightButton.font = .lightButton
rightButton.tapHandler = // remember to set a tapHandler if you want to show a block or if you want perform an action

let doubleButton = DoubleButtonRocketBlock.init(left: leftButton, right: rightButton)

InputRocketBlock

The InputRocketBlock is an inherited protocol from RocketBlock. The InputRocketBlock protocol describes the block that has an input field. He gives to the implemented class an InputRocketHandler<InputType> properties:

protocol InputRocketBlock: RocketBlock {
    associatedtype InputType
    var handler: InputRocketHandler<InputType>? { get set }
}

When you create an InputRocketHandler<T> you need to define a closure that returns back at least one RocketBlock:

public struct InputRocketHandler<T> {
    public init(action: ((T)->(RocketBlock?))?) {
        self.action = action
    }

    internal let action: ((_ text: T)->(RocketBlock?))?
}

TextInputRocketBlock

Use the TextInputRocketBlock when you want to ask the user to enter some String information. The TextInputRocketBlock is an implemented class of the InputRocketBlock protocol.

You can create a TextInputRocketBlock by using one of these init:

TextInputRocketBlock.init(text: String, buttonTitle: String)
TextInputRocketBlock.init(text: text, buttonTitle: buttonTitle, inputHandler: InputRocketHandler<String>?)
TextInputRocketBlock.init(text: String, buttonTitle: String, inputHandler: InputRocketHandler<String>?, id: String? = nil, font: RocketFont? = RocketFont.text, buttonStyle: RocketFont? = RocketFont.lightButton)

In it basic form you can use it like that:

let input = TextInputRocketBlock.init(text: "Describe your problem:", buttonTitle: "Send")

input.handler = InputRocketHandler<String>.init(action: { (input) -> RocketBlock? in
    return TextRocketBlock.init(text: "Thanks you so much!")
})

Return different blocks

If you want to handle differently the user’s input, you can return a different block based on the value of the InputRocketHandler:

let input = TextInputRocketBlock.init(text: "Describe your problem:", buttonTitle: "Send")

input.handler = InputRocketHandler<String>.init(action: { (input) -> RocketBlock? in
    if (input.isEmpty) {
        return TextRocketBlock.init(text: "Why haven't added a text? :(")
    }

    if (input == "SecretKey") {
        return TextRocketBlock.init(text: "Awesome!! you know the secret key")
    }

    let block = TextRocketBlock.init(text: "Thanks you so much!")
    /* you can concatenate more blocks if you want */
    return block
})

NotificationCenter

rocketBlockAddedEvent

You can subscribe your object as observers of the Notification.Name.rocketBlockAddedEvent. This event will be fired after a block is displayed on the screen.

The userInfo bring with itself the index and the block presented.

// subscribe to the Notification.Name.addedNewRocketBlock
NotificationCenter
    .default
    .addObserver(self,
                 selector: #selector(ViewController.handleRocketAlertBlock),
                 name: Notification.Name.rocketBlockAddedEvent,
                 object: nil)

// handle the notification
@objc func handleRocketAlertBlock(_ sender: Notification) {
    guard
        let index = sender.userInfo?["index"] as? Int,
        let block = sender.userInfo?["block"] as? RocketBlock
    else { return }

    print(index, block)
}

rocketDismissEvent

rocketDismissEvent will be fired when rocket is dismissed (after the last block or after click to the close button). Inside the userInfo you will find the count of all blocks displayed and the blocks array:

NotificationCenter
    .default
    .addObserver(self,
                 selector: #selector(ViewController.handleRocketAlertBlock),
                 name: Notification.Name.rocketDismissEvent,
                 object: nil)

@objc func handleRocketDismissEvent(_ sender: Notification) {
    guard
        let count = sender.userInfo?["count"] as? Int,
        let blocks = sender.userInfo?["blocks"] as? [RocketBlock]
        else { return }

    print(count, blocks)
}

Latest podspec

{
    "name": "RocketAlert",
    "version": "1.0-beta.3",
    "summary": "User friendly, Modular and Modern iOS Alert View",
    "homepage": "https://github.com/peppesapienza/Rocket-Alert",
    "authors": {
        "Giuseppe Sapienza": "[email protected]"
    },
    "license": {
        "type": "Apache-2.0",
        "file": "LICENSE"
    },
    "platforms": {
        "ios": "10.0"
    },
    "source": {
        "git": "https://github.com/peppesapienza/Rocket-Alert.git",
        "tag": "1.0-beta.3"
    },
    "requires_arc": true,
    "ios": {
        "frameworks": [
            "Foundation",
            "UIKit"
        ],
        "source_files": [
            "RocketAlert/*.swift",
            "RocketAlert/**/*.{h,m,swift,plist}"
        ]
    }
}

Pin It on Pinterest

Share This