How to change UIPageControl dots [duplicate]

Question

This question already has answers here:

How can I change the color of pagination dots of UIPageControl? (17 answers)

Is there a way to change page indicator dots color (10 answers)

Closed 6 years ago.

I've seen apps (e.g. meebo) that have different indicators on UIPageControls instead of the default white circles.

is there an easy way to do this? I've read the docs for UIPageControls and it seems that there is no methods to replace the images.

Answer 1

You can achieve this by making the following steps:

1- Create a custom class that inherits from UIPageControl.

2- Assign this class to the required UIPageControl that you want to change its dots.

3- Put the following code inside your custom UIPageControl class.

Put this in the customClass.m file:

-(id)initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];
    if(self)
    {
        activeImage = [UIImage imageNamed:@"active_dot.png"];
        inactiveImage = [UIImage imageNamed:@"inactive_dot.png"];
    }
    return self;
}

-(void)updateDots
{
    for (int i = 0; i < [self.subviews count]; i++)
    {
        UIImageView* dot = [self.subviews objectAtIndex:i];
        dot.frame = CGRectMake(dot.frame.origin.x, dot.frame.origin.y, 14, 14.5);
        if (i == self.currentPage)
            dot.image = activeImage;
        else
            dot.image = inactiveImage;
    }
}

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

Put this in the customClass.h file

{
    UIImage* activeImage;
    UIImage* inactiveImage;
}
@property(nonatomic, retain) UIImage* activeImage;
@property(nonatomic, retain) UIImage* inactiveImage;

5- Just set the current page of your UIPageControl in the class that you put the page control inside it using the following line:

[self.pageControl setCurrentPage:number];

remember to set the current page in the viewDidLoad() method in the view of that UIPageControl is inside it.

When the view loaded the UIPageControl images will be set.

Answer 2

There is not public API to change the images. You can take a look at this blog post, that describes a method to customize the UIPageControl.