how to customize pageview indicators in ios

Question

I want to show page indicator in following way in my view controller.for visited page I want to show green color tick mark\image.

Answer 1

Create a custom class for UIPageControl, let's name it 'customPageContoller':

CustomPageContoller.h:

@interface CustomPageContoller : UIPageControl
{
    UIImage* activeImage;
    UIImage* inactiveImage;
}

CustomPageContoller.m file :

@implementation CustomPageContoller

-(id) initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];

    activeImage = [UIImage imageNamed:@"active_page_image.png"] ;
    inactiveImage = [UIImage imageNamed:@"inactive_page_image.png"] ;

    return self;
}

-(void) updateDots
{
    for (int i = 0; i < [self.subviews count]; i++)
    {
        UIImageView * dot = [self imageViewForSubview:  [self.subviews objectAtIndex: i]];
        if (i == self.currentPage) dot.image = activeImage;
        else dot.image = inactiveImage;
    }
}

- (UIImageView *) imageViewForSubview: (UIView *) view
{
    UIImageView * dot = nil;
    if ([view isKindOfClass: [UIView class]])
    {
        for (UIView* subview in view.subviews)
        {
            if ([subview isKindOfClass:[UIImageView class]])
            {
                dot = (UIImageView *)subview;
                break;
            }
        }
        if (dot == nil)
        {
            dot = [[UIImageView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, view.frame.size.width, view.frame.size.height)];
            [view addSubview:dot];
        }
    }
    else
    {
        dot = (UIImageView *) view;
    }

    return dot;
}

-(void) setCurrentPage:(NSInteger)page
{
    [super setCurrentPage:page];
    [self updateDots];
}

Now Your View controller where you want custom Page Controller:

ViewController.m file:

#import "CustomPageContoller.h"

@interface PullRefreshViewController : UIViewController{
    IBOutlet CustomPageContoller *PageIndicator;
}

Now add an action for UIPageControl:

ViewController.m file:

-(IBAction) pageChanged:(id)sender
{
    NSInteger page = PageIndicator.currentPage;

    // update the scroll view to the appropriate page
    CGRect frame = ImagesScroller.frame;
    frame.origin.x = frame.size.width * page;
    frame.origin.y = 0;
    [ImagesScroller scrollRectToVisible:frame animated:YES];
}

In the ViewController interface builder set custom class of UIPageControl to CustomPageContoller. And make IBOutlet Connection with your custom UIPageControl i.e. PageIndicator.

Don't forget to add active_page_image.png and Inactive_page_image.png to your project.

P.S - Credits to JWD And iProgrammer