我怎样才能改变UIPageControl的分页点的颜色?

我正在开发一个应用程序,我想要更改UIPageControl分页点的颜色或图像。 我怎样才能改变它? 有没有可能在上面的情况下自定义UIpageControl

更新:

这个答案是6岁,很过时,但它仍然吸引着选票和评论。 自iOS 6.0以来,您应该使用pageIndicatorTintColor上的pageIndicatorTintColorcurrentPageIndicatorTintColor属性。

原文答案:

我今天遇到这个问题,决定写我自己的简单replace课。

这是一个sublassed UIView使用核心graphics来呈现您指定的颜色点。

您使用公开的属性来定制和控制它。

如果你想要的话,你可以注册一个委托对象来获取通知,当用户点击其中一个小页面点时。 如果没有委托注册,则视图不会对触摸input做出反应。

烤箱里完全新鲜,但似乎工作。 如果遇到任何问题,请告诉我。

未来的改进:

  • 调整点的大小,以适应目前的界限,如果有太多。
  • 不要在drawRect中重绘整个视图:

使用示例:

 CGRect f = CGRectMake(0, 0, 320, 20); PageControl *pageControl = [[[PageControl alloc] initWithFrame:f] autorelease]; pageControl.numberOfPages = 10; pageControl.currentPage = 5; pageControl.delegate = self; [self addSubview:pageControl]; 

头文件:

 // // PageControl.h // // Replacement for UIPageControl because that one only supports white dots. // // Created by Morten Heiberg <morten@heiberg.net> on November 1, 2010. // #import <UIKit/UIKit.h> @protocol PageControlDelegate; @interface PageControl : UIView { @private NSInteger _currentPage; NSInteger _numberOfPages; UIColor *dotColorCurrentPage; UIColor *dotColorOtherPage; NSObject<PageControlDelegate> *delegate; //If ARC use __unsafe_unretained id delegate; } // Set these to control the PageControl. @property (nonatomic) NSInteger currentPage; @property (nonatomic) NSInteger numberOfPages; // Customize these as well as the backgroundColor property. @property (nonatomic, retain) UIColor *dotColorCurrentPage; @property (nonatomic, retain) UIColor *dotColorOtherPage; // Optional delegate for callbacks when user taps a page dot. @property (nonatomic, retain) NSObject<PageControlDelegate> *delegate; @end @protocol PageControlDelegate<NSObject> @optional - (void)pageControlPageDidChange:(PageControl *)pageControl; @end 

实施文件:

 // // PageControl.m // // Replacement for UIPageControl because that one only supports white dots. // // Created by Morten Heiberg <morten@heiberg.net> on November 1, 2010. // #import "PageControl.h" // Tweak these or make them dynamic. #define kDotDiameter 7.0 #define kDotSpacer 7.0 @implementation PageControl @synthesize dotColorCurrentPage; @synthesize dotColorOtherPage; @synthesize delegate; - (NSInteger)currentPage { return _currentPage; } - (void)setCurrentPage:(NSInteger)page { _currentPage = MIN(MAX(0, page), _numberOfPages-1); [self setNeedsDisplay]; } - (NSInteger)numberOfPages { return _numberOfPages; } - (void)setNumberOfPages:(NSInteger)pages { _numberOfPages = MAX(0, pages); _currentPage = MIN(MAX(0, _currentPage), _numberOfPages-1); [self setNeedsDisplay]; } - (id)initWithFrame:(CGRect)frame { if ((self = [super initWithFrame:frame])) { // Default colors. self.backgroundColor = [UIColor clearColor]; self.dotColorCurrentPage = [UIColor blackColor]; self.dotColorOtherPage = [UIColor lightGrayColor]; UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipedRight:)]; [swipeRight setDirection:UISwipeGestureRecognizerDirectionRight]; [self addGestureRecognizer:swipeRight]; UISwipeGestureRecognizer *swipe = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipedLeft:)]; [swipe setDirection:UISwipeGestureRecognizerDirectionLeft]; [self addGestureRecognizer:swipe]; } return self; } -(void) swipedLeft:(UISwipeGestureRecognizer *) recognizer { self.currentPage++; } -(void) swipedRight:(UISwipeGestureRecognizer *) recognizer { self.currentPage--; } - (void)drawRect:(CGRect)rect { CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSetAllowsAntialiasing(context, true); CGRect currentBounds = self.bounds; CGFloat dotsWidth = self.numberOfPages*kDotDiameter + MAX(0, self.numberOfPages-1)*kDotSpacer; CGFloat x = CGRectGetMidX(currentBounds)-dotsWidth/2; CGFloat y = CGRectGetMidY(currentBounds)-kDotDiameter/2; for (int i=0; i<_numberOfPages; i++) { CGRect circleRect = CGRectMake(x, y, kDotDiameter, kDotDiameter); if (i == _currentPage) { CGContextSetFillColorWithColor(context, self.dotColorCurrentPage.CGColor); } else { CGContextSetFillColorWithColor(context, self.dotColorOtherPage.CGColor); } CGContextFillEllipseInRect(context, circleRect); x += kDotDiameter + kDotSpacer; } } - (void)dealloc { [dotColorCurrentPage release]; [dotColorOtherPage release]; [delegate release]; [super dealloc]; } - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { if (!self.delegate) return; CGPoint touchPoint = [[[event touchesForView:self] anyObject] locationInView:self]; CGFloat dotSpanX = self.numberOfPages*(kDotDiameter + kDotSpacer); CGFloat dotSpanY = kDotDiameter + kDotSpacer; CGRect currentBounds = self.bounds; CGFloat x = touchPoint.x + dotSpanX/2 - CGRectGetMidX(currentBounds); CGFloat y = touchPoint.y + dotSpanY/2 - CGRectGetMidY(currentBounds); if ((x<0) || (x>dotSpanX) || (y<0) || (y>dotSpanY)) return; self.currentPage = floor(x/(kDotDiameter+kDotSpacer)); if ([self.delegate respondsToSelector:@selector(pageControlPageDidChange:)]) { [self.delegate pageControlPageDidChange:self]; } } @end 

在iOS 6中,您可以设置UIPageControl的色调:

有2个新的属性:

  • pageIndicatorTintColor
  • currentPageIndicatorTintColor

您也可以使用外观API来更改所有页面指示器的色调。

如果你的目标iOS 5确保它不会崩溃:

 if ([pageControl respondsToSelector:@selector(setPageIndicatorTintColor:)]) { pageControl.pageIndicatorTintColor = [UIColor whiteColor]; } 
 pageControl.pageIndicatorTintColor = [UIColor redColor]; pageControl.currentPageIndicatorTintColor = [UIColor redColor]; 

适用于iOS6

如果任何人想要一个ARC /现代版本(不需要重新定义属性作为伊娃,没有dealloc,并与界面生成器):

 #import <UIKit/UIKit.h> @protocol PageControlDelegate; @interface PageControl : UIView // Set these to control the PageControl. @property (nonatomic) NSInteger currentPage; @property (nonatomic) NSInteger numberOfPages; // Customize these as well as the backgroundColor property. @property (nonatomic, strong) UIColor *dotColorCurrentPage; @property (nonatomic, strong) UIColor *dotColorOtherPage; // Optional delegate for callbacks when user taps a page dot. @property (nonatomic, weak) NSObject<PageControlDelegate> *delegate; @end @protocol PageControlDelegate<NSObject> @optional - (void)pageControlPageDidChange:(PageControl *)pageControl; @end 

PageControl.m:

 #import "PageControl.h" // Tweak these or make them dynamic. #define kDotDiameter 7.0 #define kDotSpacer 7.0 @implementation PageControl @synthesize dotColorCurrentPage; @synthesize dotColorOtherPage; @synthesize currentPage; @synthesize numberOfPages; @synthesize delegate; - (void)setCurrentPage:(NSInteger)page { currentPage = MIN(MAX(0, page), self.numberOfPages-1); [self setNeedsDisplay]; } - (void)setNumberOfPages:(NSInteger)pages { numberOfPages = MAX(0, pages); currentPage = MIN(MAX(0, self.currentPage), numberOfPages-1); [self setNeedsDisplay]; } - (id)initWithFrame:(CGRect)frame { if (self = [super initWithFrame:frame]) { // Default colors. self.backgroundColor = [UIColor clearColor]; self.dotColorCurrentPage = [UIColor blackColor]; self.dotColorOtherPage = [UIColor lightGrayColor]; } return self; } -(id)initWithCoder:(NSCoder *)aDecoder { if (self = [super initWithCoder:aDecoder]) { self.dotColorCurrentPage = [UIColor blackColor]; self.dotColorOtherPage = [UIColor lightGrayColor]; } return self; } - (void)drawRect:(CGRect)rect { CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSetAllowsAntialiasing(context, true); CGRect currentBounds = self.bounds; CGFloat dotsWidth = self.numberOfPages*kDotDiameter + MAX(0, self.numberOfPages-1)*kDotSpacer; CGFloat x = CGRectGetMidX(currentBounds)-dotsWidth/2; CGFloat y = CGRectGetMidY(currentBounds)-kDotDiameter/2; for (int i=0; i<self.numberOfPages; i++) { CGRect circleRect = CGRectMake(x, y, kDotDiameter, kDotDiameter); if (i == self.currentPage) { CGContextSetFillColorWithColor(context, self.dotColorCurrentPage.CGColor); } else { CGContextSetFillColorWithColor(context, self.dotColorOtherPage.CGColor); } CGContextFillEllipseInRect(context, circleRect); x += kDotDiameter + kDotSpacer; } } - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { if (!self.delegate) return; CGPoint touchPoint = [[[event touchesForView:self] anyObject] locationInView:self]; CGFloat dotSpanX = self.numberOfPages*(kDotDiameter + kDotSpacer); CGFloat dotSpanY = kDotDiameter + kDotSpacer; CGRect currentBounds = self.bounds; CGFloat x = touchPoint.x + dotSpanX/2 - CGRectGetMidX(currentBounds); CGFloat y = touchPoint.y + dotSpanY/2 - CGRectGetMidY(currentBounds); if ((x<0) || (x>dotSpanX) || (y<0) || (y>dotSpanY)) return; self.currentPage = floor(x/(kDotDiameter+kDotSpacer)); if ([self.delegate respondsToSelector:@selector(pageControlPageDidChange:)]) { [self.delegate pageControlPageDidChange:self]; } } @end 

Heiberg提供的答案非常好,但是页面控制并不像苹果那样。

如果你希望页面控件的行为像苹果那样(如果你触摸下半部分,总是将当前页面加1,否则减1),试试这个touchesBegan方法:

 - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{ CGPoint touchPoint = [[[event touchesForView:self] anyObject] locationInView:self]; CGRect currentBounds = self.bounds; CGFloat x = touchPoint.x - CGRectGetMidX(currentBounds); if(x<0 && self.currentPage>=0){ self.currentPage--; [self.delegate pageControlPageDidChange:self]; } else if(x>0 && self.currentPage<self.numberOfPages-1){ self.currentPage++; [self.delegate pageControlPageDidChange:self]; } } 

将以下代码添加到AppDelegate中的DidFinishLauch,

 UIPageControl *pageControl = [UIPageControl appearance]; pageControl.pageIndicatorTintColor = [UIColor lightGrayColor]; pageControl.currentPageIndicatorTintColor = [UIColor blackColor]; pageControl.backgroundColor = [UIColor whiteColor]; 

希望这会有所帮助。

添加到现有的答案,可以这样做,

在这里输入图像描述

Swift 1.2很容易:

 UIPageControl.appearance().pageIndicatorTintColor = UIColor.lightGrayColor() UIPageControl.appearance().currentPageIndicatorTintColor = UIColor.redColor() 

这在iOS 7中适用于我。

 pageControl.pageIndicatorTintColor = [UIColor purpleColor]; pageControl.currentPageIndicatorTintColor = [UIColor magentaColor]; 

您可以通过在您的didFinishLaunchingWithOptions方法中的appdelegate.m文件中添加休闲代码来轻松修复它:

 UIPageControl *pageControl = [UIPageControl appearance]; pageControl.pageIndicatorTintColor = [UIColor darkGrayColor]; pageControl.currentPageIndicatorTintColor = [UIColor orangeColor]; pageControl.backgroundColor = [UIColor whiteColor] 

用这个进行编码

 if ([pageControl respondsToSelector:@selector(setPageIndicatorTintColor:)]) { pageControl.pageIndicatorTintColor = [UIColor whiteColor]; } 

或从故事板可以改变当前页面的色调

在这里输入图像描述

从官方的angular度来看,使用iPhone SDK是不可能的。 您可以使用私有方法来做到这一点,但这将成为进入app store的障碍。

唯一的另一个安全的解决scheme是创build自己的页面控件,因为页面控件只是显示当前在滚动视图中显示的页面,所以这个控件太难了。

@Jasarien我认为你可以子类UIPageControll,只从苹果文档中挑选的行“自定义页面控件的外观的子类可以使用此方法来调整页面控件的大小,当页面数改变”的方法sizeForNumberOfPages:

你也可以使用Three20库,其中包含一个样式的PageControl和其他十几个有用的UI控件和抽象。

在Swift中,UIPageViewController中的这段代码正在获取页面指示符的引用并设置其属性

 override func viewDidLoad() { super.viewDidLoad() //Creating the proxy let pageControl = UIPageControl.appearance() //Customizing pageControl.pageIndicatorTintColor = UIColor.lightGrayColor() pageControl.currentPageIndicatorTintColor = UIColor.darkGrayColor() //Setting the background of the view controller so the dots wont be on a black background self.view.backgroundColor = UIColor.whiteColor() } 

Swift 2.0以上的版本中,下面的代码将起作用:

 pageControl.pageIndicatorTintColor = UIColor.whiteColor() pageControl.currentPageIndicatorTintColor = UIColor.redColor() 

这是一个Swift 3.0解决scheme…你知道如果你接受规定的风险是可以的:“修改现有控件的子视图是脆弱的”。

你将不得不在你的viewDidAppear()和你的valueChanged处理程序中调用页面控件的updateDots()。

  import UIKit class CustomImagePageControl: UIPageControl { let activeImage:UIImage = UIImage(named: "SelectedPage")! let inactiveImage:UIImage = UIImage(named: "UnselectedPage")! override func awakeFromNib() { super.awakeFromNib() self.pageIndicatorTintColor = UIColor.clear self.currentPageIndicatorTintColor = UIColor.clear self.clipsToBounds = false } func updateDots() { var i = 0 for view in self.subviews { if let imageView = self.imageForSubview(view) { if i == self.currentPage { imageView.image = self.activeImage } else { imageView.image = self.inactiveImage } i = i + 1 } else { var dotImage = self.inactiveImage if i == self.currentPage { dotImage = self.activeImage } view.clipsToBounds = false view.addSubview(UIImageView(image:dotImage)) i = i + 1 } } } fileprivate func imageForSubview(_ view:UIView) -> UIImageView? { var dot:UIImageView? if let dotImageView = view as? UIImageView { dot = dotImageView } else { for foundView in view.subviews { if let imageView = foundView as? UIImageView { dot = imageView break } } } return dot } } 
 myView.superview.tintColor = [UIColor colorWithRed:1.0f green:1.0f blue:1.0f alpha:1.0f];