UISegmentedControl inside title of UINavigationBar looks unformatted - iphone

Question

I'm trying to add a UISegmentedControl within the title of a UINavigationController. However, the formatting looks like this (i.e. its ugly).
When I want it to look like this (pretty :). Can anyone help??
I've read the popular example by Red Artisan here. But I'm not showing this as my first view (like Red Artisan does), so I've moved a lot of the code out of App Delegate. In App Delegate, I do set up this screen to be a UINavigationController with its rootView a UIViewController.
GenInfoViewController *genInfoController = [[GenInfoViewController alloc] initWithNibName:#"GenInfoViewController" bundle:nil];
UINavigationController *genInfoNavController = [[UINavigationController alloc] initWithRootViewController:genInfoController];
Then in viewDidLoad of GenInfoViewController.m I do the following:
self.segmentedControl = [[UISegmentedControl alloc] initWithItems:#[#"Info",#"Map"]];
self.navigationItem.titleView = self.segmentedControl;

Answer 1

To style a segmented control, set the segmentedControlStyle property to one of the following:
UISegmentedControlStylePlain
UISegmentedControlStyleBordered
UISegmentedControlStyleBar
UISegmentedControlStyleBezeled
For example:
self.segmentedControl = [[UISegmentedControl alloc] initWithItems:#[#"Info",#"Map"]];
self.segmentedControl.segmentedControlStyle = UISegmentedControlStyleBordered;
self.navigationItem.titleView = self.segmentedControl;
    
There's some relevant Q+As on here regarding styling segment controls:
Custom segment control
Remove rounded corner
Change font size
Change colour of selected segment
If you'd like to try a custom segmented control, check out all the available CocoaControls and CocoaPods.

Answer 2

Yup, you need to set the property "segmentedControlStyle" on your UISegmented control.
Your options are as follows:
typedef enum {
UISegmentedControlStylePlain,
UISegmentedControlStyleBordered,
UISegmentedControlStyleBar, // This is probably the one you want!
UISegmentedControlStyleBezeled,
} UISegmentedControlStyle;
So the following should probably do the trick:
self.segmentedControl = [[UISegmentedControl alloc] initWithItems:#[#"Info",#"Map"]];
self.segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar;
self.navigationItem.titleView = self.segmentedControl;
One thing you might also want to consider is setting the "tintColor" of the segmented control too.
self.segmentedControl = [UIColor blackColour];
Will leave you with something like this:
Obviously there is lots of other customisation you can do too. Take a look at the documentation here: http://developer.apple.com/library/ios/#documentation/uikit/reference/UISegmentedControl_Class/Reference/UISegmentedControl.html