Creating a Drop Down Menu with Xcode 4.3.2 Storyboards - ios5

I'm a noob at Obj-C, and especially at the concept of storyboarding. It seems like storyboarding could be so awesome yet it is not intuitive at all.
I'm trying to make it so when this button is pressed, the user will see a drop down menu letting them pick from either All, Read, or Unread:
Do I drag a new view controller out and put in a drop down selector in that and then segue to that view from the button?
P.S. What system icon should I use to represent the read/unread filter? The one I have just isn't right. =]
P.P.S. This project is open source: https://github.com/kirkouimet/enzyme

Well, I guess the most native control for this would be a scope bar, but this must be attached to a search bar, which may not be what you're looking for. The scope bar basically would only appear when the search bar is the first responder (i.e., when it has the keyboard's focus).
If you're developing for iPad, you could use a popover controller. Simply create a view controller to manage the buttons for your filter and use a UIStoryboardPopoverSegue to transition to them.
These two questions involving popover segues may help:
- iOS - Create an Popover View using StoryBoard
- UIStoryboardPopoverSegue opening multiple windows on button touch
You may also want to consider using a segmented control inside a toolbar—using the UISegmentedControlStyleBar style—and situating that above the search bar you already have. Then you would just create a IBAction method (probably in your root master view controller) that responds to the UIControlEventValueChanged control event. You can use that to determine which segment was selected to do your filtering.
Something like this...
From top to bottom:
Navigation bar
Toolbar
Flexible space
Segmented control
Flexible space
Search bar
Table view

Related

Replacing UINavigationControllers NavigationBar with UIView

I am developing app that has multiple skins and I have a dilemma on how to implement this.
One of the solutions would be to have separate nib files for every skin, and load it depending on which skin is currently selected. Problem with this is that I can't edit navigation bar of navigation controller (which my app uses), and I have to change it's background image and back button image etc.. I came up with an idea to hide this navigation bar on every screen and replace it with custom UIView in Interface Builder which will act as navigation bar and custom back button with IBAction for popping current View Controller, so that user won't see any difference.
Is this approach acceptable and if I make it this way, will I have problems with rejection in App Store?
If you choose to hide & replace the UINavigationBar with your own UIView it's no problem as far as Apple goes.
However, I can tell you that you will have to spend some time trying to replicate some visual effects that come naturally with UINavigationBar.
For example, when you push/pop a new controller, you will see that the navigation bar title will slide & fade beautifully. The same applies for left and right bar items.
Personally I would not completely hide the UINavigationBar, but customize it. In the end it all depends on what you want, but by default the UINavigationBar is pretty customizable.
You can add your own buttons or even entire UIViews as left and right bar items. Also, you can add your own UIView as the title (with your own label, custom font or whatever) or change the background.
EDIT:
To easily customize the looks in your entire application, you can subclass UINavigationController and create your own CustomUINavigationController. Then, in viewDidLoad method you can change whatever you want to the navigation bar and this will be accessible in the entire application.
No way, what you are doing is perfect. This will work & no way it will get rejected from app store (just based on this approach). I too have explored several ways to provide skins & what you wrote seemed to be the least hassle-some. Plus its way more easier to create UI elements in Interface Builder hence the separate nib files for different skins.
I am saying this so confidently 'coz I have done the same thing & app store approved.
Best of luck.

Multiple UINavigationControllers similar to Maps

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.

iPhone, how what I show smaller views ontop of normal view and switch between my current normal views?

I'd like to display some small tutorial dialogs on top of my exiting views. I want to be able to see my existing views behind these smaller views.
Do I have to use view controllers in the same I way I would me normal views, and presentmodalviewcontroller etc ?
I haven't tried making a smaller view in interface builder before.
Also, say I want to move to another one of my existing views, full screen, while in my tutorial view. How would I close my tutorial view move to the next full screen view and launch another tutorial view ?
Example code or pseudo code would be welcome.
If your tutorial dialogs are just text, you could use UIAlertView to show the information to the user, so they can just read it and click the OK button when they're done. It's a very easy way to show some text to the user.
If you need to include images or other interactive items in your tutorial dialogs, the easiest way might be for you to just have your fullscreen view's view controller create a new view and put it up. So in this case, you'd create your view in Interface Builder, and when you want to show it, instantiate it using -[UIBundle loadNibNamed:owner:options:] and add it as a subview of your main view. Of course, it may even be easier to create the tutorial view programmatically from your view controller rather than using a nib for them at all.
Regarding the question of moving on to another fullscreen view, you would probably want to look into embedding your view controllers in a UINavigationController. This would allow you to push from the first controller to the second very easily, and the user would be able to just tap the Back button to get back to the first. If you're not looking for a navigation bar type of interface, you could present the second view controller as a modal view controller by calling -[UIViewController presentModalViewController:animated:] on your main view controller. This will pop up the second view controller fullscreen, and the user can dismiss it when they're done. Check out Apple's great documentation on UINavigationController to get a feel for how to use that:
http://developer.apple.com/library/ios/#featuredarticles/ViewControllerPGforiPhoneOS/NavigationControllers/NavigationControllers.html%23//apple_ref/doc/uid/TP40007457-CH103-SW1
I would think that you could use existing UIViewController and simply add a new UIView that is of desired dimensions, that sits in front of other views and which is non-opaque and has alpha less than 1.
If you want a general purpose tutorial mechanism that can be placed atop any one of many UIViewControllers, then you would want to extract the navigation logic, etc.
Sorry, no code - just a few quick thoughts.

iPhone/iPad/iOS: tricky use of tab bar controller

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.

iphone persistent button on all views

I have a navigation app that has many screens the user navigates to. A handful of views manages these screens dynamically. What I want to try to do is add a button that will always show up on every screen the user views. I need to do this so that the user is always able to preform the action associated with the button regardless of where they are in the app.
Is it possible to achieve this by adding this button only once and having it passed between views like my navigation bar is? Or do I just have to man up and add this button and its functionality to every single view file I have?
Thanks
I would say it probably depends on what the button does. If the button is generic to all views, meaning it affects all views the same exact way so no customization for a given view is needed, then a way to do this would be to include the function in the App Delegate or as a subclass to your Navigation controller.
You can then use the rightBarButtonItem to always show the same button and just access that method. You would just have to add code for the rightBarButtonItem in each viewDidLoad (but they'd all be the same).
I did something similar to this with an "Upgrade" button on one project. Since all the button does is launch the AppStore to the paid version, it's independent of all views and I can place it anywhere.
You can put the button on the navigation bar if you want. Alternately, the more generic way to do this would be to split your single view into two views. One is small and only contains your button but always stays on the screen. The second is your workspace and you swap in and out the views that are displaying the current content. You'll note that this is the way the navigation controls and tab-bar controls work.
The last way to do this would be to put different buttons, in the same place, on each view and have them all trigger the same action. As far as the user is concerned this looks like the same button. Disadvantage here is that you can't alter the button across all views in a simple manner.