UIPageViewController that has UIPageControl with different dot colours

 Customise page control

  1. Create page control subclassing UIView
  2. Draw the coloured dots in - (void) drawRect:(CGRect) rect
  3. Control the touch events using - (void) touchesBegan:(NSSet *) touches withEvent:(UIEvent *) event
  4. Inform page view controller when user touch it using delegation.

Customise page view controller

  1. Override - (void) viewDidLayoutSubviews and search all the subviews and find the UIPageControl instance.
  2. Hide the UIPageControl instance and add the custom page control instance to its superview.
  3. Set the UIPageControl instance frame to custom page control.
  4. Bring the custom page control using [self.view bringSubviewToFront:pageControl];
  5. When custom page control informs you about the user touch then call the method - (void)setViewControllers:(nullable NSArray *)viewControllers direction:(UIPageViewControllerNavigationDirection)direction animated:(BOOL)animated completion:(void (^ __nullable)(BOOL finished))completion; to move to right or left page.

Page view controller delegate

  1. Update custom control page dots/index using
    - (void) pageViewController:(COPageViewController *)pageViewController didFinishAnimating:(BOOL)finished previousViewControllers:(NSArray *) previousViewControllers transitionCompleted:(BOOL) completed
  2. This method - (void) pageViewController:(COPageViewController *)pageViewController willTransitionToViewControllers:(NSArray *) pendingViewControllers will start when user swipes the page. What I did is maintained a variable that tells whether the page is still in transition, based on that I will allow the user interaction with custom page control.

 

Advertisements

One Response to “UIPageViewController that has UIPageControl with different dot colours”

  1. Alex Says:

    Wow, wonderful weblog format! How long have you ever been blogging for? you make blogging look easy. The whole look of your web site is wonderful, as smartly as the content material!


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s

%d bloggers like this: