I'm trying to animate a UIButton to move up the screen. At any point the user can touch it. However, it doesn't seem to respond to touches while moving, only at the start and end of its animation. I guess this is because the button itself isn't moving, just the image of it. Any ideas how I can solve this? Here's my code so far. Thanks!
- (void)viewDidLoad {
[self newBubble];
[super viewDidLoad];
}
- (void)newBubble {
UIButton *bubble = [[UIButton buttonWithType:UIButtonTypeCustom] retain];
bubble.frame = CGRectMake(10, 380, 50, 50);
UIImage *bubbleImage = [UIImage imageNamed:#"bubble.png"];
[bubble setBackgroundImage:bubbleImage forState:UIControlStateNormal];
bubble.imageView.contentMode = UIViewContentModeScaleAspectFit;
[bubble addTarget:self action:#selector(bubbleBurst:) forControlEvents:UIControlEventTouchDown];
[self.view addSubview:bubble];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:5.0];
CGAffineTransform newTransform = CGAffineTransformMakeScale(1.5, 1.5);
bubble.transform = CGAffineTransformTranslate(newTransform, 10, -200);
[UIView commitAnimations];
}
- (IBAction)bubbleBurst:(id)sender {
NSLog(#"Bubble burst");
UIButton *bubbleBurst = sender;
[bubbleBurst removeFromSuperview];
}
The +[UIView animateWithDuration:delay:options:animations:completion:] method takes a UIViewAnimationOptions argument. If you include UIViewAnimationOptionAllowUserInteraction, you should be able to press the button while it animates:
[UIView animateWithDuration:5.0
delay:0.0
options:UIViewAnimationOptionAllowUserInteraction
animations:^{
CGAffineTransform newTransform = CGAffineTransformMakeScale(1.5, 1.5);
bubble.transform = CGAffineTransformTranslate(newTransform, 10, -200);
} completion:nil];
Well after posting a similar question, I found the answer here
Basically, you have to move the button frame by frame using an NSTimer. In my case I was worried there would be too many NSTimers involved moving each button, but in the end I used a single timer which loops through an array of buttons and moves them all one by one.
I'm pretty sure you would have to use Core Animation if you want the button to respond to touches while it is moving, but I have never done this so this is really more a tip then an answer!
I agree. I think the problem is that you're not using Core Animation. I can't believe you couldn't figure that out for yourself.
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.
Everybody..
How to set animation on button click ?
I have two buttons, both have different frame..
First CGRectMake (10 , 10 , 100 , 80 ); It has Black Image,
Second CGRectMake (200, 10 , 210 , 80 ); It has White Image,
When I click on First button of those, It should be animate to move from one frame to another frame..
Only seen like first's button Black Image move to second button location.. Like Image changes of Buttons..
After clicked button frame does not change... Should be remain as First and Second..
I have tried but not got the exact
buttonFirst.frame = buttonSecond.frame;
buttonFirst.center = buttonSecond.center;
buttonFirst.transform = CGAffineTransformMakeTranslation( buttonSecond.frame.origin.x - buttonFirst.frame.origin.x , buttonSecond.frame.origin.y - buttonFirst.frame.origin.y);
How to animate this ?
Editting :
I need to move one checkers from one CGRect to Another CGRect.. So, It want to display like moving checkers, But i dont want to change CGRect, Only button images looks like that...
Please tell me..
Thanks...
very simple logic
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.20f];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
[UIView setAnimationBeginsFromCurrentState:YES];
[firstButton setFrame:CGRectMake(5, 50, 30, 30)];//moves to second button place
[secondButton setFrame:CGRectMake(5, 5, 30, 30)];//moves to first button place
[UIView commitAnimations];
use the logic accordingly to your use..
well..
you can try this link
[UIView beginAnimation/endAnimation] bock
CGRect oldRectFirst = buttonFirst.frame;
CGRect oldRectSecond = buttonSecond.frame;
[UIView animateWithDuration:0.2f animations:^{
buttonFirst.frame = oldRectSecond;
buttonSecond.frame = oldRectFirst;
}];
Here is example from working program:
[self.buttonFirst setUserInteractionEnabled:NO];
[UIView transitionWithView:self.buttonFirst
duration:1.0
options:UIViewAnimationOptionTransitionFlipFromLeft | UIViewAnimationOptionCurveLinear
animations:^{
buttonFirst.frame = buttonSecond.frame;
buttonFirst.center = buttonSecond.center;
}
completion:^(BOOL finished){
[self.buttonFirst setUserInteractionEnabled:YES];
}];
Finally i got the answer...
I have set two button in two separate view. after set one timer, and move first button image to another button's position..
Here is a sample code for that..
Step 1 : Set view with Timer
UIView *oldView = [[UIView alloc] init];
oldView = [viewArray objectAtIndex:selectedIndex];
UIView *newView = [[UIView alloc] init];
newView = [viewArray objectAtIndex:[sender tag]];
oldRect = [oldView frame];
newRect = [newView frame];
movingTimer = [[NSTimer alloc] init];
movingTimer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:#selector(movingCheckers:) userInfo:nil repeats:YES];
imageViewMove = [[UIImageView alloc] init];
[imageViewMove setFrame:oldRect];
[imageViewMove setImage:[UIImage imageNamed:blackManName]];
[self.view bringSubviewToFront:imageViewMove];
[self.view addSubview:imageViewMove];
Step 2 : Moving Image to second position
CGPoint aPoint = CGPointMake(newRect.origin.x - oldRect.origin.x, oldRect.origin.y - newRect.origin.y);
imageViewMove.frame = CGRectMake(imageViewMove.frame.origin.x + (aPoint.x / 6) , imageViewMove.frame.origin.y - (aPoint.y / 6), imageViewMove.frame.size.width, imageViewMove.frame.size.height);
if (imageViewMove.frame.origin.x >= newRect.origin.x)
{
[selectButton setBackgroundImage:nil forState:UIControlStateNormal];
[moveButton setBackgroundImage:imageViewMove.image forState:UIControlStateNormal];
[imageViewMove removeFromSuperview];
[movingTimer invalidate];
}
Now its work.....
I want to rotate a UIButton continuously as a means of indicating that an app is recording something. Is this a good idea. I also want to be able to stop this continuous rotation.
How would I use animation to do this?
Use the UIView animation method:
animateWithDuration:delay:options:animations:completion:
and use the option UIViewAnimationOptionRepeat
For example for a UIButton * outlet named button:
- (void)viewDidLoad
{
[super viewDidLoad];
[UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveLinear animations:^{
CGAffineTransform transform = CGAffineTransformMakeRotation(M_PI);
self.button.transform = transform;
} completion:NULL];
}
Since it's going round and round, I just rotate it by pi radians rather than 2pi. you could use any angle you want.
Edit
To stop the animation, just create another animation of a short duration beginning from the current state, e.g.
- (void)stopRotating {
[UIView animateWithDuration:0.1 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState | UIViewAnimationOptionCurveLinear animations:^{
CGAffineTransform transform = CGAffineTransformMakeRotation(M_PI * 0.05);
self.button.transform = transform;
} completion:NULL];
}
This provides a very short animation which overrides the current animation. Note that the angle of the transform is multiplied by 0.05 which is the ratio of 0.1/2.0 which means that the rotational speed for this little segment is the same as the continuous rotational speed.
Try below code that will help you because I run that code successfully.
UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[button addTarget:self action:#selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
[button setTitle:#"Show View" forState:UIControlStateNormal];
button.frame = CGRectMake(80.0, 210.0, 160.0, 40.0);
[self.view addSubview:button];
CABasicAnimation *halfTurn;
halfTurn = [CABasicAnimation animationWithKeyPath:#"transform.rotation"];
halfTurn.fromValue = [NSNumber numberWithFloat:0];
halfTurn.toValue = [NSNumber numberWithFloat:((360*M_PI)/180)];
halfTurn.duration = 0.5;
halfTurn.repeatCount = HUGE_VALF;
[[button layer] addAnimation:halfTurn forKey:#"180"];
I had the same problem myself. In the end I made it like that:
#pragma mark Start/StopSpining
-(void)startSpin{
isSpining = YES;
[self Spin];
}
-(void)stopSpin{
isSpining = NO;
}
-(void)spin{
[UIView animateWithDuration:1.0 delay:0 options: UIViewAnimationOptionCurveLinear animations:^{
self.spinCircle.transform = CGAffineTransformRotate(self.spinCircle.transform, M_PI/2);
} completion:^(BOOL finished) {
if (isSpining)
[self spin];
}];
}
Try below extension for swift 3.
extension UIView {
func rotate360Degrees(duration: CFTimeInterval = 3) {
let rotateAnimation = CABasicAnimation(keyPath: "transform.rotation")
rotateAnimation.fromValue = 0.0
rotateAnimation.toValue = CGFloat(M_PI * 2)
rotateAnimation.isRemovedOnCompletion = false
rotateAnimation.duration = duration
rotateAnimation.repeatCount=Float.infinity
self.layer.add(rotateAnimation, forKey: nil)
}
}
For start rotation.
MyButton.rotate360Degrees()
And for Stop.
MyButton.layer.removeAllAnimations()
I suggest you don't rotate the UIButton, just the image you put on the button. Who knows what complications or overhead rotating a rectangular object that can detect touches introduces - what happened if your user somehow taps in the corner of the button and then releases the tap as the button has rotated so that the touch is now outside? Does that register a touch up inside or not?
Anyway, if you want continuous rotation use a block method:
+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion
seems to fit the bill. The complete rotation (2pi) will occur every duration and you cause it to repeat until you stop it using UIViewAnimationOptionRepeat. You can check with completion to see if you should begin another cycle when one animation cycle has ended and you can stop the animation at any time with
[myView.layer removeAllAnimations];
(If you simply want to run it until you stop it then there are other variants of this method without a completion block)
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:0.3];
uiButtonObject.transform = CGAffineTransformMakeRotation(M_PI);
[UIView commitAnimations];
M_PI is the radian value of the angle you want to rotate. Run this in a loop and in a different thread. You might also want to run the above using performSelectorInMainThread method as UI changes are not permitted in the UIThread.
hie everyone, here is my code:
- (void)viewDidLoad {
[[UIAccelerometer sharedAccelerometer] setUpdateInterval:1.0/60.0];
[[UIAccelerometer sharedAccelerometer] setDelegate:self];
[super viewDidLoad];
}
-(void)accelerometer:(UIAccelerometer *)accelerometer didAccelerate:(UIAcceleration *)acceleration {
valueX = acceleration.x *20.0;
valueY = acceleration.y *-20.0;
int newX = (int)(imageView.center.x+valueX);
int newY = (int)(imageView.center.y+valueY);
CGPoint newCenter = CGPointMake(newX,newY);
imageView.center=newCenter;
UIImageView* imageView2 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"ball.png"]];
imageView2.frame = CGRectMake(newX-12, newY-12, 24, 24);
[self.view addSubview:imageView2];
[UIView beginAnimations:nil context:imageView2];
[UIView setAnimationDuration:10.5];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
imageView2.frame = CGRectMake(newX-2, newY-2, 4, 4);
[imageView2 setAlpha:0.0];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(removeSmoke:finished:context:)];
[UIView commitAnimations];
if(imageView2.alpha=0){
[imageView2 removeFromSuperview];
}
[self.view bringSubviewToFront:imageView];
}
At first my animation is very smooth with 1.0/60.0 but after some seconds the animation bug and is not smooth, i think it become 1.0/5.0. I don't know why . How can I solve this please ? sorry for my english I'm french :/
I'm not completely clear on what you are trying to achieve. It seems as though every time the accelerometer fires, you add in a new imageView animation, and want to move it based on some rules, as well shrink the image down. There are problems with your code though. You never call [imageView2 release];, and so you are probably getting memory problems after awhile.
You may also be doing too much computation in the method #selector(removeSmoke:finished:context:), but I'd need to see code in order to help with that.
If you know how many UIImageViews you are planning on having at one time, it is probably best to pre-load them, and put them in an array for easy access. That way, you can move one UIImageView, and move to the next one.
If you are shooting for iOS 4.0 or higher, I'd also recommend using Block Animations. They are easier to use, and I find a lot easier on the processor as well. Something like:
[UIView animateWithDuration:10.5
animations:^{
CGRect newRect = imageView2.frame;
newRect.origin.x -= newX-2;
newRect.origin.y -= newY-2;
imageView2.frame = newRect;
}
completion:^(BOOL finished){
[UIView animateWithDuration:0.1
animations:^{
// This is where you complete your animation, maybe remove from view or something?
}
completion:^(BOOL finished){
;
}];
}];
Finally, instead of adding and removing from the view, I would suggest you just setting the imageView2.hidden = YES;, and that way it won't get drawn, and has the same effect. Hope that helps!
i wanted to use animations to load a view from the bottom of the window, i know this can be done via presentmodalViewController but in as per the requirement of my app its not valid as i only want to load the view at half of the window. So i used Animations and heres a look at what i did
-(void) displayPicker
{
UIButton *done = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[done setFrame:CGRectMake(197, 199, 103, 37)];
[done setBackgroundImage:[UIImage imageNamed:#"button_0.png"] forState:UIControlStateNormal];
[done setTitle:#"Done" forState:UIControlStateNormal];
[done setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[done addTarget:self action:#selector(dismissView) forControlEvents:UIControlEventTouchUpInside];
[pickerDisplayView addSubview:datePicker];
[pickerDisplayView addSubview:done];
//animating here
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
pickerDisplayView = [[UIView alloc]initWithFrame:CGRectMake(0, 185, 320, 275)];
[self.view addSubview:pickerDisplayView];
[UIView commitAnimations];
}
The view called pickerDisplayView has two components called Picker and Button, but the problem is that Picker is not working correctly and neither the view (pickerDisplayView) is loading in a smooth way.
#Matt: I have followed ur instructions and did as u advised here's what i did
-(void) animationIn
{
CGPoint p = {x:0,y:185};
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
//pickerDisplayView = [[UIView alloc]initWithFrame:CGRectMake(0, 185, 320, 275)];
[pickerDisplayView setCenter:p];
[UIView commitAnimations];
}
But the prob is that the view is going at the top of the window and is not coming at exact y axis of 185. I took these coordinates from IB. Please help me sir
You will have to add the view offscreen and then animate it in.
// In your viewDidLoad or wherever you initialize the view.
pickerDisplayView = [[UIView alloc]initWithFrame:offscreenRect];
[self.view addSubview:pickerDisplayView];
[self performSelector:#selector(animateIn) withObject:nil afterDelay:0.25];
// Declare animateIn
- (void)animateIn
{
UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[pickerDisplayView setCenter:onscreenPosition];
[UIView commitAnimations];
}
The value offscreenRect is a CGRect for the size and position where you want the view to start. onscreenPosition is a CGPoint for the position where you want the animation to finish. Animating the view's center is adequate since you don't want to change the size of the view while animating.
Also, I placed the animation in a separate method that gets called with -performSelector:withObject:afterDelay to ensure that the animation with fire. Sometimes you won't see the animation run if you start it in the same run loop where you added the view you're animating.
You need to init and addSubview before beginAnimations:. When you init pickerDisplayView position it so that the top of it is inline with the bottom of the superview. The animation will then slide up pickerDisplayView. Ideally you should create the view in a nib or in the loadView method. (I strongly recommend using nibs over 'loadView').
Do this in loadView (or move to a nib):
CGRect offScreenFrame = ?????; //Figure this out from self.view
self.pickerDisplayView = [[UIView alloc]initWithFrame:offScreenFrame];
[self.view addSubview:self.pickerDisplayView];
This is the animation:
[UIView beginAnimations:nil context:NULL];
self.pickerDisplayView.frame = CGRectMake(0, 185, 320, 275);
//[UIView setAnimationDuration:0.5]; //this line is probably not needed
[UIView commitAnimations];
Also I'd advice against using 'magic numbers' in the frame. Instead you can derive the pickerDisplayView frame from the superviews frame. If you do use 'magic' numbers be sure explain them in some way (ie assigning them to a appropriately named variable or a comment).