Programmatically add a UISegmentedControl to a UINavigationBar

Question

How do I PROGRAMMATICALLY add a UISegmentedControl to a UINavigationBar?

I do not want to use a XIB file for this.

I have a UIView with a UITableView that is added as a subview.

I have tried two methods but both are not satisfactory:

1)

self.segmentedControl = [[UISegmentedControl alloc]initWithItems:[NSArray arrayWithObjects:@"All",@"Subject",@"Category",@"Finished",nil]];
self.segmentedControl.backgroundColor = [UIColor cloudsColor];
[self.segmentedControl setSelectedSegmentIndex:0];
[self.segmentedControl addTarget:self action:@selector(segmentedControlHasChangedValue) forControlEvents:UIControlEventValueChanged];
self.mainView.tableHeaderView = self.segmentedControl;

The reason this first one fails is that in the UITableView, when the user scrolls, the segmented control is scrolled as well! I don't want that to happen. It must stay pinned to the top.

2) Second attempt

UISegmentedControl *statFilter = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:@"Filter_Personnal", @"Filter_Department", @"Filter_Company", nil]];
[statFilter setSegmentedControlStyle:UISegmentedControlStyleBar];
[statFilter sizeToFit];
self.navigationItem.titleView = statFilter;

This removes my title!!! I have a title at the top in the UINavigationBar and this method removes it!!

Here's an example of what I want to accomplish: UISegmentedControl below UINavigationbar in iOS 7

The UISegmentedControl must stay pinned below as part of the UINavigationBar and it must be below the title!

Thanks!

Add the segmented control as a subview above your table view. What's so complicated about that? — CrimsonChris, May 31 '14 at 00:00
Uhhh... Okay, I didn't try this at first because I didn't want to mess with the bounds of my UITableView.. — wayway, May 31 '14 at 00:31
Repositioning the table is one line of code. The link you posted where they use a toolbar is also a simple way to do it. — CrimsonChris, May 31 '14 at 00:53
@WayWay I answered the question: [UISegmentedControl below UINavigationbar in iOS 7](http://stackoverflow.com/a/25454083/1873427) — iTSangar, Aug 22 '14 at 19:52

score 1 · Answer 1 · answered May 31 '14 at 00:28

1

Use tableView:viewForHeaderInSection: (and possibly tableView:heightForHeaderInSection:) instead of tableHeaderView. Set tableStyle to UITableViewStylePlain (this should be the default).

answered May 31 '14 at 00:28

Khanh Nguyen

10,636
9
47
62

This was my approach for method 1 and it didn't work because the thing scrolled with my table! – wayway May 31 '14 at 00:30
Your code used `tableHeaderView` (the global header), not the delegate methods (section header)... Section headers stick to the top of the screen. – Khanh Nguyen May 31 '14 at 00:32

score 1 · Answer 2 · edited Jun 30 '15 at 19:44

You can use the following code :

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{


     if (section == 0) {
         UIView *viewHeader = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)];


         UISegmentedControl *segmentedControl = [[UISegmentedControl alloc]initWithItems:[NSArray arrayWithObjects:@"All",@"Subject",@"Category",@"Finished",nil]];
         segmentedControl.backgroundColor = [UIColor cloudsColor];
         [segmentedControl setSelectedSegmentIndex:0];
         [segmentedControl addTarget:self action:@selector(segmentedControlHasChangedValue) forControlEvents:UIControlEventValueChanged];
         segmentedControl.frame = CGRectMake(0, 20, viewHeader.frame.size.width, 50);


         [viewHeader addSubview:segmentedControl];

         return viewHeader;

     }
     return nil; 
}

Hope this helps. Thanks.

score 0 · Answer 3 · answered May 31 '14 at 01:01

As the other posters have suggested, you could put the segmented control above the table view and under the nav bar, but you'd need to shift down the table view.

...Or, you could add the segmented control as a tableHeaderView.

A third option is to actually add it to the navigation bar. To do that you have to turn it into a navBarItem. Something like this:

UISegmentedControl *statFilter = [[UISegmentedControl alloc] 
  initWithItems:
    [NSArray arrayWithObjects:
      @"Filter_Personnal", 
      @"Filter_Department", 
      @"Filter_Company", 
      nil]];
[statFilter setSegmentedControlStyle:UISegmentedControlStyleBar];
[statFilter sizeToFit];

UIBarItem *theBarItem = [[UIBarItem alloc] initWithCustomView: statFilter];
self.navigationItem.rightBarButtonItem = theBarItem;

Programmatically add a UISegmentedControl to a UINavigationBar

3 Answers3