How to implement a UIPageControl properly?

Question

I have 3 minor issues related to implementing a UIPageControl. I'm not using a UIPageViewController, so I would not like to use that, if possible.

I have implemented a UIPageControl, where, when a user swipes either left or right on the view, it will move to the next "page" and display a different image.

Here is the following code:

ViewController.h:

@property (nonatomic) NSInteger Count;

@property (strong, nonatomic) IBOutlet UIPageControl *Control;
@property (strong, nonatomic) IBOutlet UIImageView *imageView;
@property (strong, nonatomic) IBOutlet UILabel *label;

@property (strong, nonatomic) UISwipeGestureRecognizer *swipeRight, *swipeLeft;

@property (strong, nonatomic) NSArray *array;

ViewController.m:

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    self.array = @[@"page1", @"page2", @"page3", @"page4"];

    self.swipeRight = [ [UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(Right:)];

    self.swipeRight.direction = UISwipeGestureRecognizerDirectionRight;
    [self.view addGestureRecognizer:self.swipeRight];

    self.swipeLeft = [ [UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(Left:)];
    self.swipeLeft.direction = UISwipeGestureRecognizerDirectionLeft;
    [self.view addGestureRecognizer:self.swipeLeft];

    self.Control.numberOfPages = 3;
    self.Control.currentPage = 0;
}

-(void)Right: (UITapGestureRecognizer *)sender
{
    self.Count = self.Count - 1;

    if (self.Count > 3)
    {
        self.Count = 1;
    }
    else if (self.Count < 1)
    {
        self.Count = 3;
    }

    if (self.Count == 1)
    {
        self.Control.currentPage = 0;
        self.imageView.image = [UIImage imageNamed:[self.array objectAtIndex:self.Control.currentPage]];
 //       self.label.text = @"this is page 1";
    }
    else if (self.Count == 2)
    {
        self.Control.currentPage = 1;
        self.imageView.image = [UIImage imageNamed:[self.array objectAtIndex:self.Control.currentPage]];
       // self.label.text = @"this is page 2";
    }
    else if (self.Count == 3)
    {
        self.Control.currentPage = 2;
        self.imageView.image = [UIImage imageNamed:[self.array objectAtIndex:self.Control.currentPage]];
//        self.label.text = @"this is page 3";
    }
}

-(void)Left: (UITapGestureRecognizer *)sender
{
    self.Count = self.Count + 1;

    if (self.Count > 3)
    {
        self.Count = 1;
    }
    else if (self.Count < 1)
    {
        self.Count = 3;
    }

    if (self.Count == 1)
    {
        self.Control.currentPage = 0;
        self.imageView.image = [UIImage imageNamed:[self.array objectAtIndex:self.Control.currentPage]];
        //self.label.text = @"this is page 1";
    }
    else if (self.Count == 2)
    {
        self.Control.currentPage = 1;
        self.imageView.image = [UIImage imageNamed:[self.array objectAtIndex:self.Control.currentPage]];
        //self.label.text = @"this is page 2";
    }
    else if (self.Count == 3)
    {
        self.Control.currentPage = 2;
        self.imageView.image = [UIImage imageNamed:[self.array objectAtIndex:self.Control.currentPage]];
       // self.label.text = @"this is page 3";
    }
}

The first issue: how do I make the view display the first image at index 0 on launch?

Right now, if you start the app initially, the image is blank on screen even though the page control shows the current view as being highlighted with the little dot. You have to swipe left to get the first image in index 0 to display.

The second issue: how do I add a scroll transition style animation when swiped left or right?

Right now, if you swipe either left or right, the image transition is instant, and you don't see that swiping animation where one image pushes the other image out of the view.

The third issue: how do I make the swipe gesture recognition not be the whole view area, but only be swipeable if you swipe on the upper portion of the view?

Feel free to download the project code as it's just a template that I'm using: project code

Thanks

I feel like I have to ask... ***Why*** don't you want to use a UIPageViewController? Why handle all of the annoying stuff yourself? All of your issues are easily solved, in an order of magnitude less code, by using the native page controller. — Mike, Dec 28 '14 at 23:47
Or a UICollectionView as an other solution. Anyway, handle it all manually is a bad idea and a wasting of time ... — Yaman, Dec 29 '14 at 00:25
Combine the UIPageController with a UIScrollView (if you haven't already) to use the scroll transition style animation. — Lyndsey Scott, Dec 29 '14 at 00:41
@Mike, there is a tutorial: http://www.appcoda.com/uipageviewcontroller-storyboard-tutorial/ , this involves a UIPageViewController but I don't know how to integrate it using my current implementation with a UITableView. With my current setup I have a ViewController1 with a UITableView. Upon selection of a row, it goes to another ViewController2 where I want to use a UIPageControl to swipe through different images. I couldn't follow the tutorial well to implement it in my own design. I would be happy to provide you with a portion of my code if you can help me with a UIPageViewController. thnx — Pangu, Dec 29 '14 at 00:48
Have a look at https://github.com/mamaral/MAPageViewController. That project lets you create a page view controller with an array of view controllers of any type of class. When you select a table row, you want to create and push the page view controller. Basically, you can do what you're trying to do with less than 10 lines of code, or alternatively you can see how the page controller is implemented and do it yourself. — Mike, Dec 29 '14 at 00:55
Go through this http://stackoverflow.com/questions/2942636/how-can-i-change-the-color-of-pagination-dots-of-uipagecontrol — Tirth, Dec 29 '14 at 04:18

How to implement a UIPageControl properly?

0 Answers0