Onboard
点击此处查看更多示例
重要
Onboard不再处于活跃的开发状态,因此如果您创建任何问题或提交pull请求,它不太可能被集成。感谢所有在过去几年中帮助使Onboard变得更好的人!
使用
在您的Podfile
中添加以下内容并运行pod install
即可
pod 'Onboard'
如果您不想使用CocoaPods,您可以使用Carthage或从资源目录中获取文件并将它们手动拖到您的项目中。
每次入职体验都包括两个主要组件 - 背景 和 内容页面。背景包括静态背景图像/视频、页面控制和跳过按钮。内容页面由四部分组成,一个图像/图标、标题、正文和操作按钮。
通过创建 OnboardingContentViewController
的实例来创建单个页面。提供一个标题、正文、图像、操作按钮的文本,并在操作块中处理用户按下按钮时想要执行的操作。如果您不需要按钮,您可以同时将按钮文本和操作处理程序设置为 nil。
Objective-C
OnboardingContentViewController *firstPage = [OnboardingContentViewController contentWithTitle:@"Page Title" body:@"Page body goes here." image:[UIImage imageNamed:@"icon"] buttonText:@"Text For Button" action:^{
// do something here when users press the button, like ask for location services permissions, register for push notifications, connect to social media, or finish the onboarding process
}];
Swift
let firstPage = OnboardingContentViewController(title: "Page Title", body: "Page body goes here.", image: UIImage(named: "icon"), buttonText: "Text For Button") { () -> Void in
// do something here when users press the button, like ask for location services permissions, register for push notifications, connect to social media, or finish the onboarding process
}
通过提供项目中的背景图像或本地视频文件的 URL,以及您刚刚创建的内容视图控制器数组来创建 OnboardingViewController
。然后,您可以以模态方式显示并根据需求开始入职过程!
Objective-C
// Image
OnboardingViewController *onboardingVC = [OnboardingViewController onboardWithBackgroundImage:[UIImage imageNamed:@"background"] contents:@[firstPage, secondPage, thirdPage]];
// Video
NSBundle *bundle = [NSBundle mainBundle];
NSString *moviePath = [bundle pathForResource:@"yourVid" ofType:@"mp4"];
NSURL *movieURL = [NSURL fileURLWithPath:moviePath];
OnboardingViewController *onboardingVC = [OnboardingViewController onboardWithBackgroundVideoURL:movieURL contents:@[firstPage, secondPage, thirdPage]];
Swift
// Image
let onboardingVC = OnboardingViewController(backgroundImage: UIImage(named: "background"), contents: [firstPage, secondPage, thirdPage])
// Video
let bundle = NSBundle.mainBundle()
let moviePath = bundle.pathForResource("yourVid", ofType: "mp4")
let movieURL = NSURL(fileURLWithPath: moviePath!)
let onboardingVC = OnboardingViewController(backgroundVideoURL: movieUrl, contents: [firstPage, secondPage, thirdPage])
只需几行代码,您就拥有了一个令人印象深刻的、从头到尾的入职过程,这将让您的用户兴奋地使用您令人惊叹的应用程序。
Customization
公开了 iconImageView
、titleLabel
、bodyLabel
和 actionButton
属性以自定义字体、大小等,还可以自定义内容页面中元素之间的间距。
onboardingVC.topPadding = 20;
onboardingVC.underIconPadding = 10;
onboardingVC.underTitlePadding = 15;
onboardingVC.bottomPadding = 20;
模糊、遮罩和淡入
默认情况下,您用于背景的图片将应用一个遮罩,稍微变暗。这是为了增加一点对比度,以便更容易看到文本。如果您的图片已经编辑过或看起来很合适,可以轻松禁用此功能。
onboardingVC.shouldMaskBackground = NO; // defaults to YES
我们还可以对背景图片应用模糊效果。
onboardingVC.shouldBlurBackground = YES; // defaults to NO
在页面切换过程中,对图标、文本和按钮应用淡入效果。您滚动页面时内容淡出,下一个页面内容滚动进入时淡入。
onboardingVC.shouldFadeTransitions = YES; // defaults to NO
注意:确保您在设置这些属性之前,不触发内置视图控制器视图的加载,因为这些值仅在视图控制器的 viewDidLoad
被调用时才生效,因此在此之前执行类似 onboardingVC.view.backgroundColor = [UIColor whiteColor];
的操作将导致这些设置无效。
您可以通过不同的组合调整这些设置以获得所需的效果。
自动导航
如果您想当用户按下动作按钮时自动将他们转到下一页,请将任何不属于最后视图控制器的 OnboardingContentViewController
中的 movesToNextViewController
属性设置为 YES
。配合此功能,您可以通过将 OnboardingViewController
中的 swipingEnabled
属性设置为 NO
来禁用对内容的连续滑动。这允许您对培训过程有更大的控制权。最后,如果设计有助于不使用页面控制,或者仅有一页,您可以设置 hidePageControl
属性为 YES
,页面控制点将不会显示。
contentVC.movesToNextViewController = YES;
onboardingVC.swipingEnabled = NO;
onboardingVC.hidePageControl = YES;
跳过
如果您想允许用户跳过培训过程,请在培训视图控制器中启用跳过功能,并设置在按下跳过按钮时执行的操作。
onboardingVC.allowSkipping = YES;
onboardingVC.skipHandler = ^{
// Dismiss, fade out, etc...
};
块
可能存在这样的情况,您想在内容页面即将出现时或它们出现时执行某些操作。在这种情况下,您可以为任何或所有内容页面设置viewWillAppearBlock和viewDidAppearBlock属性来处理您想做的任何事情。
contentVC.viewWillAppearBlock = ^{
// do something when the view will appear here…
}
contentVC.viewDidAppearBlock = ^{
// do something when the view appears here…
}
笔记
目前我不支持横幅显示,所以我建议您要么在一个仅支持纵向的应用中使用此功能,要么将其包裹在一个子类化的UnitednavigationController对象中,该对象仅支持纵向。
社区
欢迎提问、评论、问题和建议!
许可证
本项目在MIT许可证下提供。有关详细信息,请参阅LICENSE.txt。