应用程序app一般都有引导页,引导页可以作为操作指南指导用户熟悉使用;也可以展现给用户,让用户了解app的功能作用。引导页制作简单,一般只需要一组图片,再把图片组展现出来就可以了。展示图片组常用uiscrollview来分页显示,并且由uipagecontrol页面控制器控制显示当前页。uiscrollview和uipagecontrol搭配会更加完美地展现引导页的功能作用。下面我们来看具体的实例:
我们用nsuserdefaults类来判断程序是不是第一次启动或是否更新,在 appdelegate.swift中加入以下代码:
func application(application: uiapplication, didfinishlaunchingwithoptions launchoptions: [nsobject: anyobject]?) -> bool {
// 得到当前应用的版本号
let infodictionary = nsbundle.mainbundle().infodictionary
let currentappversion = infodictionary!["cfbundleshortversionstring"] as! string
// 取出之前保存的版本号
let userdefaults = nsuserdefaults.standarduserdefaults()
let appversion = userdefaults.stringforkey("appversion")
let storyboard = uistoryboard(name: "main", bundle: nil)
// 如果 appversion 为 nil 说明是第一次启动;如果 appversion 不等于 currentappversion 说明是更新了
if appversion == nil || appversion != currentappversion {
// 保存最新的版本号
userdefaults.setvalue(currentappversion, forkey: "appversion")
let guideviewcontroller = storyboard.instantiateviewcontrollerwithidentifier("guideviewcontroller") as! guideviewcontroller
self.window?.rootviewcontroller = guideviewcontroller
}
return true
}
在guideviewcontroller中,我们用uiscrollview来装载我们的引导页:
class guideviewcontroller: uiviewcontroller {
@iboutlet weak var pagecontrol: uipagecontrol!
@iboutlet weak var startbutton: uibutton!
private var scrollview: uiscrollview!
private let numofpages = 3
override func viewdidload() {
super.viewdidload()
let frame = self.view.bounds
scrollview = uiscrollview(frame: frame)
scrollview.pagingenabled = true
scrollview.showshorizontalscrollindicator = false
scrollview.showsverticalscrollindicator = false
scrollview.scrollstotop = false
scrollview.bounces = false
scrollview.contentoffset = cgpointzero
// 将 scrollview 的 contentsize 设为屏幕宽度的3倍(根据实际情况改变)
scrollview.contentsize = cgsize(width: frame.size.width * cgfloat(numofpages), height: frame.size.height)
scrollview.delegate = self
for index in 0..<numofpages {
// 这里注意图片的命名
let imageview = uiimageview(image: uiimage(named: "guideimage\(index + 1)"))
imageview.frame = cgrect(x: frame.size.width * cgfloat(index), y: 0, width: frame.size.width, height: frame.size.height)
scrollview.addsubview(imageview)
}
self.view.insertsubview(scrollview, atindex: 0)
// 给开始按钮设置圆角
startbutton.layer.cornerradius = 15.0
// 隐藏开始按钮
startbutton.alpha = 0.0
}
// 隐藏状态栏
override func prefersstatusbarhidden() -> bool {
return true
}
}
最后我们让guideviewcontroller遵循uiscrollviewdelegate协议,在这里判断是否滑动到最后一张以显示进入按钮:
// mark: - uiscrollviewdelegate
extension guideviewcontroller: uiscrollviewdelegate {
func scrollviewdidscroll(scrollview: uiscrollview) {
let 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.2) {
self.startbutton.alpha = 0.0
}
}
}
}
在上面的代码中,为了显得自然我们给进入按钮加入了一点动画 :]
最终效果如下: