I'm trying to use iOS7's custom transitions in order to let the user navigate between view controllers through a kind of 'pan' effect.
As depicted here:
I need the background pattern to continue also outside the vc's bounds, so that when the user moves from vc1 to vc2 all the background visible between the vcs translates too.
Any hint is really appreciated.
Thanks,
DAN
Have a large UIImageView with the image in the transitionContext.containerView, and change its origin as the pan gesture progresses?
Related
I implemented my own custom animation using the UIViewControllerAnimatedTransitioning protocol. However, this replaces the entire default push animation (including the navigation bar animation, and the new view sliding on top of the old one). I want to keep that stuff, and animate a simple UIView on top, which visualises how an item from the first view is being taken to the next.
Is there a way to accomplish this?
There is an "annimateAlongSide" function .... think it belongs to the TransitionCoordinator. Check that out.
I need to show UIVIew when i will swipeup on UIViewController in ios with animation like it is coming from that UIVIewController,and i need to place that UIVIew in specific portion in UIVIewController not to cover on entire area.But my problem is i need to create this one in storyboard,normally storyboard means its for showing over all project flow so ,how to do that in storyboard.Please help me as soon as possible.I am new to iphone development i can do by programatically but i am not getting how to do with xib.
Thanks & Regards
Harshitha
You're going to want to look at custom View Controller transitions, introduced in iOS 7. There were a couple of WWDC 2013 sessions on this, including one called "Implementing Engaging UI"
The fact that you're using a storyboard doesn't matter, storyboards are just a way to define your view controllers and navigations via segues. If you're doing a custom animation, your View Controller still segues as normal, it just does so with a custom animation (instead of one of the stock ones, like a Navigation Controller "push" or the various Modal VC presentations), which you provide via an animation controller - an object that conforms to UIViewControllerAnimatedTransitioning.
Storyboard, or XIB? They are different.
The simplest thing to do is probably to create your view and get it set up in it's final position inside the view controller. Hook up an outlet to your view in your view controller.
Note the Y coordinate of the view when it is at the location you want it. Then use the size inspector to change the y coordinate of the view to the bottom of the view. (768 for a landscape iPad app, 1024 for a portrait iPad app, etc.)
Then attach a swipe gesture recognizer to your VC's content view, and in action for the swipe gesture, use a UIView animation method (animateWithDuration:animations: or a similar method to move the view's frame.origin.y up to the y desired y coordinate.
With iOS 7 a new push animation was created, which slides the pushed view controller on top of the hierarchy. But when the animation happens, iOS apparently does two things to modify the design of the top view controller:
A shadow is added:
And a light overlay over the bottom view controller:
In most applications this is not a problem. But, I am currently working on an application with pixel perfect design and I use view controllers with clear background. But this functionality remains the same, and the light overlay appears over the view controller. Because the background is a white gradient, this light overlay (on screenshot 2) is very visible and when the animation completes, it is removed without animation, which makes it very noticeable and annoying.
I am aware I can create custom animations and transitions, but I am wondering:
Is there any way to remove (or modify) this light overlay and shadow, without having to create custom transitions?
Thank you for your help.
It's not the most elegant solution, but I've seen people use UIImage animations to show what they want shown. So, you could:
Screenshot the incoming UIViewController
Animate the arrival of a UIImageView
Call pushViewController:animated:, passing NO for animated:
Remove the UIImageView
Again, a bit of a hack, but maybe it's the best solution for your scenario.
Try this proxy
[[UIImageView appearanceWhenContainedIn:NSClassFromString(#"_UIParallaxDimmingView"), nil] setAlpha:0.0f];
I don't know if Apple allows this or not because it uses a private API. Will update when app submitted.
Note: I'm not talking about custom view controller transition effects which can be done by using a custom view controllers it's the iOS 5+ API.
I'm talking about transitioning to another view controller, where a view from the presently displayed view controller is animated to the view controller to be presented's view.
EXAMPLE
-you have friendsViewController which displays a list of the current users friends. Each table view cell has a profile picture and name.
-click on a cell, all other cells fade away and the name and picture animate to the top. At this point, UserProfileViewComtroller is displayed.
THEORIES
-I could easily do this by combining the two view controllers, but UserProfileViewComtroller can be launched from other parts of the app.
-if the UserProfileViewControllers view is instantiated, I could convert the coordinates using UIViews methods
I feel like there is a more appropriate/cleaner solution here which is why I'm asking the community for help :)
It seems to me that what you want is exactly about view controllers transition, since you want to do 'something' that would look to the user as if you took a view from old VC and moved it to the new VC.
Then you're in luck, as you're allowed to move a UIView from one view controller to another using [superview addSubview:view] as part of the transition you want to do.
This can be done on any iOS version, although it's easier now as in iOS 7 there's a delegate you write (see <UIViewControllerAnimatedTransitioning> reference) which has access to both VC's view hierarchies and can change them at will (move one view, fade other views) during transition period.
Also, making your new view controller during the transition transparent (or using old controller's snapshot) will help you hide the fact that VC changed.
Not so much an answer but a technique that might inspire a solution. I did an app that had need for a custom transition like this. The original app arranged itself then took a snapshot, so at the last moment the user is looking at an image. The second viewController was created, given coordinates etc, and the image, then shown immediately. It put the image into its view (subview with same bounds).
At this point the second vc has complete control, and can fade in some other content etc. the reverse was more or less as the start - the image is used, swapped, used removed to uncover the real view content.
Note that this took a bit of time to get it working with no glitches etc.
EDIT: if you are concerned in turning the whole original view into an image, then modify the technique. For instance, in the original view, fade all other content to black but the cell, then snapshot the one cell. The second view will start with an all black background, and place the cell image over top it, then go from there.
EDIT2: As mentioned in the comments, you of course push the second view with no animation, so it happens instantaneously. By setting a small image on the second vc, with an agreed upon background, you can quickly "pass the baton" so to speak and let the second controller go to work quickly and seamlessly.
I need to implement a navigation based app with a custom made button bar that stays on the vertical size of the screen, similar to Reeder iPad app (see Reeder screenshot).
What is the best way to achieve that result? I thought about adding the bar as a subview of the UINavigationController and calling its methods (like pushViewController:animated:) via the parentViewController reference from my button bar view controller, but it seems a bit convoluted.
Might work, but dangerous: set a transform on the CALayer object of the UINavigationBar. A transform that rotates the bar by "-1 * M_PI_2" would be almost right, you might need to translate it a few pixels too, to get the position correct.
Definitely works, but more effort: render a custom navbar, implement the delegate protocol from UINavigationController, and listen to the nav changing, and implement your own animations inside the callbacks.
(I've done the latter method to provide custom UINavigationBars - it works fine)
The only caveat with latter method is that your animations might pause / delay because by default they wait for each other to finish. If you look at the UIView animations, there's a setting that says "play immediately, even if other animations are in progress", and you might need to set that to YES.