A walkthrough is the process of intentionally revealing functionality to a user.
While some people argue that a user should be able to figure out how an app works just by looking at it, walkthroughs are becoming an increasingly popular user experience strategy as apps become more complex. We show the inside screens of the App in Walkthrough.
We can design walkthrough with ScrollView, CollectionView, UIPageViewController etc. We found that UIPageViewController is best for this, so we implemented it with UIPageViewController.
Let WalkthroughVC is the view controller that holds the design of walkthrough, and HomeVC is the view controller in which we will show walkthrough.
We can customize WalkthroughVC as per requirement.
These are the steps to implement walkthrough in Swift 3.0:
- HomeVC must conform the protocol UIPageViewControllerDataSource and UIPageViewControllerDelegate
- Create and instantiate UIPageViewController instance –
private func initializeWalkThrough() {
//transition style can be pageCurl and scroll
let pageController = UIPageViewController.init(transitionStyle: .scroll, navigationOrientation: .horizontal, options: nil)
pageController.delegate = self
pageController.dataSource = self
var frame:CGRect = self.view.bounds
frame.size.height = UIScreen.main.bounds.size.height – 100 // WalkThrough will cover this height”
pageController.view.frame = frame
let walkThroughVC:WalkThroughVC = self.viewControllerAtIndex(index: 0)
let viewControllers:[WalkThroughVC] = [walkThroughVC]
pageController.setViewControllers(viewControllers, direction: .forward, animated: false, completion: nil)
self.addChildViewController(pageController)
self.view.addSubview(pageController.view)
self.pageControl.numberOfPages = walkThroughVC.pageArray.count
self.view .bringSubview(toFront: self.pageControl)
}
private func viewControllerAtIndex(index:Int) -> WalkThroughVC {
let childVC = storyboard?.instantiateViewController(withIdentifier: WalkThrough_Identifier) as! WalkThroughVC
childVC.pageIndex = index
return childVC
}
3. Define DataSource methods of UIPageViewController
func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController: UIViewController) -> UIViewController? {
let walkThroughVC = viewController as? WalkThroughVC
var index = walkThroughVC?.pageIndex
if index == 0 {
return nil
}
index = index! – 1
return self.viewControllerAtIndex(index: index!)
}
func pageViewController(_ pageViewController: UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {
let walkThroughVC = viewController as? WalkThroughVC
var index = walkThroughVC?.pageIndex
let pageCount = walkThroughVC?.pageArray.count
index = index! + 1
if index == pageCount {
return nil
}
return self.viewControllerAtIndex(index: index!)
}
4. Define Delegate method of UIPageViewController to update the PageControl
func pageViewController(_ pageViewController: UIPageViewController, didFinishAnimating finished: Bool, previousViewControllers: [UIViewController], transitionCompleted completed: Bool) {
if !completed {
return
}
let childVC = pageViewController.viewControllers?.last as? WalkThroughVC
self.pageControl.currentPage = (childVC?.pageIndex)!
}
Note : You can download sample project on Walkthrough implementation in Swift 3.0 from here.