i Have two images generated like this
- (void)moveImage:(UIImageView *)image duration:(NSTimeInterval)duration
curve:(int)curve x:(CGFloat)x y:(CGFloat)y
{
// Setup the animation
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:duration];
[UIView setAnimationCurve:curve];
[UIView setAnimationBeginsFromCurrentState:YES];
// The transform matrix
CGAffineTransform transform = CGAffineTransformMakeTranslation(x, y);
image.transform = transform;
// Commit the changes
[UIView commitAnimations];
}
- (void)alien {
enemy =
[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"alien.png"]];
enemy.frame = CGRectMake(-100, 20, 50, 50);
[self.view addSubview:enemy];
// Move the image
[self moveImage:enemy duration:5
curve:UIViewAnimationCurveLinear x:460 y:0.0]; }
- (void)bullet4 {
bullet =
[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Bullet.png"]];
bullet.frame = CGRectMake(carDude.center.x, 380, 5, 10);
[self.view addSubview:bullet];
// Move the image
[self moveImage:bullet duration:3
curve:UIViewAnimationCurveLinear x:0 y:-500.0]; }
I'm trying to hide them when they intersect. There can be many on the screen at the same time but i tried,
-(void)checkCollision {
if(CGRectIntersectsRect(bullet.frame, enemy.frame)) {
}
}
and no luck getting the images to do anything when they collide.
How can i get the image to hide and check collision?
If you change the transform of a view, its frame doesn't change (it can even become unvalid) and should be ignored.
From the documentation:
Warning If this property is not the identity transform, the value of the frame property is undefined and therefore should be ignored.
Since all you're doing is applying a translation transform, why don't you animate the frame instead?
Related
i am developing one application.In that i have 10 images .i want to move that images from right to left like as a marquee effect in HTML.That images are moving infinite number of times.So please tell me how to move that images from left to right.
I'd try something like this:
- (void)startAnimatingImages
{
for (UIImage* aImage in yourImageArray)
{
[self animateLabelToTheRight:aImage];
}
}
- (void)animateLabelToTheRight:(UIView *)yourView
{
[UIView animateWithDuration:0.3
animations:^{ view.frame = CGRectMake(view.frame.origin.x + 35, view.frame.origin.y, image.frame.size.width, image.frame.size.height); }
completion:^{ [self animateLabelToTheLeft:yourView] } ];
}
- (void)animateLabelToTheLeft:(UIView *)yourView
{
[UIView animateWithDuration:0.3
animations:^{ yourView.frame = CGRectMake(yourView.frame.origin.x - 35, yourView.frame.origin.y, yourView.frame.size.width, yourView.frame.size.height); }
completion:^{ [self animateLabelToTheRight:yourView] } ];
}
As stated in #Dev's answer this can be done through animation, however if you're going to animate it theres no need to change the image if you only want to move it.
This code for example takes a photo of your choosing and moves it from the top left of the screen to the bottom left and can be modified to move right to left, and is already set up to repeat infinitely with [UIView setAnimationRepeatCount:-1];.
In achieving a marquee effect, the best way I can think of to handle that would be to make the images fully animate off screen before the animation ends and resets, creating the illusion that the image went off one side of the screen and came in the other.
- (void)animateImage
{
UIImageView *myImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"myImage.png"]];
[self.view addSubview:myImageView];
[myImageView setFrame:CGRectMake(0, 0, 50, 50)];
[UIView beginAnimations:#"myAnimation" context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDelegate:self];
[UIView setAnimationRepeatCount:-1];
// [UIView setAnimationDidStopSelector:#selector(callSomeThingElse)];
[myImageView setFrame:CGRectMake(0, 430, 50, 50)];
[UIView commitAnimations];
}
Animation is required for this type of moving image. if you try this code ,your problen is solve:
UIImageView *animationimage;
animationimage.animationImages = [NSMutableArray arrayWithObjects:
[UIImage imageNamed:#"Splash1.png"],
[UIImage imageNamed:#"Splash2.png"],
[UIImage imageNamed:#"Splash3.png"],
[UIImage imageNamed:#"Splash4.png"],
[UIImage imageNamed:#"Splash5.png"],nil];
// all frames will execute in 1.0 seconds
animationimage.animationDuration = 1.0;
// repeat the annimation forever
animationimage.animationRepeatCount = 0;
remember one thing you have different sequential image is require link in my code splash%i.
i hope ,helpful for you.
I'd like to have an image in my iphone app "pop-in" on screen rather than just appearing. By "pop-in" I mean that it would grow from a small dot to its actual size. For reference, this is exactly the same as the "pop" animation effect in Keynote.
I'm completely new to iOS animations, so if someone could point me in the direction on the animation effects I would need to use, it would be greatly appreciated.
Thanks
Brian
UPDATE
I've added this code from the suggestions below. This works but it scales my image down, rather than up. I know that is because I have 0.01 as the transform scale size, but I would like to know how I can start out with an image of size 0.0 and scale up to 1. Is it just a matter to setting the size of my image to 0?
Thanks
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration: 0.2];
image.transform = CGAffineTransformMakeScale(0.01, 0.01);
[UIView setAnimationDelegate:self];
[UIView commitAnimations];
The effect you’re looking for is something like this:
// instantaneously make the image view small (scaled to 1% of its actual size)
view.transform = CGAffineTransformMakeScale(0.01, 0.01);
[UIView animateWithDuration:0.2 delay:0 options:UIViewAnimationOptionCurveEaseOut animations:^{
// animate it to the identity transform (100% scale)
view.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished){
// if you want to do something once the animation finishes, put it here
}];
if you want something like Facebook does on liking any post then use this
-(void)animateButton:(UIButton *)sender{
UIButton * btn = (UIButton *)sender;
[UIView animateWithDuration:0.3/1.5 animations:^{
btn.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.4, 1.4); // scales up the view of button
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3/2 animations:^{
btn.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.7, 0.7);// scales down the view of button
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3/2 animations:^{
btn.transform = CGAffineTransformIdentity; // at the end sets the original identity of the button
}];
}];
}];}
just call this method when you want to animate the view
if you have text and image on the button and you just want to animate the image of the button then just replace "btn" with "btn.imageView" , this will just produce animation on the image view property of the button.
Hope it helps
All the best.
You have to animate the frame of the view, to shrink it from zero to the final state.
This can be done for example with UIView block animation.
So for example start with your view as an IBOutlet property self.myView with the final size and position, but set the hidden flag.
Then when you want it to appear use the following:
// Save old frame as final stater and set it to zero size for the start of the animation
// But keep the same center position, so it just grows and don't move around
CGRect oldFrame = self.myView.frame;
CGRect oldCenter = self.myView.center;
self.myView.frame = CGRectZero;
self.myView.center = oldCenter;
self.myView.hidden = NO;
NSTimeInterval duration = 0.3;
[UIView animateWithDuration:duration delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^{
// New position and size after the animation should be the same as in Interface Builder
self.myView.frame = oldFrame
}
completion:^(BOOL finished){
// You can do some stuff here after the animation finished
}];
Swift 2.0 version
view.transform = CGAffineTransformMakeScale(0.01, 0.01);
UIView.animateWithDuration(0.2, delay: 0, options: .CurveEaseOut, animations: { () -> Void in
// animate it to the identity transform (100% scale)
self.view.transform = CGAffineTransformIdentity;
}) { (finished) -> Void in
// if you want to do something once the animation finishes, put it here
}
For that you will have to use a simple UIView
Add the UIview to your current view.
- (void) initPopUpView
{
popup.alpha = 0;
popup.frame = CGRectMake (160, 240, 0, 0);
[self.view addSubview:popup];
}
- (void) animatePopUpShow
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.3];
[UIView setAnimationDelegate:self];
[UIView setAnimationWillStartSelector:#selector(initPopUpView)];
popup.alpha = 1;
popup.frame = CGRectMake (20, 40, 300, 400);
[UIView commitAnimations];
}
I have a UIButton somewhere on my view. On touch event of button I making a UIView appear. The UIAnimation I have used make the view appear from top of window. But I want it to appear from button.frame.origin.y . Before touching the button the view is not visible. On touching the button view should start appearing from above position.
Here is the code :
-(IBAction) ShowInfowView:(id)sender{
CGRect rect = viewInfo.frame;
rect.origin.y = rect.size.height - rect.size.height+58.0;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.70];
[UIView setAnimationDelay:0.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
viewInfo.frame = rect;
[UIView commitAnimations];
}
This is how I am hiding the view again :
-(IBAction) HideInfoView:(id)sender{
CGRect rect = viewInfo.frame;
rect.origin.y = -rect.size.height;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.70];
[UIView setAnimationDelay:0.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
viewInfo.frame = rect;
[UIView commitAnimations];
}
In viewDidLoad I am doing the following :
CGRect rect = viewInfo.frame;
rect.origin.y = -rect.size.height;
viewInfo.frame = rect;
UPDATE:
Please see this example. Here view is appearing from top of screen. I want it to appear from button y axis. For that matter please consider button y position a bit upwards.
So you want a slide-in effect, but not from the top of the screen, just some arbitrary value?
One way to do it:
1) You should create a view that has the dimensions and position of your desired view AFTER animation finishes, we'll call it baseview.
2) Set this baseview property clipsToBounds to YES. This will make all subviews that are outside of the baseview's frame invisible.
3) Add your animating view as a subview of the baseview, but set the frame so it is invisible (by plcacing it above the baseview):
frame = CGRectMake(0, -AnimViewHeight, AnimViewWidth, AnimViewHeight);
4) Animate the animview frame:
//put this inside of an animation block
AnimView.frame = CGRectMake(0, 0, AnimViewWidth, AnimViewHeight);
EDIT:
Example:
//define the tags so we can easily access the views later
#define BASEVIEW_TAG 100
#define INFOVIEW_TAG 101
- (void) showInfo
{
//replace the following lines with preparing your real info view
UIView * infoView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
[infoView setBackgroundColor: [UIColor yellowColor]];
[infoView setTag: INFOVIEW_TAG];
//this is the frame of the info view AFTER the animation finishes (again, replace with real values)
CGRect targetframe = CGRectMake(100, 100, 100, 100);
//create an invisible baseview
UIView * baseview = [[UIView alloc] initWithFrame:targetframe];
[baseview setBackgroundColor: [UIColor clearColor]];
[baseview setClipsToBounds: YES]; //so it cuts everything outside of its bounds
[baseview setTag: BASEVIEW_TAG];
//add the nfoview to the baseview, and set it above the bounds frame
[baseview addSubview: infoView];
[infoView setFrame:CGRectMake(0, -infoView.bounds.size.height,
infoView.bounds.size.width, infoView.bounds.size.height)];
//add the baseview to the main view
[self.view addSubview: baseview];
//slide the view in
[UIView animateWithDuration: 1.0 animations:^{
[infoView setFrame: baseview.bounds];
}];
//if not using ARC, release the views
[infoview release];
[baseview release];
}
- (void) hideinfo
{
//get the views
UIView * baseView = [self.view viewWithTag: BASEVIEW_TAG];
UIView * infoView = [baseView viewWithTag: INFOVIEW_TAG];
//target frame for infoview - slide up
CGRect out_frame = CGRectMake(0, -infoView.bounds.size.height,
infoView.bounds.size.width, infoView.bounds.size.height);
//animate slide out
[UIView animateWithDuration:1.0
animations:^{
[infoView setFrame: out_frame];
} completion:^(BOOL finished) {
[baseView removeFromSuperview];
}];
}
I have done exactly what you're trying in my recent project.
The following steps should make this work:
1. In your viewDidLoad: you init your viewToFadeIn like this:
viewToFadeIn = [[UIView alloc] initWithFrame:CGRectMake(20,self.view.frame.size.height+10, self.view.frame.size.widh-40, 200)];
//its important to initalize it outside your view
//your customization of this view
[self.view addSubview:viewToFadeIn];
2.your ShowInfowView: Method should look like this:
` -(IBAction) ShowInfowView:(id)sender{
[UIView beginAnimations:#"fadeIn" context:NULL];
[UIView setAnimationDuration:0.25];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(animationFinished:finished:context:)];
viewToFadeIn.transform = CGAffineTransformMakeTranslation(0, -290);
//290 is in my case, try a little for your correct value
[UIView commitAnimations];
}
3.yourHideInfoView:` Method looks like this
-(IBAction) HideInfoView:(id)sender{
[UIView beginAnimations:#"fadeOut" context:NULL];
[UIView setAnimationDuration:0.25];
[UIView setAnimationDelegate:self];
viewToFadeIn.transform = CGAffineTransformMakeTranslation(0, 0);
[UIView commitAnimations];
}
EDIT:
4. animationFinishedMethod:
- (void)animationFinished:(NSString *)animationID finished:(BOOL)finished context:(void *)context{
if ([animationID isEqual:#"fadeIn"]) {
//Do stuff
}
if ([animationID isEqual:#"fadeOut"]) {
//Do stuff
}
}
SEE THIS
This should do the trick. Good luck
Your problem is not clear (for me).
What is this?
rect.origin.y = rect.size.height - rect.size.height+58.0;
Is 58 origin of your UIButton?
You should use sender.frame etc
Use blocks to animate like this
[UIView animateWithDuration:0.5f animations:^{
// Animation here
} completion:^(BOOL finished) {
// onComplete
}];
- (void) slideIn{
//This assumes the view and the button are in the same superview, if they're not, you'll need to convert the rects
//I'm calling the animated view: view, and the button: button...easy enough
view.clipToBounds = YES;
CGRect buttonRect = button.frame;
CGRect viewRect = CGRectMake(buttonRect.origin.x, buttonRect.origin.y + buttonRect.size.height, view.bounds.size.width, 0);
CGFloat intendedViewHeight = view.height;
view.frame = viewRect;
viewRect.size.height = intendedViewHeight;
[UIView animateWithDuration:.75 delay:0.0f options:UIViewAnimationOptionCurveEaseOut animations:^{
view.frame = viewRect;
}completion:nil];
}
This will cause the the view to appear to slide out from under the button. To slide the view back in, you just reverse the animations. If you wish to slide it up from the button, you'll need to make sure your starting 'y' is the 'y' value of the button (rather than the 'y' + 'height') and animate both the height and y values of the view that needs animating.
- (void)moveImage:(UIImageView *)image duration:(NSTimeInterval)duration
curve:(int)curve x:(CGFloat)x y:(CGFloat)y
{
// Setup the animation
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:duration];
[UIView setAnimationCurve:curve];
[UIView setAnimationBeginsFromCurrentState:YES];
// The transform matrix
CGAffineTransform transform = CGAffineTransformMakeTranslation(x, y);
image.transform = transform;
// Commit the changes
[UIView commitAnimations];
}
- (void)viewDidLoad {
[super viewDidLoad];
UIImageView *imageToMove =
[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"icon.png"]];
imageToMove.frame = CGRectMake(10, 10, 20, 20);
[self.view addSubview:imageToMove];
// Move the image
[self moveImage:imageToMove duration:3.0
curve:UIViewAnimationCurveLinear x:50.0 y:50.0];
}
I have tried this one.It works fine at one time from left to right.But i need to move the image from left and right to left repeatedly.
Thanks in advance.
[UIView animateWithDuration:timeDuration
delay:0.0f
options:UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse | UIViewAnimationCurveLinear
animations:^{
[iVBackgroundImg setFrame:YOUR_FRAME];
}
completion:nil];
[UIView commitAnimations];
y dont you create a NSTimer that repeatedly calls the function every 5 secs(where 5 is the time reqd to move from left to right) and then this function will check.
if(image.origin.x< 0 )
//move image to right
else if(image.origin.x > 320)
// move image to left.
Either user NSTimer or in your move function call a [self performSelector:];
I m creating a game, in that i want to use some animation, but i m new to animations.
I want to create an image ,as soon as i click on imageview, the image should come in bouncing manner as if it is a Ball, so is it possible to do so??? The image is predefined for the game.and it must come after touch begin event occures, can any one help me???
regards
viral.
you can do something like
imageview = [[[UIImageView alloc] initWithFrame:CGRectMake(x,y,w,h)]autorelease];
imageview.image = [[UIImage imageNamed: [NSString stringWithString:name]]autorelease];
[self.view addSubview:imageview];
imageview.frame = CGRectMake(imageview.frame.origin.x, (imageview.frame.origin.y), imageview.frame.size.width, imageview.frame.size.height);
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelegate:self];
//[UIView setAnimationWillStartSelector:#selector(Transform2)];
[UIView setAnimationDuration:k_AnimateTime];
[UIView setAnimationBeginsFromCurrentState:YES];
//[UIView setAnimationDidStopSelector:#selector(increaseCount)];
imageview.frame = CGRectMake(imageview.frame.origin.x - Ex, (imageview.frame.origin.y - Ey), imageview.frame.size.width, imageview.frame.size.height);
[UIView commitAnimations];
this will move your image from one co coordinate to another coordinate animating... set appropriate coordinate to make it looks like bouncing effcet...