Handling Tap Gesture in a UICollectionView - objective-c

since I couldn't use any framework to create an photo album, I'm trying to create my own using Collection View, but I got stuck right at the beginning.
My goal is to display all images from my web service into my collection view, since all displayed, the next step is when someone taps on any cell, I can open it in a new view and also navigate between all.
here is the basic code that I created:
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view.
[collectionController reloadData];
tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:nil action:#selector(touched)];
tapGesture.numberOfTapsRequired = 1;
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 1;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return 6;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
static NSString *cellIdentifier = #"Cell";
CollectionCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];
[cell.imgCollection setImageWithURL:[NSURL URLWithString:#"http://sallescds.com.br/wp-content/uploads/2012/12/xepop-300x300.jpg"] placeholderImage:[UIImage imageNamed:#"placeholder.png"]];
[cell.imgCollection addGestureRecognizer:tapGesture];
return cell;
}
-(void)touched:(UIGestureRecognizer *)tap{
NSLog(#"the touch happened");
}
thanks guys.

A couple of things are not right in your code:
First, initWithTarget:action: should not be passed a nil value for target. From the docs :
target
An object that is the recipient of action messages sent by the receiver when it recognizes a gesture. nil is not a valid value.
In your case you should pass self as a target because you want to sent the message touched: to the current instance of your class.
Second, the selector you passed to initWithTarget:action: is wrong. You used #selector(touched) but your method implementation is - (void)touched:(UIGestureRecognizer *)tap;, which selector is #selector(touched:) (mind the :).
I'd recommend reading this question on selectors if your are confused.
Third, you cannot attach a single UIGestureRecognizer to multiple view (see this SO question).
So to make it work, you could create one UITapGestureRecognizer per collection cell (maybe in a subclass). Or better yet, implement your UICollectionViewDelegate method collectionView:didSelectItemAtIndexPath:.
EDIT - How to implement collectionView:didSelectItemAtIndexPath::
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view.
// Bind the collectionView's delegate to your view controller
// This could also be set without code, in your storyboard
self.collectionView.delegate = self;
}
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
return 1;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return 6;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
static NSString *cellIdentifier = #"Cell";
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];
[cell.imgCollection setImageWithURL:[NSURL URLWithString:#"http://sallescds.com.br/wp-content/uploads/2012/12/xepop-300x300.jpg"] placeholderImage:[UIImage imageNamed:#"placeholder.png"]];
return cell;
}
// I implemented didSelectItemAtIndexPath:, but you could use willSelectItemAtIndexPath: depending on what you intend to do. See the docs of these two methods for the differences.
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
// If you need to use the touched cell, you can retrieve it like so
UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
NSLog(#"touched cell %# at indexPath %#", cell, indexPath);
}

Related

CALayer addSublayer does not work in didSelectItemAtIndexPath

I want to achieve an effect that can turn to red when a cell is clicked in CollectionView,so I use CAlayer,but it does not work. When I use target-action inside cell to achieve, it can work perfectly.
Here are the codes:
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
videoCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"videoCell" forIndexPath:indexPath];
CALayer *testLayer = [[CALayer layer] init];
testLayer.frame = cell.bounds;
testLayer.backgroundColor = [UIColor redColor].CGColor;
[cell.layer addSublayer:testLayer];
}
You need to use the cell's contentView to accomplish this. Also, remember cells are caches and so you can not use state that you store inside a cell. You have to store it somewhere else. And you should not use didSelectItemAtIndexPath to update the UI. Rather change the state there and then request and update of the relevant cell.
Here is a nice example to illustrate. In this example you can select multiple cells and they all will have a red background. The selection state of a cell is stored inside a dictionary in the controller. You could easily change this if you e.g. only want to have a single cell selected at a given moment in time. Then you need to also updated the cell that became unselected but that is another example.
#import "CollectionViewController.h"
#interface CollectionViewController () < UICollectionViewDelegate, UICollectionViewDataSource >
#property (nonatomic,strong) NSMutableDictionary * selectedCells; // Key is integer row, value is boolean selected
#end
#implementation CollectionViewController
static NSString * const reuseIdentifier = #"Cell";
- (void)viewDidLoad {
[super viewDidLoad];
// Register cell classes
[self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];
// Do any additional setup after loading the view.
self.collectionView.dataSource = self;
self.collectionView.delegate = self;
// Empty / nothing selected for now
self.selectedCells = NSMutableDictionary.dictionary;
}
#pragma mark <UICollectionViewDataSource>
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
return 1;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return 5;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
// Configure the cell based on state
if ( [( NSNumber * )[self.selectedCells objectForKey:#( indexPath.row )] boolValue] ) {
cell.contentView.backgroundColor = UIColor.redColor;
} else {
cell.contentView.backgroundColor = UIColor.blueColor;
}
return cell;
}
#pragma mark <UICollectionViewDelegate>
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
// Flip selected state
[self.selectedCells setObject:#( ! [( NSNumber * )[self.selectedCells objectForKey:#( indexPath.row )] boolValue] )
forKey:#( indexPath.row )];
// Request an UI update to reflect the updated state
[collectionView reloadItemsAtIndexPaths:#[ indexPath ]];
}
#end

How to call a method in the parent view controller from a cell of a cell?

The structure of my app currently looks like this:
Collection View Controller -> Generic Cell with table view inside of it -> individual cells.
I would like to call a method in the collection view controller from one of the individual cells. So far I have implemented a delegate in the individual cell but if I can't seem to set my delegate in the collection view controller because I don't have an instance of it.
Furthermore, I have several cells inside the table view that are required to access the methods in the collection view controller.
The responder chain can help.
The view can query the responder chain for the first target that can accept a message. Suppose the message is -fooBar, then the view can query the target using the method -[UIResponder targetForAction:sender:]
// find the first responder in the hierarchy that will respond to -fooBar
id target = [self targetForAction:#selector(fooBar) sender:self];
// message that target
[target fooBar];
Note that this communication is controlled by this method:
(BOOL)canPerformAction:(SEL)action
withSender:(id)sender;
This default implementation of this method returns YES if the responder class implements the requested action and calls the next responder if it does not.
By default, the first object that responds to that message will become the target so you may want to override the canPerformAction:withSender: if needed for some views or view controllers.
For that you can do like that :
In Collection View Controller -> .h file
#interface CollectionViewController : UICollectionViewController<ColectionCellDelegate>
#end
In Collection View Controller -> .m file
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return [self.collectionData count];
}
// The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
CollectionCell *cell = (CollectionCell *)[collectionView dequeueReusableCellWithReuseIdentifier:#"CollectionCell" forIndexPath:indexPath];
cell.cellData = [self.collectionData objectAtIndex:indexPath.row];
cell.delegate = self;
return cell;
}
-(void)tableCellDidSelect:(UITableViewCell *)cell{
NSLog(#"Tap %#",cell.textLabel.text);
DetailViewController *detailVC = [[DetailViewController alloc] initWithNibName:#"DetailViewController" bundle:nil];
detailVC.label.text = cell.textLabel.text;
[self.navigationController pushViewController:detailVC animated:YES];
}
In CollectionCell.h
#class CollectionCell;
#protocol ColectionCellDelegate
-(void)tableCellDidSelect:(UITableViewCell *)cell;
#end
#interface CollectionCell : UICollectionViewCell<UITableViewDataSource,UITableViewDelegate>
#property(strong,nonatomic) NSMutableArray *cellData;
#property(weak,nonatomic) id<ColectionCellDelegate> delegate;
#end
In CollectionCell.m
#implementation CollectionCell
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
self.cellData = [[NSMutableArray alloc] init];
}
return self;
}
-(void) awakeFromNib{
[super awakeFromNib];
self.cellData = [[NSMutableArray alloc] init];
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return [self.cellData count];
}
// Row display. Implementers should *always* try to reuse cells by setting each cell's reuseIdentifier and querying for available reusable cells with dequeueReusableCellWithIdentifier:
// Cell gets various attributes set automatically based on table (separators) and data source (accessory views, editing controls)
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
static NSString *CellIdentifier = #"TableCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
}
cell.textLabel.text = [self.cellData objectAtIndex:indexPath.row];
return cell;
}
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
[[self delegate] tableCellDidSelect:cell];
}

How to link a UICollectionViewCell to a UICollectionView

I have a UIViewController with a UICollectionView on it but Xcode doesn't seem to look like every tutorial I find on the Internet or on YouTube - When I drag a UICollectionViewCell to place in the UICollectionView, it won't let me place it.
Now I'm confused as to how I can link my cell to the UICollectionView.
This is the viewController.h file:
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 1;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return [self.imagesArray count];
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
ImageViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"imageCell" forIndexPath:indexPath];
NSString *myImageString = [self.imagesArray objectAtIndex:indexPath.row];
cell.imageView.image = [UIImage imageNamed:myImageString];
return cell;
}
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return CGSizeMake(100.0, 100.0);
}
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
return UIEdgeInsetsMake(5, 5, 5, 5);
}
- (void)viewDidLoad
{
[super viewDidLoad];
self.collectionView.delegate = self;
self.collectionView.dataSource = self;
//[self.collectionView registerClass:[ImageViewCell class] forCellWithReuseIdentifier:#"imageCell"];
self.imagesArray = #[#"shirt1.PNG", #"pants.png", #"pants2.png"];
}
I'm not using a Storyboard interface but individual xib's. When I run this all that appears is the blank black screen. What am I missing?
-registerNib:forCellWithReuseIdentifier:
If you have your cell defined in a NIB, then you register that NIB with the collection view. That is how the collection view know what to load when -dequeueReusableCellWithReuseIdentifier:forIndexPath: is called.
- (void)viewDidLoad
{
// …
UINib nib = [UINib nibWithNibName:#"<the name of your xib>" bundle:nil];
[self.collectionView registerNib:nib forCellWithReuseIdentifier:#"imageCell"];
// …
}
Because you didn't have new a object of UICollectionViewCell in this method:
-(UICollectionViewCell*)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
The "cell" in your method must be set to nil.

UIImageView in UICollectionViewCell in UITableViewCell bug

The settings for the UICollectionView were defined using IB (ie scroll direction: horizontal, etc), and was embedded in UITableViewCell using IB.
UICollectionViewCell displays, images display, however, images are stacked on top of one another, instead of one image per one cell with fidelity.
I made individual UIImageView for each picture as instance variables, and same occurred using if and switch statements in the cellForItemAtIndexPath message.
Since IB was used, it may be a stretch to identify the bug, however, would you please help to identify the bug in case it is obvious from the code? Thanks.
#implementation AccountTableViewCell
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
[super setSelected:selected animated:animated];
// Configure the view for the selected state
imageArray = #[[UIImage imageNamed:#"image1.png"], [UIImage imageNamed:#"image2.png"], [UIImage imageNamed:#"image3.png"], [UIImage imageNamed:#"image4.png"], [UIImage imageNamed:#"image5.png"]];
self.oCollectionView.dataSource = self;
[self.oCollectionView setFrame:self.contentView.frame];
[self.contentView addSubview:self.oCollectionView];
self.oCollectionView.backgroundColor = [UIColor clearColor];
[self.oCollectionView reloadData];
}
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
return 1;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return imageArray.count;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"accountCell" forIndexPath:indexPath];
UIImageView* iv = [[UIImageView alloc] init];
[cell.contentView addSubview:iv];
[iv setFrame:cell.contentView.frame];
iv.image = imageArray[indexPath.row];
return cell;
}
#end
It's because you keep on adding an UIImageView to the cell each time it's dequeued.
Instead, you should subclass the UICollectionViewCell (let's call it "MYCollectionViewCell", add a UIImageView to the cell subclass in the storyboard and set the UIImageView as an outlet on the subclass.
Then, within cellForItemAtIndexPath, set that imageView's image like so:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
MyCollectionViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"accountCell" forIndexPath:indexPath];
cell.imageView.image = imageArray[indexPath.row];
return cell;
}

setScrollDirection: for CollectionView is not working

I implemented a Collection View programatically in a ViewController and I connected it with the Storyboard but the scrolling is not working and half of the cells do not appear since they are faded to the right:
- (void)viewDidLoad {
[super viewDidLoad];
[self.collectionView registerClass:[FotoCell class]
forCellWithReuseIdentifier:#"cell"];
UICollectionViewFlowLayout *myLayout = [[[UICollectionViewFlowLayout alloc]init]autorelease];
[myLayout setScrollDirection:UICollectionViewScrollDirectionHorizontal];
[self.collectionView setCollectionViewLayout:myLayout];
}
Do you know why?
You need to remove the registerClass line in viewDidLoad and set the reuse identifier in the Datasource method for UICollectionViewDelegate as follows -
- (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath: (NSIndexPath *)indexPath
{
FotoCell *cell = [cv dequeueReusableCellWithReuseIdentifier:#"cell" forIndexPath:indexPath];
....
return cell;
}