I'm trying to emulate the sliding UIViewController as seen in the Readability app. You can drag a page to the right and it pops the current view off the stack to go back to parent UIViewController with a sliding animation as in the image: the right-most view was on the top and is being dragged right-wards showing the original table on the left.
I've tried a few of the slidingUIViewController solutions such as ECSlidingViewController but they try to emulate the Facebook/Path behaviour of partially sliding a slidingUIViewController on top of another which is not what Readability does.
I've also tried a standard horizontally scrolling UIScrollView but scrolls like the pages are joined at the sides, as opposed to sliding one view over another.
Does anyone know how they did this?
This can be easily accomplished in few steps. I'm not going to write down all the code you need to write in order to do it, but just the steps you need to take. I will use a master-details terminology where the master view is the one from which you want to present a details view and the details view is of course the one at the top of the navigation stack.
When you want to present the detail view:
1) create an instance of the UIViewController that handles the interactions with the detailView. On iOS 5+ you can store this instance in the childrenViewControllers #property on the master's viewController. If you support a lower OS you should store the instance in an ivar.
2) set the detailView's frame to be outside the screen's bounds; add to detailView a shadow for graphical purposes. Finally add the detailView as a subview of the masterView.
3) (optional) add a pan gesture recognizer to the detailView in order to allow the user to swipe the view back and dismiss it.
4) animate the detailView in the screen's bounds. Make sure the interactions with the view below are disabled (be careful not to disable also the interactions with the detailsView!)
When you want to dismiss the detail view:
1) animate the detailView outside the screen's bounds.
2) remove it from it's superview and delete the reference to it's viewController.
3) re-enable the user interaction with the master view.
Related
I need to create below thing
Currently i'm using WYPopover , but I can't create the button since it's outside of the popover. Is there any existing solution out there ? Many thanks
Create a bigger popover UIView holding all your child elements (current popover + button) and make its background transparent or however you wish.
Popover-controller's are exclusively used in iPad. If you want to use in iPhone, you should create it in a custom way.
I am not familiar with the XYPopover in Github, but normally the custom created popover should be dismissed whenever the user taps any place in the screen. That is one of the key feature of the popovers.
Normally the custom popovers are build like, adding a hidden parent view and then the visible image of a popover frame on it.
You should to do the following,
Avoid dismissing the parent view on tap of parent-hidden-view.
Add a close button at the area where you want to show the close button, on top of the parent-hidden-view.
Capture the button click and dismiss the view (remove the view from superview)
How to customize your need
Creating custom popover view is not a big task. It will take maxim one day, try it your self.
One Parent view with clear color
One background image of a popover frame.
View-inside popover (this needs to be customized for UIPopover also).
Close button.
I am making a media player app. I have UITableViewControllers that are embedded in Navigation Controller. I would like to somehow make a view that would overlay potentially multiple (2?) of these tableviewcontrollers (one that shows the user's playlists, and the next would show the tracks in the playlist), but only at the bottom, like a now playing bar in (e.g.) Spotify's iOS app (as in the left bottom side of this
or as in this
I have tried to drag a Container View into my Navigation controller (in which my TableViewCell is embedded), but it won't let me drop it there.
It looks like I can drag the Container View into my TableView, but then how would it remain there when i navigate between tableviews?
Trying to follow #Rintaro's suggestion, but I'm a little new to XCode. How did you do this? So I made a single view application, i added a container view to the first VC, it's imm drawing it somewhere else in the storyboard, but i can't figure out how to tell that view that it's a navigation controller. also, as soon as i add a second container to the first VC and tried to size it, the first container disappears! It is still listed in the hierarchy on the left, and still has an arrow pointing out of it, but the view controller that was added and was being pointed to is also invisible?!
UPDATE: This works very well, but it has a problem with orientation changes. how can i make this work in both orientations? (I hypothesize that it currently positions the "nowplaying view" off screen when the orientation changes).
Basically, view hierarchy like that is constructed like this:
Using two "Container View" in initial view controller, one for Navigation Controller, one for "Now Playing Bar" view controller.
ADDED:
"Main Container View Controller" would be your own UIViewController subclass. It will have responsibility to show/hide "Now Playing Bar".
Workaround for Interface Builder strange behaviors.
You can set Auto Layout constraints like following. Maybe you might want to select the view from the left menu.
Note that, you should uncheck Constrain to margins check box.
Container View for Navigation Controller:
Container View for Now Playing Bar Controller:
And then, Update Frames from the menu:
If you are manually placing any buttons with absolute coordinates, make sure that you update the coordinates of them when the rotation is changed.
Obviously you need to create a custom UIView class, where you will show this menu. And when you will create it, add it to your view just like here:
float y = ROOTVC.view.frame.size.height - 49;
[self setFrame:CGRectMake(0, y, 320, 49)];
[ROOTVC.view addSubview:self];
[ROOTVC.view bringSubviewToFront:self];
I would simply add a nowPlayingView to the appDelegate.window and adjust either:
The window.rootController.view frame to avoid overlapping the nowPlayingView.
If window.rootController.view is a UIScrollView, adjust its contentInset.bottom to avoid overlapping the nowPlayingView. You can also use transparency/translucency with this solution.
Add a dummy toolbar to the controller that will get covered by the nowPlayingView.
If your window.rootController is a UINavigationController, then you have to probably do the above fore each controller you push. The nowPlayingView will stay unchanged on top.
I have the task to design a application that has a main view which is always visible (it has a button on it's bottom side, and when pressed a image displays on top of all views), and a set of TableControllerView's that should appear under it, and the user needs to be able to navigate through them.
I know that you can embed a view inside another, but you cannot refer more than one view to it. The current way I'm trying to do now load one TableViewController inside the embed view, and when the user clicks the cell I manually load the other controller and add it as a child of the main view, which is the RootViewController. The problem with this approach is that the navigation bar gets stuck using the root view controller, so I have to manipulate the main navigation items on each subview transition, and second is that the frame for the second view I load is coming as it had full size, making some cells be under the main view button. This way doesn't uses segues for transition, so it makes the storyboard kinda useless.
I was thinking into using a TabViewController with it's tab hidden, but wanted to ask here for a better solution.
As you discovered, a TableViewController likes to fill up the whole screen (except navigation bars, tab bars, status bar, etc. which are official Cocoa Touch GUIs). When you want a table view to fill only part of the screen, you are supposed to use a UITableView but not a UITableViewController. You set your custom view controller object (subclass of UIViewController, not UITableViewController) as the table view delegate and data source. You will need to duplicate part of the functionality of UITableViewController in your custom view controller, but it's not a lot more than you have to do already to supply the data.
You should probably follow the standard design pattern and have separate view controller objects for each of the "pages" the user can navigate to. You just have a main button and image on each of them. But I could imagine why that might not give you exactly the effect you want.
My iOS6 app has a multi-level table view whose leaf nodes open up separate views. The animation from the first level of the table slides the old view out to the left and the new view in from the right. I'd like to also use this slide-in animation when transitioning from a table view to a non-table view. How?
Here's more info:
On the first level of the table view, there are disclosure Indicators . When one is clicked, the first level of the table slides off to the left and the second level view slides in from the right. Good.
On the second level of the table, there are Detail Disclosure Buttons which take the user to a detail view for that element in the table.
I'd like to offer the same animation here too: the table view should slide off to the left and the new view should slide in from the right.
First, am I correct that this is the correct animation to use in this case?
Second, do you know why this "slide in" animation isn't in the standard view animations in UIViewAnimationTransition below?
typedef enum {
UIViewAnimationTransitionNone,
UIViewAnimationTransitionFlipFromLeft,
UIViewAnimationTransitionFlipFromRight,
UIViewAnimationTransitionCurlUp,
UIViewAnimationTransitionCurlDown,
} UIViewAnimationTransition;
Finally, if I do want to use the same slide in animation that table views use, but it's not available as one of the standard views, how should I add this animation when transitioning between a table view and a non-table view?
Typically this type of animation is done in a UINavigationController, and is the result of pushing a new viewController onto the stack. If you want to simulate it, all you need to do is add the newly exposed view to your current base view, to the right of the current view (i.e. off-screen) and use UIView's animateWithDuration:animations:completion: method to move both the on-screen and off-screen views one screen to the left. (Use the completion: block to remove the original view or leave it in place so you can easily animate it back on-screen.)
I am using ViewController containment, and I am targeting iOS5 and higher. I have a container viewController (A) that contains a sidebar (B), and a content area (C). I want it so when the user taps a button on the sidebar (B), a tableViewController (D) will "slide out" from underneath the sidebar (B) and over the content area (C).
What would be the best way to approach this?
I am just beginning to wrap my head around basic viewController containment (a parent containing two viewControllers), but the sliding out of an additional viewController from underneath a child viewController has stumped.
You'll want to take one of two approaches.
Use UIPopOverViewController on iPad. This is pretty standard behavior for many iPad apps and Wanderlich has a great tutorial here which I used on my first one.
You could also take the following steps:
Allocate, initialize, and style your table view.
Add it as a subview of its parent view controller. Make sure its frame is underneath view controller B.
Use [viewcontrollerA bringSubviewToFront:viewcontrollerB];
Finally, use [UIView animateSubviews] to slide view controller D to where it should be.
When dismissing VCD, animate it out the same way you animated it in.
Hope that helps!