UIPageControl'ün sayfalandırma noktalarının rengini nasıl değiştirebilirim?


178

UIPageControlSayfalandırma noktalarının rengini veya görüntüsünü değiştirmek istediğim bir uygulama geliştiriyorum . Nasıl değiştirebilirim? UIpageControlYukarıdaki senaryoda özelleştirmek mümkün mü ?

Yanıtlar:


266

GÜNCELLEME:

Bu cevap 6 yaşında ve çok eski, ama yine de oy ve yorumlar çekiyor. İOS 6.0'dan beri pageIndicatorTintColorve currentPageIndicatorTintColorözelliklerini kullanmalısınız UIPageControl.

ORİJİNAL CEVAP:

Bugün bu problemle karşılaştım ve kendi basit değiştirme sınıfımı yazmaya karar verdim.

Noktaları belirttiğiniz renklerde oluşturmak için Core Graphics kullanan alt sınıf bir UIView.

Görünen özellikleri özelleştirmek ve denetlemek için kullanırsınız.

İsterseniz, kullanıcı küçük sayfa noktalarından birine dokunduğunda bildirim almak için bir temsilci nesnesi kaydedebilirsiniz. Kayıtlı bir temsilci yoksa, görünüm dokunmatik girişe tepki vermez.

Fırından tamamen taze, ama işe yarıyor gibi görünüyor. Bununla ilgili herhangi bir sorun yaşarsanız bana bildirin.

Gelecekteki gelişmeler:

  • Çok fazla varsa noktaları geçerli sınırlara uyacak şekilde yeniden boyutlandırın.
  • Tüm görünümü drawRect'te yeniden çizmeyin:

Örnek kullanım:

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];

Başlık dosyası:

//
//  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

Uygulama dosyası:

//
//  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

Peki bu nasıl çalışıyor? PagecontrolPageDidChange yöntemini kullanıyorum ve hiçbir şey almıyorum. Düğmelerden hiçbirini
Adam

Merhaba Heiberg, scrollview sayfamı değiştirmek için bunu kullandım, kodunuzdan nasıl yapıyorsunuz? [pageControl1 addTarget: self action: @selector (changePage :) forControlEvents: UIControlEventValueChanged];
Desmond

// UIPageControl'de sayfa değiştirme eylemi - (void) changePage: (UIPageControl *) kontrolü {// int page = pageControl.currentPage; int page = pageControl.currentPage; // kaydırma görünümünü uygun sayfaya güncelleyin CGRect frame = scrollview.frame; frame.origin.x = frame.size.width * sayfa; frame.origin.y = 0; [scrollview scrollRectToVisible: çerçeve animasyonu: YES]; pageControlUsed = EVET; }
Desmond

Bu kodu ARC ile çalıştırmak için, dealloc yöntemini kaldırmanız, atamayı zayıf olarak değiştirmeniz ve ilgili özellik bildiriminden önce bir __weak eklemeniz yeterlidir. Çok hoş. Çok teşekkürler.
cschuff

NSObject <PageControlDelegate> * temsilcisini __unsafe_unretained id delegate ile değiştirin; ARC uyarısını çözmek için başlık
Mihir Mehta

150

İOS 6'da şunların renk tonunu ayarlayabilirsiniz UIPageControl:

2 yeni özellik var:

  • pageIndicatorTintColor
  • currentPageIndicatorTintColor

Tüm sayfa göstergelerinin renk tonunu değiştirmek için görünüm API'sını da kullanabilirsiniz.

İOS 5'i hedefliyorsanız kilitlenmediğinden emin olun:

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

İOS 5 ne olacak? Bunun çökmemesini nasıl sağlıyorsunuz?
jjxtra

41
pageControl.pageIndicatorTintColor = [UIColor redColor];
pageControl.currentPageIndicatorTintColor = [UIColor redColor];

iOS6 için çalışıyor


2
Ben UIPageControl alt sınıf gerekecekti bummed. Bu hile yaptı. Bu # 1 konumunda olmalıdır.
Forrest

Bu kadar karmaşık bir cevap neden tam anlamıyla ihtiyacınız olan tek şey olduğunda en iyisi seçildi?
TaylorAllred

23

Herhangi birinin ARC / modern bir sürümünü istemesi durumunda (özellikleri ivar olarak yeniden tanımlamaya gerek yoktur, dealloc yok ve Interface Builder ile çalışır):

#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

1
Bir dokunuştan sonra sayfa numarası gerçekten değişmediyse, temsilciye gönderilmesini durdurmak için küçük bir ekleme. NSInteger newPage = kat (x / (kDotDiameter + kDotSpacer)); if (self.currentPage == newPage) döndürürse;
theLastNightTrain

15

Heiberg tarafından verilen cevap gerçekten iyi çalışıyor, ancak sayfa kontrolü tam olarak elmadaki gibi davranmıyor.

Sayfa denetiminin elmadaki gibi davranmasını istiyorsanız (ikinci yarıya dokunursanız her zaman geçerli sayfayı bir artırın, aksi takdirde bir azaltın), bunun yerine şu dokunmaları deneyin:

- (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]; 
    }   
}

8

AppDelegate'te DidFinishLauch'a aşağıdaki kodu ekleyin,

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

Umarım bu yardımcı olur.


6

kodlama için bunu kullan

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

veya film şeridinden geçerli sayfa tonundan değiştirebilirsiniz

resim açıklamasını buraya girin


Teşekkürler ... paylaşmaya devam :)
Tirth

6

Swift'te, UIPageViewController içindeki bu kod sayfa göstergesine başvuru alıyor ve özelliklerini ayarlıyor

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()
}

UIPageControlile aynı değilUIPageViewController
jungledev


4

Swift 1.2 ile kolaydır:

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

3
Bu onu küresel olarak ayarlar. Uygulamanızda birden fazla UIPageControls varsa ve sınıfa göre farklı renklere ihtiyacınız varsa UIPageControl.appearanceWhenContainedInInstancesOfClasses([MyClassName.self])bunun yerine kullanın UIPageControl.appearance(). İOS 9 gerektirir.
Jon

4

Aşağıdaki kodu yönteminizde appdelegate.m dosyanıza kolaylıkla ekleyerek düzeltebilirsiniz didFinishLaunchingWithOptions:

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

3

Bu benim için iOS 7'de çalıştı.

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

2

İPhone SDK'sını resmi bir bakış açısıyla kullanmak mümkün değildir. Bunu özel yöntemler kullanarak yapabilirsiniz, ancak bu uygulama mağazasına girmenin önünde bir engel olacaktır.

Diğer güvenli çözüm, sayfa kontrolünün o anda hangi sayfanın bir kaydırma görünümünde gösterildiğini göstermesi nedeniyle çok zor olmayan kendi sayfa kontrolünüzü oluşturmaktır.


Benim çözümümün bağlantısı değil. Benim çözümüm, yorumunuzun hemen üstündeki metinde. Ya özel yöntemleri arayın (bunların ne olduğunu bilmiyorum) ya da kendinizinkini yazın (bunu sizin için yapmayacağım).
Jasarien

2

@Jasarien Ben sadece apple doc "hat kontrolü görünümünü özelleştiren alt sınıflar sayfa yöntemi değiştiğinde sayfa denetimini yeniden boyutlandırmak için bu yöntemi kullanabilirsiniz" yöntem boyutu için UIPageControll, alt sınıf yapabilirsiniz düşünüyorumForForNumberOfPages:


2

Ayrıca, şekillendirilebilir bir PageControl ve düzinelerce yararlı kullanıcı arayüzü denetimi ve soyutlaması içeren Three20 Library'yi de kullanabilirsiniz.


2

Kasalı Swift 2.0ve üstü, aşağıdaki kod çalışacaktır:

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

-1
myView.superview.tintColor = [UIColor colorWithRed:1.0f  
                                      green:1.0f blue:1.0f alpha:1.0f];
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.