title: iPhone crop part of image, without resizing using animation
body: <p>OK in my application I have an image which I would like to slowly reveal to the user. So I don't want to resize the image, I want to have the complete image there in the background, then slowly reveal more of the image going from the top down. I am creating a vertical progress bar using animation which I have done using animation, and works fine. </p>
  
  <p>The progress bar itself has an alpha of 0.5 so you can see the image behind it. I use animation and stretch the progress bar when it is animating which is just a view with a set color depending on the progress bar. I don't mind stretching that as that looks fine. However I don't want the image behind the bar to stretch, I want that to only reveal as much of the image as the progress bar has animated. So say the progress bar is 80% complete, then then I should see 80% of the height of the image behind it, the width will never change, and the image behind it is not resized, just more of it is revealed. </p>
  
  <p>I tried using the same code I use with the progress bars on the image, but it looks inconsistent as the progress bars will be at different levels and the stretched image looks odd.</p>
  
  <p>I have been looking at different ways of cropping code dynamically, but I can't seem to find any which do it in an animation. Are there any built in methods for carrying out such a task? A lot of the crop code I have found, seem to resize the image.</p>
  
  <p>I am been animating my progress bars using this to animate</p>
  
  <pre><code> [UIView beginAnimations:nil context:nil];
      [UIView setAnimationDuration:3.0];
      [UIView setAnimationDelegate:self];
      [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
      transform = CGAffineTransformMakeScale(1,transformValue);
      image.transform = transform;
      image.center = CGPointMake(xValue, yValue);
  
  [UIView commitAnimations];
  </code></pre>
  
  <p>I was hoping you could use something similar for an animating a crop of an image.</p>
  
  <p>Any help would be much appreciated!!</p>
  
  <p>After a hell of a lot of testing, I have managed to get to this point:</p>
  
  <pre><code>    [UIView animateWithDuration:3.0 delay:0.0 options:UIViewAnimationOptionCurveEaseInOut
                   animations:^{
  
  
                           UIImage *image = [UIImage imageNamed:@"button_connectMe.png"];
                       CGImageRef tmpImgRef = image.CGImage;
                       CGImageRef topImgRef = CGImageCreateWithImageInRect(tmpImgRef, CGRectMake(0, 30, image.size.width, image.size.height));
  
                       UIImage *topImage = [UIImage imageWithCGImage:topImgRef];
                      imgView.image = topImage;
                       imgView.frame = CGRectMake(0, 180, topImage.size.width, topImage.size.height);
  
                   } 
                   completion:^(BOOL finished) {
                       NSLog(@"Final method");
  
  
                   }
   ];
  </code></pre>
  
  <p>This will crop image in half, and keep the original image size, however the problem is, that  the new cropped image is applied instantly in this line of code</p>
  
  <pre><code> UIImage *topImage = [UIImage imageWithCGImage:topImgRef];
                          imgView.image = topImage;
  </code></pre>
  
  <p>It isn't animated, whereas this part</p>
  
  <p>imgView.frame = CGRectMake(0, 180, topImage.size.width, topImage.size.height);</p>
  
  <p>is animated. I would need to somehow animate the change in frame of the CGI image so the image is slowly cropped to whatever size it needs to be.</p>