CODEWITHSUNDEEP
iosobjective-cuitableview
iljawascoding
iljawascoding

Reputation: 1110

Unwanted image animation when resizing UITableView

For an iPad project I implemented an NSBrowser-like interface wich supports a dynamic number of columns. Each column is represented by an UITableView.

When adding or removing columns, I'm using UIView's animateWithDuration:animations: to change the width of the UITableView.

The problem I'm running into:

The system adds an unwanted frame size animation for the imageView of each table view cell, which resizes to imageView from very large to it's initial size. This looks really awkward, so I'm looking for ways to get rid off it - while keeping the animated frame size change for the enclosing tableViews.

Any ideas what I might be doing wrong?

I posted a sample project demonstration the issue here: https://github.com/iljaiwas/TableViewFrameTest

Here is where I setup the cell: https://github.com/iljaiwas/TableViewFrameTest/blob/master/TableViewFrameTest/TestTableViewController.m#L61

Here is where I trigger the animation: https://github.com/iljaiwas/TableViewFrameTest/blob/master/TableViewFrameTest/TestViewController.m#L46

Upvotes: 1

Views: 638

Answers (3)

jday
jday

Reputation: 578

I was having a similar issue with the (pretty large) image shrinking down from its original size when the editing animation fired to show the delete button. The picture would fly across my screen as it shrank. Pretty crazy. Anyway, I fixed it by using this category on UIImage to resize the image before putting it in the UIImageView:

- (UIImage *)imageWithImage:(UIImage *)image scaledToSize:(CGSize)scaledSize {
    UIGraphicsBeginImageContext(scaledSize);
    [image drawInRect:CGRectMake(0, 0, scaledSize.width, scaledSize.height)];
    UIImage *scaledImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return scaledImage;
}

Edit: here's another category that does a much better job of scaling down the image, depending on how good you need it to look. I originally found these on another SO question a while back but can't seem to find it now to link to, but I used them as a starting point and this one was especially helpful:

- (UIImage *)imageScaledToFitRect:(CGRect)rect {

    // compute scale factor for imageView
    CGFloat widthScaleFactor = CGRectGetWidth(rect) / self.size.width;
    CGFloat heightScaleFactor = CGRectGetHeight(rect) / self.size.height;

    NSLog(@"Rect width: %f, Image width: %f, WidthFactor: %f", rect.size.width, self.size.width, widthScaleFactor);
    NSLog(@"Rect height: %f, Image height: %f, HeightFactor: %f", rect.size.height, self.size.height, heightScaleFactor);

    CGFloat imageViewXOrigin = 0;
    CGFloat imageViewYOrigin = 0;
    CGFloat imageViewWidth = 0;
    CGFloat imageViewHeight = 0;

    // if image is narrow and tall, scale to width and align vertically to the top
    if (widthScaleFactor > heightScaleFactor) {
        imageViewWidth = self.size.width * widthScaleFactor;
        imageViewHeight = self.size.height * widthScaleFactor;
    }

    // else if image is wide and short, scale to height and align horizontally centered
    else {
        imageViewWidth = self.size.width * heightScaleFactor;
        imageViewHeight = self.size.height * heightScaleFactor;
        imageViewXOrigin = - (imageViewWidth - CGRectGetWidth(rect))/2;
    }

    return [self imageScaledToRect:CGRectMake(imageViewXOrigin, imageViewYOrigin, imageViewWidth, imageViewHeight)];
}

Hope this can help someone else.

Upvotes: 0

rwcarff
rwcarff

Reputation: 21

I was having the same issue and found this link (http://www.objc.io/issue-5/iOS7-hidden-gems-and-workarounds.html) which has a section on Blocking Animations.

To get your example working add the following at the top of TestTableViewController.m after the import statement:

@interface MyTableViewCell : UITableViewCell
@end
@implementation MyTableViewCell
- (void) layoutSubviews {
    [UIView performWithoutAnimation:^{
        [super layoutSubviews];
    }];}
@end

Then change the following line in viewDidLoad to use MyTableViewCell:

[self.tableView registerClass:[MyTableViewCell class] forCellReuseIdentifier:@"Cell"];

Now run the example and you will no longer have your unwanted image animation.

Upvotes: 2

sajmon
sajmon

Reputation: 21

this hepled to me: set UIImageView ** (in TableView cell) **contentMode to aspect Fit.

do not know why, but works for me.

Upvotes: 1

Related Questions