Setting font size of UIBarButtonItem - swift

I am creating a UIBarButtonItem with the following code.
let rightItem = UIBarButtonItem(title: "➞", style: UIBarButtonItemStyle.Plain, target: self, action: "navigateToViewTwo")
if let font = UIFont(name: "System", size: 25.0) {
rightItem.setTitleTextAttributes([NSFontAttributeName: font], forState: UIControlState.Normal)}
navigationController?.navigationBar.topItem?.rightBarButtonItem = rightItem
The button should display a right arrow, and it does. The problem is that the font is not controlling the size of the button. I get the following:
The only happens when using the System font. I tried it with Helvetica, and I got the following:
The arrow is definitely larger, but it is also too high on the nav bar. If I rotate the screen, it looks bad.
The arrow is too high, and looks out of place. See how it looks, compared to the Item button on the left? That one was dragged and dropped.
How can I adjust the arrow so that it is in the correct size, and in the correct place on the screen?

You have to set title edge insets
With CustomView
var btn = UIButton.buttonWithType(UIButtonType.System) as! UIButton
btn.frame = CGRectMake(10, 20, 50, 50)
btn.setTitle("➞", forState: UIControlState.Normal)
btn.titleLabel?.font = UIFont(name: "Helvetica" , size: 17)
btn.titleEdgeInsets = UIEdgeInsetsMake(5, 0, 0, 0)
btn.addTarget(self, action: Selector("navigateToViewTwo"), forControlEvents: UIControlEvents.TouchUpInside)
var right = UIBarButtonItem(customView: btn)
With Normal as you have done
var rightItem = UIBarButtonItem(title: "➞", style: UIBarButtonItemStyle.Plain, target: self, action: "navigateToViewTwo")
rightItem.setTitleTextAttributes([NSFontAttributeName: UIFont(name: "Helvetica", size: 17.0)!], forState: UIControlState.Normal)
rightItem.setTitlePositionAdjustment(UIOffsetMake(0.0, 5.0), forBarMetrics: UIBarMetrics.Default)
Set both for comparison, just add it which looks batter :
navigationController?.navigationBar.topItem?.rightBarButtonItems = [rightItem,right]
Results :
Hope it will help you.

UIBarButtonItem.appearance().setTitleTextAttributes([NSAttributedStringKey.foregroundColor : UIColor(red:0.12, green:0.28, blue:0.40, alpha:1.0), NSAttributedStringKey.font: UIFont(name: "GalanoGrotesque-SemiBold", size: 18)!], for: .normal)

I have encounter this problem before, and I decide to use a custom view to handle this as follow:
var view = // create your custom view
var btnMenu = UIBarButtonItem(customView: view)

Related

Making rightBarButtonItem bold

I am trying to set up a navigation button to appear red and semibold. I managed to changed the color but I'm having trouble changing it to semibold:
navigationItem.rightBarButtonItem = UIBarButtonItem(title: "Sign Up", style: .plain, target: self, action: #selector(signIn))
navigationItem.rightBarButtonItem?.tintColor = .red
UIBarItem.appearance().setTitleTextAttributes(
[
NSAttributedString.Key.font: UIFont.systemFont(ofSize: 12, weight: .semibold)
],
for: .normal)
I tried rightBarButtonItem.appearance first but that doesn't seem to be an option.
I'm working with Swift 4.2.
You can set the style property to .done to make the UIBarButtonItem bold. This will work until Apple changes how the done button looks in a newer version of iOS.
navigationItem.rightBarButtonItem?.style = .done
Well to have fully customized bar button appearance, you can use bar button items with custom view just like this
let doneButton: UIButton = UIButton (type: UIButton.ButtonType.custom)
doneButton.setTitle("Done", for: .normal)
doneButton.titleLabel?.font = UIFont.boldSystemFont(ofSize: 14)
doneButton.setTitleColor(.blue, for: .normal)
doneButton.addTarget(self, action: #selector(self.doneBarButtonTapped(sender:)), for: UIControl.Event.touchUpInside)
doneButton.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
let barButton = UIBarButtonItem(customView: doneButton)
navigationItem.rightBarButtonItem = barButton

NavigationBarButton Item Not able to align vertically?

Hi I have tried to align the navigationbar button item position center in the navigation bar. I have changed the navigation bar height programmatically so I have able to align title its working fine, but same I have tried leftbarbutton and rightbarbutton. its has not vertically aligned center. I have tried these programmatically
Title Alignment
self.navigationController!.navigationBar.setTitleVerticalPositionAdjustment(-15, forBarMetrics: .Default)
RightBarButton:
let button: UIButton = UIButton(type: .Custom)
button.setImage(buttonImage, forState: UIControlState.Normal)
button.addTarget(self, action: #selector(self.toggleRight), forControlEvents: UIControlEvents.TouchUpInside)
button.frame = CGRectMake(0, 0, 40, 40)
let rightButton = UIBarButtonItem(customView: button)
// rightButton.imageInsets = UIEdgeInsets(top: 20, left: 0, bottom: 0, right: 0)
let negativeSpacer = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FixedSpace, target: nil, action: nil)
negativeSpacer.width = -10;
self.navigationItem.rightBarButtonItems = [negativeSpacer ,rightButton ]
LeftBarButton:
let button: UIButton = UIButton(type: .Custom)
button.setImage(buttonImage, forState: UIControlState.Normal)
button.addTarget(self, action: #selector(self.toggleLeft), forControlEvents: UIControlEvents.TouchUpInside)
button.frame = CGRectMake(0, 0, 40, 40)
let leftButton = UIBarButtonItem(customView: button)
let negativeSpacer = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FixedSpace, target: nil, action: nil)
negativeSpacer.width = -10;
self.navigationItem.leftBarButtonItems = [negativeSpacer,leftButton ]
Please find the screenshot.

How can i move a button in a UINavigation bar to the right

im trying to move the right button in my navigation bar to the right to align it with buttons on a table view here is what is currently looks like
i made a button like this:
let allButton = UIButton(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
allButton.layer.borderColor = Constants.AppColor.cgColor
allButton.layer.borderWidth = 1
allButton.layer.backgroundColor = UIColor.white.cgColor
allButton.addTarget(self, action: #selector(selectAllContacts), for: .touchUpInside)
allButton.layer.cornerRadius = 10
and im adding it to my nav bar like this:
navigationItem.rightBarButtonItems = [UIBarButtonItem(customView: allButton), importButton]
I have tried adding image insets, content insets and it doesn't work.
Any idea on what else i can try?
Will this do?
navigationItem.rightBarButtonItem = UIBarButtonItem(
title: "Menu >",
style: .plain,
target: self,
action: #selector( rightNavTap )
)
I was able to solve this by adding
let negativeSpacer:UIBarButtonItem = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.fixedSpace, target: nil, action: nil)
negativeSpacer.width = -10
and appending that to my array of buttons
navigationItem.rightBarButtonItems = [negativeSpacer, UIBarButtonItem(customView: allButton), importButton]
If anyone finds a better solution let me know.

Changing font color of UIBarButtonItem

I tried to change the font color of the right bar button item to purple, but it still shows up as white. I've consulted this question and this question. How do I fix this?
Code
let sortButton = UIButton(frame: CGRect(x: 0, y: 0, width: 34, height: 15))
sortButton.setTitle("SORT", for: .normal)
sortButton.titleLabel?.tintColor = UIColor.myMusicPurple
sortButton.tintColor = UIColor.myMusicPurple
navigationItem.rightBarButtonItem = UIBarButtonItem(customView: sortButton)
navigationItem.rightBarButtonItem?.tintColor = UIColor.myMusicPurple
This should do the trick (if you have plain text)
let rightBarButtonItem = UIBarButtonItem(title: "Some text", style: .plain, target: self, action: #selector(someAction))
rightBarButtonItem.tintColor = UIColor.myMusicPurple
navigationItem.rightBarButtonItem = rightBarButtonItem
Please try this
sortButton.setTitleTextAttributes([NSAttributedStringKey.foregroundColor : UIColor.white], for: .normal)
Its simple, just create a reference for UIBarButtonItem from Main.stroyboard to corresponding swift file like this,
#IBOutlet var yourBarBtn: UIBarButtonItem!
After that write this line,
yourBarBtn.tintColor = .white //your_color
Thats it!
First, you need to set plain properties then after you can write as like.
#IBOutlet weak var btnGenerate: UIBarButtonItem!
btnGenerate.setTitleTextAttributes([NSAttributedString.Key.foregroundColor : UIColor.colorBlue], for: .normal)
What about using:
func setTitleColor(UIColor?, for: UIControlState)
Documentation says it sets the color of the title to use for the specified state.
sortButton.setTitleColor( .red, for: .normal)

Back Button Image - what is it called in Swift?

I am trying to use Swift's internal back button image.
I have asked this question before and got the technically correct answer that it inherits it from the previous View, BUT if I insert this code you can control the back button on the current View.
// Takeover Back Button
self.navigationItem.hidesBackButton = false
let newBackButton = UIBarButtonItem(title: "<", style: .Plain, target: self, action: "segueBack")
navigationItem.leftBarButtonItem = newBackButton
That gives me a <, "ABC" would give me ABC etc but how do I trigger Swift to put up it's internal Back Button image. The code below doesn't work but I would have thought is along the right lines.
let backImg: UIImage = UIImage(named: "BACK_BUTTON_DEFAULT_ICON")!
navigationItem.leftBarButtonItem!.setBackgroundImage(backImg, forState: .Normal, barMetrics: .Default)
Has anyone worked out how to do this?
Try to add custom view as back button like as
var backButton = UIButton(frame: CGRectMake(0, 0, 70.0, 70.0))
var backImage = UIImage(named: "backBtn")
backButton.setImage(backImage, forState: UIControlState.Normal)
backButton.titleEdgeInsets = UIEdgeInsetsMake(10.0, 10.0, 10.0, 0.0)
backButton.setTitle("Back", forState: UIControlState.Normal)
backButton.addTarget(self, action: "buttonPressed", forControlEvents: UIControlEvents.TouchUpInside)
var backBarButton = UIBarButtonItem(customView: backButton)
var spacer = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FixedSpace, target: nil, action: nil)
spacer.width = -15
self.navigationItem.leftBarButtonItems = [spacer,backBarButton]
It will look same as iOS back button
I struggled with this question for a while. Finally I got the back image with the following code:
let backImage = navigationController?.navigationBar.subviews[2].subviews[0].subviews[0].subviews[0] as! UIImageView).image
Before run the code above, make sure the back button is showing. Then you can save backImage to anywhere you want.
Here is the backImage I got.
Here is my solution:
override func viewDidLoad() {
...
let buttonBack = UIBarButtonItem(image: UIImage(named: "backButton"), style: .plain, target: self, action: #selector(buttonSavePressed(_:)))
self.navigationItem.leftBarButtonItem = buttonBack
let backButton = UIButton(frame: CGRect(x: 0, y: 0, width: 24.0, height: 24.0))
let backImage = UIImage(named: "backButton")
backButton.setImage(backImage, for: .normal)
backButton.setTitle("Back", for:.normal)
if #available(iOS 13.0, *) {
backButton.setTitleColor(.link, for: .normal)
} else {
backButton.setTitleColor(.blue, for: .normal)
}
backButton.addTarget(self, action:#selector(buttonSavePressed(_:)), for: .touchUpInside)
let backBarButton = UIBarButtonItem(customView: backButton)
let spacer = UIBarButtonItem(barButtonSystemItem: .fixedSpace, target: nil, action: nil)
spacer.width = -15
self.navigationItem.leftBarButtonItems = [spacer,backBarButton]
}
#objc func buttonBackPressed(_ sender: Any) {
...
}
If you want to get the default back button image, the arrow is a class of type _UINavigationBarBackIndicatorView.
Here follows the hack,
UIImage *imgViewBack ;
for (UIView *view in self.navigationController.navigationBar.subviews) {
// The arrow is a class of type _UINavigationBarBackIndicatorView. This is not any of the private methods, so I think
// this is fine for the AppStore...
if ([NSStringFromClass([view class]) isEqualToString:#"_UINavigationBarBackIndicatorView"]) {
// Set the image from the Default BackBtn Imageview
UIImageView *imgView = (UIImageView *) view;
if(imgView){
imgViewBack = imgView.image ;
}
}
}
Try this to replace the back button image:
let back_image = UIImage(named: "btn_back")
self.navigationBar.backIndicatorImage = back_image
self.navigationBar.backIndicatorTransitionMaskImage = back_image
If you don't like to have the "Back" title you can add this too:
self.navigationBar.topItem?.title = ""