How can i offset UIButton image inside UIBarButtonItem on navBar? - iphone

Here is the code i am using to insert a custom UIBarButtonItem as the leftButton on my navbar. The issue is that the button is too close to the left edge and i cant figure out how to indent it a little without using another image with padding on the left?
UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 20, 20)];
btn.imageEdgeInsets = UIEdgeInsetsMake(0, 10, 0, 0);
[btn setBackgroundImage:[UIImage imageNamed:#"image.png"] forState:UIControlStateNormal];
self.myBtn = btn;
[btn release];
UIBarButtonItem *barBtn = [[UIBarButtonItem alloc] initWithCustomView:self.myBtn];
self.myBarBtn = barBtn;
self.myBarBtn.imageInsets = UIEdgeInsetsMake(0, 5, 0, 0);
[self.navigationItem setLeftBarButtonItem:self.myBarBtn animated:YES];
[barBtn release];
I've tried adjusting the frame, edgeInsets, all without any luck. The barButtonItem is still too close to the left edge. Is there any way to offset the image for the button?
Thx

UIImage *buttonImage = [UIImage imageNamed:#"Close.png"];
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:buttonImage forState:UIControlStateNormal];
button.imageEdgeInsets = UIEdgeInsetsMake(0, -40, 0, 0);
button.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
[button addTarget:self action:#selector(donePressed:) forControlEvents:UIControlEventTouchUpInside];
//create a UIBarButtonItem with the button as a custom view
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.navigationItem.leftBarButtonItem = customBarItem;

there is the custom left or right button with swift language
let buttonEdit: UIButton = UIButton.buttonWithType(UIButtonType.Custom) as UIButton
buttonEdit.frame = CGRectMake(0, 0, 40, 40)
buttonEdit.setImage(UIImage(named:"nav-right-Y.png"), forState: UIControlState.Normal)
buttonEdit.addTarget(self, action: "rightNavItemEditClick", forControlEvents: UIControlEvents.TouchUpInside)
var rightBarButtonItemEdit: UIBarButtonItem = UIBarButtonItem(customView: buttonEdit)
self.navigationItem.rightBarButtonItem = rightBarButtonItemEdit

Related

Custom button Image not visible on navigation bar iOS 7.1

I had added custom button on my navigation bar. here is the code now my problem is that in iOS7 I am able to see back Button image with text, while in iOS 7.1 the image is not displaying only text is displaying.
-(void)addBackButton{
self.navigationItem.hidesBackButton = YES;
[backButtonView removeFromSuperview];
if (backButtonView) {
[backButtonView release];
backButtonView = nil;
}
backButtonView = [[UIView alloc] initWithFrame:CGRectMake(0,6,70,30)];
NSString *strText = #"Back";
btnBack = [[UIButton alloc] initWithFrame:CGRectMake(2,0, 70, 31)];
[btnBack setTitle:strText forState:UIControlStateNormal];
btnBack.titleLabel.font = [UIFont fontWithName:#"HelveticaNeue-Medium" size:17];
btnBack.titleLabel.textColor = IOS7ColorBtnBackText;
[btnBack setImage:[UIImage imageNamed:#"Left_Arrow.png"] forState:UIControlStateNormal];
[btnBack addTarget:self action:#selector(btnBack:) forControlEvents:UIControlEventTouchUpInside];
[backButtonView addSubview:btnBack];
[btnBack release];
[self.navigationController.navigationBar addSubview:backButtonView];
}
Instead of adding it as subview in navigationView you can assign custom button to left or right button and this too works
UIButton *backbtn=[[UIButton alloc]initWithFrame:CGRectMake(20,5,42, 42)];
[backbtn setImage:[UIImage imageNamed:#"arrow.png"] forState:UIControlStateNormal];
[backbtn setTitle:#"Login" forState:UIControlStateNormal];
[backbtn addTarget:self action:#selector(didTapBackButton:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *barbtn=[[UIBarButtonItem alloc]initWithCustomView:backbtn];
self.navigationItem.leftBarButtonItem=barbtn;
[self.navigationItem setHidesBackButton:YES];
This do work, but you made mistake here
[self.navigationController.navigationBar addSubview:backButtonView];
///// Your code to create custom button goes here
self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc]
initWithCustomView:BackButton];
Create custom button and add it in your navigation left bar button item as a custom view as follows:
let btnShowMenu = UIButton()
let image: UIImage = UIImage(named: "requiredImageName")!
btnShowMenu.setImage(image, for: UIControlState.normal)
btnShowMenu.frame = CGRect(x: 0, y: 0, width: 15, height: 15)
btnShowMenu.addTarget(self, action: #selector(addAnAction(_:)), for: UIControlEvents.touchUpInside)
let customBarItem = UIBarButtonItem(customView: btnShowMenu)
self.navigationItem.leftBarButtonItem = customBarItem;

Back button on custom navigation bar

I am trying to develop an app with a navigation bar of custom size. (100px) In the navigation bar, I also want to include a back button. I have added both of them using the child view, but the back button is not working:
UIButton *backBtn = [UIButton buttonWithType:UIButtonTypeCustom];
UIImage *backBtnImage = [UIImage imageNamed:#"menueButton.png"];
UIImage *backBtnImagePressed = [UIImage imageNamed:#"menueButton.png"];
backBtn.exclusiveTouch = YES;
[backBtn addTarget:self action:#selector(back:) forControlEvents:UIControlEventTouchUpInside];
[backBtn setBackgroundImage:backBtnImage forState:UIControlStateNormal];
[backBtn setBackgroundImage:backBtnImagePressed forState:UIControlStateHighlighted];
backBtn.frame = CGRectMake(0, -40, 35, 32);
UIView *backButtonView = [[UIView alloc] initWithFrame:CGRectMake(0, -40, 35 , 32)];
[backButtonView addSubview:backBtn];
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithCustomView:backButtonView];
self.navigationItem.leftBarButtonItem = backButton;
My navigation bar size is 100 pixels tall, and when I use button position (0,0,35,32) it will work correctly. But in this case, the button is being displayed much lower than intended. What am I doing wrong?
self.btnBack = [UIButton buttonWithType:UIButtonTypeCustom];
[self.btnBack setImage:[UIImage imageNamed:#"back_active.png"] forState:UIControlStateNormal];
[self.btnBack addTarget:self action:#selector(back) forControlEvents:UIControlEventTouchUpInside];
self.btnBack.frame = CGRectMake(5, 9, 50, 30);
[self.navigationController.navigationBar addSubview:self.btnBack];
check this link also.
Update:for back button
-(void)back
{
[self.btnBack removeFromSuperview];
[self.navigationController popViewControllerAnimated animated:NO];
}
Try allocing backButtonView like this
UIView *backButtonView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 35 , 32)];
Change : orgin of view to (0,0)
Edit
Try
backBtn.frame = CGRectMake(0, 0, 35, 32);
UIView *backButtonView = [[UIView alloc] initWithFrame:CGRectMake(0, -40, 35 , 32)];

Make custom back button's clickable area smaller in Navigation controller

I've created a custom back button with the code below, however the clickable area is very big and goes well beyond the icon itself. Does anyone know how to set the clickable area, or make it the same size as the image?
Thanks
UIImage *buttonImage = [UIImage imageNamed:#"prefs"];
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:buttonImage forState:UIControlStateNormal];
button.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
[button addTarget:self action: #selector(handleBackButton)
forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.navigationItem.leftBarButtonItem = customBarItem;
The clickable area is shown in red.
Thanks!
If you want to prevent the click other than the button then add the custom button to UIView then set that view as custom view to the barbuttonItem
Your code will become like this :
UIImage *buttonImage = [UIImage imageNamed:#"prefs"];
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:buttonImage forState:UIControlStateNormal];
button.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
[button addTarget:self action: #selector(handleBackButton)
forControlEvents:UIControlEventTouchUpInside];
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height)];
[view addSubview:button];
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:view];
self.navigationItem.leftBarButtonItem = customBarItem;
This should work as it worked for me.
#Prasad Devediga, swift version works greatly:
let btnName = UIButton()
btnName.setImage(UIImage(named: "settings_filled_25"), forState: .Normal)
btnName.frame = CGRectMake(0, 0, 30, 30)
btnName.addTarget(self, action: Selector("toggleRight"), forControlEvents: .TouchUpInside)
var rightView = UIView()
rightView.frame = CGRectMake(0, 0, 30, 30)
rightView.addSubview(btnName)
let rightBarButton = UIBarButtonItem()
rightBarButton.customView = rightView
self.navigationItem.rightBarButtonItem = rightBarButton

Adding a Custom Button to a UINavigationItem LeftBarButtonItem

Could anyone tell me why this code does not working?
self.backButton = [UIButton buttonWithType:UIButtonTypeCustom];
[self.backButton setImage:[UIImage imageNamed:#"back_arrow.png"]
forState:UIControlStateNormal];
self.backButton.contentMode = UIViewContentModeCenter;
[self.backButton addTarget:self
action:#selector(backButtonAction:)
forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *backButtonItem = [[UIBarButtonItem alloc] initWithCustomView:self.backButton];
[navigationItem setLeftBarButtonItem:backButtonItem animated:NO];
navigationItem.hidesBackButton = YES;
Edit:
Nothing appears on the leftBarButtonItem. That's the problem.
From the docs:
"When creating a custom button—that is a button with the type UIButtonTypeCustom—the frame of the button is set to (0, 0, 0, 0) initially. Before adding the button to your interface, you should update the frame to a more appropriate value."
So you should see something if you set the frame in line 2, eg:
self.backButton.frame = CGRectMake(0, 0, 40, 20);
This should work
CGRect rect = CGRectMake(10, 0, 30, 30);
self.backButton = [[UIButton alloc] initWithFrame:rect];
[self.backButton setImage:[UIImage imageNamed:#"back_arrow.png"]
forState:UIControlStateNormal];
self.backButton.contentMode = UIViewContentModeCenter;
[self.backButton addTarget:self
action:#selector(backButtonAction:)
forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *backButtonItem = [[UIBarButtonItem alloc] initWithCustomView:self.backButton];
self.navigationItem.leftBarButtonItem = backButtonItem;
self.navigationItem.hidesBackButton = YES;

Can I change the position of navigationbar item?

Here is the snapshot:
And the code is here:
UIButton *leftButton = [UIButton buttonWithType:UIButtonTypeCustom];
leftButton.frame = CGRectMake(0.0f, 0.0f, 46.0f, 32.0f);
[leftButton setBackgroundImage:[UIImage imageNamed:#"navi_register_up.png"] forState:UIControlStateNormal];
[leftButton addTarget:self action:#selector(doRegister) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *leftBarItem = [[UIBarButtonItem alloc] initWithCustomView:leftButton];
self.navigationItem.leftBarButtonItem = leftBarItem;
[leftBarItem release];
Is there any way to move the button up some px?
Thank you:)
You need to create a UIBarButtonItem with system item UIBarButtonSystemItemFixedSpace with -5 width which will remove 5 px padding. Then set leftBarButtonItems with both fixed space item and your back bar item like this -
UIBarButtonItem *negativeSpacer = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
[negativeSpacer setWidth:-5];
self.navigationItem.leftBarButtonItems = [NSArray arrayWithObjects:negativeSpacer,leftBarItem,nil];
You can try this,
leftButton.imageEdgeInsets = UIEdgeInsetsMake(-2, 0, 0, 0);
Add a UIBarButtonSystemItemFlexibleSpace item in between the items you want to separate.
Here's a Swift 3 version of the most voted answer:
let soundButton = UIBarButtonItem(image:image , style: UIBarButtonItemStyle.plain, target: self, action: #selector(self.soundPressed))
let negativeSpacer = UIBarButtonItem(barButtonSystemItem: .fixedSpace, target: nil, action: nil)
negativeSpacer.width = -5
self.navigationItem.rightBarButtonItems = [negativeSpacer,soundButton]
The height of a standard bar button is 29pt. Do yourself a favor and just shrink leftbutton's height and navi_register_up.png's height instead.
You can use this code,I think this will be helpful to you.
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.frame = CGRectMake(0,0,50,32);
[button setBackgroundImage:[UIImage imageNamed:#"btn_back.png"] forState:UIControlStateNormal];
[button addTarget:self action:#selector(BackBtnClicked) forControlEvents:UIControlEventTouchUpInside];
UIView *backButtonView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 50, 32)];
backButtonView.bounds = CGRectOffset(backButtonView.bounds, -1, -4);
[backButtonView addSubview:button];
UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithCustomView:backButtonView];
//barButtonItem.imageInsets = UIEdgeInsetsMake(-6, 20, 30, 0);
[self.navigationItem setLeftBarButtonItem:barButtonItem];
I had a similar issue and found an option that sufficed in the storyboard. Just click on the navbar item and you should see the x/y position options.