I have a UIImageView in the center of the screen (Position Set with the help of the constraints through the storyboard)
In the code's viewDidLoad method I set the image for that imageView by:
self.imageView.image = [UIImage imageNamed:#"food"];
Then I wanted to slide the old image off from left of the UIImageView and slide the new image on from right of the UIImageView for which i have used the following code(The code below is triggered after the swipe gesture is recognized, so the code below is inside the selector method for the swipeGestureRecognizer):
self.imageView.image = [UIImage imageNamed:#"picnic"];
CATransition *animation = [CATransition animation];
[animation setDuration:1];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromRight];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[self.imageView layer] addAnimation:animation forKey:nil];
But when I do this the new image appears on the screen from the right edge of the screen and not the right edge of the UIImageView and same with the old image which is pushed out all the way to the left edge of the screen and not the left edge of the UIImageView.
Is there a way I can fix it?
Any help would be appreciated. Thanks
You can try put image view into view which too have clip to bounds YES. I think this should help.
Related
I have a problem when I want to create a transition between to views inside a container view in iOS application. I want to create an animation that makes my first view goes out sliding to the left and the second coming from the right (like switching between photos, a sort of push in Navigation Controller). I created my animation but the problem is that my subview does not disappear once reached the border of my container view but when it reaches the edge of my screen.
I used this code:
CATransition *transition = [CATransition animation];
transition.duration = animationTime;
transition.type = kCATransitionPush;
transition.subtype = transationSubtype;
[transition setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
transition.removedOnCompletion = YES;
[view.layer addAnimation:transition forKey:nil];
As visible in the image the red square goes out from the screen and not from its container and also the green comes inside from the screen edge and not from the container view edge. I want instead that the animation ends when reaches the container view edge.
I tried anything but I was not able to find something useful.
Try to set clipsToBounds property of the container view to YES
I trying to create activity indicator, currentView will be static and nextView will animate left to right, right to left, top to bottom and bottom to top.
I had written the code as below. The problem I am facing is, instead of all the four animations I am getting only one animation top to bottom animation. Can anyone help me how to run all the four animations one by one until a process is completed
statusImage = [UIImage imageNamed:#"image2.png"];
moveImage = [UIImage imageNamed:#"image1.png"];
currentView = [[UIImageView alloc]
initWithImage:statusImage];
nextView = [[UIImageView alloc]
initWithImage:moveImage];
//Add your custom activity indicator to your current view
[self.view addSubview:currentView];
[self.view addSubview:nextView];
CATransition *transition1 = [CATransition animation];
[transition1 setType:kCATransitionPush];
[transition1 setSubtype:kCATransitionFromLeft];
[transition1 setDuration:1];
[nextView.layer addAnimation:transition1 forKey:#"string1"];
CATransition *transition2 = [CATransition animation];
[transition2 setType:kCATransitionPush];
[transition2 setSubtype:kCATransitionFromRight];
[transition2 setDuration:1];
[nextView.layer addAnimation:transition2 forKey:#"string2"];
CATransition *transition3 = [CATransition animation];
[transition3 setType:kCATransitionPush];
[transition3 setSubtype:kCATransitionFromTop];
[transition3 setDuration:1];
[nextView.layer addAnimation:transition3 forKey:#"string3"];
CATransition *transition4 = [CATransition animation];
[transition4 setType:kCATransitionPush];
[transition4 setSubtype:kCATransitionFromBottom];
[transition4 setDuration:1];
[nextView.layer addAnimation:transition4 forKey:#"string4"];
Can anyone help me how to run all the four animations one by one until a process is completed
A layer can have only one transition animation at a time. There is no point supplying a key for a transition animation. The key will always really be kCATransition. Your string1 etc. are pointless; just use nil. Moreover, your code makes no sense; multiple animations attached to a layer causes those animations to be performed simultaneously (if possible), not successively.
You need to chain the animations. Set up your code like this:
Perform the first animation, giving it a completion handler. This completion handler is called when the first animation finishes.
In the completion handler, do the second animation, giving it a completion handler. This completion handler is called when the second animation finishes.
In the completion handler, do the third animation, giving it a completion handler. This completion handler is called when the third animation finishes.
In the completion handler, do the fourth animation.
I'm working on and iPhone app, and have an issue with a gesture recognizer.
I've added an UITapGestureRecognizer on a view, then I transform the layer related to this view with CABasicAnimation. After this transformation, the gesture recognizer only works in the area occupied by the view before the transformation.
Hope this little description of my problem is understandable..
Here is some code :
UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(myViewTapped:)];
[self.myView addGestureRecognizer:tapGestureRecognizer];
CABasicAnimation * animation = [CABasicAnimation animationWithKeyPath:#"position.y"];
[animation setFromValue:[NSNumber numberWithFloat:0]];
[animation setToValue:[NSNumber numberWithFloat: - 100]];
[animation setDuration:.3];
[animation setTimingFunction:[CAMediaTimingFunction functionWithControlPoints:.55 :-0.25 :.30 :1.4]];
animation.additive = YES;
animation.removedOnCompletion = NO;
animation.fillMode = kCAFillModeForwards;
[self.myView.layer addAnimation:animation forKey:nil];
How can I handle this issue ?
Thanks !
You are animating only the graphical part of the view (the CALayer), not the part responsable for user interaction (the UIView itself).
Your code move the layer and made it been drown elsewhere, but don't change the frame (or the bound+center).
You have 3 option (well maybe more, just I can think of these 3):
1) use the UIView-based animations [UIView animation...]
2) struct with you code but also relocare the view after the animation take place (but this may rise issues cause your layer will be moved also).
3) use your animation but put the gesture recognizer on a parent (bigger) view and then check the events there...
I am trying add subview with animation effect using the code which work fine for the first time below.
CATransition *transition = [CATransition animation];
transition.duration = 1.0;
transition.type = kCATransitionMoveIn;
transition.subtype = kCATransitionFromRight;
[newView.layer removeAllAnimations]
[newView.layer addAnimation:transition forKey:nil];
[self.masterview addSubview:newView];
There is a back button in newView which removes the View from the superview.
[newView removeFromSuperview];
Now when I try adding newView as subview again using the above code,its first adds the view as a subview(without animation) and again with animation.
Instead of removing newView from superview, why not you can just set a frame like
newView.frame = CGRectMake(0, -500, CGRectGetWidth(newView.frame), CGRectGetHeight(newView.frame));
so that you can just hide it from showing. Just an idea. :-)
When you remove the view from its super view it keeps its frame as it is. So, i think you have to change the newView location to be placed in the new location again.
It will work fine for all the times.But the only difference you have to find is that you need to wai for the duration of animation. It will not animate continuously. It will take a minimum time that you mentioned in the duration.
I've got a MainViewController that has many subViews. Basically, it's broken down into two panes. The panes are designed to look like clipboards. I'd like to hit a button and have the "paper" on one of the clipboards do a partial curl to reveal the page underneath.
This isn't a full Modal ViewController presentation situation.
I'm working with the following code, but the results are funky:
FlipView *flipView = [[FlipView alloc] init];
[self setFlipView:flipView];
[flipView setHidden:YES];
[flipView setFrame:[[self WhereAmI] frame]];
[[self view] addSubview:flipView];
[[self view] bringSubviewToFront:[self WhereAmI]];
[flipView setHidden:NO];
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:1.0];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[animation setType:#"pageCurl"];
[animation setFillMode:kCAFillModeForwards];
[animation setEndProgress:0.9];
[animation setRemovedOnCompletion:NO];
[[self WhereAmI] setHidden:YES];
[[[self WhereAmI] layer] addAnimation:animation forKey:#"pageCurlAnimation"];
Basically, I'm trying to load my new view programmatically, slide it in behind the currently visible view and then curl up the view that's on top to reveal the view that's now underneath. I get somewhat of a partial curl animation, but the "page" that's curling up isn't opaque, which is odd. Also, when I don't set my view and label to be hidden, even though you see them curl up, you also still see them "underneath", which is also odd. Plus, I don't see the UILabel I placed in the XIB for the new view.
Any thoughts?
Thanks!
OK, so I've got a working solution, but it's not quite what I was hoping to do. I'd still love to figure out the solution to my original question, but here's what I'm doing for now:
The background image for my "base" view is an image of a spiral-bound notebook.
The background image for all other views is a screen shot of a page curl.
(By "background image", I mean a UIColor created with a patternImage.)
The code to transition views is:
- (IBAction)NavigationTabSelected:(id)sender
{
// Flipping views is driven by a SegmentedControl
int selected = [[self NavigationTabsSegmentedControl] selectedSegmentIndex];
int current = [[self ViewArray] indexOfObject:[self ActiveFlipView]];
UIView *newFlip = [[self ViewArray] objectAtIndex:selected];
BOOL up = selected > current;
[UIView animateWithDuration:1.0
animations:^{
[UIView setAnimationTransition:(up)?UIViewAnimationTransitionCurlUp:UIViewAnimationTransitionCurlDown forView:[self RightView] cache:YES];
[[self ActiveFlipView] removeFromSuperview];
[[self RightView] addSubview:newFlip];
}
completion:^(BOOL finished){
[self setActiveFlipView:newFlip];
}];
}
As you can see, tabs to the right of the current tab generate a "curl up" and tabs to the left of the current tab generate a "curl down". It's not quite what I wanted, but it serves my purpose.
Any better ideas?
have you considered loading it as a modal view?
- (void)yourFrontViewControllerMethod
{
YourBackViewController *bfvc = [[YourBackViewController alloc] init];
[bfvc setModalTransitionStyle:UIMoalTransitionStylePartialCurl];
[self presentViewController:bfvc];
[bvfc release];
}
This will give you the desired effect of a view curling up to reveal another view.
Also as a general rule of thumb we try not to create animations that way. Try using a block based method instead (eg [UIView AnimateWithDuration:....]);
Hope that helps :)