paper-onboarding
Check this library on other platforms:
Looking for developers for your project?
This project is maintained by Ramotion, Inc. We specialize in the designing and coding of custom UI for Mobile Apps and Websites.
The iPhone mockup available here.
Requirements
- iOS 10.0+
- Xcode 9
Installation
Just add the Source folder to your project.
or use CocoaPods with Podfile:
pod 'paper-onboarding'
or Carthage users can simply add to their Cartfile
:
github "Ramotion/paper-onboarding"
Usage
Storyboard
-
Create a new UIView inheriting from
PaperOnboarding
-
Set dataSource in attribute inspector
or Code
override func viewDidLoad() {
super.viewDidLoad()
let onboarding = PaperOnboarding(itemsCount: 3)
onboarding.dataSource = self
onboarding.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(onboarding)
// add constraints
for attribute: NSLayoutAttribute in [.Left, .Right, .Top, .Bottom] {
let constraint = NSLayoutConstraint(item: onboarding,
attribute: attribute,
relatedBy: .Equal,
toItem: view,
attribute: attribute,
multiplier: 1,
constant: 0)
view.addConstraint(constraint)
}
}
For adding content use dataSource methods:
func onboardingItem(at index: Int) -> OnboardingItemInfo {
return [
OnboardingItemInfo(informationImage: IMAGE,
title: "title",
description: "description",
pageIcon: IMAGE,
color: UIColor.RANDOM,
titleColor: UIColor.RANDOM,
descriptionColor: UIColor.RANDOM,
titleFont: UIFont.FONT,
descriptionFont: UIFont.FONT),
OnboardingItemInfo(informationImage: IMAGE,
title: "title",
description: "description",
pageIcon: IMAGE,
color: UIColor.RANDOM,
titleColor: UIColor.RANDOM,
descriptionColor: UIColor.RANDOM,
titleFont: UIFont.FONT,
descriptionFont: UIFont.FONT),
OnboardingItemInfo(informationImage: IMAGE,
title: "title",
description: "description",
pageIcon: IMAGE,
color: UIColor.RANDOM,
titleColor: UIColor.RANDOM,
descriptionColor: UIColor.RANDOM,
titleFont: UIFont.FONT,
descriptionFont: UIFont.FONT)
][index]
}
func onboardingItemsCount() -> Int {
return 3
}
configuring content item:
func onboardingConfigurationItem(item: OnboardingContentViewItem, index: Int) {
// item.titleLabel?.backgroundColor = .redColor()
// item.descriptionLabel?.backgroundColor = .redColor()
// item.imageView = ...
}
This library is a part of a selection of our best UI open-source projects.
License
paper-onboarding is released under the MIT license. See LICENSE for details.
Get the Showroom App for iOS to give it a try
Try this UI component and more like this in our iOS app. Contact us if interested.