Trying to implement the following behavior on an iPad.
I have a map-centric application which uses a tab-bar interface. The tabs at the bottom allow the user to choose between looking at the various different types of points that are marked on the map (e.g, think of the tab-bar items "food", "lodging" and "gas", where the "food" tab shows a listview of all the restaurants in the area, and so on).
The top half of the screen should always show the map. The bottom half of the screen is what should be controlled by the tab bar. However, there needs to be one tab on the tab bar that will make the map full-screen (not covering the tab bar itself, but covering everything else).
My impulse is that what I need is a map-view which always covers the whole screen, and then a tab-bar-controller that controls a view which sits on top of the map view, and then when the user selects the full-screen-map tab, the content view just gets hidden. But how do I actually do that?
Thanks!
I would go so far to say that this barely possible using a standard UITabBarController. Instead, you should use the UITabBar directly in your interface and then link the actions of the items directly to your root view controller. This controller should then lay out the content area accordingly. This could be done quite easily by giving your nib a structure like this:
- ViewController
- View
- View // place contents here
- TabBar
- Item1 // link action to ViewController
- ...
Depending on how generic you want your solution to be, you could also implement a custom subclass of UITabBarController that does the custom layout. The above solution is the simplest and might require the least code.
Related
I would like to develop a ipad apps which has a menu at the top of the screen as well as at the bottom.
There are four buttons on the top of the screen, and there are 10+ buttons at the bottom tab bar, which can be scrolled horizontally.
How can I write the root view controller as a framework for this operation?
Should I customize the UIViewController class or UITabBarViewController?
Thanks
EDIT:
Sorry for being unclear. Let me restate my question.
Actually my app will have the following hierarchy.
'Front Page' is simply a page (view controller) for user to choose language. After choosing the language, 'Menu Page' view controller is displayed.
Starting from Menu page and ALL view controllers (VC) in below, the page layout is something like this.
As you can see, there are top menu and bottom menu. Clicking on the buttons the app will quickly jump to the corresponding view controller (3rd level in the tree, VC1,VC2,VC3 etc) . And for every view, there is a BACK button on every page, clicking which will back to the parent view controller.
I was thinking to implement this by using a tab bar view controller and a navigation view controller but I still do not have a clear idea how to implement this.
Or maybe should I just use the navigation view controller and hide the top tool bar except the back button, and display an overlay UIView as menu which is on top of all other UIViews.
Can somebody help me? Thanks.
Since this is the outermost container for my app I hope to do it properly at start..
Sorry for my long question.
If you really want to develop a framework for this logic .You need to create Manager, ViewController, View, DAO ,Model and other classes according to your needs.
I assume you want to add the buttons dynamically to the tabbar (and if it scrollable , it must be a scrollview).You can use Toolbar for upper view but then it won't be in sync with the bottom-view(visually).In that case you will have to create your own customized views to look like a tabbar.
The manager will basically keep a track of all the buttons and different states of events and action on the views and the same information can be accessed via a static method form the viewcontroller.
Well you have not detailed on your needs , so it's difficult to predict the entire architecture.
You need a container view controller to manage selection of VC's 1-4.
clicking which will back to the parent view controller
Parent view controller is used to mean the container vc in a container view controller scheme - I'm not sure that's what you mean in this comment. Where exactly does the back button go?
See this link for more info about container VC's.
https://developer.apple.com/library/ios/featuredarticles/ViewControllerPGforiPhoneOS/CreatingCustomContainerViewControllers/CreatingCustomContainerViewControllers.html
You should be able to embed a tab bar controller in the content view of the container VC. Should be able to but it might be really buggy if there is a lot of communication between the child vc's.
The hard part is the back button. Basically it must be a button that goes back to VC 1-4 depending on which section you are in. The easiest way to do it is to make sure that when you cycle view controllers, pass the back button information as to which VC is the current child so it knows which VC to navigate to when you press it.
I am making an app that has both a bottom bar and a top bar (both are customized) and i want them to stay there the entire length of the app while the middle portion switches between views. But the kicker is at some points in the app, i want to have the top bar and bottom bar slide off the screen and be able to be dragged back on.
What i was thinking was to have one main UIViewController with three UIViews (top bar, middle section, and bottom bar) each running code from their own respective files. Sort of like how a Tab bar works with a nav controller. or do i have that backwards? i dont really know... but any constructive advice helps =)
Im fairly new to xcode and i've been trying to find a way for a few days now, so please dont be too harsh on me. Thanks!
In general, we build one view controller for each 'screenful' of content. So the basic advice for you would be to make the app in a way where each 'section' is it's own view controller. This is especially important to the MVC paradigm, where your business logic should be in the viewControllers, not the views (just display and interaction logic there). If you had just one view controller, it would get convoluted FAST by trying to manage multiple sections.
A good route may be this: Embed the whole hierarchy in a navigation controller, which gives you the top bar. Then make a custom view controller class which knows how to make your bottom bar, and have each section subclass that.
The side effect is that the bottom bar will be uniquely created for each section VC. If that is not desirable for you, you can explore view controller 'containment'. It is basically a technique for building components like the navigation controller, which keep certain elements onscreen for a long time, while exchanging 'content' view controllers for a smaller portion of the screen. It's not the easiest thing to do, and should be considered carefully. However, if you really need to keep the same instance of something on screen while other view controllers come and go, it may be the right way to go. That said, consider the other idea first (each section manages it's own bottom bar). You can accomplish it in a way that promotes code re-use, etc.
I've yet to find an example that does this. A client wants a navigation-based app where two sections (one nav-screen each) need to have a few views, controlled by a tab bar. I'm having difficulty setting up the logic of connecting all of the elements and making sure the flow makes sense (ex. hitting the nav-bar's back button on any of the tabbed views will lead back to the same screen).
I answered a similiar question not long ago (if I understand your question right). This will add a tabbar as a rootcontroller and each tab has its own navigationcontroller.
Right design pattern for tabbed navigation views?
EDIT
From UITabBarController documentation
Because the UITabBarController class inherits from the
UIViewController class, tab bar controllers have their own view that
is accessible through the view property. When deploying a tab bar
interface, you must install this view as the root of your window.
Unlike other view controllers, a tab bar interface should never be
installed as a child of another view controller.
As #Jolly good has mentioned, Apple HIG suggests not to do such implementations.
The only other way I can suggest is to try implementing a custom view controller that looks/behaves like a tabbarcontroller and make use of that.
Another hack I can think of, not sure if it'll work or if its possible, create a tabbarcontrller the usual way and then set the hideBottomBar property, and make the bottom bar visible only when you want it to be visible.
It is possible, despite the documentation that #Jolly good cited.
As a real world example, let me describe a game of mine. It consists of a UITabBarController (UITBC) and UINavigationController (UINC). The "main" window of the game is the Root view of the UINC, and when the game is active, it hides both the tab bar and nav bar to maximize screen real estate (not as necessary for iPad, but still...).
When the game is idle (paused, between rounds, etc.), it pushes the UITBC onto the nav bar. It also tells the UITBC to make a particular VC selected. That allows access to the additional screens (About, Scores, Instructions, Settings, etc.), and the player can navigate using the tab bar. In addition to the additional views on the tab bar is the game controller that simply pops the UITBC from the nav bar to revert to the game view to un-pause, go to next round, etc. (Obviously, the UITBC is cached within the game VC so it can be pushed back when necessary.)
Using this sort of logic, it is possible to mix and match tab bar and nav bar controllers for complex navigation. You can get away with this for games; just make sure that any non-game app follows Apple's HIG so as not to confuse the user.
I hope this helps.
I'm looking to create a UI similar to that of the Maps application just to try out some odds and ends and brush up on my knowledge of interface builder.
What i'm struggling to discern at the moment is how the Maps application handles the interactions between the toolbar and the navigation controller and which UI elements are needed to mimic the interface. I'm guessing that the Maps app only has one view controller which kind of negates the need for a navigation controller so i'm not sure if i'm using the right application template currently but i'll come back to that one later.
To give you an idea of what I'm looking to copy, if you search for directions between two locations and then hit route, the navigation controller changes from:
[Clear] Directions [Cancel]
to:
[Edit] {car | train | walk} [Start]
That's all fine so far, nothing out of the ordinary from what i'm used to doing. What is confusing me however is the semi transparent view underneath the navigation controller that displays the total distance and time (or other information depending on the search method). What is the UI element? Is it simply a toolbar tacked on to the main view? How would I go about adding this to my app, is it part of the view, or part of the navigation controller?
Also, in a similar vein... Clicking the "Search" segment in the toolbar displays the search field at the top of the app. Is this in the navigation controller, or is the navigation controller hidden whilst the search field is displayed? Again, clicking "Directions" displays the search field but this time with an additional search field and a button to switch the order of the fields. How is this achieved?
I'm not so good with the terminology so excuse me if i've mixed up some terms. I'm just trying to get to grips with the UI elements as i've spent most of my time learning OpenGL so it's all a bit new to me still. If anyone can point out the right UI elements used in the Maps application, that would be greatly appreciated!
Many thanks for reading.
Edit: I've uploaded an image to illustrate the UI elements i'm querying in this question.
I have no inside information, so I'm speculating on how I'd do it.
I'd use a UIToolBar for both the top and bottom bars, not a navigation bar. You can put a tool bar anywhere as they're just a subclass of UIView.
The semi transparent view underneath the navigation controller is likely just a custom view on top of the map view. Again, just a subclass of UIView.
The items in both toolbars would call methods in the view controller that could change the contents of either tool bar or hide or show other views.
For example, the Search button might call a showSearchToolbar: method, while the Directions calls a showDirectionsToolBar: method. Both methods would just change the contents of the top tool bar and hide or show the view beneath the top tool bar.
Check out the UICatalog example code from Apple to see how to dynamically change the contents of the tool bar.
I want to use Tabview for my whole app. However in certain view, I have more operations than I can fit in the navigator bar. So I thought of using Toolbar but toolbar should be located at the bottom, right? Toolbar looks weird to be on top of the tabview, and hiding tabview for one view doesn't really make sense. I guess I can go with more buttons in the main view, but any other alternatives?
What can one use to add more operation(s) to tabview?
Thanks
In regards to keeping the UI simple, Apple recommends using a "More" button on the tab bar to fit additional functionality in on a tableview or some other NIB.
Additionally, you could always have another NIB that is hidden unless they hit a certain area or button and then it pops into view for controls, options, etc.