I make a custom UICollectionViewCell and add a subView to its contentView:
BooksCell.h
#interface BooksCell : UICollectionViewCell
#property (strong, nonatomic) UIImageView *certifyImageView;
#end
BooksCell.m
- (id)initWithFrame:(CGRect)frame {
self= [super initWithFrame:frame];
if(self){
_coverImageView = [[UIImageView alloc] initWithFrame:CGRectMake(15, 15, 88, 117)];
_coverImageView.userInteractionEnabled = YES;
[self.contentView addSubview:_coverImageView];
UIImage *certifyImage = [UIImage imageNamed:#"13-6.png"];
_certifyImageView = [[UIImageView alloc] initWithFrame:CGRectMake(17.5, _coverImageView.frame.size.height-3, certifyImage.size.width, certifyImage.size.height)];
_certifyImageView.image = certifyImage;
_certifyImageView.hidden = YES;
}
return self;
}
ViewController
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
BooksCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"BooksCell" forIndexPath:indexPath];
cell.coverImageView.image = [UIImage imageNamed:#"13-5.png"];
// **Here I want some cell display certifyImageView and some not.**
if(indexPath.row%2==0){
cell.certifyImageView.hidden = NO;
}
return cell;
}
I add the collectionView as subView to the Viewcontroller, and set it's frame correctly, now the collectionView displaied coverImageView and certifyImageView normally, but when I scroll the collectionView, certifyImageView displaied on the wrong cell,I guess it maybe caused by the Reuse Cell, and how to sole it?
I think because it is reusing the cell that already set the certifyImageView.hidden to NO so you have to set it back to YES
Maybe try this
if(indexPath.row%2==0){
cell.certifyImageView.hidden = NO;
}
else{
cell.certifyImageView.hidden = YES;
}
This way you will make sure that the certifyImageView will be set to hidden if thats what you want.
Related
I am trying to use a collection view and reuse a collection view cell and I have to get 23 images and name from server which I have not started coz of the problem I am facing
This is my custom cell file collection view file objective c
Below is my custom cell.h
#import <UIKit/UIKit.h>
#interface CustomCell : UICollectionViewCell
{
UIImageView *imageView;
}
#property (nonatomic, retain) UIImageView *imageView; //this imageview is the only thing we need right now.
#end
Here is my custom cell.m file
#import "CustomCell.h"
#implementation CustomCell
#synthesize imageView;
- (id)initWithFrame:(CGRect)aRect
{
if (self = [super initWithFrame:aRect])
{
//we create the UIImageView in this overwritten init so that we always have it at hand.
imageView = [[UIImageView alloc] init];
//set specs and special wants for the imageView here.
[self addSubview:imageView]; //the only place we want to do this addSubview: is here!
//You wanted the imageView to react to touches and gestures. We can do that here too.
UITapGestureRecognizer * tap=[[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(onButtonTapped:)];
[tap setNumberOfTapsRequired:1];
[self addGestureRecognizer:tap];
//We can also prepare views with additional contents here!
//just add more labels/views/whatever you want.
}
return self;
}
-(void)onButtonTapped:(id)sender
{
//the response to the gesture.
//mind that this is done in the cell. If you don't want things to happen from this cell.
//then you can still activate this the way you did in your question.
}
#end
These are the methods in my normal view controller.m file
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cvCell" forIndexPath:indexPath];
[[[cell contentView] subviews] makeObjectsPerformSelector:#selector(removeFromSuperview)];
// create a uiview where we can place all views that need to go into this cell
UIView * contents=[[UIView alloc] initWithFrame:cell.contentView.bounds];
[contents setBackgroundColor:[UIColor clearColor]];
[cell.contentView addSubview:contents];
// set tag to the indexPath.row so we can access it later
[cell setTag:indexPath.row];
// add interactivity
UITapGestureRecognizer * tap=[[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(onButtonTapped:)];
[tap setNumberOfTapsRequired:1];
[cell addGestureRecognizer:tap];
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
}
I don't get any cell when I moved to this view, it is just blank with the background image and I have even given a blank picture to see how the view is but I don't get anything please help!!!
The cells are not displaying because you might not have set the datasource and delegate properly.
Since you have added the cells in storyboard you don't need to add the imageview as subview in the collection view cell.
First connect the outlet of imageview that you have added in storyboard to the CustomCell. Then remove
{
UIImageView *imageView;
}
#property (nonatomic, retain) UIImageView *imageView;
You can remove - (id)initWithFrame:(CGRect)aRect this method and you can add the tap gesture initialization in awakeFromNib method
-(void)awakeFromNib {
UITapGestureRecognizer * tap=[[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(onButtonTapped:)];
[tap setNumberOfTapsRequired:1];
[self addGestureRecognizer:tap];
}
No need to do
imageView = [[UIImageView alloc] init];
[self addSubview:imageView];
Again in cellForItemAtIndexPath
remove the following lines
[[[cell contentView] subviews] makeObjectsPerformSelector:#selector(removeFromSuperview)];
UIView * contents=[[UIView alloc] initWithFrame:cell.contentView.bounds];
[contents setBackgroundColor:[UIColor clearColor]];
[cell.contentView addSubview:contents];
After making these changes please try again
I'm create UICollectionView programmatically to uiview (i use single view). like this
UICollectionViewFlowLayout *CATLayout=[[UICollectionViewFlowLayout alloc]init];
CATLayout.minimumInteritemSpacing = 2.0f;
CATLayout.minimumLineSpacing = 2.0f;
CATLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
CATLayout.sectionInset = UIEdgeInsetsMake(1.0f, 1.0f, 1.0f, 1.0f);
self.ColStickersListView=[[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, StickersListView.frame.size.width, StickersListView.frame.size.height) collectionViewLayout:CATLayout];
self.ColStickersListView.delegate=self;
self.ColStickersListView.dataSource=self;
self.ColStickersListView.tag=2;
[self.ColStickersListView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:#"CollStickersList"];
[self.ColStickersListView setBackgroundColor:[UIColor clearColor]];
[StickersListView addSubview:ColStickersListView];
and
UICollectionViewCell *cell = [ColStickersListView dequeueReusableCellWithReuseIdentifier:#"CollStickersList" forIndexPath:indexPath];
// for background selected
NSString *imageName=anObject;
NSString *filename=[NSString stringWithFormat:#"%#/Stickers/List/%#",[appDel DocsPath],imageName];
NSLog(#"%#",filename);
cell.backgroundColor=[UIColor clearColor];
UIImage *image=[UIImage imageNamed:filename];
UIImageView *photoView=[[UIImageView alloc]initWithFrame:CGRectMake(StickersListPadding,StickersListPadding,StickersListThumbSize-(StickersListPadding*2),StickersListThumbSize-(StickersListPadding*2))];
photoView.image=image;
photoView.contentMode=UIViewContentModeScaleAspectFit;
photoView.userInteractionEnabled = YES;
[cell.contentView addSubview:photoView];
return cell;
it's work perfect for display image to cell.
Problem !!
if scroll page to bottom and scroll return to top again that image in cell it's overlap.
How to fix it.!!! (Programmatically only with single view)
I suspect because you aren't setting the frame on the UIImageView it is deriving its size from the image that is being set on it. So in some cases it might overflow its parent view -> the cell in this case.
I suggest you setup some constraints on the UIImageView, this can be done programmatically.
So try to set left, right, top and bottom constraints on the UIIMageView so that it stays within the bounds of the cell
During scroll
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath is beeing called repeatively..
the means your are adding UIImageView *photoView repeatedly to cell.contentView
UIImageView *photoView=[[UIImageView alloc]initWithFrame:CGRectMake(StickersListPadding,StickersListPadding,StickersListThumbSize-(StickersListPadding*2),StickersListThumbSize-(StickersListPadding*2))];
//codes..
[cell.contentView addSubview:photoView];
doing something like this prevent that:
UICollectionViewCell *cell = [ColStickersListView dequeueReusableCellWithReuseIdentifier:#"CollStickersList" forIndexPath:indexPath];
if (cell == nil)
{
UIImageView *photoView=[[UIImageView alloc]initWithFrame:CGRectMake(StickersListPadding,StickersListPadding,StickersListThumbSize-(StickersListPadding*2),StickersListThumbSize-(StickersListPadding*2))];
// codes...
[cell.contentView addSubview:photoView];
}
Another way of solving this is by creating a custom collection cell:
// CustomCollectionCell.h
#interface YourCollectionCell : UICollectionViewCell
#property (nonatomic) UIImageView *photoView;
#end
// CustomCollectionCell.m
#implementation YourCollectionCell
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// and setting up you imageview here
self.photoView=[[UIImageView alloc]initWithFrame:YourRect];
self.photoView.contentMode=UIViewContentModeScaleAspectFit;
self.photoView.userInteractionEnabled = YES;
[self.contentView addSubview:self.photoView];
}
return self;
}
and using it like:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
CustomCollectionCell *cell = (CustomCollectionCell *)[ColStickersListView dequeueReusableCellWithReuseIdentifier:#"CollStickersList" forIndexPath:indexPath];
cell.photoView.image=image;
return cell;
}
Hope i've helped you, happy coding.. Cheers & Good night!
I am building an application that looks like a Photo Gallery.
I follow different references, but It still not run.
The problem is with the imageView in the cell, because if I try to change the backgroundColor of the cell it works, in spite of if I try to change the image of the imageView it doesn't run.
- (void)viewDidLoad {
[super viewDidLoad];
_ownImages = [#[#"1.jpg",
#"2.jpg",
#"2.jpg",
#"3.jpg"] mutableCopy];
self.view = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
UICollectionViewFlowLayout *layout=[[UICollectionViewFlowLayout alloc] init];
_photoGallery =[[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:layout];
[_photoGallery setDataSource:self];
[_photoGallery setDelegate:self];
[_photoGallery registerClass:[PhCell class] forCellWithReuseIdentifier:#"photoCell"];
[self.view addSubview:_photoGallery];
}
Here I change the option of the CollectionView
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
return 1;
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(100, 100);
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return _ownImages.count;
}
And finally, I create the Cell
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
cellForItemAtIndexPath:(NSIndexPath *)indexPath {
PhCell *myCell = [_photoGallery dequeueReusableCellWithReuseIdentifier:#"photoCell" forIndexPath:indexPath];
long row = [indexPath row];
NSLog(#"%#", _ownImages[row]);
image = [UIImage imageNamed:_ownImages[row]];
myCell.backgroundColor = [UIColor clearColor];
myCell.imageView.image = image;
return myCell;
}
To implement the custom Cell I create an UICollectionViewCell called PhCell. In this Class I set an xib file for the cellView in which there is an imageView connected to the variable
#property (strong, nonatomic) IBOutlet UIImageView *imageView;
in PhCell.h
The code is free of errors, but it not display the image, why?
Just try to set the imagebackground is another color, like yellow, and let see the image is shown or not.
In the line image = [UIImage imageNamed:_ownImages[row]]; I can see you have not inited the image.
I have UICollectionViewCell
#import "DBPhotoCollectionViewCell.h"
#define IMAGEVIEW_BORDER_LENGTH 5
#implementation DBPhotoCollectionViewCell
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
[self setup];
}
return self;
}
/* Need to implement the initWithCoder method since this class will be created from the storyboard */
-(id)initWithCoder:(NSCoder *)aDecoder
{
self = [super initWithCoder:aDecoder];
if (self){
[self setup];
}
return self;
}
/* Create the UIImageView and add it to the cell's contentView in code. */
-(void)setup
{
self.imageView = [[UIImageView alloc] initWithFrame:CGRectInset(self.bounds, IMAGEVIEW_BORDER_LENGTH, IMAGEVIEW_BORDER_LENGTH)];
[self.contentView addSubview:self.imageView];
}
#end
And call this Cell from CollectionViewController class
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
static NSString *CellIdentifier = #"Photo Cell";
DBPhotoCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
cell.backgroundColor = [UIColor whiteColor];
cell.imageView.image = [UIImage imageNamed:#"Astronaut.jpg"];
// Configure the cell
return cell;
}
But I have one problem when I start my application my picture is showed with small size. What I missed?
http://screencast.com/t/ia8tE05P6yc
http://screencast.com/t/33N4AhT7
cell.imageView, imageView object is not same as which you have added on cell of Interface Builder. UICollectionViewCell has default size UIImageView which are accessing, you can access your customView imageView in cellForIndexPath method of collectionView by linking imageView of subClass DBPhotoCollectionViewCell in interface builder you don't need to add [self.contentView addSubview:self.imageView]; in setup method.
Second approach would be assign tag value to imageView when you adding to cell contentView
/* Create the UIImageView and add it to the cell's contentView in code. */
-(void)setup
{
self.imageView = [[UIImageView alloc] initWithFrame:CGRectInset(self.bounds, IMAGEVIEW_BORDER_LENGTH, IMAGEVIEW_BORDER_LENGTH)];
self.imageView.tag=1;
[self.contentView addSubview:self.imageView];
}
//And access imagView in cellForIndexPath
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
static NSString *CellIdentifier = #"Photo Cell";
DBPhotoCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
cell.backgroundColor = [UIColor whiteColor];
UIImageView *imageView=[cell.contentView viewWithTag:1];
imageView.image = [UIImage imageNamed:#"Astronaut.jpg"];
// Configure the cell
return cell;
}
I have created a UICollectionView programmatically. I use a custom UICollectionViewCell subclass. Inside the cell class, I create a label with a class of my own (easier and quicker to set up its appearance).
The problem I'm having is : for several cells, the collectionView does not layout the label content. I know that the data is here (print in the console) that is, the text property of the cell does contain the string data I want to show, but for some reason the collectionView does not display the label content.
I tried with a simple test (print 'toto' inside the label) and I get a few toto's here and there, but not in all of the cells. As you can see I have 2 UICollectionViews inside the same ViewController, and this is why I test whether it's one or the other in the DataSource implementation.
Please tell me if you need more code.
Here's the code :
-(void)createBottomCollectionView {
// Layout
UICollectionViewFlowLayout *collectionViewLayout = [[UICollectionViewFlowLayout alloc] init];
collectionViewLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
collectionViewLayout.minimumLineSpacing = 0.0;
// UICollectionView
self.bottomCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(20, 354+20, 320-2*20, 35) collectionViewLayout:collectionViewLayout];
self.bottomCollectionView.showsHorizontalScrollIndicator = NO;
self.bottomCollectionView.bounces = YES;
self.bottomCollectionView.alwaysBounceHorizontal = YES;
self.bottomCollectionView.alwaysBounceVertical = NO;
self.bottomCollectionView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
self.bottomCollectionView.dataSource = self;
self.bottomCollectionView.delegate = self;
[self.bottomCollectionView registerClass:[SetFormatCollectionViewCell class] forCellWithReuseIdentifier:SetFormatCollectionViewCellIdentifier];
// Background
self.bottomCollectionView.backgroundColor = [UIColor clearColor];
[self.view addSubview:self.bottomCollectionView];
[self.bottomCollectionView reloadData];
}
CollectionView datasource (dumb test with a "toto" value) in the real app I pull data with CoreData
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
if (collectionView == self.bottomCollectionView) {
SetFormatCollectionViewCell *cell = (SetFormatCollectionViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:SetFormatCollectionViewCellIdentifier forIndexPath:indexPath];
cell.text = #"toto";
return cell;
}
if (collectionView == self.collectionView) {
TrackingSetCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:TrackingSetCollectionViewCellIdentifier forIndexPath:indexPath];
[self configureCell:cell atIndexPath:indexPath];
return cell;
}
return nil;
}
Custom Cell class :
#interface SetFormatCollectionViewCell : UICollectionViewCell
#property (strong,nonatomic) NSString *text;
#end
#implementation SetFormatCollectionViewCell
{
FormatLabel *aFormatLabel;
}
-(id)initWithFrame:(CGRect)frame {
if (self=[super initWithFrame:frame]) {
// Initialization code
aFormatLabel = [[FormatLabel alloc]initWithFrame:self.frame textColor:[UIColor blackColor] font:[UIFont fontWithName:#"ITCAvantGardeStd-Bk" size:22] alpha:1.0f border:YES];
[self.contentView addSubview:aFormatLabel];
}
return self;
}
-(void)prepareForReuse {
[super prepareForReuse];
self.text = #"";
}
-(void)setText:(NSString *)text {
_text = [text copy];
aFormatLabel.text = self.text;
}
FormatLabel Class (not important I think)
#interface FormatLabel ()
#property (assign,nonatomic) UIEdgeInsets edgeInsets;
#end
#implementation FormatLabel
-(id)initWithFrame:(CGRect)frame textColor:(UIColor *)color font:(UIFont *)font alpha:(CGFloat)alphaValue border:(BOOL)withBorder{
self = [super initWithFrame:frame];
if (self) {
// Set up
self.textAlignment = NSTextAlignmentCenter;
self.baselineAdjustment = UIBaselineAdjustmentAlignCenters;
self.adjustsFontSizeToFitWidth = YES;
self.textColor = color;
self.alpha = alphaValue;
self.font = font;
if (withBorder) {
self.layer.borderWidth = 1.0f;
self.layer.borderColor = color.CGColor;
}
self.edgeInsets = UIEdgeInsetsMake(9, 6, 8, 6);
}
return self;
}
Thanks for helping
EDIT: for those who might have the same issue, I post 3 shots of the problem (you can find the answer just below). The 2nd shot contains colored cell the see the problem. The third shot is the one that I took just after accepting jmkk's answer.
Thanks for all the other answers!
Your problem lies with positioning of the FormatLabel view within the cell.
You're using cell's frame as the frame for the label, while what you need is the cell's bounds.
Cell's frame is relative to its superview, so applying the same position to cell's subview renders it offset relative to the cell itself.
Fix your code to do this:
aFormatLabel = [[FormatLabel alloc]initWithFrame:self.bounds textColor:[UIColor blackColor] font:[UIFont fontWithName:#"ITCAvantGardeStd-Bk" size:22] alpha:1.0f border:YES];