CODEWITHSUNDEEP
iphoneiosobjective-cuiimageviewuiviewanimation
Steaphann
Steaphann

Reputation: 2777

Animate a UIImageView from center of the UIImageView

I have a UIImageView that should animate from size (0,0) --> (93,75)

I have the following

  [UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionTransitionNone
                 animations:^{
                     imgButton.layer.anchorPoint = CGPointMake(imgButton.bounds.size.width/2, imgButton.bounds.size.height/2);
                     CGRect btnFrame = imgButton.frame;
                     btnFrame.size.width = 105;
                     btnFrame.size.height = 85;
                     imgButton.frame = btnFrame;
                 }
                 completion:^(BOOL finished) {
                     [self animageButton2:imgButton];
                 }];

This is working but the only problem I have is that it is not animating from the center of the UIImageView but from the top left corner.

Anybody got a clue?

Upvotes: 3

Views: 3977

Answers (4)

Steaphann
Steaphann

Reputation: 2777

I've solved it with the help of Borrden. This is what my solution was.

First create an imageview

UIImageView *imgLineup = [[UIImageView alloc]initWithFrame:CGRectMake(10, y, 93, 75)];
imgLineup.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.0, 0.0);

And then to the following.

[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionCurveEaseInOut
                     animations:^{
                         imgButton.layer.anchorPoint = CGPointMake(0.5, 0.5);
                         imgButton.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);

                     }
                     completion:^(BOOL finished) {
                        NSLog(@"done");
                     }];

Upvotes: 4

wesley
wesley

Reputation: 859

just try with this. import #import <QuartzCore/QuartzCore.h> then put below code while adding the uimageView into subView of self.view 

CABasicAnimation *zoomAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
[zoomAnimation setDuration:0.8];
[zoomAnimation setRepeatCount:1];
[zoomAnimation setFromValue:[NSNumber numberWithFloat:0.1]];
[zoomAnimation setToValue:[NSNumber numberWithFloat:1.0]];
[zoomAnimation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[imageView layer] addAnimation:zoomAnimation forKey:@"zoom"];

Upvotes: 2

Amar
Amar

Reputation: 13222

What you are trying to achieve is a scale transform i.e. animating UIView size from size(0,0) to size(w,h). Same effect can be achieved by CGAffineTransformMakeScale.

Initially when you create the view apply CGAffineTransformMakeScale(0.0,0.0) then animate size scale up to CGAffineTransformMakeScale(1.0,1.0).

Code:

// Create the view and apply correct frame
UIView *tagView = [[UIView alloc] initWithFrame:CGRectMake(50, 100, 100, 100)];
tagView.tag = kTag;
//Apply scale transform, to make size(0,0) 
tagView.transform = CGAffineTransformMakeScale(0,0);
[self.view addSubview:tagView];

/// ............

UIView *tagView = [self.view viewWithTag:kTag];
//Now animate the view size scale up
[UIView animateWithDuration:0.5
        delay:0
        options:UIViewAnimationOptionCurveEaseOut
        animations:^{
                        tagView.transform = CGAffineTransformMakeScale(1.0,1.0);
                    }
        completion:NULL
 ];

This animation will happen about the center point of the view as you want, thus avoiding the need to play with anchorPoint and frame, which can be tricky. Read more about the relation between frame and anchorPoint from this answer.

Upvotes: 0

Amit
Amit

Reputation: 1043

What i suggest may be kind of hack but it will be an easier way to achieve what you want:

  • You set the initial frame of imageView as:

    CGRectMake(center, center, 0, 0);

    So in your case it will be something closer to :

    CGRectMake(46, 37, 0, 0);

  • Then animate it with new rect of something like this:

    CGRectMake(0, 0,93,75);

    You can use simple UIViewAnimation for this;

        [UIView beginAnimations:@"zoom" context:NULL];
     [UIView setAnimationDuration:0.3];
    imageView.frame = CGRectMake(0, 0, 93, 75); ;
    [UIView commitAnimations];

Hope It works

Upvotes: 0

Related Questions