I'm trying to animating across the screen a horizontal bar with a color gradient. For simplicity, I chose to make a png of the fully extended bar, assign it to a UIImageView, and (attempt to) animate resizing of it using a UIView animation. The problem is that in the "closed" state of the Image, the portion of the image showing is not the part that I want. The image is arranged so that from L to R, a white to red color gradient occurs. The right side (about 20 pixels) is solid red and is the part I want to show when the bar is "collapsed". I'm trying to extend the image out by about 100 pixels to its full width. I referenced the "Buy Now" button example for my code as it seemed relevant"
UIButton AppStore buy button animation
My code:
[UIView beginAnimations:@"barAnimation" context:nil];
[UIView setAnimationDuration:0.6];
CGRect barFrame = bookBar.bounds;
if (fExtendBar)
{
barFrame.origin.x -= 100;
barFrame.size.width += 100;
}
else
{
barFrame.origin.x += 100;
barFrame.size.width -= 100;
}
bookBar.frame = barFrame;
[UIView commitAnimations];
I feel like this should be possible, maybe by setting an "offsetOfImage" to display in the UIImageView, but I can't seem to make it work. Also, I've noticed that the behavior is kind of consistent with what happens in Interface Builder when you resize an image. Then again, I would think there would be a way to override this behavior programmatically. Any suggestions (including other approaches) are welcome.
Thanks, chris.o.