Adding UIButtons to uiimage of a UICollectionView cells programmatically

Question

I have a UIViewController with a UICollectionView image gallery created inside it programmatically. I want to add a button to the on each uiimage of UICollectionView cell: The code in CMFViewController.h.m file for adding button to imageview is:

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {

    CMFGalleryCell *cell = (CMFGalleryCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"cellIdentifier" forIndexPath:indexPath];

    NSString *imageName = [self.dataArray objectAtIndex:indexPath.row];
    [cell setImageName:imageName];
   // [[cell myButton] addTarget:self action:@selector(myClickEvent:event) forControlEvents:UIControlEventTouchUpInside];

    UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    button.frame = CGRectMake(80.0, 210.0, 100.0, 20.0);
    [button addTarget:self action:@selector(show) forControlEvents:UIControlEventTouchUpInside];
    [button setTitle:@"ShowView" forState:UIControlStateNormal];

  //  NSMutableArray *buttonArray = [NSMutableArray arrayWithCapacity:100];

  //  for (int i = 0; i < 4; i++) {
       // NSUInteger index = arc4random() % 4;


        // newButton.frame = CGRectMake( 5,  5, 10, 10);    // Whatever position and size you need...

       // UIImage *buttonImage = [UIImage imageNamed:[self.dataArray objectAtIndex:indexPath.row]];
        //[newButton setBackgroundImage:buttonImage forState:UIControlStateNormal];

     //   [buttonArray addObject:newButton];
  //  }
   // newButton = buttonArray;   // Where myButtons is a NSArray property of your class, to store references to the buttons.

   // [newButton addTarget:self action:@selector(loadImages:) forControlEvents:UIControlEventTouchUpInside];
    //[newButton addTarget:self action:@selector(updateCell) forControlEvents:UIControlEventTouchUpInside];

    [cell updateCell];

    return cell;

}

I have tied to get help from codes at following links adding-a-uibutton-to-a-uicollectionview

UIButton in cell in collection view not receiving touch up inside event Please give my your suggestion and help me on this issue.

from this link u can download source code in Creating a Paged Photo Gallery With a UICollectionView: their i want to place next and previous buttons on middle lines of each image of the screen

Answer 1

For implementing next and previous buttons, don't added it on each image, better u add it on collection view, what chinttu-maddy-ramani told in his answer is correct, but he is doing in xib file, but programatically u can do it like below,

just add this code

Edit for requirement updating the buttons

in CMFViewController.h file make two button properties replace by below code

 #import <UIKit/UIKit.h>

 @interface CMFViewController : UIViewController <UICollectionViewDataSource,   UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>
 @property (nonatomic, strong) UIButton *nextButton;
 @property (nonatomic, strong) UIButton *prevButton;
 @end

in CMFViewController.m file

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

    [self loadImages];
    [self setupCollectionView]; 
    [self addNextAndPreviousButtons];//add a method to add previous and next buttons 
 }

 //hear u are adding previous and next images, but i didn't added the constraints u add it if u want t work in both orientation 
 - (void)addNextAndPreviousButtons
 {
    _nextButton = [UIButton buttonWithType:UIButtonTypeSystem];
    _nextButton.frame =CGRectMake(self.view.bounds.size.width - 40, self.view.bounds.size.height/2, 50, 30);
    [_nextButton setTitle:@"Next" forState:UIControlStateNormal];
    [_nextButton addTarget:self action:@selector(nextButtonAction:) forControlEvents:UIControlEventTouchUpInside];

    _prevButton = [UIButton buttonWithType:UIButtonTypeSystem];
    _prevButton.frame =  CGRectMake(self.view.bounds.origin.x, self.view.bounds.size.height/2, 50, 30);
    [_prevButton setTitle:@"Prev" forState:UIControlStateNormal];
    [_prevButton addTarget:self action:@selector(previousButtonAction:) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:_nextButton];
    [self.view addSubview:_prevButton];

}

 //previous button action
- (void)previousButtonAction:(id)sender
{
    NSArray *visibleCell = [_collectionView visibleCells];
    if(visibleCell)
    {
      NSIndexPath *path = [_collectionView indexPathForCell:[visibleCell lastObject]];
      if(!path.row == 0)
      {
         NSIndexPath *nextPath = [NSIndexPath indexPathForItem:(path.row - 1) inSection:0];
         [_collectionView scrollToItemAtIndexPath:nextPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];
     }
   }
}

//next button action
- (void)nextButtonAction:(id)sender  
{
    NSArray *visibleCell = [_collectionView visibleCells];
    if(visibleCell)
   {
      NSIndexPath *path = [_collectionView indexPathForCell:[visibleCell lastObject]];
     if(path.row < [_dataArray count] - 1)
     {
         NSIndexPath *nextPath = [NSIndexPath indexPathForItem:(path.row + 1) inSection:0];
         [_collectionView scrollToItemAtIndexPath:nextPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];
    }
  }
}

//edited the method addNextAndPreviousButtons please replace it by this edited answer
//for all cases even when u are swiping 
//this is to handle buttons either by tapping or navigation through swiping the collection view 
- (void)updateButtons:(NSInteger)row
 {
    //at the beginning
    if(row == 0)
    {
      _prevButton.hidden = YES;
      _nextButton.hidden = NO;
      return;
    }
    else if(row == ([_dataArray count] -1))
    {
      _nextButton.hidden = YES;
      _prevButton.hidden = NO;
    }
    else
    {
      _nextButton.hidden = NO;
      _prevButton.hidden = NO;
    }
 }

//finally u have to call updateButtons method  this method 
 -(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath 
 {
   CMFGalleryCell *cell = (CMFGalleryCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"cellIdentifier" forIndexPath:indexPath];

   NSString *imageName = [self.dataArray objectAtIndex:indexPath.row];
   [cell setImageName:imageName];
   [cell updateCell];
   [self updateButtons:indexPath.row]; //update the buttons 
   return cell;

 }

Answer 2

you can add button in you cell to direct drag & drop button in CMFGalleryCell.xib please check attach screenshot. and add button constraint to center horizontally and center vertically with your cell.

for suggestion only if you want next-previous functionality then you can also add button in main xib in CMFViewController.xib as per below screenshot.