ios 我们可以在 UIPageViewController 中自定义页面指示器吗？

Can we customize the page indicator in UIPageViewController?

提问by Septiadi Agus

Now it's white dots with black background. What about if I want it to be black dots with white backgrounds?

现在它是黑​​色背景的白点。如果我希望它是白色背景的黑点怎么办？

- (NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageViewController NS_AVAILABLE_IOS(6_0)
{
    return _imageArrays.count;
}// The number of items reflected in the page indicator.
- (NSInteger)presentationIndexForPageViewController:(UIPageViewController *)pageViewController NS_AVAILABLE_IOS(6_0)
{
    return self.intCurrentIndex;
}// The selected item reflected in the page indicator.

采纳答案by sirvine

I don't believe that you can manipulate the UIPageViewController's page control. My solution:

我不相信你可以操纵 UIPageViewController 的页面控件。我的解决方案：

I have a "root" UIViewController that is UIPageViewControllerDelegate and UIPageViewControllerDataSource.

我有一个“根” UIViewController，即 UIPageViewControllerDelegate 和 UIPageViewControllerDataSource。

On this root view controller, I have @property (strong, nonatomic) IBOutlet UIPageControl *pageControl. In the corresponding storyboard nib, I add a UIPageControl, position it, and check "Hides for Single Page". I can also change the colors, if I wish.

在这个根视图控制器上，我有@property (strong, nonatomic) IBOutlet UIPageControl *pageControl. 在相应的故事板笔尖中，我添加了一个 UIPageControl，定位它，然后选中“隐藏单页”。如果我愿意，我也可以更改颜色。

Then, I add the following in the root view controller's viewDidLoad: self.pageControl.numberOfPages = [self.features count]

然后，我在根视图控制器的 viewDidLoad 中添加以下内容： self.pageControl.numberOfPages = [self.features count]

My root view controller also has @property (strong, nonatomic) UIPageViewController *pageViewController. And in the implementation:

我的根视图控制器也有@property (strong, nonatomic) UIPageViewController *pageViewController. 在实施中：

self.pageViewController = [[UIPageViewController alloc]
          initWithTransitionStyle:UIPageViewControllerTransitionStyleScroll 
            navigationOrientation:UIPageViewControllerNavigationOrientationHorizontal 
                          options:nil];


self.pageViewController.delegate = self;
DataViewController *startingViewController = [self viewControllerAtIndex:0 storyboard:self.storyboard];
NSArray *viewControllers = @[startingViewController];
[self.pageViewController setViewControllers:viewControllers
                                  direction:UIPageViewControllerNavigationDirectionForward
                                   animated:NO
                                 completion:NULL];
self.pageViewController.dataSource = self;      
[self addChildViewController:self.pageViewController];
[self.view addSubview:self.pageViewController.view];
self.pageViewController.view.frame = CGRectMake(0.0, 0.0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height + 10.0);
[self.pageViewController didMoveToParentViewController:self];
self.view.gestureRecognizers = self.pageViewController.gestureRecognizers;

(SIDE NOTE: That line that sets the frame makes the height of the UIPageViewController's view exceed the screen size so that the native page control is no longer visible. My app is portrait only, iPhone only, so I got off a bit easy here. If you need to handle rotations, you'll have to find a way to keep that native page control offscreen. I tried using auto layout, but UIPageViewController creates a set of magic views that have a bunch of autolayout mask constraints that I couldn't find a way to override.)

（边注：设置框架的那条线使 UIPageViewController 的视图的高度超过了屏幕尺寸，因此本机页面控件不再可见。我的应用程序仅限纵向，仅限 iPhone，所以我在这里下车有点容易。如果您需要处理旋转，则必须找到一种方法来使本机页面控件保持在屏幕外。我尝试使用自动布局，但 UIPageViewController 创建了一组魔术视图，这些视图具有一堆我无法做到的自动布局掩码约束找到覆盖的方法。）

Anyway...then I add an extra UIPageViewController delegate method to change my new, non-native UIPageControl to the currently-selected page:

无论如何......然后我添加了一个额外的 UIPageViewController 委托方法来将我的新的非本地 UIPageControl 更改为当前选择的页面：

- (void)pageViewController:(UIPageViewController *)viewController didFinishAnimating:(BOOL)finished previousViewControllers:(NSArray *)previousViewControllers transitionCompleted:(BOOL)completed
{
  if (!completed){return;}

  // Find index of current page
  DataViewController *currentViewController = (DataViewController *)[self.pageViewController.viewControllers lastObject];
  NSUInteger indexOfCurrentPage = [self indexOfViewController:currentViewController];
  self.pageControl.currentPage = indexOfCurrentPage;
}

Not as pretty as I would like, but Apple's API for this class doesn't exactly lend itself to elegance.

不像我想要的那么漂亮，但 Apple 为此类提供的 API 并不完全适合优雅。

回答by Yas T.

You can use UIAppearanceto change the color of UIPageControl. Try this in your AppDelegate's didFinishLaunchingWithOptionsfunction.

您可以使用UIAppearance来更改 UIPageControl 的颜色。在您的 AppDelegatedidFinishLaunchingWithOptions函数中试试这个。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    UIPageControl *pageControl = [UIPageControl appearance];
    pageControl.pageIndicatorTintColor = [UIColor lightGrayColor];
    pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
    pageControl.backgroundColor = [UIColor blueColor];

    return YES;
}

EDIT:

编辑：

To apply style only to a particular view controller, use appearanceWhenContainedIninstead, as following:

要将样式仅应用于特定的视图控制器，请appearanceWhenContainedIn改为使用，如下所示：

UIPageControl *pageControl = [UIPageControl appearanceWhenContainedIn:[MyViewController class], nil];

Now, only UIPageControlobjects contained in the MyViewControllerare going to adapt this style.

现在，只有UIPageControl包含在 中的对象MyViewController才会适应这种风格。

Thanks Mike & Shingoo!

谢谢迈克和新高！

EDIT:If you see black background around UIPageControlat the bottom of your screen, it is due to the background color of your UIPageViewControllernot UIPageControl. You can change this color as following:

编辑：如果您UIPageControl在屏幕底部看到黑色背景，这是由于您的UIPageViewControllernot的背景颜色UIPageControl。您可以按如下方式更改此颜色：

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor blueColor]; //Set it to whatever you like
}

回答by Yariv Nissim

You can actually grab it and store it locally in your own property in one of the delegate calls.

您实际上可以在委托调用之一中获取它并将其本地存储在您自己的属性中。

Put this code inside your delegate to access the UIPageControl inside the UIPageViewController:

将此代码放在您的委托中以访问 UIPageViewController 中的 UIPageControl：

- (NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageViewController
{
    [self setupPageControlAppearance];
    return kPageCount;
}

- (void)setupPageControlAppearance
{
    UIPageControl * pageControl = [[self.view.subviews filteredArrayUsingPredicate:[NSPredicate predicateWithFormat:@"(class = %@)", [UIPageControl class]]] lastObject];
    pageControl.pageIndicatorTintColor = [UIColor grayColor];
    pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
}

回答by CyberKid

You can recursively search it in your subviews

您可以在子视图中递归搜索它

- (void)findAndConfigurePageControlInView:(UIView *)view
{
    for (UIView *subview in view.subviews) {
        if ([subview isKindOfClass:[UIPageControl class]]) {
            UIPageControl * pageControl = (UIPageControl *)subview;
            //customize here
            pageControl.hidesForSinglePage = YES;
            break;
        } else {
            [self findAndConfigurePageControlInView:subview];
        }
    }
}

- (NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageViewController
{
    [self findAndConfigurePageControlInView:self.view];
    return self.promotionsVCs.count;
}

it works for me

这个对我有用

回答by Shingoo

UIPageControl *pageControl = [UIPageControl appearanceWhenContainedIn:[MyViewController class], nil];
pageControl.pageIndicatorTintColor = [UIColor whiteColor];
pageControl.currentPageIndicatorTintColor = [UIColor redColor];
pageControl.backgroundColor = [UIColor blackColor];

This will change the appearance just for "MyViewController". If you want to have different colors in different page indicators on the same view you have to create different subviews and customize them individually.

这将改变“MyViewController”的外观。如果你想在同一个视图的不同页面指示器中有不同的颜色，你必须创建不同的子视图并单独自定义它们。

回答by Zeezer

It is possible to customise it through appearance. You can do it in AppDelegate like this.

可以通过外观对其进行自定义。你可以像这样在 AppDelegate 中做到这一点。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
   UIPageControl *pageControl = [UIPageControl appearance];
   pageControl.pageIndicatorTintColor = [UIColor whiteColor];
   pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
   pageControl.backgroundColor = [UIColor lightGrayColor];

   return YES;
}

If you want to do it just for a certain view controller, replace the pageControl with this instead.

如果您只想为某个视图控制器执行此操作，请将 pageControl 替换为 this。

UIPageControl *pageControl = [UIPageControl appearanceWhenContainedIn:[MyViewController class], nil];

回答by Heckscheibe

If you use the "auto generated" page indicator created by UIPageViewController, I think that you can't customize it. The only way you could do that is to add an extra PageControl, either the one provided by Apple or a custom one as @Maschel proposed.

如果使用 UIPageViewController 创建的“自动生成”页面指示器，我认为您无法自定义它。您可以这样做的唯一方法是添加一个额外的 PageControl，要么是 Apple 提供的，要么是@Maschel 建议的自定义。

回答by Gurumoorthy Arumugam

This one working perfectly for custom image

这个非常适合自定义图像

self.pageControl.pageIndicatorTintColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"page_indicater"]];

self.pageControl.currentPageIndicatorTintColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"page_indicater_selection"]];

回答by wsgeorge

Here's what I did in Swift 4. I tried similar answers first, in viewDidLoad, but this is what eventually worked. This same snippet was used to answer similar SO questions.

这是我在 Swift 4 中所做的。我首先在 中尝试了类似的答案viewDidLoad，但这最终奏效了。这个相同的片段用于回答类似的 SO 问题。

    override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    for view in self.view.subviews{
        if view is UIPageControl{
            (view as! UIPageControl).currentPageIndicatorTintColor = .yellow
            }
        }
    }

Once you have the UIPageControl in this block, you should be able to customize its indicator colours

在此块中拥有 UIPageControl 后，您应该能够自定义其指示器颜色

回答by boliva

You can easily access the UIPageViewController's pageControlby defining a computed property like this:

您可以通过定义这样的计算属性轻松访问UIPageViewController's pageControl：

var pageControl: UIPageControl? {
    for subview in view.subviews {
        if let pageControl = subview as? UIPageControl {
            return pageControl
        }
    }
    return nil
}

And then customize it to suite your needs like this:

然后自定义它以满足您的需求，如下所示：

override func viewDidLoad() {
    super.viewDidLoad()
    pageControl?.backgroundColor = .white
    pageControl?.pageIndicatorTintColor = .red
    pageControl?.currentPageIndicatorTintColor = .blue
}

Obvious caveat: if Apple ever decides to change the UIPageViewControllerview hierarchy this will stop working.

明显的警告：如果 Apple 决定更改UIPageViewController视图层次结构，这将停止工作。