How can I present one ViewController on top of another ViewController? - ios

Let's say I have a class that is a subclass of UIViewController named FullSizeViewController. I also have another class that is a subclass of UIViewController called TQHViewController (TQH: Three Quarter Height). How would I
be able to display TQHViewController over FullSizeViewController, with the only one quarter of FullSizeViewController visible?
animate this action?
I'm basically attempting to make something like a UIPopover, but animate it so it slides in from the bottom of the screen.

#property(nonatomic,retain) TQHViewController *template;
template = [[TQHViewController alloc]init];
template.view.frame = CGRectMake(20, 1000, 280, 450);
And you can also set the frame for the subView and decide the size of the subview. if you want animation from the bottom use UIViewwithanimation.
[UIView animateWithDuration:0.9f
delay:0.1f
usingSpringWithDamping:0.65f
initialSpringVelocity:0.1f
options:UIViewAnimationOptionCurveEaseOut animations:^{
template.view.frame = CGRectMake(20, 63, 280, 450);
[self.view addSubview:overlayWindow];
}
completion:^(BOOL finished) {
//Completion Block
}];
Use like this so your functionalities will not be lost and make nill after the usage.
If anything wrong feel free to comment it.

Related

Setting the size of a subview related to the parent view

Right, so I have a class called SimpleCalculator, in the interface builder I have a button with an IBAction. When I press the button it adds a subview that contains complex functions and then animates it so it slides up from the bottom.
The issue I am having is when I run it on iPad it will always take up the full screen to show the functions, however I want it to only take up 75% of the screen as it does when I run it on iPhone.
Here is the code I have currently to do this:
- (IBAction)advancedButton:(id)sender {
UIView * advancedView = advancedCalculator.view;
[advancedView setFrame:CGRectMake(0, self.view.bounds.size.height, self.view.bounds.size.width, self.view.bounds.size.height)];
[self.view addSubview:advancedView];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[advancedView setFrame:CGRectMake(0, self.view.bounds.size.height * 0.25, self.view.bounds.size.width, self.view.bounds.size.height)];
[UIView commitAnimations];
}
There is an easy method that I'd suggest you. Disable auto-layout and size class in the storyboard and try using manual method. It is very simple :) :) Let me know, if you're not clear :)

Showing UIImageView on startup after a delay with close button

I want to show a UIImageView after 3 seconds from the view did load. This image view is kind of a static Ad, a static image loaded that will show up when the application starts as mentioned. This ismageView should have a close button on it so the user can close it just like the typical ad behavior. It's my first time dealing with this kind of situations so please help me out i'm totally lost.
Till now i got to animate a view containing an image view with fade in and out animations, which is perfect..but now haw can i add a close button to it, to make her dismiss only when that button is pressed? this is my code
UIImageView *wnn = [[UIImageView alloc]init];
wnn.frame = CGRectMake(100, 100, 300, 300);
[wnn setImage:[UIImage imageNamed:#"menu-icon.png"]];
UIView *jn = [[UIView alloc]init];
[jn addSubview:wnn];
[self.navigationController.view addSubview: jn];
[jn setAlpha:0.f];
[UIView animateWithDuration:2.f delay:0.f options:UIViewAnimationOptionCurveEaseIn animations:^{
[jn setAlpha:1.f];
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.f delay:0.f options:UIViewAnimationOptionCurveEaseInOut animations:^{
[jn setAlpha:0.f];
} completion:nil];
}];
You can follow below steps:
Open Storyboard file with your viewcontroller.
Place UIView from library to your main view of viewcontroller.
Place your image and close button on new UIview placed.
Now set IBOutlet for this uiview.
Make hide/show this view instead of image and close button in your method.

Completion^ block not being called in UIView animation

Is there something I'm missing here?
i want the imageview to slide in then slide out from the bottom of the screen.
also, this seems to put the UIImageView behind the navigation bar how can I make a CGRect to fit the screen under the navbar?
_finga = [[UIImageView alloc] initWithFrame:CGRectMake(0, 88, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height-88)];
hiddenFrame = CGRectOffset(_finga.frame, 0, _finga.frame.size.height);
_finga.frame = hiddenFrame;
[self.view addSubview:_finga];
_finga.image = [UIImage imageNamed:#"Finga"];
[UIView animateWithDuration:2.0 animations:^{
_finga.frame = self.view.bounds;
}completion:^(BOOL done) {
if (done) {
NSLog(#"Complete!");
[UIView animateWithDuration:2.0 animations:^{
_finga.frame = hiddenFrame;
}];
}
}];
The CGRect you initialize _finga with would put it under the nav bar. In the animation, you are setting the frame to the bounds of the view, which would put it behind the bar, since the y value would be 0.
You could write less code by initializing _finga with this frame from the start:
CGRectMake(0,
self.view.bounds.size.height,
self.view.bounds.size.width,
self.view.bounds.size.height-88);
That will put the view off the screen. Then after you add it as a subview and set its image, animate the view back up to this frame:
CGRectMake(0,
88,
self.view.bounds.size.width,
self.view.bounds.size.height-88);
Which will put the view just below the nav bar. Consider also replacing all the hard coded 88s with a variable or #define so that you can play around with it more easily and in case the nav bar height ever changes.
As for the completion block, try logging that #"Complete!" string before you check if done is YES, or put a breakpoint there and see what the value of done is. Your animation may not be completing for some reason, which would explain why the code in the completion block is not being run.
Generally, though, if you are just using the completion block to run another animation after the first one, you don't need to check the done BOOL at all. It's only crucial when something else in your program depends on the state of the animation. For example, the user may click a button which animates something and then takes the user to a different section of the app. But if the user cancels the animation, you may not want to go to the other section after all, so you can check done.

Tweetbot like shrink view transition

Does anyone know how to achieve the present view controller's view to shrink and put another one over it with a transparency? It is achieved in Tweetbot 3 when you tap on your avatar in the top left on the navigation bar. Should I take a snapshot for example?
In order to achieve this effect you will have to rebuild your view stack from scratch.
So as there is no possibility to change the viewController.view's frame, you'll have to add a kind of container subview a little like this:
#implementation ViewController
#synthesize container;
- (void)viewDidLoad {
[super viewDidLoad];
container = [[UIView alloc] initWithFrame:self.view.frame];
[self.view addSubview:container];
// add all views later to this insted of self.view
// continue viewDidLoad setup
}
Now if you have that, you can animate the shrinking behavior like so:
[UIView animateWithDuration:.5 animations:^{
container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
}];
Okay, I assume you are developing for iOS 7, so we'll make use of some new APIs here (for earlier versions there are alternative frameworks). Now since WWDC UIView's got a resizableSnapshotViewFromRect:(CGRect) afterScreenUpdates:(BOOL) withCapInsets:(UIEdgeInsets) method returning a single UIView object.
[UIView animateWithDuration:.5 animations:^{
container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
} completion:^(BOOL finished) {
UIView *viewToBlur = [self.view resizableSnapshotViewFromRect:container.frame afterScreenUpdates:YES withCapInsets:UIEdgeInsetsZero];
}];
If you do not want to rewrite your view management, you can also first take a snapshot of your main view this way, set it to the container and then animate only the image. But remember, you can not interact with the captured view then.
When you've got that, you can download the two category files from this repo (They're from WWDC, so directly from Apple!). Basically, what they do is, they add some cool new methods to the UIView class, of which we'll use applyDarkEffect. I haven't tested this, maybe another method fits your needs better here.
Anyways if we implement that into the block and maybe also add a UIImageView to display the blurred overlay, it should look something like this:
[UIView animateWithDuration:.5 animations:^{
container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
} completion:^(BOOL finished) {
UIView *viewToBlur = [self.view resizableSnapshotViewFromRect:container.frame afterScreenUpdates:YES withCapInsets:UIEdgeInsetsZero];
UIImage *image = [viewToBlur applyDarkEffect];
UIImageView *blurredView = [[UIImageView alloc] initWithFrame:self.view.frame];
[self.view addSubview:blurredView];
// optionally also animate this, to achieve an even smoother effect
[blurredView setImage:image];
}];
You can then add your SecondViewController's view on top of the stack, so that it's delegate methods will still be called. The bounce effect of the incoming account view can be achieved via the new UIView animation method animateWithDuration:(NSTimeInterval) delay:(NSTimeInterval) usingSpringWithDamping:(CGFloat) initialSpringVelocity:(CGFloat) options:(UIViewAnimationOptions) animations:^(void)animations completion:^(BOOL finished)completion (more on that in the documentation)
I hope that will help you with your project.

iOS UIView setFrame animation error

I am having a weird error while animating a couple of view in iOS. My goal is to switch from a custom "Split View". You can see what's going on in this youtube video: http://youtu.be/ZWbf2bQYMns
You can see the weird "bump" in the Y value of the UIImageView, and I have been wondering how to fix it for quite a while now.
This is the View Controller's interface:
#interface VideoSharing_Pad : UIViewController
{
IBOutlet UIView *videoCallView;
IBOutlet UIImageView *imageView; //This is "inside" mediaView
IBOutlet UIView *mediaView;
CGRect mediaRect;
CGRect videoCallRect;
CGRect imageRect;
}
In viewDidLoad I store both views doing:
//Get frames from XIB
mediaRect = mediaView.frame;
videoCallRect = videoCallView.frame;
imageRect = imageView.frame;
And this is the code that executes when I want to switch from the Split View to a full Screen Mode:
- (IBAction)toggleFullScreen:(id)sender
{
if (iScreenMode == callAndShareMedia) {
CGRect fullScreenRect = CGRectMake(0, 0, 1024, 768);
CGRect dissapearRect = CGRectMake(0, - videoCallView.bounds.size.height, videoCallView.bounds.size.width, videoCallView.bounds.size.height);
[UIView animateWithDuration:1.0
delay:0.1
options: UIViewAnimationCurveEaseOut
animations:^{
[videoCallView setFrame:dissapearRect];
[imageView setFrame:fullScreenRect];
[mediaView setFrame:fullScreenRect];
}
completion:^(BOOL finished){
}];
iScreenMode = onlyShareMedia;
return;
}
else if (iScreenMode == onlyShareMedia)
{
[UIView animateWithDuration:1.0
delay:0.1
options: UIViewAnimationCurveEaseOut
animations:^{
[videoCallView setFrame:videoCallRect];
[mediaView setFrame:mediaRect];
[imageView setFrame:imageRect];
}
completion:^(BOOL finished){
}];
iScreenMode = callAndShareMedia;
return;
}
}
I would really appreciate any help I can get. Thanks a lot!
this is a screenshot of the XIB:
as you can see from the screenshot and the .h file, the imageView is inside an UIView called mediaView, The other UIView, videoCallView is the one with the three dummy pictures.
Interesting question indeed. It definitely has to do with animating superview and subview at the same time. I did sample program, and reproduced similar situation.
My workaround would be to avoid animating the superview (mediaView), and expand only the subview (imageView) to full rectangle. Since your superview (mediaView) does not have much, it should not give so different user experience.
So, instead of
[UIView animateWithDuration:1.0
delay:0.1
options: UIViewAnimationOptionCurveEaseOut
animations:^{
[videoCallView setFrame:dissapearRect];
[imageView setFrame:fullScreenRect];
[mediaView setFrame:fullScreenRect];
}];
You can do
[UIView animateWithDuration:1.0
delay:0.1
options: UIViewAnimationOptionCurveEaseOut
animations:^{
[videoCallView setFrame:dissapearRect];
[imageView setFrame:(CGRect){fullScreenRect.origin.x - mediaRect.origin.x, fullScreenRect.origin.y - mediaRect.origin.y, fullScreenRect.size}];
}];
For coming back to normal mode, you can just ignore mediaView animation. Probably you want to move (animate) the toggleButton along with other animation as well.
#jrturton's answer (second part) seemed a nice workaround, but it did not work on my sample code. It worked on the way to go (expansion), but bumped on the way back (shrink), for the reason I don't know why. But don't dismiss his answer because of my comment, it could be me.
Interesting question. I can't view your video from work but I expect your issue is that you are resizing both a view and its subview during an animation, there will probably be interference from any autoresizing masks (do you have them?) - the superview will change the size of the subview, then the interpolated frame will be applied.
If you think about it there will also be a stage where your image view has to animate more quickly than the superview as it has more ground to cover to get to the same final rect. The interpolation worked out by the animation may struggle with this.
If removing any autoresizing masks doesn't work, you might need to split the animation into two - one to increase the size of the superview, and another to then zoom the image view to full size.

Resources