objective-cuiviewuinavigationbarcustom-view

UINavigationBarButton not working when using customView


I would like to make a custom UIBarButtonItem that contains both image and text and also customise(reduce) the UIButton tap area. To achieve this programmatically, I am using the following code snippet. But UIButton disappears when added in UIView as subview. Could somebody guide me what is wrong ? To reduce tap area of bar button, I am embedding custom UIButton in custom UIView.

//Set Navigation Bar
UINavigationBar *navBar = [[UINavigationBar alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 64)];

//Set title if needed
UINavigationItem * navTitle = [[UINavigationItem alloc] init];
navTitle.title = @"";
UIView *customBackView = [[UIView alloc] initWithFrame:CGRectMake(220,0,50,40)];
customBackView.backgroundColor = [UIColor clearColor];

//Here you create info button and customize it
UIButton * tempButton = [UIButton buttonWithType:UIButtonTypeSystem];
tempButton.frame=CGRectMake(240,2,40,40);
[tempButton setImage:[UIImage imageNamed:@"offline_bk.png"]
         forState:UIControlStateNormal];

//Add selector to info button
[tempButton addTarget:self action:@selector(onTapDone:) forControlEvents:UIControlEventTouchUpInside];
[customBackView addSubview:tempButton];
[customBackView bringSubviewToFront:tempButton];
UIBarButtonItem * infoButton = [[UIBarButtonItem alloc] initWithCustomView:customBackView];

//In this case your button will be on the right side
navTitle.rightBarButtonItem = infoButton;

//Add NavigationBar on main view
navBar.items = @[navTitle];
[self.view addSubview:navBar];

Solution

  • Because your tempbutton is going out of bound of custom back view. You set the y origin value to 2 and x origin value to 240 which is causing button to go out of bound of custom back view.

    Try this code:

     UINavigationBar *navBar = [[UINavigationBar alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 64)];
    
        //Set title if needed
        UINavigationItem * navTitle = [[UINavigationItem alloc] init];
        navTitle.title = @"";
        UIView *customBackView = [[UIView alloc] initWithFrame:CGRectMake(0,0,50,50)];
        customBackView.backgroundColor = [UIColor clearColor];
    
        //Here you create info button and customize it
        UIButton * tempButton = [UIButton buttonWithType:UIButtonTypeSystem];
        tempButton.frame=CGRectMake(4,2,40,40);
        [tempButton setImage:[UIImage imageNamed:@"offline_bk.png"]
                    forState:UIControlStateNormal];
    
        //Add selector to info button
        [tempButton addTarget:self action:@selector(onTapDone:) forControlEvents:UIControlEventTouchUpInside];
        [customBackView addSubview:tempButton];
        [customBackView bringSubviewToFront:tempButton];
        UIBarButtonItem * infoButton = [[UIBarButtonItem alloc] initWithCustomView:customBackView];
    
        //In this case your button will be on the right side
        navTitle.rightBarButtonItem = infoButton;
    
        //Add NavigationBar on main view
        navBar.items = @[navTitle];
        [self.view addSubview:navBar];
        [self.view bringSubviewToFront:navBar];