[iOS]简单的APP引导页的实现 (Swift)
在第一次打开APP或者APP更新后通常用引导页来展示产品特性
我们用NSUserDefaults类来判断程序是不是第一次启动或是否更新,在AppDelegate.swift中加入以下代码:
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
// Override point for customization after application launch.
// 得到当前应用的版本号
let infoDictionary = NSBundle.mainBundle().infoDictionary
let currentAppVersion = infoDictionary!["CFBundleShortVersionString"] as String
let userDefaults = NSUserDefaults.standardUserDefaults()
let appVersion = userDefaults.stringForKey("appVersion")
var storyboard = UIStoryboard(name: "Main", bundle: nil)
// 如果appVersion为nil说明是第一次启动;如果appVersion不等于currentAppVersion说明是更新了
if appVersion == nil || appVersion != currentAppVersion {
userDefaults.setValue(currentAppVersion, forKey: "appVersion")
var guidanceViewController = storyboard.instantiateViewControllerWithIdentifier("GuidanceVC") as GuidanceViewController
self.window!.rootViewController = guidanceViewController
}
return true
}
在GuidanceViewController中,我们用UIScrollView来装载我们的引导页
import UIKit
class GuidanceViewController: UIViewController {
var scrollView: UIScrollView!
@IBOutlet weak var pageControl: UIPageControl!
@IBOutlet weak var startButton: UIButton!
var numOfPages = 4
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
var frame = self.view.bounds
scrollView = UIScrollView()
scrollView.frame = self.view.bounds
scrollView.delegate = self
// scrollView的contentSize设为屏幕宽度的4(我这里设了四张引导页)倍
scrollView.contentSize = CGSizeMake(frame.size.width * CGFloat(numOfPages), frame.size.height)
scrollView.pagingEnabled = true
scrollView.showsHorizontalScrollIndicator = false
scrollView.showsVerticalScrollIndicator = false
scrollView.scrollsToTop = false
for i in 0..<numOfPages {
var image = UIImage(named: "Guidance\(i + 1)")
var imageView = UIImageView(image: image)
imageView.frame = CGRectMake(frame.size.width * CGFloat(i), 0, frame.size.width, frame.size.height)
scrollView.addSubview(imageView)
}
scrollView.contentOffset = CGPointZero
self.view.addSubview(scrollView)
startButton.alpha = 0.0
// 将这两个控件拿到视图的最上面
self.view.bringSubviewToFront(pageControl)
self.view.bringSubviewToFront(startButton)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
@IBAction func start(sender: AnyObject) {
var storyboard = UIStoryboard(name: "Main", bundle: nil)
var viewController = storyboard.instantiateViewControllerWithIdentifier("LoginVC") as LoginViewController
viewController.modalTransitionStyle = UIModalTransitionStyle.CrossDissolve
presentViewController(viewController, animated: true, completion: nil)
}
}
最后我们让GuidanceViewController遵循UIScrollViewDelegate协议,在这里判断是否滑动到最后一张以显示进入按钮。
// MARK: - UIScrollViewDelegate
extension GuidanceViewController: UIScrollViewDelegate {
func scrollViewDidScroll(scrollView: UIScrollView) {
var offset = scrollView.contentOffset
// 随着滑动改变pageControl的状态
pageControl.currentPage = Int(offset.x / view.bounds.width)
// 因为currentPage是从0开始,所以numOfPages减1
if pageControl.currentPage == numOfPages - 1 {
UIView.animateWithDuration(0.5) {
self.startButton.alpha = 1.0
}
} else {
UIView.animateWithDuration(0.5) {
self.startButton.alpha = 0.0
}
}
}
}
在上面的代码中,为了显得自然我们给进入按钮加入了一点动画 :]
最终效果如下: