iOS自定义UIPageControl

3,716 阅读4分钟

写在前面

我就知道会有这一天,之前因为公司的APP弹窗的种类太多,不得不自己写一个弹窗类,为每一个弹窗类型设定一个类。现在也是因为分页符的类型太多,不得不自定义。网上的都不符合自己的需求,所以自己写了一个,贴出来,如果写的不好希望大家能给修改意见。

代码

.h文件


#import <UIKit/UIKit.h>

typedef enum : NSInteger{
    //自定义pagecontrol的类型
    NKPageControlStyleA,
    NKPageControlStyleB,
}NKPageControlStyle;

@interface NKPageControl : UIPageControl

- (instancetype)initWithStyle:(NKPageControlStyle)pageControlStyle;


@end


.m文件


#import "NKPageControl.h"

@interface NKPageControl ()

@property (nonatomic, assign) NKPageControlStyle style;

@end

@implementation NKPageControl

-(instancetype) initWithStyle:(NKPageControlStyle)pageControlStyle
{
    self = [super init];
    
    //在这里获取到创建pageControl的种类
    _style = pageControlStyle;
    
    return self;
}

-(void) updateDots
{
    if (_style == NKPageControlStyleA)
    {
        //循环获取每一个小圆点(小圆点的类型是UIView)
        for (int i = 0; i < self.subviews.count; i++)
        {
            if (i == 0)
            {
                //获取到一个小圆点
                UIView *dot = [self.subviews objectAtIndex:i];
                dot.backgroundColor = [UIColor clearColor];
                //创建imageView放在小圆点上
                UIImageView *imageView;
                if (dot.subviews.count == 0)
                {
                    imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, dot.frame.size.width, dot.frame.size.height)];
                    [dot addSubview:imageView];
                }
                else
                {
                    imageView = dot.subviews.firstObject;
                }
                //判断小圆点是否是当前页面,根据不同状态设置不同图片
                if (i == self.currentPage)
                {
                    imageView.image = [UIImage imageNamed:@"page_main_selected"];
                }
                else
                {
                    imageView.image = [UIImage imageNamed:@"page_main"];
                }
            }
        }
    }
    else if (_style == NKPageControlStyleB)
    {
        //自定义种类    
    }
}

-(void) setCurrentPage:(NSInteger)page
{
    [super setCurrentPage:page];
    //每次设置当前活动的小圆点时,重新配置图片
    [self updateDots];
}

使用

    _pageControl = [[NKPageControl alloc] initWithStyle:NKPageControlStyleA];
    //常规设置
    _pageControl.frame = CGRectMake(0 , 0, WIDTH_VIEW, 20);//小圆点控件的大小位置
    _pageControl.numberOfPages = 4;//小圆点个数
    _pageControl.currentPage = 0;
    //配置颜色
    //    _pageControl.pageIndicatorTintColor = [UIColor whiteColor];
    //    _pageControl.currentPageIndicatorTintColor = [UIColor lightGrayColor];
    _pageControl.userInteractionEnabled = NO;//关闭与  用户的交互
    //添加导视图中
    [self.view addSubview:_pageControl];

pageControl的图片类型一样

如果pageControl的图片类型一样的话,可以使用KVC设置图片,代码如下


[pageControl setValue:[UIImage imageNamed:@"image1"] forKeyPath:@"_pageImage"];

[pageControl setValue:[UIImage imageNamed:@"image2"] forKeyPath:@"_currentPageImage"];