Onboard 2.3.3

Onboard 2.3.3

测试已测试
Lang语言 Obj-CObjective C
许可证 MIT
发布上次发布2018年4月

Mike AmaralFelipe Plets 维护。



Onboard 2.3.3

Onboard

Badge w/ Version CocoaPods Build Status Carthage compatible License

demo demo demo demo

点击此处查看更多示例

重要

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

公开了 iconImageViewtitleLabelbodyLabelactionButton 属性以自定义字体、大小等,还可以自定义内容页面中元素之间的间距。

onboardingVC.topPadding = 20;
onboardingVC.underIconPadding = 10;
onboardingVC.underTitlePadding = 15;
onboardingVC.bottomPadding = 20;

demo

模糊、遮罩和淡入

默认情况下,您用于背景的图片将应用一个遮罩,稍微变暗。这是为了增加一点对比度,以便更容易看到文本。如果您的图片已经编辑过或看起来很合适,可以轻松禁用此功能。

onboardingVC.shouldMaskBackground = NO; // defaults to YES

我们还可以对背景图片应用模糊效果。

onboardingVC.shouldBlurBackground = YES; // defaults to NO

在页面切换过程中,对图标、文本和按钮应用淡入效果。您滚动页面时内容淡出,下一个页面内容滚动进入时淡入。

onboardingVC.shouldFadeTransitions = YES; // defaults to NO

注意:确保您在设置这些属性之前,不触发内置视图控制器视图的加载,因为这些值仅在视图控制器的 viewDidLoad 被调用时才生效,因此在此之前执行类似 onboardingVC.view.backgroundColor = [UIColor whiteColor]; 的操作将导致这些设置无效。

您可以通过不同的组合调整这些设置以获得所需的效果。

demo demo demo demo

自动导航

如果您想当用户按下动作按钮时自动将他们转到下一页,请将任何不属于最后视图控制器的 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。