I have the class that I subclassed from UIImageView. The instance of this class is then added as a subview to the my application's root class. Now, I can animate it's properties, for example, setFrame:
[UIView beginAnimations:nil context:nil];
...
[myImageView setFrame:someFrameCreatedInCode];
...
[UIView commitAnimations];
This takes the current frame as the initial state and interpolates imageview animation (it simply moves from the left to the right). This part works fine.
What I would like to do next is I want to add a property to my class, say, of integer type. And I want this property to cpecify the image number (it's name is formatted) and make frame based animation later. It seems to be a nice way to create animation because I can specify the "curve" to affect the animation timing:
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
How to implement my own property which is possible to animate?
Thanks in advance!
Update: In case someone will need this I found these tutorials in the Internet: blog post, sample.
You'd probably want to use the UIView animations together with the UIImageView animation images.
If you use a code like this:
colors = [[NSArray alloc] initWithObjects:[UIImage imageNamed:#"red_select1.png"],
[UIImage imageNamed:#"red_select2.png"],
[UIImage imageNamed:#"red_select3.png"],
[UIImage imageNamed:#"red_select4.png"],
[UIImage imageNamed:#"red_select5.png"],
[UIImage imageNamed:#"red_select6.png"],
[UIImage imageNamed:#"red_select7.png"],
[UIImage imageNamed:#"red_select8.png"],nil];
animationView = [[UIImageView alloc] initWithFrame:rect];
animationView.animationImages = colors;
animationView.animationDuration = 1.0;
animationView.animationRepeatCount = 0; // loop
[animationView startAnimating];
I think the only problem would be synchronizing the two animations ...
Related
I want to animate a view inside ViewController, somewhat like the notification center as seen on the iPhone.
How does one extend the subview using the x,y and/or the height values to do this? Because I would like it to be compatible with both the 3.5 inch screens and the 4 inch screens, so it would be better not to use specific values.
I just tested this out in my own project and confirmed that it works on varying screen sizes.
UIView *slidingview = [[UIView alloc] initWithFrame:CGRectOffset(self.view.frame, 0, -self.view.frame.size.height)];
slidingview.backgroundColor = [UIColor whiteColor];
[self.view addSubview:slidingview];
[UIView animateWithDuration:1 animations:^{
slidingview.center = CGPointMake(self.view.frame.size.width/2, self.view.frame.size.height/2);
}];
To implement this, simply replace slidingview with the view you want to slide down. You would, however, have to declare your own view using the frame I provided.
How about something like this?
CGRect currentFrame = self.view.bounds;
UIView * slidingView = [UIView alloc] initWithFrame:(CGRect){currentFrame.origin, currentFrame.size.width, 0};
[self.view addSubview:slidingView];
[UIView animateWithDuration:0.5f animations:^{
slidingView.frame = currentFrame;
}];
You may need to use delay version of animateWithDuration... to make animation in effect.
I'm working on something that will require me to cycle through images and create some sort of fade in and fade out transition between them. I'm used to javascript, so naturally I would want change the depth of the imageview that is going to be faded in. Is there a way to choose which view shows on the top? Or is there a better way of doing what I want to achieve?
CGRect imageFrame = CGRectMake(0.0, 0.0, 1024.0, 280.0);
UIImageView *image_one = [[UIImageView alloc] initWithFrame:imageFrame];
image_one.image = [UIImage imageNamed:#"image_one.png"];
[self.view addSubview:image_one];
UIImageView *image_two = [[UIImageView alloc] initWithFrame:imageFrame];
image_two.image = [UIImage imageNamed:#"image_two.png"];
[self.view addSubview:image_two];
You can remove a view from the view hierarchy, then re-insert it using [UIView insertSubview:aboveSubview:] and [UIView insertSubview:belowSubview:].
I have an image that represents sun rays and I need to make rotate those sun rays on iphone 4 screen. The very intuitive solution that comes to my head is to have quite large image, put it in UIImageView, set its anchor point and then use CA animation (animation). I'm designing my UI with interface builder and the problem is I'm unable to put large image that is larger than active screen (root view) size to UIImageView because is just crops it. Any thoughts and solutions?
Maybe something like this (in code, not in IB):
UIImageView *img = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"starburst.png"]];
img.center = CGPointMake (0, 0);
[self.view addSubview:img];
Then, to animate it, maybe something like this:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0f];
img.alpha = 0.0f;
[img release];
[UIView commitAnimations];
(Don't forget to release the img when you're done using it -- I did it above as an example, but you could move the release anywhere you needed)
I have a method with an image "imageView":
- (void)createNewImageView {
// Get the view's frame to make it easier later on
UIImage *image = [UIImage imageNamed:#"abouffer_03.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
// Add it at a random point
[imageView setCenter:[self randomPointSquare]];
[[self view] addSubview:imageView];
// Animate it into place
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:8.0f];
[imageView setCenter:CGPointMake(240, 160)];
[UIView commitAnimations];
[imageView release];
}
and another image "viewToRotate" (IBOuutlet defined in .h and interface builder)
And I want to check the collision with this method :
- (void)myRunloop
{
// check collision
if( CGRectIntersectsRect(imageView.frame, viewToRotate.frame) )
{
viewToRotate.alpha=0.2;
}
}
But xcode always give me the error :"imageView undeclared" and I don't know how to solve this . I don't wanna define it again in this method.
I just'd been through a similar problem actually when you set the frame of the imageView on line
[imageView setCenter:CGPointMake(240, 160)];
the imageView gets settled at that point in the memory, It's just that due to being in animation block it's showing you the transition that imageView is being moved towards the destination but in actual the view's coordinates are assigned with the destination location, you can confirm it by logging coordinates right after the line of code. If you really need to do this the similar way, you can use the timer instead of the animation block and animate yourself. But I circumvent this problem by using the animationDelegate. Just set animation delegate to self and define animationDidStopSelector and you're up. You're animationDidstopSelector will get fired when the animation's ended and hence the object reached it's final destination or you can say there's a collision (on UI). Hope that helps
Here's a code sample:
- (void)createNewImageView {
// Get the view's frame to make it easier later on
UIImage *image = [UIImage imageNamed:#"abouffer_03.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
// Add it at a random point
[imageView setCenter:[self randomPointSquare]];
[[self view] addSubview:imageView];
// Animate it into place
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(animationDidStop:)];
[UIView setAnimationDuration:8.0f];
[imageView setCenter:CGPointMake(240, 160)];
[UIView commitAnimations];
[imageView release];
}
your animationDidStopSelector will be just like:
-(void)animationDidStop:(id)sender {
//This is almost similar to collision detection, you can do something here
}
imageView is a local variable to the function createNewImageView and hence cannot be accessed by myRunloop
If you have declared imageView as an IBOutlet
you can set the image like this
UIImage *image = [UIImage imageNamed:#"abouffer_03.png"];
imageView.image = image
In Interface (.h file) declare like this
UIImageView *imageView;
And In your createNewImageView() method.Use the
imageView = [[UIImageView alloc] initWithImage:image];
You can assign a tag to the image view so you can find it later in the other method:
[imageView setTag:1];
// in myRunloop
UIImageView* imageView = [[self view] viewWithTag:1];
i'm developping an application for kids (memory game): turning two same tiles(images) and you can remove them. the problem is how to turn the uiimages with animation and only the uiimages without turning the view that contain them..
do i have to put every uiimage in a small view?
any ideas?
PS :i'm not using OpenGL
Sorry, misread the first time. Use UIImageViews for each tile and then animate as below.
a UIView is just a view, so you can animate it the way you animate any view. Its fairly straightforward.
UIImageView *tileToFlip = self.[tiles objectAtIndex:3];
CGRect frameOfTileToFlip = tileToFlip.frame;
UIImageView *newImageToShow = [[UIImageView alloc] initWithFrame:frameOfTileToFlip];
// add the image to newImageToShow
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration: 1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:newImageToShow cache:NO];
[self.View addSubview:newImageToShow]; // I'm not sure if this is necessary
[UIView commitAnimations];
[tileToFlip removeFromSuperView]; // remove it so you can add it back later
Alternatively, you can use CATransition which gives you a little more control and different transitions.
You could use UIImageView for each tile.