Positioning the imageView of a UITableViewCell

问题:

In every UITableViewCell of a UITableView I'm placing an image in its imageView. However, if I increase the height of a cell using tableView:heightForRowAtIndexPath: to accomodate more text, I've found that:

1. The image is center-aligned vertically.
2. The left margin of the image increases. This pushes the text right so its left margin is no longer aligned with the text in the cells above and below.

I'd like the image to be top-aligned vertically, so that it is in the upper-left corner of the cell (like the first cell in the image below) and not have its left margin increased (so that the left margin of the text in the second cell aligns with the text in the first cell).

Altering the frame, center, etc. of the imageView seems to have no affect. Any ideas? Thanks...

(I have an image of the problem, but SO won't let me post an image yet because I'm a noob with less than 10 reputation. Grrr...)

回答1:

You need to subclass UITableViewCell and override layoutSubviews, as follows:

- (void) layoutSubviews
{   
    [super layoutSubviews];

    self.imageView.frame = CGRectMake( 10, 10, 50, 50 ); // your positioning here
}

In your cellForRowAtIndexPath: method, be sure to return an instance of your new cell type.

回答2:

The moment you think you need to adjust sizes or positions of items in the default styles, is the time you need to think about creating a custom cell with your own items sized and positioned the way you want them to be. This is why you can create custom cells. :)

回答3:

Another way (works in iOS 6) is to create a UIImageView and add it to the cell as a subview

 UIImageView *yourImageView = [[UIImageView alloc] initWithFrame:CGRectMake(x,y,20,20)];

[yourImageView setImage:[UIImage imageNamed:[imagesArray objectAtIndex:indexPath.row]]]; //You can have an Array with the name of 

[yourcell.contentView addSubview:yourImageView]; //add the imageView as a subview

回答4:

A really useful function you might not have tried (in UITableViewDelegate) is tableView:willDisplayCell:forRowAtIndexPath:. It is called immediately before a cell is displayed and its purpose is to enable you to do things to the layout without the OS modifying it again before display. Effectively you have total control. I've used it for changing fonts in cells but you can iterate the cell's subviews and modify their frames too.

Still I agree you are at the point where it is time to look into custom cells and stop fighting the OS. It isn't hard to do and Apple gives a good example in Table View Programming Guide for iOS.

回答5:

You can create a custom cell and place the objects where you need them to be as well as setting the auto mask values.

回答6:

Swift 4 variation of TomSwift's solution (which worked for me nicely):

override public func layoutSubviews() {
        super.layoutSubviews()
        imageView?.frame = CGRect( x: 16, y: 9, width: imageView!.intrinsicContentSize.width, height:  imageView!.intrinsicContentSize.height)
    }