如何将UIPageViewController的分页控件设置在顶部？

我之前也碰到过这个问题，系统自带的UIPageControl确实没法直接调整位置，所以咱们得换个思路：隐藏系统默认的分页控件，自己实现一个自定义的UIPageControl放到顶部，再把它和UIPageViewController的页面切换逻辑绑定起来。具体步骤如下：

1. 先隐藏系统自带的分页控件 #

在viewDidLoad里先把系统默认的分页控件关掉，避免和自定义控件冲突：

override func viewDidLoad() {
    super.viewDidLoad()
    dataSource = self
    delegate = self
    
    // 关键操作：关闭系统自带分页控件的显示
    self.definesPresentationContext = false
    
    // 也可以用遍历子视图的方式隐藏（备选方案）
    // for subview in self.view.subviews {
    //     if let systemPageControl = subview as? UIPageControl {
    //         systemPageControl.isHidden = true
    //     }
    // }
}

2. 配置自定义UIPageControl并放到顶部 #

你已经声明了pageControl变量，接下来完善它的布局，把它固定到屏幕顶部（适配安全区和导航栏）：

class ProfilePageViewController: UIPageViewController, UIPageViewControllerDelegate, UIPageViewControllerDataSource {
    // 自定义分页控件
    var pageControl = UIPageControl(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 30))
    
    override func viewDidLoad() {
        super.viewDidLoad()
        dataSource = self
        delegate = self
        
        // 配置分页控件样式
        pageControl.numberOfPages = 3 // 替换成你实际的页面总数
        pageControl.currentPage = 0
        pageControl.tintColor = .lightGray
        pageControl.currentPageIndicatorTintColor = .systemBlue
        pageControl.hidesForSinglePage = true
        
        // 设置顶部位置：适配导航栏+安全区
        let topSafeInset = UIApplication.shared.windows.first?.safeAreaInsets.top ?? 0
        let navBarHeight = navigationController?.navigationBar.frame.height ?? 0
        pageControl.frame.origin.y = navBarHeight + topSafeInset
        
        // 添加到视图层级
        self.view.addSubview(pageControl)
        
        // 隐藏系统分页控件
        self.definesPresentationContext = false
    }
    
    // ... 你的其他数据源方法（比如viewControllerBefore/After）
}

3. 关联页面切换和自定义控件的页码更新 #

实现UIPageViewControllerDelegate的方法，当页面切换完成时，同步更新自定义分页控件的当前页码：

func pageViewController(_ pageViewController: UIPageViewController, didFinishAnimating finished: Bool, previousViewControllers: [UIViewController], transitionCompleted completed: Bool) {
    guard completed, let currentVC = pageViewController.viewControllers?.first else { return }
    // 这里替换成你获取当前页面索引的逻辑（比如从你的页面数组中查找位置）
    let currentIndex = yourPageViewControllerArray.firstIndex(of: currentVC) ?? 0
    pageControl.currentPage = currentIndex
}

4. 处理分页控件的点击跳转 #

给自定义的pageControl添加点击事件，让用户点击页码时能直接跳转到对应页面：

override func viewDidLoad() {
    super.viewDidLoad()
    // ... 之前的代码
    
    // 添加点击事件监听
    pageControl.addTarget(self, action: #selector(pageControlTapped(_:)), for: .valueChanged)
}

@objc func pageControlTapped(_ sender: UIPageControl) {
    let targetIndex = sender.currentPage
    // 获取目标页面的视图控制器（从你的页面数组中取）
    guard let targetVC = yourPageViewControllerArray[safe: targetIndex] else { return }
    // 切换页面，判断滑动方向
    let direction: UIPageViewController.NavigationDirection = targetIndex > pageControl.currentPage ? .forward : .reverse
    self.setViewControllers([targetVC], direction: direction, animated: true, completion: nil)
}

小提示 #

如果你的项目用Auto Layout而不是frame布局，更推荐给pageControl添加约束：比如顶部对齐安全区顶部（或导航栏底部）、左右对齐父视图、高度固定30，这样适配不同屏幕会更稳定。

内容的提问来源于stack exchange，提问作者madhatter989