UIPageControl not visible in iOS 14

Question

I have a UIPageControl that has worked fine in my production app for the last 6 months. However, after updating all my test devices to iOS 14 and updating Xcode to v12, my UIPageControl I have in a tableView cell is no longer visible.

I have changed nothing in my code, this just occurred spontaneously due to the software update. I understand Apple has changed the view hierarchy of UITableView and has also modified page controls. Does anyone have any idea why this page control is positioned correctly yet remains invisible?

Page control is in view hierarchy yet it is not visible

score 15 · Accepted Answer · answered Oct 01 '20 at 09:34

15

if UIPageControl not visible in iOS 14 then simply add a width constraint and assign relation "greater that or equal" or make increase width of UIPageControl.

answered Oct 01 '20 at 09:34

Harendra Tiwari

460
5
11

score 8 · Answer 2 · answered Feb 23 '21 at 12:40

UIPageControl works a little differently in iOS 14. It might be surprising that it does not show anything if the width is too small.

import UIKit

class ViewController: UIViewController {
    
    lazy var label: UILabel = UILabel()
    var widthConstraint: NSLayoutConstraint!

    override func viewDidLoad() {
        super.viewDidLoad()

        let pageControl = UIPageControl()
        pageControl.numberOfPages = 10
        pageControl.currentPage = 3
        pageControl.pageIndicatorTintColor = .red
        pageControl.currentPageIndicatorTintColor = .green
        pageControl.layer.borderWidth = 1
        pageControl.layer.borderColor = UIColor.purple.cgColor
        widthConstraint = pageControl.widthAnchor.constraint(equalToConstant: 100)
        widthConstraint.isActive = true
        
        let slider = UISlider()
        slider.minimumValue = 0
        slider.maximumValue = 300
        slider.value = 100
        slider.widthAnchor.constraint(equalToConstant: 200).isActive = true
        slider.addTarget(self, action: #selector(sliderValueDidChange(_:)), for: .valueChanged)
        
        let stackView = UIStackView(arrangedSubviews: [label, pageControl, slider])
        stackView.axis = .vertical
        stackView.alignment = .center
        stackView.spacing = 40
        
        view.addSubview(stackView)
        stackView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            stackView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            stackView.widthAnchor.constraint(equalTo: view.widthAnchor)
        ])
        
        updateLabel()
    }


    @objc
    func sliderValueDidChange(_ sender: Any?) {
        guard let slider = sender as? UISlider else { return }
        widthConstraint.constant = CGFloat(slider.value)
        updateLabel()
    }
    
    func updateLabel() {
        if #available(iOS 14.0, *) {
            label.text = "iOS 14 PageControl width: \(widthConstraint.constant.rounded())"
        } else {
            label.text = "iOS 13 PageControl width: \(widthConstraint.constant.rounded())"
        }
    }
}

Leo.J · Answer 3 · 2020-11-27T05:52:15.357

7

I have same issue, When UIPageControl's width is short, such as 80pt, I set pageControl.backgroundStyle = .minimal in iOS 14 or later. It works for me.

edited Nov 27 '20 at 05:52

answered Nov 27 '20 at 05:44

Leo.J

317
1
3
10

score 3 · Answer 4 · answered Sep 25 '20 at 06:15

After trying a lot, only thing work for me is just to increase the width of the UIPageControl by adding it constarints. It works fine for me.

Also there are some new features added in pagecontrol for ios14. You can refer this link: https://medium.com/better-programming/take-a-look-at-ios-14s-new-uipagecontrol-3207a10212b9

score 0 · Answer 5 · edited Sep 24 '20 at 11:37

0

I myself was being bugged by this issue recently and after spending many hours and trying different methods I could make it work by simply replacing the current UIPageController in Storyboard by new UIPageController.

edited Sep 24 '20 at 11:37

Dharman

30,962
25
85
135

answered Sep 24 '20 at 11:31

g4genuis

45
1
1
11

score 0 · Answer 6 · answered Oct 30 '20 at 06:53

0

Try below one of the things to sort out :

Increase width & height by double or triple.
Add Constraint to the page view controller.
Add page control in Storyboard or XIB. It will be very easy than above 2 point.

answered Oct 30 '20 at 06:53

Manish

608
1
11
23

score -1 · Answer 7 · answered Sep 29 '20 at 06:27

-1

iOS 14 can not set dot border, because UIPageControl subview is not page dot. You can change dot color on storyboard or xib, but you can not change dot border.

answered Sep 29 '20 at 06:27

Jam

101
4

UIPageControl not visible in iOS 14

7 Answers7

Linked