NavigationBarButton Item Not able to align vertically? - swift

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.

Related

iOS: adding buttons to Toolbar programmatically

I need to create Toolbar and add buttons programmatically. I will have different sets of buttons for diferent screens.
That's easy.
Also, I need to center those buttons. They should have equal space between them.
And also I need that all those buttons separate screen width only between themselfs. Like, I have 5 buttons, total screen width is 300, so each button will have width 60. I am not sure how to do that, i tried dirrenrt things but they wasn't centered or hadn't such width. Any ideas how to do that?
class OptionsView: UIView {
#IBOutlet weak var toolbar: UIToolbar!
var width: CGFloat {
return 0//UIScreen.main.bounds.width/5 //was trying to calculate width , but it did not work
}
override func awakeFromNib() {
super.awakeFromNib()
toolbar.isTranslucent = true
toolbar.setBackgroundImage(UIImage(), forToolbarPosition: UIBarPosition.any, barMetrics: UIBarMetrics.default)
toolbar.setShadowImage(UIImage(), forToolbarPosition: UIBarPosition.any)
toolbar.barTintColor = .white
backgroundColor = .clear
}
func addAirPlay(target: Any?, action: Selector) {
let normalImage = UIImage(named: "player-airplay")
let button = UIButton(type: .custom)
button.frame = CGRect(x: 0, y: 0, width: width, height: 100)
button.setImage(normalImage, for: UIControlState())
button.addTarget(target, action: action, for: .touchUpInside)
let item = UIBarButtonItem(customView: button)
//item.width = width //was trying to play with that
var items = toolbar.items
items?.append(item)
toolbar.items = items
toolbar.reload()
}
func addOrientation(target: Any?, action: Selector) {
let button = UIButton(type: .custom)
button.tag = orientationTag
button.frame = CGRect(x: 0, y: 0, width: width, height: 100)
button.addTarget(target, action: action, for: .touchUpInside)
let item = UIBarButtonItem(customView: button)
//item.width = width
var items = toolbar.items
items?.append(item)
toolbar.items = items
toolbar.reload()
reloadOrientation()
}
func addFlexibleSpace() {
let item = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
var items = toolbar.items
items?.append(item)
toolbar.items = items
toolbar.reload()
}
Creating:
optionsView = OptionsView.loadFromNib()
playerView.addSubview(optionsView)
optionsView.snp.makeConstraints { (make) in
make.leading.trailing.top.bottom.equalTo(self.optionsPlaceholderView)
}
// optionsView.addFlexibleSpace() //was trying that as well
optionsView.addAirPlay(target: self, action: #selector(airplayButtonAction(_:)))
optionsView.addFlexibleSpace()
optionsView.addOrientation(target: self, action: #selector(orientationButtonAction(_:)))
optionsView.addFlexibleSpace()
optionsView.addFave(target: self, action: #selector(faveButtonAction(_:)))
optionsView.addFlexibleSpace()
optionsView.addExtra(target: self, action: #selector(showExtraButtonAction(_:)))
optionsView.addFlexibleSpace()
optionsView.addScenes(target: self, action: #selector(sceneButtonAction(_:)))
// optionsView.addFlexibleSpace()

Custom Bar Button with Image And Title

I got the problem when i use Custom Bar button with image and title, I use below code
let button = UIButton(type: .system)
button.titleEdgeInsets.left = 5
button.setImage(buttonImg, for: .normal)
button.setTitle(title, for: .normal)
button.sizeToFit()
button.addTarget(self, action: #selector(self.popVC), for: .touchUpInside)
navigationItem.leftBarButtonItem = UIBarButtonItem(customView: button)
And Here is the problem snippet. Text not show clearly
Try this:
let backButton = UIButton(type: .system)
backButton.frame = CGRect(x: 0, y: 0, width: 500, height: 30)
backButton.setImage(buttonImg, for: .normal)
backButton.setTitle(title, for: .normal)
backButton.addTarget(self, action: #selector(self.popVC(_:)), for: .touchUpInside)
backButton.sizeToFit()
let backBarButton = UIBarButtonItem(customView: backButton)
self.navigationItem.leftBarButtonItem = backBarButton

Evenly space UIToolbar buttons in inputAccessoryView

In the following code I have three buttons that show when an inputField is tapped. Right now the buttons show but all of them are shifted to the left and what I would like to do is have them evenly space and keep them like that regardless of what phone size they are viewed on.
How can I evenly space the buttons in a UIToolbar?
CODE:
override func viewDidLoad() {
super.viewDidLoad()
addButtonsToKeyboard()
}
// Reusable Button
func configurButton(button:UIButton) {
button.backgroundColor = UIColor.whiteColor()
button.layer.cornerRadius = 5
button.layer.borderWidth = 1.0
button.layer.borderColor = UIColor.blueColor().CGColor
button.setTitleColor(UIColor.lightGrayColor(), forState: .Normal)
button.setTitleColor(UIColor.blueColor(), forState: .Highlighted)
button.frame = CGRect(x:0, y:0, width:50, height:35)
button.addTarget(self, action: #selector(customKeyPressed), forControlEvents: UIControlEvents.TouchUpInside)
}
func addButtonsToKeyboard(){
// First button
let button1 = UIButton()
button1.setTitle("Btn 1", forState: .Normal)
configureButton(button1)
let barButton1 = UIBarButtonItem()
barButton1.customView = button1
// Second button
let button2 = UIButton()
button2.setTitle("Btn 2", forState: .Normal)
configureButton(button2)
let barButton2 = UIBarButtonItem()
barButton2.customView = button2
// Third button
let button3 = UIButton()
button3.setTitle("Btn 3", forState: .Normal)
configureButton(button3)
let barButton3 = UIBarButtonItem()
barButton3.customView = button3
/**
* UIToolbar.
*/
let toolBar = UIToolbar()
toolBar.tintColor = UIColor.redColor()
toolBar.barTintColor = UIColor.lightGrayColor()
toolBar.items = [barButton1, barButton2, barButton3]
toolBar.sizeToFit()
myInputField.inputAccessoryView = toolBar
}
func customKeyPressed(sender: UIButton){
// do something
}
CURRENT:
AFTER:
Very simple, you just need to add a flexible bar button item between each button. See the following:
let space = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
toolbar.items = [barButton1, space, barButton2, space, barButton3]

BarButtonItem not appearing

I have a simple + button on the right side to add rows to my tableView, however the button is not appearing. This is how i implement it
let AddButton = UIButton()
AddButton.setTitle("+", forState: .Normal)
let AddView = UIBarButtonItem(customView: AddButton)
self.navigationItem.rightBarButtonItem = AddView
AddButton.addTarget(self, action: #selector(self.addRow), forControlEvents: UIControlEvents.TouchUpInside)
Note, I use the same exact implementation for my hamburger button which does appear. This is the working hamburger button implementation
let navicon = UIButton(type: UIButtonType.System)
navicon.setImage(defaultMenuImage(), forState: UIControlState.Normal)
navicon.frame = CGRectMake(0, 0, 30, 30)
let menu = UIBarButtonItem(customView: navicon)
self.navigationItem.leftBarButtonItem = menu
self.view.addGestureRecognizer(self.revealViewController().panGestureRecognizer())
navicon.addTarget(self.revealViewController(), action: #selector(SWRevealViewController.revealToggle(_:)), forControlEvents: .TouchUpInside)
why is this happening?
Try:
let AddButton = UIButton(type: .Custom)
AddButton.frame = CGRectMake(0, 0, 44, 44)

swift set more space between bar items

in my swift 2 app i have to items on the left side of my item bar.
this is my code:
let CloseButton: UIButton = UIButton(type: UIButtonType.Custom)
CloseButton.frame = CGRectMake(0, 0, 24, 24)
CloseButton.setImage(UIImage(named:"close"), forState: UIControlState.Normal)
CloseButton.addTarget(self, action: "close", forControlEvents: UIControlEvents.TouchUpInside)
let leftBarCloseButton: UIBarButtonItem = UIBarButtonItem(customView: CloseButton)
let EditButton: UIButton = UIButton(type: UIButtonType.Custom)
EditButton.frame = CGRectMake(0, 0, 24, 24)
EditButton.setImage(UIImage(named:"edit"), forState: UIControlState.Normal)
EditButton.addTarget(self, action: "edit", forControlEvents: UIControlEvents.TouchUpInside)
let leftBarEditButton: UIBarButtonItem = UIBarButtonItem(customView: EditButton)
self.navigationItem.setLeftBarButtonItems([leftBarCloseButton,leftBarEditButton], animated: true)
this is the result:
how can i make more space between the "x" and pencil icon?
Add a new Bar button item (fixed space) between these icons
var fixedSpace:UIBarButtonItem = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FixedSpace, target: nil, action: nil)
fixedSpace.width = 10.0
self.navigationItem.setLeftBarButtonItems([leftBarCloseButton,fixedSpace,leftBarEditButton], animated: true)