本文将演示使用滚动视图创建多个页面。
【Create a new Xcode project】->【Single View App】->【Next】
Product Name:PageControllViewProject
->【Next】->【Create】
创建三个视图控制器类文件,并为每个视图控制器的根视图,设置背景颜色。
1、视图文件1
【New File】->【Cocoa Touch Class】->【Next】
Name:PageControllViewController
Subclass:UIViewController
Language:Swift
->【Create】
1 import UIKit 2 3 class FirstSubViewController: UIViewController { 4 5 override func viewDidLoad() { 6 super.viewDidLoad() 7 // Do any additional setup after loading the view. 8 //设置第一个视图的根视图背景颜色为棕色 9 self.view.backgroundColor = UIColor.brown 10 } 11 12 override func didReceiveMemoryWarning() { 13 super.didReceiveMemoryWarning() 14 // Dispose of any resources that can be recreated. 15 } 16 }
2、视图文件2
Name:FirstSubViewController
Subclass:UIViewController
Language:Swift
1 import UIKit 2 3 class SecondSubViewController: UIViewController { 4 5 override func viewDidLoad() { 6 super.viewDidLoad() 7 8 // Do any additional setup after loading the view. 9 //设置第一个视图的根视图背景颜色为紫色 10 self.view.backgroundColor = UIColor.purple 11 } 12 }
3、视图文件3
Name:SecondSubViewController
Subclass:UIViewController
Language:Swift
1 import UIKit 2 //首先为当前视图控制器,添加滚动视图的代理协议 UIScrollViewDelegate 3 class PageControlViewController: UIViewController, UIScrollViewDelegate { 4 //然后为视图控制器,添加一个滚动视图属性 5 //滚动视图是一个可以拖动的组件 6 var scrollView = UIScrollView() 7 //继续添加一个控制翻页的属性,使用它来控制滚动视图的翻页 8 //通过该组件中的小白点,来观察当前页面的位置 9 var pageControl = UIPageControl() 10 //添加一个状态属性,用来标识页面的滑动状态 11 var isPageControlUsed = false 12 override func viewDidLoad() { 13 super.viewDidLoad() 14 15 // Do any additional setup after loading the view. 16 //首先获得当前设备的屏幕尺寸信息 17 var screenFrame = UIScreen.main.bounds 18 //然后获得屏幕尺寸的宽度值 19 let screenWidth = screenFrame.size.width 20 //然后获得屏幕尺寸的高度值 21 let screenHeight = screenFrame.size.height 22 23 //创建一个区域,来显示之前创建的视图控制器 24 scrollView.frame = screenFrame 25 //设置滚动视图为分页模式,即每滚动一次就是一页 26 scrollView.isPagingEnabled = true 27 //设置滚动视图的尺寸信息。 28 //这里有两个页面,所以将滚动视图的宽度,设置为两倍页面宽度 29 scrollView.contentSize = CGSize(width: screenWidth * 2, height: screenHeight) 30 //设置滚动视图的背景颜色为黑色 31 scrollView.backgroundColor = UIColor.black 32 //设置滚动视图对象的代理为当前的控制器对象, 33 //这样就可以在当前的文件中,编写代理方法, 34 //以捕捉滚动视图的相关动作 35 scrollView.delegate = self 36 37 //再创建一个高度常量,作为页面控制器对象的高度 38 let pcHeight:CGFloat = 50.0 39 //然后创建一个区域,用来显示页面控制器对象 40 let pcRect = CGRect(x: 0, y: screenHeight - pcHeight, width: screenWidth, height: pcHeight) 41 42 //设置页面控制器对象的显示区域 43 pageControl.frame = pcRect 44 //接着设置页面控制器对象的总页数为2页 45 pageControl.numberOfPages = 2 46 //设置页面控制器对象的当前页编号 47 pageControl.currentPage = 0 48 //继续设置页面控制器对象的背景颜色为灰色 49 pageControl.backgroundColor = UIColor.gray 50 //给页面控制器对象,添加监听页面切换事件的方法 51 pageControl.addTarget(self, action: #selector(pageControlDidChanged(_:)), for: UIControl.Event.valueChanged) 52 53 //创建第一个视图控制器对象的实例 54 let firstController = FirstSubViewController() 55 //设置坐标原点的横向值为0 56 screenFrame.origin.x = 0 57 //设置第一个视图控制器对象的显示区域 58 firstController.view.frame = screenFrame 59 60 //创建第二个视图控制器对象的实例 61 let secondController = SecondSubViewController() 62 //设置坐标原点的X值为屏幕的宽度, 63 //即第二个视图控制器对象显示再屏幕之外 64 screenFrame.origin.x = screenFrame.size.width 65 //设置第二个视图控制器对象的显示区域 66 secondController.view.frame = screenFrame 67 68 //将两个视图控制器的根视图, 69 //分别添加到滚动视图对象里 70 scrollView.addSubview(firstController.view) 71 scrollView.addSubview(secondController.view) 72 73 //再把滚动视图对象和页面控制器对象, 74 //分别添加到当前窗口的根视图里 75 self.view.addSubview(scrollView) 76 self.view.addSubview(pageControl) 77 } 78 79 //创建监听页面切换事件的方法 80 @objc func pageControlDidChanged(_ sender:AnyObject) 81 { 82 //获得当前页面控制器对象的当前页码 83 let crtPage = (CGFloat)(pageControl.currentPage) 84 //获得滚动视图当前的显示区域 85 var frame = scrollView.frame 86 //根据页面控制器对象的目标页码 87 //计算滚动视图在下一页中的显示区域 88 frame.origin.x = frame.size.width * crtPage 89 frame.origin.y = 0 90 91 //然后滚动视图到目标区域 92 scrollView.scrollRectToVisible(frame, animated: true) 93 //设置通过页面控制器对象切换页面 94 isPageControlUsed = true 95 } 96 97 //创建监听滚动视图的滚动事件的代理方法 98 func scrollViewDidScroll(_ scrollView: UIScrollView) 99 { 100 //如果是通过页面控制器对象切换页面,则不执行后面的代码 101 if(!isPageControlUsed) 102 { 103 //获得滚动视图的宽度值 104 let pageWidth = scrollView.frame.size.width 105 //根据滚动视图的宽度值和横向位移量,计算当前的页码 106 let page = floor((scrollView.contentOffset.x - pageWidth/2)/pageWidth) + 1 107 //设置页面控制器的显示页码,为通过计算所得的页码 108 pageControl.currentPage = Int(page) 109 } 110 } 111 112 //创建监听滚动视图的滚动减速事件的代理方法 113 func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) { 114 //重置标识变量的默认值,然后打开应用代理文件 115 isPageControlUsed = false 116 } 117 118 override func didReceiveMemoryWarning() { 119 super.didReceiveMemoryWarning() 120 // Dispose of any resources that can be recreated. 121 } 122 }
然后打开应用代理文件
1 import UIKit 2 3 @UIApplicationMain 4 class AppDelegate: UIResponder, UIApplicationDelegate { 5 6 var window: UIWindow? 7 8 9 func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { 10 // Override point for customization after application launch. 11 //在应用启动完成的代理方法中,创建程序的入口 12 //创建滚动视图控制器的实例 13 let vc = PageControlViewController() 14 //然后把滚动视图控制器的实例, 15 //作为当前窗口的根视图控制器 16 self.window?.rootViewController = vc 17 return true 18 } 19 20 func applicationWillResignActive(_ application: UIApplication) { 21 // Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state. 22 // Use this method to pause ongoing tasks, disable timers, and throttle down OpenGL ES frame rates. Games should use this method to pause the game. 23 } 24 25 func applicationDidEnterBackground(_ application: UIApplication) { 26 // Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later. 27 // If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits. 28 } 29 30 func applicationWillEnterForeground(_ application: UIApplication) { 31 // Called as part of the transition from the background to the inactive state; here you can undo many of the changes made on entering the background. 32 } 33 34 func applicationDidBecomeActive(_ application: UIApplication) { 35 // Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface. 36 } 37 38 func applicationWillTerminate(_ application: UIApplication) { 39 // Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:. 40 } 41 }