How do I make the bottom bar with dots of a UIPageViewController translucent?

Question

I\'m in the process of making a tutorial, and I\'m trying to emulate the style of Path\'s tutorial like so:

http://www.appcoda.com/wp-content/uploads/2013/06/UIPageV

Answer 1

Swift 5.2

you can use this code for your requirment

 override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    if let myScrollView = view.subviews.filter({ $0 is UIScrollView }).first,
        let myPageControl = view.subviews.filter({ $0 is UIPageControl }).first {
        myScrollView.frame = view.bounds
        view.bringSubviewToFront(myPageControl)
    }
}

Answer 2

Small hack I found today..

Please see the code below.

self.pageController.dataSource = self;
    CGRect rect = [self.view bounds];
    rect.size.height+=37;
    [[self.pageController view] setFrame:rect];
        NSArray *subviews = self.pageController.view.subviews;
        UIPageControl *thisControl = nil;
        for (int i=0; i<[subviews count]; i++) {
            if ([[subviews objectAtIndex:i] isKindOfClass:[UIPageControl class]]) {
                thisControl = (UIPageControl *)[subviews objectAtIndex:i];
            }
        }

        UIView *tempview = [[UIView alloc] initWithFrame:CGRectMake(0, -30, 320, 40)];
        [tempview addSubview:thisControl];
        thisControl.pageIndicatorTintColor = [UIColor lightGrayColor];
        thisControl.currentPageIndicatorTintColor = [UIColor greenColor];
        [self.view addSubview:tempview];

Answer 3

I don't think you can change the behavior of UIPageViewController, so it seems likely that the Path app uses its own view controller. You can do the same: create your own container view controller that uses a UIPageControl to indicate the current page.

Answer 4

Here's a conversion of Zerotool's solution into Swift 2.1, though there's probably a more elegant way to write it:

override func viewDidLayoutSubviews() {
    var scrollView: UIScrollView?
    var pageControl: UIPageControl?

    // If you add any custom subviews, you will want to remove this check.
    if (self.view.subviews.count == 2) {
        for view in self.view.subviews {
            if (view.isKindOfClass(UIScrollView)) {
                scrollView = view as? UIScrollView
            } else if (view.isKindOfClass(UIPageControl)) {
                pageControl = view as? UIPageControl
            }
        }
    }

    if let scrollView = scrollView {
        if let pageControl = pageControl {
            scrollView.frame = self.view.bounds
            self.view.bringSubviewToFront(pageControl)
        }
    }

    super.viewDidLayoutSubviews()
}

Answer 5

You can simply adjust the alpha of the UIPageViewController's UIPageControl.

First, you should retrieve it from the UIPageViewController like so:

- (UIPageControl *)getPageControlForPageViewController:(UIPageViewController *)pageViewController {
      for (UIView *subview in self.pageViewController.view.subviews) {
        if ([subview isKindOfClass:[UIPageControl class]]) {
          return (UIPageControl *) subview;
        }
      }

      return nil;
    }

Next, make use of the function. I've made a property on my ViewController called childPageControl. Give it the UIPageViewController's UIPageControl:

self.childPageControl = [self getPageControlForPageViewController:self.pageViewController];

Next, you can adjust the alpha to give a translucent effect:

self.childPageControl.alpha = .5;

You're very limited in what you can do to affect the UIPageViewController's UIPageControl, but you can at least achieve this with little effort.

Answer 6

I wanted to do a similar effect in the app I was working on - I used a UIPageViewController with a separate UIPageControl.

This lets you place the UIPageControl anywhere you'd like in the view, including over the top of the UIPageViewController, and you keep its active page dot up to date via the UIPageViewController delegate method:

- (void)pageViewController:(UIPageViewController *)pageViewController
        didFinishAnimating:(BOOL)finished
   previousViewControllers:(NSArray<UIViewController *> *)previousViewControllers
       transitionCompleted:(BOOL)completed {
    if (completed) {
        self.pageControl.currentPage = [self.pageViewControllers indexOfObject:pageViewController.viewControllers.firstObject];
    }
}

No need to traverse the subview hierarchy trying to find the internal UIPageViewController page control, nor having to resize the contents of the internal scrollview.

Hope this helps.