Want create a View that come from upperside at some position - iphone

I have created View which displays at position (0, 0, 320, 100). Now I want to make that view to come from upperside and to be set at given position I have tried this.
CATransition *transition = [CATransition animation];
transition.duration = 1.0;
transition.type = kCATransitionFromTop; //choose your animation
[bGView.layer addAnimation:transition forKey:nil];
[self.view addSubview:bGView];
But it did not worked for me.

You can adjust frames of your view in animation blocks
First add your view as subview
[self.view addSubview:bGView];
and give it a frame outside the visible screen area
bGView.frame = CGRectMake(0,-150,320,100);
and then fire animation to bring it from upside
[UIView animateWithDuration:2.0
animations:^{
bGView.frame = CGRectMake(0,0,320,100);
}
completion:^(BOOL finished){
;
}];

Everything is ok. Except a fact that animation should be added in superview, so it should be like:
[self.view.layer addAnimation:transition forKey:nil];

You can try view block animation
[UIView animateWithDuration:0.7f animations:^{
bGView.frame = CGRectMake(0.0f, 200.0f, 320.0f, 100.0f);//Some frame
}];

Related

Animate a UIImageView from center of the UIImageView

I have a UIImageView that should animate from size (0,0) --> (93,75)
I have the following
[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionTransitionNone
animations:^{
imgButton.layer.anchorPoint = CGPointMake(imgButton.bounds.size.width/2, imgButton.bounds.size.height/2);
CGRect btnFrame = imgButton.frame;
btnFrame.size.width = 105;
btnFrame.size.height = 85;
imgButton.frame = btnFrame;
}
completion:^(BOOL finished) {
[self animageButton2:imgButton];
}];
This is working but the only problem I have is that it is not animating from the center of the UIImageView but from the top left corner.
Anybody got a clue?
I've solved it with the help of Borrden. This is what my solution was.
First create an imageview
UIImageView *imgLineup = [[UIImageView alloc]initWithFrame:CGRectMake(10, y, 93, 75)];
imgLineup.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.0, 0.0);
And then to the following.
[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionCurveEaseInOut
animations:^{
imgButton.layer.anchorPoint = CGPointMake(0.5, 0.5);
imgButton.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);
}
completion:^(BOOL finished) {
NSLog(#"done");
}];
just try with this. import #import <QuartzCore/QuartzCore.h> then put below code while adding the uimageView into subView of self.view
CABasicAnimation *zoomAnimation = [CABasicAnimation animationWithKeyPath:#"transform.scale"];
[zoomAnimation setDuration:0.8];
[zoomAnimation setRepeatCount:1];
[zoomAnimation setFromValue:[NSNumber numberWithFloat:0.1]];
[zoomAnimation setToValue:[NSNumber numberWithFloat:1.0]];
[zoomAnimation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[imageView layer] addAnimation:zoomAnimation forKey:#"zoom"];
What i suggest may be kind of hack but it will be an easier way to achieve what you want:
You set the initial frame of imageView as:
CGRectMake(center, center, 0, 0);
So in your case it will be something closer to :
CGRectMake(46, 37, 0, 0);
Then animate it with new rect of something like this:
CGRectMake(0, 0,93,75);
You can use simple UIViewAnimation for this;
[UIView beginAnimations:#"zoom" context:NULL];
[UIView setAnimationDuration:0.3];
imageView.frame = CGRectMake(0, 0, 93, 75); ;
[UIView commitAnimations];
Hope It works
What you are trying to achieve is a scale transform i.e. animating UIView size from size(0,0) to size(w,h). Same effect can be achieved by CGAffineTransformMakeScale.
Initially when you create the view apply CGAffineTransformMakeScale(0.0,0.0) then animate size scale up to CGAffineTransformMakeScale(1.0,1.0).
Code:
// Create the view and apply correct frame
UIView *tagView = [[UIView alloc] initWithFrame:CGRectMake(50, 100, 100, 100)];
tagView.tag = kTag;
//Apply scale transform, to make size(0,0)
tagView.transform = CGAffineTransformMakeScale(0,0);
[self.view addSubview:tagView];
/// ............
UIView *tagView = [self.view viewWithTag:kTag];
//Now animate the view size scale up
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionCurveEaseOut
animations:^{
tagView.transform = CGAffineTransformMakeScale(1.0,1.0);
}
completion:NULL
];
This animation will happen about the center point of the view as you want, thus avoiding the need to play with anchorPoint and frame, which can be tricky. Read more about the relation between frame and anchorPoint from this answer.

Slide Image 400px from Current Location with CATransition

I have a UIImageView that I have aligned right where I want it in my XIB file. When my viewController is called, I would like to have the image move to the right about 400px over the course of 3 seconds. Then I would like the image to fade-out.
I have been playing around with QuartzCore and CATransition and have been able to fade an image out over time with:
CATransition *animation = [CATransition animation];
animation.type = kCATransitionFade;
animation.duration = 0.4;
[coverImage.layer addAnimation:animation forKey:nil];
coverImage.hidden = true;
However, I would like the image to slide to the right. Anyone know how to do this? Thank you!
Using CATransition for moving images is quite overkill. I would recommend using UIView animations, then you would simply do
// UIImageView *coverImage = ...
// This will move the image to the right and then fade it out.
[UIView animateWithDuration:3 animations:^{
coverImage.center = CGPointMake(coverImage.center.x + 400, coverImage.center.y);
coverImage.alpha = 0.0f;
}];
UIImageView *coverImage=[[UIImageView alloc] initWithFrame:CGRectMake(0, 300, 200, 400)];
coverImage.backgroundColor = [UIColor blackColor];
[self.view addSubview:coverImage];
[UIView animateWithDuration:0.4 animations:^{
coverImage.frame = CGRectInset(coverImage.frame, -400, 0);
coverImage.alpha = 0.0f;
}];
//there is subtype property which provides transition from right or from left. You have to just set this property as given below
animation.subtype = kCATransitionFromRight;

viewController no full screen

anyone know how to implement something like a viewController no full screen just like when we tap in search in the iPhone ?
I want that when the user make an swipe up a viewController (half height) be showed.
No segue !! I would like that the old view controller be showed at the same time.
Thanks in advance
I Add this type of functionality for whole project, i add the QRView in window so user swip up the view from any view of project...
See the Example of my code..
Just set the UISwipeGestureRecognizer to your second view which you want to present like bellow...
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setType:kCATransitionFade];
[animation setDuration:0.5];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:
kCAMediaTimingFunctionEaseInEaseOut]];
[[self.view layer] addAnimation:animation forKey:kAnimationKey];
UISwipeGestureRecognizer *swipeGesture = [[[UISwipeGestureRecognizer alloc] initWithTarget:self action:#selector(addCustomBottomBar)] autorelease];
swipeGesture.numberOfTouchesRequired = 1;
swipeGesture.direction = (UISwipeGestureRecognizerDirectionDown);
[yourViewController.view addGestureRecognizer:swipeGesture];/// use your view name here, its depends on your requirement
UISwipeGestureRecognizer *swipeGestureTop = [[[UISwipeGestureRecognizer alloc] initWithTarget:self action:#selector(addCustomBottomBar)] autorelease];
swipeGestureTop.numberOfTouchesRequired = 1;
swipeGestureTop.direction = (UISwipeGestureRecognizerDirectionUp);
[yourViewController.view addGestureRecognizer:swipeGestureTop];
and this bellow method called when you swipe up view...
Also just add one BOOL variable with name isViewPop and set it to NO in your viewDidLoad: method ..
-(void)addCustomBottomBar{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[UIView setAnimationTransition:UIViewAnimationTransitionNone forView:self.window cache:YES];
if (isqrcodepop) {
isViewPop=NO;
yourViewController.view.frame=CGRectMake(0, 430, 320, 70);
}
else{
isViewPop=YES;
yourViewController.view.frame=CGRectMake(0, 210, 320, 270);
[self.view bringSubviewToFront:yourViewController.view];
}
[UIView commitAnimations];
}
i hope this answer helpful for you...
If it is something simple I would add a UIView to your UIViewController just below the bottom-- then when you hit 'Search' or whatever, animate that UIView up in view with an animation block:
- (IBAction)btnTouch:(id)sender
{
[UIView animateWithDuration:0.3
delay:0.0
options: UIViewAnimationCurveEaseInOut
animations:^{
//bring searchView up
_searchView.transform = CGAffineTransformMakeTranslation(0, -80);
}
completion:^(BOOL finished){
}
];
}
Then when you are done, push the view back to its origin by using the same animation block with this line instead:
_searchView.transform = CGAffineTransformMakeTranslation(0, 0);
You could have the background view controller [self presentViewController:vc animated:YES completion:nil]; and set your front view controller's frame to half of the screen. This way, since bottom half of the front view is transparent, your background view controller will still be visible

How can I make slide down transition animation?

I can see a lot of transition animation: from left to right, right to left, fading, but how can I make transition from the top down to bottom?
Thanks for all help
Try working out this...
Add QuartzCore framework
#import <QuartzCore/QuartzCore.h>
CATransition *transDown=[CATransition animation];
[transDown setDuration:0.5];
[transDown setType:kCATransitionPush];
[transDown setSubtype:kCATransitionFromBottom];
[transDown setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[Boottom_view.layer addAnimation:transDown forKey:nil];
[[self navigationController] presentModalViewController:modalViewController animated:YES];
and hiding it like this:
[self.navigationController dismissModalViewControllerAnimated:YES];
Your could use Core Animation, what sort of object are you using?
Basically, to fade in an object you do this:
[[objectName animator] setOpacity: 1];
Remember you first need to set the opacity to 0 etc. before the animation begins.
Hope this is what your wanting.
You set your view frame to it's starting position offscreen and then your bring your frame into position with some animation.
CGRect originalFrame = [detailsView frame];
CGRect offscreenFrame = originalFrame;
offscreenFrame.origin.y -= offscreenFrame.size.height;
detailsView.frame = offscreenFrame; //Send the frame above screen
//Add view here if necessary to an unscrew view
// [aSuperView addSubview:detailsView];
[UIView beginAnimations:#"BringIn" context:nil];
[UIView setAnimationDuration:.3];
[UIView setAnimationDelegate:self];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
detailsView.frame = originalFrame
[UIView commitAnimations];

addSubview animation

I have main UIView where I display different data. Then I put a button, which displays subview like this:
- (IBAction) buttonClicked:(id)sender
{
UIView *newView = [[UIView alloc] initWithFrame:CGRectMake(25,25,50,20)];
UILabel *newLabel = [[UILabel alloc] initWithFrame:CGRectMake(25,25,50,25)];
newLabel.text = #"some text";
[newView addSubview:newLabel];
[self.view addSubview:newView];
[newLabel release];
[newView release];
}
newView appears fine, but it doesn't animate itself any way, it just appears immediately. How can I add some kind of animation when newView appears? Like zoom or slide down or something like that. Is there some simple code?
[UIView transitionWithView:containerView duration:0.5
options:UIViewAnimationOptionTransitionCurlUp //change to whatever animation you like
animations:^ { [containerView addSubview:subview]; }
completion:nil];
Hi You could use the UIView Animations:
[newView setFrame:CGRectMake( 0.0f, 480.0f, 320.0f, 480.0f)]; //notice this is OFF screen!
[UIView beginAnimations:#"animateTableView" context:nil];
[UIView setAnimationDuration:0.4];
[newView setFrame:CGRectMake( 0.0f, 0.0f, 320.0f, 480.0f)]; //notice this is ON screen!
[UIView commitAnimations];
The SDK will now figure this out for you and animate the view to the positions you gave it.
This works for most properties of UIViews: alpha, scale, bounds, frames, etc.
There are also build in animations as flip and curl:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight
forView:newView
cache:YES];
[self.navigationController.view addSubview:settingsView.view];
[UIView commitAnimations];
Hope this helps out getting you started:)
Let's do this in swift.
var redView = UIView(frame:CGRectMake(20,20,100,100))
redView.backgroundColor = UIColor.redColor
redView.alpha = 0.0
view.addSubview(redView)
UIView.animateWithDuration(0.25) { () -> Void in
redView.alpha = 1.0
}
Adding a subview cannot be animated by simply putting it in an animateWithDuration block. And it can't be animated using hidden.
link against QuarzCore framework
#import <QuartzCore/QuartzCore.h>
CATransition *transition = [CATransition animation];
transition.duration = 1.0;
transition.type = kCATransitionPush; //choose your animation
[newView.layer addAnimation:transition forKey:nil];
[self.view addSubview:newView];
I found that even with the animation blocks and options, trying to animate addSubview alone would not do anything for me. I found a workaround which is to set the subview's alpha to 0.0, add the subview, and then animate the setting of the alpha from 0.0 to 1.0. This gives me the fade in effect I was looking for.
Hope this helps someone else.
UIView *redView = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 100, 100)];
redView.backgroundColor = [UIColor redColor];
redView.alpha = 0.0;
[self.view addSubview:redView];
[UIView animateWithDuration:0.5 animations:^{
redView.alpha = 1.0;
}];
Swift 5
UIView.transition(with: renderView, duration: 0.25, options: .transitionCrossDissolve, animations: {
self.renderView.addSubview(emojiView)
self.renderView.bringSubviewToFront(emojiView)
}, completion: nil)
in code example renderView is view to what you will add your subView