How do I implement UIPageControl in Swift

Question

Ok so I'm struggling here and haven't been able to find a working solution. I've been self learning Swift without Objective C experience (I know, I know).

In my app, I have my main UIViewController, a subview that is transparent but slides in from the bottom of the screen, and then 4 subviews of the sliding subview that are all working UIScrollViews. I have paging enabled and it works great but I'd like to add a UIPageControl for each of them. I seriously can't grasp delegates and how to implement the using swift. Any help would be much appreciated!

Also, I'm doing this all programmatically, so no IB please. Happy to provide code if it'll help. Thanks

Answer 1

Just setup it in code like this:

private var pageControl = UIPageControl(frame: .zero)

private func setupPageControl() {

    pageControl.numberOfPages = controllers.count
    pageControl.translatesAutoresizingMaskIntoConstraints = false
    pageControl.currentPageIndicatorTintColor = UIColor.orange
    pageControl.pageIndicatorTintColor = UIColor.lightGray.withAlphaComponent(0.8)

    let leading = NSLayoutConstraint(item: pageControl, attribute: .leading, relatedBy: .equal, toItem: view, attribute: .leading, multiplier: 1, constant: 0)
    let trailing = NSLayoutConstraint(item: pageControl, attribute: .trailing, relatedBy: .equal, toItem: view, attribute: .trailing, multiplier: 1, constant: 0)
    let bottom = NSLayoutConstraint(item: pageControl, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: 0)

    view.insertSubview(pageControl, at: 0)
    view.bringSubview(toFront: pageControl)
    view.addConstraints([leading, trailing, bottom])
}

Answer 2

Delegates are just methods of a class, that can be palmed off to another class. These methods are usually callbacks.

e.g. A callback for a TextField, when the user hits return, can be implemented in a Delegate. The delegate can be implemented in the ViewController class.

Now when the user hits return the TextField Object will call the delegate method in the ViewController object. The great thing about this is, you can access all the variables and methods of the ViewController object from the delegated method. Otherwise you would need a handle to the ViewController object within the TextField object itself.

Delegates are implemented as protocols, which are just interfaces. So if the ViewController implements the TextFieldDelegate protocol, all your textfield callbacks can be called from within the ViewController object.

I hope this helps.

Answer 3

I think you and/or anyone else looking for how to do this will find this answer helpful. The code example enabled me to create a page control indicator on my scrollView, and it was the first time attempting to do this. I found it very clear.

The lines you probably need to add to your project are:

1: add UIScrollViewDelegate as a protocol when you first name your view controller class.

2: in the class declaration create a pageControl variable. You will need to play with the frame numbers to get it to appear where you want it. the current numbers made one in the middle of the window for me. For reference the numbers mean (x position for top left corner of indicator, y coordinate for top left corner, width of page indicator, height of page indicator)

var pageControl : UIPageControl = UIPageControl(frame: CGRectMake(50, 300, 200, 20))

3. in viewDidLoad set the scrollView delegate and call `configurePageControl():

   override func viewDidLoad() {
       super.viewDidLoad()
   
       scrollView.delegate = self
   
       configurePageControl()
   }
   

4. you need to add two methods after viewDidLoad. one is called in viewDidLoad

   func configurePageControl() {
        self.pageControl.numberOfPages = <some reference to the number of pages>
        self.pageControl.currentPage = 0
        self.pageControl.tintColor = UIColor.redColor()
        self.pageControl.pageIndicatorTintColor = UIColor.blackColor()
        self.pageControl.currentPageIndicatorTintColor = UIColor.greenColor()     
        self.view.addSubview(pageControl)
    }
   

   and

    func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
       let pageNumber = round(scrollView.contentOffset.x / scrollView.frame.size.width)
       pageControl.currentPage = Int(pageNumber)
   }
   

The scrollView delegate is actually very simple to set up. Add UIScollViewDelegate as a protocol that your ViewController class will implement by adding it after the class declaration: class YourClassName: UIScrollViewDelegate. And then in viewDidLoad(), you complete the delegate setup by assigning the scroll view's delegate property to your class with the line scrollView.delegate = self. (again see the example I linked for if you need further clarification of where these commands go)

Answer 4

UIPageControl Integration using Swift 4

func configurePageControl() {
    self.pageview.numberOfPages = items.count
    self.pageview.currentPage = 0
    self.pageview.tintColor = UIColor.red
    self.pageview.pageIndicatorTintColor = UIColor.black
    self.pageview.currentPageIndicatorTintColor = UIColor.green
}