dev_m
dev_m

Reputation: 806

ios Glitches in table view cell image

I am new to swift language... Making simple table with image, and want to set corner radius of image view inside cell.

Code :-

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    let cell = tableView.dequeueReusableCellWithIdentifier(cellIdentifier)!

    cell.textLabel?.text = "Test"
    cell.detailTextLabel?.text = "\(indexPath.row)"

    if(cell.imageView != nil){
        cell.imageView?.image = UIImage(named: "avatar")
        cell.imageView?.layer.cornerRadius =  cell.imageView!.frame.size.height/2
        cell.imageView?.layer.masksToBounds = true

    }


    return cell
}

Don't know what i am doing wrong, but corner radius not seted when table display when i start to scroll table it set properly ...enter image description here

Edit:- Getting fine result with cell.imageView?.layer.cornerRadius = 20 Don't know why it works with static value.

Upvotes: 0

Views: 599

Answers (3)

technerd
technerd

Reputation: 14514

This happens due to ImageView is still not getting Width or Height value at time tableView loading first time. You must have to pass Width and Height of imageView inside cell in Storyboard.

If you are not passing Width or height then reload table view in viewDidAppear method.

You can set Constraint for ImageView in Cell as suggested in image.

enter image description here

enter image description here

Output :

enter image description here

Apply Corner radius when creating cell.

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

static NSString *cellIdentifier = @"cell";

UITableViewCell *cell = (UITableViewCell *)[tableView dequeueReusableCellWithIdentifier:cellIdentifier];

if (!cell)
{
    cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
}

UIImageView *imgView = (UIImageView *) [cell.contentView viewWithTag:9];

NSLog(@"Frame : %@", NSStringFromCGRect(imgView.frame));

imgView.layer.cornerRadius = imgView.frame.size.width/2.0;
imgView.layer.masksToBounds = YES;
//imgView.clipsToBounds = YES;

UILabel *lbl = (UILabel *)[cell.contentView viewWithTag:99];
if(indexPath.row % 2 == 0){

    lbl.text = [NSString stringWithFormat:@"Index : %ld -- I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....I am Even....",(long)indexPath.row];

}else{

    lbl.text = [NSString stringWithFormat:@"Index : %ld -- I am Odd....I am Odd....I am Odd....I am Odd....I am Odd....I am Odd....I am Odd....I am Odd....",(long)indexPath.row];

}
return cell;
}

Upvotes: 3

Halil İbrahim YILMAZ
Halil İbrahim YILMAZ

Reputation: 750

your code is true but code is sorting error

this is :

cell.imageView?.layer.cornerRadius =  cell.imageView!.frame.size.height/2
cell.imageView?.layer.masksToBounds = true
cell.imageView?.image = UIImage(named: "avatar")

Upvotes: 0

Piyush
Piyush

Reputation: 1544

If you are creating your own imageView, it's better to set the cornerRadius inside the custom TableViewCell.

class CircularTableViewCell: UITableViewCell {
@IBOutlet weak var circularImageView: UIImageView!
override func layoutSubviews() {
    circularImageView.layer.cornerRadius = circularImageView.bounds.height / 2
    circularImageView.clipsToBounds = true
}

Note the cornerRadius property can't guarantee that the view will be absolutely round unless you set the imageView's width and height ratio to be 1:1. Another approach to create round view is using Mask.

Upvotes: 0

Related Questions