码迷,mamicode.com
首页 > 编程语言 > 详细

Swift - 启动时的向导页(新手引导)的制作

时间:2015-09-25 16:01:47      阅读:359      评论:0      收藏:0      [点我收藏+]

标签:

在很多iOS产品或者一些应用版本的升级中,新手指导都是一个常用的功能,通过说明页的左右滑动,可以很清晰的展示系统的一些功能特性。制作思路如下:

1,如何检测应用是第一次登陆启动
我们可以使用NSUserDefaults类来解决这个问题。其特点是不会因应用的关闭、系统的重启而丢失。所以可以用来标记是否启动过。

2,新手引导视图控制器我们使用UIScrollView
比如我们设置了一套新手引导图共三张,都添加到UIScrollView里,这时UIScrollView的内容宽度是3倍于照片或者屏幕的宽度。

3,为适应不同分辨率,需要设计几套不同尺寸的图
iOS图片资源的命名规则是:basename + screen size modifier + urischeme + orientation + scale + device + .ext
basename:文件名
screen size modifier:屏幕尺寸修饰符(iPhone5出现后才有,如 -568h)
urischeme:标识URI方案的字符串(一般情况不需要关心)
orientation:屏幕方向(横屏为-Landscape,竖屏为-Portrait)
scale:缩放尺寸(普通屏不需要,Retina屏为@2x,iPhone6后多了个@3x)
device:设备类型(~ipad表示供iPad使用)
.ext:文件扩展名(可以是png或其他格式)
尽管文件很复杂,但调用却很简单,只要写上basename.ext即可。

4,效果图如下:
 技术分享 技术分享 技术分享

5,文件结构如下:
 技术分享

6,入口类:AppDelegate.swift
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
import UIKit
 
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
     
    var window: UIWindow?
     
    func application(application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
        // Override point for customization after application launch.
        //增加标识,用于判断是否是第一次启动应用...
        if (!(NSUserDefaults.standardUserDefaults().boolForKey("everLaunched"))) {
            NSUserDefaults.standardUserDefaults().setBool(true, forKey:"everLaunched")
            var  guideViewController = GuideViewController()
            self.window!.rootViewController=guideViewController;
            println("guideview launched!")
        }
        return true
    }
     
    func applicationWillResignActive(application: UIApplication) {
    }
     
    func applicationDidEnterBackground(application: UIApplication) {
    }
     
    func applicationWillEnterForeground(application: UIApplication) {
    }
     
    func applicationDidBecomeActive(application: UIApplication) {
    }
     
    func applicationWillTerminate(application: UIApplication) {
    }
}

7,向导页面:GuideViewController.swift
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import UIKit
 
class GuideViewController:UIViewController,UIScrollViewDelegate
{
    var numOfPages = 3
     
    override func viewDidLoad()
    {
        var frame = self.view.bounds
        //scrollView的初始化
        var scrollView=UIScrollView()
        scrollView.frame=self.view.bounds
        scrollView.delegate = self
        //为了能让内容横向滚动,设置横向内容宽度为3个页面的宽度总和
        scrollView.contentSize=CGSizeMake(frame.size.width*CGFloat(numOfPages),frame.size.height)
        println("\(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 imgfile = "jianjie\(Int(i+1)).png"
            println(imgfile)
            var image = UIImage(named:"\(imgfile)")
            var imgView = UIImageView(image: image)
            imgView.frame=CGRectMake(frame.size.width*CGFloat(i),CGFloat(0),
                frame.size.width,frame.size.height)
            scrollView.addSubview(imgView)
        }
        scrollView.contentOffset = CGPointZero
        self.view.addSubview(scrollView)
    }
     
    func scrollViewDidScroll(scrollView: UIScrollView!)
    {
        println("scrolled:\(scrollView.contentOffset)")
        var twidth = CGFloat(numOfPages-1) * self.view.bounds.size.width
        if(scrollView.contentOffset.x > twidth)
        {
            var mainStoryboard = UIStoryboard(name:"Main", bundle:nil)
            var viewController = mainStoryboard.instantiateInitialViewController() as UIViewController
             
            self.presentViewController(viewController, animated: true, completion:nil)
        }
    }
}

上一篇Swift - 设置程序的应用图标和启动界面

Swift - 启动时的向导页(新手引导)的制作

标签:

原文地址:http://www.cnblogs.com/Free-Thinker/p/4838417.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!