0

I'm struggling in custom UINavigationBar. The reason i want to customize is because there is same action that can be occur in different view controller. I post some images as an example.

Navigation Bar - 1 Navigation Bar - 2 Navigation Bar - 3

As you can see from the images above. I think you get what i mean. I have been trying and searching, but i don't get the answer i wanted. Furthermore, i have tried using UIView to accomplish this, it worked, but i don't think it is correct way to do this. Therefore, i need help from you guys to lead me to the right path. :) :) Thank you.

tan
  • 97
  • 1
  • 9

2 Answers2

0

You can set custom title view to the navigation bar like this way.

//To hide default back button
self.navigationItem.hidesBackButton=YES;

//Title View for Navigation
UIView *navTitle1 = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 44)];
[navTitle1 setBackgroundColor:[UIColor lightGrayColor]];

//Left View button and separator
UIButton *backBarButton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 50, 44)];
[backBarButton setTitle:@"Back" forState:UIControlStateNormal];

UIView *ttlview1 = [[UIView alloc] initWithFrame:CGRectMake(51, 0, 1, 44)];
[ttlview1 setBackgroundColor:[UIColor darkGrayColor]];


//Center view with two buttons and seprator for them
UIView *middleView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 121, 44)];
[middleView setBackgroundColor:[UIColor clearColor]];
[middleView setCenter:navTitle1.center];

UIButton *postBarButton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 60, 44)];
[postBarButton setTitle:@"Post" forState:UIControlStateNormal];

UIView *ttlview2 = [[UIView alloc] initWithFrame:CGRectMake(middleView.frame.size.width/2, 0, 1, 44)];
[ttlview2 setBackgroundColor:[UIColor darkGrayColor]];

UIButton *memeBarButton = [[UIButton alloc] initWithFrame:CGRectMake((middleView.frame.size.width/2)+1, 0, 60, 44)];
[memeBarButton setTitle:@"Meme" forState:UIControlStateNormal];

[middleView addSubview:ttlview2];
[middleView addSubview:postBarButton];
[middleView addSubview:memeBarButton];

//Right button with seprator before that
UIView *ttlview3 = [[UIView alloc]     initWithFrame:CGRectMake(self.view.frame.size.width-71, 0, 1, 44)];
[ttlview3 setBackgroundColor:[UIColor darkGrayColor]];

You can refer THIS for more detail.

Community
  • 1
  • 1
Viral Savaj
  • 3,379
  • 1
  • 26
  • 39
  • This is what i done before. Is this the correct to do it instead of customizing. – tan Apr 17 '15 at 04:19
  • I think, this is the the way, you can do high level of customisation, Default Navigation bar not providing to do this kind of customisation directly through native functions and button. – Viral Savaj Apr 17 '15 at 04:25
0

You can create 2 custom UIBarButtonItem from 2 views, using this document:

From Apple documentation: Initializes a new item using the specified custom view.

- (id)initWithCustomView:(UIView *)customView

Parameters customView: A custom view representing the item. Return Value Newly initialized item with the specified properties.

  • Left bar item: 1 view contains 3 buttons: Project, Kiara Paradize, Artist Impression.

  • Right bar item: 1 view contains 4 buttons: Sign up | Login (Profile button when user logged in) | Hamburger menu

Then:

  • self.navigationItem.leftBarButtonItem = UIBarButtonItem from left Custom View
  • self.navigationItem.rightBarButtonItem = UIBarButtonItem from right Custom View
Ryan Ho
  • 1
  • 1