I'm building an app in iOS and I want the Cells in my CollectionView to highlight when touched, pretty much like the normal buttons. How can I achieve this in the didSelectItemAtIndexPath:(NSIndexPath *)indexPath method?
Try something like this:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
.....
if (cell.selected) {
cell.backgroundColor = [UIColor colorWithRed:255/255.0 green:255/255.0 blue:153/255.0 alpha:1]; // highlight selection
}
else
{
cell.backgroundColor = [UIColor clearColor]; // Default color
}
return cell;
}
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
UICollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];
cell.backgroundColor = [UIColor colorWithRed:255/255.0 green:255/255.0 blue:153/255.0 alpha:1]; // //cell.lblImgTitle.text = #"xxx";
}
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{
UICollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];
cell.backgroundColor = [UIColor clearColor];
}
If you subclassed the cell class, put this in your .m file
- (void)setSelected:(BOOL)selected
{
if(selected)
{
self.backgroundColor = [UIColor colorWithWhite:0.1 alpha:0.5];
}
else
{
self.backgroundColor = [UIColor whiteColor];
}
}
try this
cell.selectedBackgroundView.backgroundColor = [UIColor greenColor];
why can not change the background color through the cocoa pods?I new a user-defined collectionView cell class`
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
CHSMenuControlCell *cell = (CHSMenuControlCell*)[collectionView cellForItemAtIndexPath:indexPath];
cell.backgroundColor = [UIColor colorWithRed:255/255.0 green:255/255.0 blue:153/255.0 alpha:1]; // //cell.lblImgTitle.text = #"xxx";
}
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{
CHSMenuControlCell *cell = (CHSMenuControlCell *)[collectionView cellForItemAtIndexPath:indexPath];
cell.backgroundColor = [UIColor clearColor];
}
Related
I have a UICollectionView , Under that collection view i have custom UICollectionViewCell with A Image view and A label. I am trying to change color of label text of selected cell. But every time i am changing the color of label text, its changing in multiple cells . Can anyone help me with the issue?
The code i am using :
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
NSMutableDictionary *te =[self.smilyObject objectAtIndex:indexPath.row];
self.wallPostMood =[te objectForKey:#"title"];
NSLog(#"%#",self.wallPostMood);
EffectsCollectionViewCell *efCell = (EffectsCollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];
efCell.title.textColor = [UIColor orangeColor];
}
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath
{
EffectsCollectionViewCell *efCell = (EffectsCollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];
efCell.title.textColor = [UIColor grayColor];
}
I also have tried :
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
NSMutableDictionary *te =[self.smilyObject objectAtIndex:indexPath.row];
self.wallPostMood =[te objectForKey:#"title"];
NSLog(#"%#",self.wallPostMood);
NSArray* visibleCellIndex = collectionView.indexPathsForVisibleItems ;
for(NSIndexPath * path in visibleCellIndex){
EffectsCollectionViewCell *efCell = (EffectsCollectionViewCell *)[collectionView cellForItemAtIndexPath:path];
if([efCell.title.text isEqualToString:self.wallPostMood]){
// NSLog(#"%#",efCell);
// NSLog(#"got");
efCell.title.textColor = [UIColor orangeColor];
}else{
efCell.title.textColor = [UIColor grayColor];
}
}
}
I'm currently facing a problem where my collectionView changes the order of my items when they scroll off the screen and switches the selected cell. At the moment they're organized so that they scrolls vertically (and there are two items side by side):
Here is my - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath method:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
static NSString *identifier = #"FriendCell";
FriendsCell *cell = (FriendsCell *)[collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath];
//Friend Object
PFUser *friend = [self.friendsArray objectAtIndex:indexPath.item];
cell.friendId = currentFriend.objectId;
//Setup Cell
if (!cell.isSelected) {
cell.layer.backgroundColor = [UIColor whiteColor].CGColor;
} else {
cell.layer.backgroundColor = FlatGreen.CGColor;
}
//Set Profile Image
if (!cell.profileImageView) {
cell.profileImageView = [UIImageView new];
cell.profileImageView.image = [UIImage imageNamed:#"ProfileImagePlaceholder"];
[cell addSubview:cell.profileImageView];
}
//Set Username
if (!cell.usernameLabel) {
//Set Username Label
cell.usernameLabel = [UILabel new];
cell.usernameLabel.text = friend[#"username"];
cell.usernameLabel.textColor = [UIColor lightGrayColor];
[cell addSubview:cell.usernameLabel];
} else {
if (cell.isSelected) {
cell.usernameLabel.textColor = [UIColor whiteColor];
} else {
cell.usernameLabel.textColor = [UIColor lightGrayColor];
}
}
return cell;
}
didSelectItemAtIndexPath:
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
//Determine the selected friend by using the indexPath
PFUser *selectedFriend = [self.friendsArray objectAtIndex:indexPath.item];
//Add the selected friend's objectId to our array
[self.friendsToAdd addObject:selectedFriend.objectId];
//Show Selected View
FriendsCell *currentCell = (FriendsCell *)[collectionView cellForItemAtIndexPath:indexPath];
//Animate
[UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
//Update
currentCell.layer.backgroundColor = FlatGreen.CGColor;
currentCell.profileImageView.alpha = 0.0;
currentCell.usernameLabel.textColor = [UIColor whiteColor];
} completion:nil];
}
didDeselectItemAtIndexPath:
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath {
//Determine the selected friend by using the indexPath
PFUser *deselectedFriend = [self.friendsArray objectAtIndex:indexPath.item];
//Remove the deselected friend's objectId from our array
[self.friendsToAdd removeObject:deselectedFriend.objectId];
//Show Deselected View
FriendsCell *currentCell = (FriendsCell *)[collectionView cellForItemAtIndexPath:indexPath];
//Animate
[UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionTransitionFlipFromBottom animations:^{
//Update Card
currentCell.layer.backgroundColor = [UIColor whiteColor].CGColor;
currentCell.profileImageView.alpha = 1.0;
currentCell.usernameLabel.textColor = [UIColor lightGrayColor];
} completion:nil];
}
If anyone can spot why this is happening, I'd really appreciate it!
Try
dequeueReusableCellWithReuseIdentifier:nil
How to change iOS UICollectionViewCell background outside of the cell?
For instance, I have a view controller which implements UICollectionViewDelegate method:
- (void)viewDidLoad
{
[super viewDidLoad];
[self.collectionView registerClass:[MyCollectionViewCell class] forCellWithReuseIdentifier:MY_CELL_REUSE_IDENTIFIER];
}
- (BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
MyCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:MY_CELL_REUSE_IDENTIFIER forIndexPath:indexPath];
if (condition)
{
[self actionOne];
cell.backgroundColor = [UIColor redColor];
}
else
{
[self actionTwo];
cell.backgroundColor = [UIColor greenColor];
}
return YES;
}
Breakpoints inside of if (condition) statement shows, that desired lines are executed. But, sadly, cells background stays the same...
What is more, I am successfully doing practically the same thing id UICollectionViewDataSource method:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
MyCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:MY_CELL_REUSE_IDENTIFIER forIndexPath:indexPath];
cell.backgroundColor = [UIColor orangeColor];
}
What am I doing wrong?
Try cellForRowAtIndexPath in place ofdequeueReusableCellWithReuseIdentifier.
EDIT: Only in shouldSelectItemAtIndexPath.
Explanation: dequeueReusableCellWithReuseIdentifier will get you a new cell, that you change the background color of, but that cell never gets added to the table so you won't see it. When you use cellForRowAtIndexPath, you will get a cell from the table to edit.
This should do it:
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
MyCollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
if (condition)
{
[self actionOne];
cell.backgroundColor = [UIColor redColor];
}
else
{
[self actionTwo];
cell.backgroundColor = [UIColor greenColor];
}
}
I had worked with UITableView but I have never ever use of UICollectionView in my apps. So I want to create UICollectionView programmatically.
Following is my code:
UICollectionViewFlowLayout *layout =[[UICollectionViewFlowLayout alloc] init];
_collectionView=[[UICollectionView alloc] initWithFrame:CGRectMake(0, 43, self.view.frame.size.width, self.view.frame.size.height - 84) collectionViewLayout:layout];
[_collectionView setDataSource:self];
[_collectionView setDelegate:self];
[_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:#"cellIdentifier"];
layout.sectionInset = UIEdgeInsetsMake(5, 5, 5, 5);
layout.minimumInteritemSpacing = 5;
[_collectionView setBackgroundColor:self.view.backgroundColor];
[self.view addSubview:_collectionView];
Delegate and Datasource methods.
#pragma mark -
#pragma mark - UITableView Delegate Methods
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return 15;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cellIdentifier" forIndexPath:indexPath];
if (cell.selected)
cell.backgroundColor = [UIColor lightGrayColor]; // highlight selection cell
else
cell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background-grid.png"]]; // Default Cell
UIImageView *imgPhoto = [[UIImageView alloc] init];
imgPhoto.userInteractionEnabled = YES;
imgPhoto.backgroundColor = [UIColor grayColor];
imgPhoto.frame = CGRectMake(3.5, 5, 90, 80);
imgPhoto.clipsToBounds = YES;
imgPhoto.image = [UIImage imageNamed:#"product.png"];
[cell.contentView addSubview:imgPhoto];
UILabel *lblCategoryTitle = [[UILabel alloc] init];
[lblCategoryTitle setFont: [UIFont fontWithName:#"OpenSans-Bold" size:14]];
lblCategoryTitle.textAlignment = NSTextAlignmentCenter;
lblCategoryTitle.frame = CGRectMake(3.5, 90, 90, 24);
lblCategoryTitle.textColor = [UIColor blackColor];
lblCategoryTitle.text = #"Product 1";
lblCategoryTitle.backgroundColor = [UIColor clearColor];
lblCategoryTitle.numberOfLines = 2;
[cell.contentView addSubview:lblCategoryTitle];
return cell;
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(97, 118);
}
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewCell *datasetCell =[collectionView cellForItemAtIndexPath:indexPath];
datasetCell.backgroundColor = [UIColor lightGrayColor]; // highlight selection
}
-(void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewCell *datasetCell =[collectionView cellForItemAtIndexPath:indexPath];
datasetCell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background-grid.png"]]; // default cell
}
Then my screen Look like
Question 1 - Look at above screen, you will see that 1st and 3rd item is looking blur (see Product 1 ) then 2nd/middle item ? why this is happening ?
And whenever I scroll up/down UICollectionView then items are overwrite, Look at Next image
After looked this image, from my experience of UITableView, it's happening because of Reusability of cell of UICollectionView.
Question 2 - Then how can i solve it?
Please give my your suggestion and help me on this issue.
EDITED: (suggestion of #Dima)
Custom cell
.h file
#import <UIKit/UIKit.h>
#interface customeGridCell : UICollectionViewCell
#property (nonatomic, strong) UIImageView *imgPhoto;
#property (nonatomic, strong) UILabel *lblCategoryTitle;
#end
.m file
#import "customeGridCell.h"
#implementation customeGridCell
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self)
{
self.imgPhoto = [[UIImageView alloc] init];
self.imgPhoto.userInteractionEnabled = YES;
self.imgPhoto.backgroundColor = [UIColor grayColor];
self.imgPhoto.frame = CGRectMake(3.5, 5, 90, 80);
[self addSubview:self.imgPhoto];
self.lblCategoryTitle = [[UILabel alloc] init];
[self.lblCategoryTitle setFont: [UIFont fontWithName:#"OpenSans-Bold" size:14]];
self.lblCategoryTitle.textAlignment = NSTextAlignmentCenter;
self.lblCategoryTitle.frame = CGRectMake(3.5, 90, 90, 24);
self.lblCategoryTitle.textColor = [UIColor blackColor];
self.lblCategoryTitle.backgroundColor = [UIColor clearColor];
self.lblCategoryTitle.numberOfLines = 2;
[self addSubview:self.lblCategoryTitle];
}
return self;
}
And code of cellForItemAtIndexPath
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
customeGridCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cellIdentifier" forIndexPath:indexPath];
if (cell.selected)
cell.backgroundColor = [UIColor lightGrayColor]; // highlight selection cell
else
cell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background-grid.png"]]; // Default Cell
cell.imgPhoto.image = [UIImage imageNamed:#"product.png"];
cell.lblCategoryTitle.text = #"Product 1";
return cell;
}
The problem is in your collectionView:cellForItemAtIndexPath: method. You are adding those subviews every single time a cell is reused, on top of each other.
You should create a UICollectionViewCell subclass and add all of the extra subviews you want into its initializer. This will make sure they only get added once.
sample code:
Here is an example of how you would subclass UICollectionViewCell
#interface MyCustomCell : UICollectionViewCell
#property (nonatomic, strong) UILabel *customLabel;
#property (nonatomic, strong) UIImageView *customImageView;
#end
// in implementation file
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self)
{
// initialize label and imageview here, then add them as subviews to the content view
}
return self;
}
Then when you are grabbing a cell you just do something like:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
MyCustomCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cellIdentifier" forIndexPath:indexPath];
if (cell.selected)
cell.backgroundColor = [UIColor lightGrayColor]; // highlight selection cell
else
cell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background-grid.png"]]; // Default Cell
cell.customImageView.image = // whatever
cell.customLabel.text = // whatever
return cell;
}
You can do it with two way.
Remove UILabel form view.
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cellIdentifier" forIndexPath:indexPath];
for (UILabel *lbl in cell.contentView.subviews)
{
if ([lbl isKindOfClass:[UILabel class]])
{
[lbl removeFromSuperview];
}
}
UILabel *lblCategoryTitle =[[UILabel alloc]init];
[lblCategoryTitle setFont: [UIFont fontWithName:#"OpenSans-Bold" size:14]];
lblCategoryTitle.textAlignment = NSTextAlignmentCenter;
lblCategoryTitle.frame = CGRectMake(3.5, 90, 90, 24);
lblCategoryTitle.textColor = [UIColor blackColor];
lblCategoryTitle.text = #"Product 1";
lblCategoryTitle.backgroundColor = [UIColor clearColor];
lblCategoryTitle.numberOfLines = 2;
[cell.contentView addSubview:lblCategoryTitle];
return cell;
}
Use tag to get Label
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cellIdentifier" forIndexPath:indexPath];
UILabel *lblCategoryTitle =(UILabel *) [cell viewWithTag:5];
if (!lblCategoryTitle) {
lblCategoryTitle=[[UILabel alloc]init];
[cell.contentView addSubview:lblCategoryTitle];
}
[lblCategoryTitle setFont: [UIFont fontWithName:#"OpenSans-Bold" size:14]];
lblCategoryTitle.tag=5;
lblCategoryTitle.textAlignment = NSTextAlignmentCenter;
lblCategoryTitle.frame = CGRectMake(3.5, 90, 90, 24);
lblCategoryTitle.textColor = [UIColor blackColor];
lblCategoryTitle.text = #"Product 1";
lblCategoryTitle.backgroundColor = [UIColor clearColor];
lblCategoryTitle.numberOfLines = 2;
return cell;
}
I am trying to highlight a selected collection cell in UICollectionView with yellow border so user can see which one is currently selected. I tried this:
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
FilterCell *filterCell = (FilterCell *)[collectionView dequeueReusableCellWithReuseIdentifier:#"FilterCell" forIndexPath:indexPath];
filterCell.window.backgroundColor = [UIColor yellowColor];
filterCell.backgroundColor = [UIColor yellowColor];
NSLog(#"hello");
}
There are 2 empty pixels around UIImageView inside UICollectionViewCell so it should work but it doesn't.
It is logging "hello" but the border stays black. See this screenshot:
You are getting the cell in the wrong way
FilterCell *filterCell = (FilterCell *)[collectionView dequeueReusableCellWithReuseIdentifier:#"FilterCell" forIndexPath:indexPath];
will dequeue a cell which is not used right now or allocate a new one with the specified identifier.
Use
FilterCell *filterCell = (FilterCell *)[collectionView cellForItemAtIndexPath:indexPath];
instead.
Anyway a cleaner solution would be to set the backgroundView and selectedBackgroundView properties of the cell, without touching the backgroundProperty color (that will stay clear as default). In this way you can avoid the delegate method and achieve the same behavior.
Do a reloadItemsAtIndexPaths: there instead, then in cellForItemAtIndexPath, check if [[collectionView indexPathsForSelectedItems] containsObject:indexPath] If true, change the cell's attributes there.
This may help you:
cell.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"YOUR_FILE_NAME.png"]];
-This code may help you to change background colour of selected cell
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cvCell" forIndexPath:indexPath];
if (cell.selected) {
cell.backgroundColor = [UIColor blueColor]; // highlight selection
}
else
{
cell.backgroundColor = [UIColor redColor]; // Default color
}
return cell;
}
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewCell *datasetCell =[collectionView cellForItemAtIndexPath:indexPath];
datasetCell.backgroundColor = [UIColor blueColor]; // highlight selection
}
-(void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *datasetCell =[collectionView cellForItemAtIndexPath:indexPath];
datasetCell.backgroundColor = [UIColor redColor]; // Default color
}