UIImageView inside a UITableViewCell - objective-c

I'm trying to display a UIImageView inside a UITableViewCell.
Inside method - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath I have:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}
CGSize cellSize = cell.frame.size;
CGFloat cellWidth = cellSize.width;
CGFloat cellHeight = cellSize.height;
CGRect imageFrame = CGRectMake(0, 0, 70, cellHeight);
UIImageView * image = [[UIImageView alloc] initWithFrame:imageFrame];
[image setImage:[UIImage imageWithContentsOfFile:#"cyan.jpg"]];
CGRect nameFrame = CGRectMake(80, 0, cellWidth-80, cellHeight/2);
UILabel * nameLabel = [[UILabel alloc] initWithFrame:nameFrame];
nameLabel.text = #"Name: John Doe";
CGRect jobFrame = CGRectMake(80, 20, cellWidth-80, cellHeight/2);
UILabel * jobLabel = [[UILabel alloc] initWithFrame:jobFrame];
jobLabel.text = #"Job: IT-Consultant";
[cell addSubview:image];
[cell addSubview:nameLabel];
[cell addSubview:jobLabel];
return cell;
}
The labels are displaying perfectly but I don't see the image.
Any help would be appreciated.

imageWithContentsOfFile: expects a path to be sent to it. Use imageNamed: instead, or get hold of the path first by using NSBundle's pathForResource... methods first to get the path.
Also, if the image is the same for every cell, you should add the image view inside the cell=nil block, or you will be adding the view over and over again.

Add it to the UITableViewCell contentView instead.
[cell.contentView addSubview:...];

Use the UITableViewCell's imageView property instead of what you're doing. To be more clear, use cell.imageView.image and set your UIImage to that.
Or if you wish the image's location to be more flexible, add the imageView to the cell's contentView. i.e: [cell.contentView addSubview:yourImageView];

Related

Changing selectioncolor for UITableView grouped

Currently I'm trying to change the background selection color of a grouped UITableViewCell (non-subclassed) with the following code:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
...
cell.selectionStyle = UITableViewCellSelectionStyleNone;
}
- (void)tableView:(UITableView *)tableView didHighlightRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
cell.contentView.backgroundColor = [UIColor yellowColor];
}
The following problem occurs:
Also Tried:
cell.selectedBackgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, cell.frame.size.width - 17, cell.frame.size.height-3)];
cell.selectedBackgroundView.backgroundColor = coolBlue;
UIBezierPath *rounded;
rounded = [UIBezierPath bezierPathWithRoundedRect:cell.selectedBackgroundView.bounds byRoundingCorners:UIRectCornerAllCorners cornerRadii:CGSizeMake(8.0f, 8.0f)];
else
rounded = [UIBezierPath bezierPathWithRoundedRect:cell.selectedBackgroundView.bounds byRoundingCorners:UIRectCornerTopLeft|UIRectCornerTopRight cornerRadii:CGSizeMake(8.0f, 8.0f)];
CAShapeLayer *shape = [[CAShapeLayer alloc] init];
[shape setPath:rounded.CGPath];
cell.selectedBackgroundView.layer.mask = shape;
When I try using the above code part of the bottom of the cell gets cut off when I try to subtract 3 from the height. I'm subtracting 3 pixels in attempt to maintain the separator line.
Have you tried just using:
[cell setBackgroundColor:[UIColor yellowColor]];
It seems to work for me but my tableView might be set up differently than yours.

add project with app delegate

I'm trying to add a dynamic horizontal scroll to a table cell.
I found an example after searching for a while, but since the example project only was the view it was directly connected to the app delegate which contained the majority of the relevant code. Most of it within applicationDidFinishLaunching.
Do any of you know how I am supposed to add this code to my project?
Thanks in advance, Tom
EDIT:
Here's the link to the sample project i downloaded: http://blog.sallarp.com/wp-content/uploads/2008/11/slidemenu.zip
Here's the youtube clip of how it's supposed to work: http://www.youtube.com/watch?v=wFqBNXZ4SHI
EDIT 2 (New code):
"famorables" is declared with 5 one-word-strings
- (UITableViewCell *)tableView:(UITableView *)aTableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"MyFamorablesCell";
UITableViewCell *cell;
//Create Cell
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}
//Create a UIScroll View
UIScrollView *scrollview = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 80)];
scrollview.contentSize = CGSizeMake(self.view.frame.size.width * 2, 80);
scrollview.showsHorizontalScrollIndicator = NO;
float totalButtonWidth = 0.0f;
famorableArray = self.famorables;
for(int i = 0; i < [self.famorables count]; i++){
UIButton *famorableButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[famorableButton setFrame:CGRectMake(0.0f, 0.0f, 100.0f, 30.0f)];
[famorableButton setTitle:[NSString stringWithFormat:#"%#", [famorableArray objectAtIndex:[indexPath row]]] forState:UIControlStateNormal];
// Move the buttons position in the x-demension (horizontal).
CGRect btnRect = famorableButton.frame;
btnRect.origin.x = totalButtonWidth;
[famorableButton setFrame:btnRect];
// Add the button to the scrollview
[scrollview addSubview:famorableButton];
// Add the width of the button to the total width.
totalButtonWidth += famorableButton.frame.size.width;
}
[cell.contentView addSubview:scrollview];
return cell;
}
Okay Try this
- (UITableViewCell *)tableView:(UITableView *)aTableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell;
//Create Cell
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}
//Create a UIScroll View
UIScrollView scrollview = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, (it will be the height of the Cell u want))];
scrollview.contentSize = CGSizeMake(self.view.frame.size.width * 2,(it will be the height of the Cell u want));
scrollview.showsHorizontalScrollIndicator = NO;
/*
Now add every this u might want to add in ur Scroll view.
keep that in mind that the height and width of contentSize and ScrollView will be depandent on ur requirement
Make sure u add every thing u want in the Scroll view will be the part of Scroll View
like for label
//Add Something to Scroll View
[scrollView addSubview:label];
*/
//Add Scroll view to Cell
[cell.contentView addSubview:scrollView];
return cell;
}
This will Work
In case of any queries feel free to ask

Event not triggered for UIButton in UIView in UITableViewCell

In my UITableViewCell I have an UIImageView with a UIButton.
Here my code
My problem is that each time I try to click on the UIButton the UITableViewCell is triggered by the TouchUpInside event and not the UIBUtton.
Can you please help me?
This is my code.. here I use a UIButton inside the UITableViewCell and it works perfectly for me.. Hope this will help you..
// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
NSString *CellIdentifier = #"ChildList";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
itsChildContactsTableView = tableView;
if (cell == nil)
{
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault
reuseIdentifier:CellIdentifier] autorelease];
}
// we need a view to place our labels on.
UIView *aTableCellContentView = [[UIView alloc] initWithFrame:CGRectZero];
CGRect contentRect = aTableCellContentView.bounds;
CGFloat boundsX = contentRect.origin.x;
CGRect frame;
frame = CGRectMake(boundsX + 10, 8, 200, 20);
UIButton *aCallButton = [UIButton buttonWithType:UIButtonTypeCustom];
[aCallButton setImage:[UIImage imageNamed:#"call.png"] forState:UIControlStateNormal];
[aCallButton addTarget:self action:#selector(dialNumber:) forControlEvents:UIControlEventTouchUpInside];
[aCallButton setTag:[indexPath row]];
frame = CGRectMake(210, 14, 35, 35);
aCallButton.frame = frame;
UIButton *aEmailButton = [UIButton buttonWithType:UIButtonTypeCustom];
[aEmailButton setImage:[UIImage imageNamed:#"mail.png"] forState:UIControlStateNormal];
[aEmailButton addTarget:self action:#selector(eMailContact:) forControlEvents:UIControlEventTouchUpInside];
[aEmailButton setTag:[indexPath row]];
frame = CGRectMake(250, 14, 35, 35);
aEmailButton.frame = frame;
aTableCellContentView.backgroundColor = [UIColor whiteColor];
[cell.contentView addSubview:aCallButton];
[cell.contentView addSubview:aEmailButton];
[cell.contentView addSubview:aTableCellContentView];
[aTableCellContentView release];
return cell;
}
if your UITableViewCell has a customer height(not the default 44.0f)。 if so, you should set the code like this:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *cellID = #"cellID";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellID];
cell.contentView.frame = CGRectMake(0, 0, tableView.width, [self tableView:tableView heightForRowAtIndexPath:indexPath]);
// add a UIButton that you create
}
return cell;
}
the reason for this problem is the cell.contentView.size is default (320.f, 44.0f), if your button is over the rect, then the button could not accept the event, so you should set the cell.contentView.frame yourself, like i do the code。
Good Luck。

UITableViewCell with images in different dimensions

I'm trying to use my ReusableCell for cells with images in different dimensions. The images are put inside a 220x150 black box with with scaling UIViewContentModeScaleAspectFit.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"NewsTableViewCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}
NewsItem *item = [self.fetchedResultsController objectAtIndexPath:indexPath];
NSData *data = [NSData dataWithContentsOfURL:[NSURL URLWithString:item.imageUrl]];
[cell.imageView setImage:[[UIImage alloc] initWithData:data]];
[cell.imageView setBackgroundColor:[UIColor blackColor]];
[cell.imageView setContentMode:UIViewContentModeScaleAspectFit];
CGRect imageViewFrame = cell.imageView.frame;
imageViewFrame.size.width = 220;
imageViewFrame.size.height = 150
[cell.imageView setFrame:imageViewFrame];
[cell.textLabel setText:item.title];
return cell;
}
The above code results in a layout like below and the images are sometimes changing when scrolling in the table view.
Instead of this unstructured layout, I would like the images to be aligned like this:
What am I doing wrong with this ReusableCell?
EDIT1:
I'm trying to create an imageView and add this imageView as a superview to cell.contentView.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"NewsTableViewCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}
NewsItem *item = [self.fetchedResultsController objectAtIndexPath:indexPath];
UIImage *placeholderImage = [UIImage imageNamed:#"ImagePlaceholderThumb"]; //220x150
UIImageView *imageView = [[UIImageView alloc] initWithImage:placeholderImage];
NSData *data = [NSData dataWithContentsOfURL:[NSURL URLWithString:item.imageUrl]];
[imageView setImage:[[UIImage alloc] initWithData:data]];
[imageView setBackgroundColor:[UIColor blackColor]];
[imageView setContentMode:UIViewContentModeScaleAspectFit];
CGRect imageViewFrame = imageView.frame;
imageViewFrame.size.width = placeholderImage.size.width;
imageViewFrame.size.height = placeholderImage.size.height;
[imageView setFrame:imageViewFrame];
[cell.contentView addSubview:imageView];
[cell.textLabel setText:item.title];
return cell;
}
The above code results in the following:
It is like some of the images are visible in two cells. It seems that they are not keeping the size I've set in the imageViewFrame. Do you know why?
A quick fix would be using content mode UIViewContentModeScaleAspectFill. Images will be stretched in one or both dimensions to fill up the whole image view bounds.
You really need subclassing UITableViewCell to do this right.
Thre is a lazy solution adding a new UIImageView and using a spacer, as Keller told you in his answer (feel free to accept his answer, this is just the missing code).
Extract of tableView:cellForRowAtIndexPath::
...
cell.textLabel.text = [NSString stringWithFormat:#"Cell #%i", indexPath.row];
cell.imageView.image = [UIImage imageNamed:#"spacer.png"]; /* spacer is 64 x 44 */
/* image view width should be ~ 64 px, otherwise it will overlap the text */
UIImageView *iv = [[UIImageView alloc] initWithFrame:(CGRect){.size={64, tableView.rowHeight}}];
switch (indexPath.row) {
case 0:
iv.image = [UIImage imageNamed:#"waterfall.png"];
break;
/* etc... */
}
if (indexPath.row < 3) {
/* add black bg to cell w/ images */
iv.backgroundColor = [UIColor blackColor];
}
iv.contentMode = UIViewContentModeScaleAspectFit;
[cell.contentView addSubview:iv];
...
The table will look like this:
You need to set the placeholder (spacer.png above) in the existing cell image view. It will push the text label to the right.
You can use aspect fill and remove the background color bit:
iv.contentMode = UIViewContentModeScaleAspectFill;
The table will look wrong because the image is drawn outsite the bounds:
Just clip to bounds to get a better result:
iv.clipsToBounds = YES;
Create a UIImageView subview for each cell and it to the contentView. Each UIImageView contains an image with a consistent frame but with option UIViewContentModeScaleAspectFit. Then just Set the background color of the UIImageView to black.
I just confirmed this works, but you need to also create a placeholder spacer image to make sure the textLabel moves out of the way. Just make it the same dimensions of your image (with the letter boxing).
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
//spacer
cell.imageView.image = [UIImage imageNamed:#"placeholder"];
//imageview
UIImageView *thumbnail = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 44)];
thumbnail.tag = kThumbTag;
thumbnail.backgroundColor = [UIColor blackColor];
thumbnail.contentMode = UIViewContentModeScaleAspectFit;
[cell.contentView addSubview:thumbnail];
}
// Configure the cell...
cell.textLabel.text = [NSString stringWithFormat:#"Cell %d", indexPath.row];
cell.imageView.frame = CGRectMake(0, 0, 80, 44);
UIImageView *thumb = (UIImageView*)[cell.contentView viewWithTag:kThumbTag];
if (indexPath.row == 0) {
[thumb setImage:[UIImage imageNamed:#"image1.png"]];
} else {
[thumb setImage:[UIImage imageNamed:#"image2.png"]];
}
return cell;
}
Obviously, this example isn't lazy loading the images (I didn't realize you were loading them from a URL). For that, I would use a subclass with EGOImageView or something of the like.

Adding extra UIlabel to each cell

I'm trying to add an extra UILabel into each cell(UITableView)
I'v succeeded with this code in
(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath method
Here's my code
//add another text
UILabel *test = [[UILabel alloc] initWithFrame:CGRectMake(250,80,50,20.0)];
test.text = [NSString stringWithFormat: #"test"];
test.backgroundColor = [UIColor clearColor];
test.font=[UIFont fontWithName:#"AppleGothic" size:20];
[cell addSubview:test];
However I figured that if I do this, I can't add different text to each cell, instead, it ends up with the same text in all cells. Can anyone tell me how to do that?
Oh and another problem was that if I do this, "test" is displayed in every cell except for the first one.
Have a look at the tutorial "UITableView – Adding subviews to a cell’s content view".
Try something like this
- (UITableViewCell *) getCellContentView:(NSString *)cellIdentifier {
CGRect CellFrame = CGRectMake(0, 0, 320, 65);
CGRect Label1Frame = CGRectMake(17,5,250,18);
UILabel *lblTemp;
UITableViewCell *cell = [[[UITableViewCell alloc] initWithFrame:CellFrame reuseIdentifier:cellIdentifier] autorelease];
lblTemp = [[UILabel alloc] initWithFrame:Label1Frame];
[lblTemp setFont:[UIFont fontWithName:#"Arial-BoldMT" size:15]];
lblTemp.tag = 1;
lblTemp.backgroundColor=[UIColor clearColor];
lblTemp.numberOfLines=0;
[cell.contentView addSubview:lblTemp];
return cell; // this I forgot
}
in cellForRowAtIndexPath
{
if(cell == nil)
cell = [self getCellContentView:CellIdentifier];
UILabel *lblTemp1 = (UILabel *)[cell viewWithTag:1];
lblTemp1.text =[nameArray objectAtIndex:value+indexPath.row];
return cell;
}
For having the same Label on all cells, you are probably instantiating just one cell and use the cellReUseIdentifier for all cells. So, I suggest that you create different labels as properties of the class, and assign each property-label to each cell.
// For example -
if (indexPath.row ==0 )
// assign [cell.contentView addSubview: self.label1];
if (indexPath.row ==1 )
// assign [cell.contentView addSubview: self.label2];
And for the second part of the question, please post your cellForRowAtIndexPath fully - there could be an error in that.
First check if any of the predefined styles work for you.
If you need more flexibility than what they offer, you can try something like this:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [self makeCell: CellIdentifier];
}
MyData *data = [self.data objectAtIndex:indexPath.row];
UILabel *lbl1 = (UILabel *)[cell viewWithTag:1];
UILabel *lbl2 = (UILabel *)[cell viewWithTag:2];
lbl1.text = data.text;
lbl2.text = data.auxText;
return cell;
}
- (UITableViewCell *)makeLensListCell: (NSString *)identifier
{
CGRect lbl1Frame = CGRectMake(10, 0, 140, 25);
CGRect lbl2Frame = CGRectMake(10, 150, 140, 25);
UILabel *lbl;
UITableViewCell *cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:identifier] autorelease];
// Label with tag 1.
lbl = [[UILabel alloc] initWithFrame:lbl1Frame];
lbl.tag = 1;
[cell.contentView addSubview:lbl];
[lbl release];
// Label with tag 2.
lbl = [[UILabel alloc] initWithFrame:lbl2Frame];
lbl.tag = 2;
lbl.textColor = [UIColor lightGrayColor];
[cell.contentView addSubview:lbl];
[lbl release];
// Add as many labels and other views as you like
return cell;
}
This approach also allows images and other views.