UIBarButtonItem size displays wrong - ios

I have custom UINavigationBar(for JSQMessagesViewController) with some items. But I have some problems with leftBarButtonItem
func setNavigationBar() {
let screenSize: CGRect = UIScreen.main.bounds
let navBar = UINavigationBar(frame: CGRect(x: 0, y: 28, width: screenSize.width, height: 78))
let navItem = UINavigationItem(title: chatName ?? "chat")
let menuBtn = UIButton(type: .custom)
menuBtn.frame = CGRect(x: 0.0, y: 0.0, width: 78, height: 78)
menuBtn.setImage(UIImage(named: "backButton"), for: .normal)
menuBtn.addTarget(self, action: #selector(back), for: UIControl.Event.touchUpInside)
let menuBarItem = UIBarButtonItem(customView: menuBtn)
let currWidth = menuBarItem.customView?.widthAnchor.constraint(equalToConstant: 78)
currWidth?.isActive = true
let currHeight = menuBarItem.customView?.heightAnchor.constraint(equalToConstant: 78)
currHeight?.isActive = true
navItem.leftBarButtonItem = menuBarItem
navBar.titleTextAttributes = [.font : UIFont(name: "Acrom-Bold", size: 26)!, .foregroundColor : UIColor.white]
navBar.setItems([navItem], animated: false)
navBar.setBackgroundImage(UIImage(), for: .default)
navBar.shadowImage = UIImage()
navBar.backgroundColor = UIColor(displayP3Red: 0, green: 0, blue: 0, alpha: 0.3)
navBar.isTranslucent = true
self.view.addSubview(navBar)
}
But my BackButton looks wrong.
What is the problem with the height of the button?

If a bar button item has a custom view, you must size the width of the custom view using internal autolayout constraints.
But you must not size the height larger than the runtime likes, as you are doing. Delete these lines:
let currHeight = menuBarItem.customView?.heightAnchor.constraint(equalToConstant: 78)
currHeight?.isActive = true

Related

Custom NavigationBar in iOS Swift

I'm creating custom navigationbar in swift for every screen. I'm calling this function at viewWillAppear while first time loading it is coming properly if First Time Loading Screen. I move to another screen it is changing. Next View screen navigation title view is shifted. if I came back to previous screen then also it was shiftedenter image description here. I'm unable to find the bug where code was wrong.left and right navigation items are placing fine . But navigationtitle view only getting shifting.
extension UIViewController {
func reightMenuItems(_ isMenuBtn: Bool, _ navigationItem:UINavigationItem) {
if isMenuBtn {
let leftView = UIView()
leftView.backgroundColor = .clear
leftView.frame = CGRect(x: 0, y: 0, width: 40, height: 44)
let menuImage = UIImageView(image:#imageLiteral(resourceName: "MenuIcon"))
menuImage.contentMode = .scaleAspectFit
menuImage.frame = CGRect(x: 2.5, y: 6, width: 35, height: 32)
leftView.addSubview(menuImage)
let followButton = UIButton(type: .system)
followButton.frame = CGRect(x: 0, y: 0, width: 40, height: 44)
followButton.contentEdgeInsets = UIEdgeInsetsMake(0, -20, 0, 0)
followButton.addTarget(self, action: #selector(self.btnClickMenu), for: .touchUpInside)
leftView.addSubview(followButton)
navigationItem.leftBarButtonItems = [UIBarButtonItem(customView: leftView)]
}else{
let leftView = UIView()
leftView.backgroundColor = .clear
leftView.frame = CGRect(x: 0, y: 0, width: 40, height: 44)
let menuImage = UIImageView(image:#imageLiteral(resourceName: "arrow_white-left"))
menuImage.contentMode = .scaleToFill
menuImage.frame = CGRect(x: 12.5, y: 10.5, width: 15, height: 25)
leftView.addSubview(menuImage)
let followButton = UIButton(type: .system)
followButton.frame = CGRect(x: 0, y: 0, width: 40, height: 44)
leftView.addSubview(followButton)
followButton.addTarget(self, action: #selector(self.btnClickBack), for: .touchUpInside)
navigationItem.leftBarButtonItems = [UIBarButtonItem(customView: leftView)]
}
}
fileprivate func leftMenuItems(_ isCart: Bool, _ navigationItem: UINavigationItem) {
//lecftButtons
if isCart {
let reightView = UIView()
reightView.backgroundColor = .clear
reightView.frame = CGRect(x: 0, y: 0, width: 40, height: 44)
let menuImage = UIImageView(image:#imageLiteral(resourceName: "Cart"))
menuImage.contentMode = .scaleToFill
menuImage.frame = CGRect(x: 2.5, y: 6, width: 35, height: 34)
reightView.addSubview(menuImage)
let cartBtn = UIButton(type: .system)
cartBtn.frame = CGRect(x: 0, y: 0, width: 40, height: 44)
reightView.addSubview(cartBtn)
cartBtn.addTarget(self, action: #selector(self.btnClickCart), for: .touchUpInside)
navigationItem.rightBarButtonItems = [UIBarButtonItem(customView: reightView)]
}else{
let composeButton = BtnFontBold20()
composeButton.setTitle("Done", for: .normal)
composeButton.titleLabel?.textColor = .white
composeButton.frame = CGRect(x: 0, y: 00, width: 34, height: 44)
composeButton.contentEdgeInsets = UIEdgeInsetsMake(0, 20, 0, 0)
composeButton.addTarget(self, action: #selector(self.btnClickCart), for: .touchUpInside)
navigationItem.rightBarButtonItems = [UIBarButtonItem(customView: composeButton)]
}
}
func setupNavItems(_ navigationItem: UINavigationItem , day:String = "",address:String = "",type:Int,isMenuBtn:Bool,isCart:Bool,title:String = "") {
//NavigationItem
self.navigationController?.isNavigationBarHidden = false
self.navigationController?.navigationBar.isTranslucent = false
self.navigationController?.navigationBar.setValue(true, forKey: "hidesShadow")
//Shadow
self.navigationController?.navigationBar.layer.shadowOffset = CGSize(width: 1.5, height: 1.5)
self.navigationController?.navigationBar.layer.shadowRadius = 2.0
self.navigationController?.navigationBar.layer.shadowOpacity = 0.5
//reight Menu Items
reightMenuItems(isMenuBtn, navigationItem)
leftMenuItems(isCart, navigationItem)
let height = navigationController?.navigationBar.frame.height ?? 0
let leftButtonWidth: CGFloat = 90 // left padding
let width2 = AppConstants.screenWidth - leftButtonWidth
print(width2)
let Titleview = UIView(frame: CGRect(x: 0, y: 0, width: width2, height: height))
Titleview.backgroundColor = .clear
navigationItem.titleView = Titleview
if type == 1 {
let dayLbl = FontBold18(frame: CGRect(x: 0, y: 0, width: min(width2/2,40), height: height))
dayLbl.text = day
dayLbl.textColor = .white
dayLbl.textAlignment = .left
dayLbl.numberOfLines = 1
Titleview.addSubview(dayLbl)
let DirectImag = UIImageView()
DirectImag.contentMode = .scaleAspectFit
DirectImag.image = #imageLiteral(resourceName: "RightDirection")
Titleview.addSubview(DirectImag)
DirectImag.translatesAutoresizingMaskIntoConstraints = false
DirectImag.widthAnchor.constraint(equalToConstant: 15).isActive = true
DirectImag.heightAnchor.constraint(equalToConstant: 15).isActive = true
DirectImag.leadingAnchor.constraint(equalTo: dayLbl.trailingAnchor, constant:5).isActive = true
DirectImag.centerYAnchor.constraint(equalTo: dayLbl.centerYAnchor).isActive = true
let dayBtn = UIButton(type: .system)
dayBtn.addTarget(self, action: #selector(self.btnClickASAPType), for: .touchUpInside)
Titleview.addSubview(dayBtn)
dayBtn.translatesAutoresizingMaskIntoConstraints = false
dayBtn.centerYAnchor.constraint(equalTo: dayLbl.centerYAnchor).isActive = true
dayBtn.centerXAnchor.constraint(equalTo: dayLbl.centerXAnchor, constant: 0).isActive = true
dayBtn.heightAnchor.constraint(equalTo: dayLbl.heightAnchor).isActive = true
dayBtn.widthAnchor.constraint(equalTo: dayLbl.widthAnchor , constant:25).isActive = true
let addLbl = FontBold18()
addLbl.textColor = .white
addLbl.textAlignment = .left
addLbl.numberOfLines = 1
Titleview.addSubview(addLbl)
addLbl.text = address
addLbl.translatesAutoresizingMaskIntoConstraints = false
addLbl.leadingAnchor.constraint(equalTo: DirectImag.trailingAnchor,constant:5).isActive = true
addLbl.heightAnchor.constraint(equalToConstant: height).isActive = true
addLbl.centerYAnchor.constraint(equalTo: Titleview.centerYAnchor).isActive = true
addLbl.widthAnchor.constraint(lessThanOrEqualToConstant: (width2 - dayLbl.frame.width) * 0.9).isActive = true
let downImag = UIImageView()
downImag.contentMode = .scaleAspectFit
downImag.image = #imageLiteral(resourceName: "down-arrow-white")
Titleview.addSubview(downImag)
downImag.translatesAutoresizingMaskIntoConstraints = false
downImag.widthAnchor.constraint(equalToConstant: 15).isActive = true
downImag.heightAnchor.constraint(equalToConstant: 15).isActive = true
downImag.leadingAnchor.constraint(equalTo: addLbl.trailingAnchor, constant:5).isActive = true
downImag.centerYAnchor.constraint(equalTo: addLbl.centerYAnchor).isActive = true
let addressBtn = UIButton(type: .system)
addressBtn.backgroundColor = .clear
addressBtn.addTarget(self, action: #selector(self.btnClickAddress), for: .touchUpInside)
Titleview.addSubview(addressBtn)
addressBtn.translatesAutoresizingMaskIntoConstraints = false
addressBtn.centerYAnchor.constraint(equalTo: addLbl.centerYAnchor).isActive = true
addressBtn.leadingAnchor.constraint(equalTo: addLbl.leadingAnchor, constant: 0).isActive = true
addressBtn.heightAnchor.constraint(equalTo: addLbl.heightAnchor).isActive = true
addressBtn.widthAnchor.constraint(equalTo: addLbl.widthAnchor).isActive = true
}
else if type == 2{
let dayLbl = FontBold18()
dayLbl.text = title
dayLbl.textColor = .white
dayLbl.textAlignment = .center
dayLbl.numberOfLines = 1
Titleview.addSubview(dayLbl)
dayLbl.translatesAutoresizingMaskIntoConstraints = false
dayLbl.centerXAnchor.constraint(equalTo: Titleview.centerXAnchor).isActive = true
dayLbl.centerYAnchor.constraint(equalTo: Titleview.centerYAnchor).isActive = true
}
}
#objc func btnClickASAPType() {
print("DayExt")
// self.overriderFunc()
}
#objc func btnClickAddress() {
print("AddressExt")
}
#objc func btnClickCart() {
print("CartExt")
}
#objc func btnClickMenu() {
print("MenuExt")
}
#objc func btnClickBack() {
print("backExt")
self.navigationController?.popViewController(animated: true)
}
}
calling setupNavigation Method in viewDidLoad
self.setupNavItems( self.navigationItem, day:"Today", address:"Jayanagar 4th Block", type: 1,isMenuBtn: false,isCart: true)

Setup rightBarButtonItem in navigationBar

I have stuck on this bug for days. I have a problem with rightBarButtonItem. I want to create a custom view. Inside custom view, there are 2 items: label, imageView. When I type this:
let customView = UIView()
customView.translatesAutoresizingMaskIntoConstraints = false
customView.backgroundColor = .black
customView.frame = CGRect(x: 0, y: 0, width: 90, height: 40)
let coinLabelNavigationBar = UILabel()
coinLabelNavigationBar.frame = CGRect(x: 40, y: 0, width: 30, height: 25)
coinLabelNavigationBar.translatesAutoresizingMaskIntoConstraints = false
coinLabelNavigationBar.text = "200"
coinLabelNavigationBar.font = UIFont(name: ".SFUIText-Medium", size: 20)
coinLabelNavigationBar.textColor = UIColor.white
let coinImage = UIImageView()
coinImage.frame = CGRect(x: 75, y: 0, width: 25, height: 25)
coinImage.translatesAutoresizingMaskIntoConstraints = false
coinImage.image = UIImage(named: "Coin")
customView.addSubview(coinLabelNavigationBar)
customView.addSubview(coinImage)
let rightBarButton = UIBarButtonItem(customView: customView)
navigationItem.rightBarButtonItem = rightBarButton
It doesn't work, navigationBar shows me this:
Do you have any idea, how to fix it?
Thanks for your answers.
try this -
let customView = UIView()
// customView.translatesAutoresizingMaskIntoConstraints = false
customView.backgroundColor = .black
customView.frame = CGRect(x: 0, y: 0, width: 90, height: 40)
let coinLabelNavigationBar = UILabel()
coinLabelNavigationBar.frame = CGRect(x: 40, y: 0, width: 30, height: 25)
// coinLabelNavigationBar.translatesAutoresizingMaskIntoConstraints = false
coinLabelNavigationBar.text = "200"
coinLabelNavigationBar.font = UIFont(name: ".SFUIText-Medium", size: 20)
coinLabelNavigationBar.textColor = UIColor.white
let coinImage = UIImageView()
coinImage.frame = CGRect(x: 75, y: 0, width: 25, height: 25)
// coinImage.translatesAutoresizingMaskIntoConstraints = false
coinImage.image = UIImage(named: "coin.jpg")
customView.addSubview(coinLabelNavigationBar)
customView.addSubview(coinImage)
let rightBarButton = UIBarButtonItem(customView: customView)
navigationItem.rightBarButtonItem = rightBarButton
For Swift 3.0:
let btn1 = UIButton(type: .custom)
btn1.setImage(UIImage(named: "imagename"), for: .normal)
btn1.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
btn1.addTarget(self, action: #selector(Class.Methodname), for: .touchUpInside)
let item1 = UIBarButtonItem(customView: btn1)
let btn2 = UIButton(type: .custom)
btn2.setImage(UIImage(named: "imagename"), for: .normal)
btn2.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
btn2.addTarget(self, action: #selector(Class.MethodName), for: .touchUpInside)
let item2 = UIBarButtonItem(customView: btn2)
self.navigationItem.setRightBarButtonItems([item1,item2], animated: true)

How do i set the back button x position from the starting point of device position?

How do i set the back button x position from the starting point of device position ?
static func backButton(navigationItem: UINavigationItem) {
//Back Button
let btnBack = UIButton(frame: CGRect(x: 0, y: 0, width: 40, height: 22))
btnBack.setImage(UIImage(named:"icn-back"), for: .normal)
btnBack.addTarget(self, action: #selector(NavBar.backBtn), for: .touchUpInside)
let leftBtn = UIBarButtonItem.init(customView: btnBack)
leftBtn.tintColor = UIColor(red: 30/255, green: 104/255, blue: 140/255, alpha: 1)
navigationItem.setLeftBarButton(leftBtn, animated: false)
}
let leftView = UIView(frame: CGRect(x: desiredXValue, y: 0, width: 90, height: 21))
let leftButton = UIButton(frame: CGRect(x: 0, y: 0, width: 80, height: 10))
leftButton.setImage(UIImage(named: "Group.png"), for: UIControlState())
leftButton.addTarget(self, action: #selector(ViewController.action(_:)), for: UIControlEvents.touchUpInside)
leftButton.contentMode = .scaleAspectFit
leftView.addSubview(leftButton)
leftView.contentMode = .scaleAspectFit
let leftBarButton = UIBarButtonItem(customView: leftButton)
self.navItem.leftBarButtonItem = leftBarButton
UserDefaults.standard.synchronize()

Center a UILabel of a UIView

I am currently trying to make a simple pop up, here I have a button, once it gets tapped.
It should show a simple view above it, I achieved the blue background, but I am not being able to add a label to it, and center the label to the blue popup
let width = (sender as! UIButton).frame.width
let y = (sender as! UIButton).frame.origin.y
let x = (sender as! UIButton).frame.origin.x
myView = UIView(frame: CGRect(x: x, y: y - 30, width:width, height: 30))
myView.backgroundColor = UIColor.blue
let label = UILabel()
label.text = (sender as! UIButton).titleLabel?.text
label.font = UIFont(name:"avenirNext-Meduim",size:20)
label.center = self.myView.center
myview.addSubview(label)
self.view.addSubview(myView)
UIView.animate(withDuration: 0.1, delay: 0.1, options: [], animations: {
self.myView.alpha = 0.0
}) { (finished: Bool) in
self.myView.isHidden = true
}
Try to set your label frame:
let label = UILabel(frame: CGRect(origin: .zero, size: yourLabelSize))
Instead of
label.center = self.myView.center
try
label.centerXAnchor.constraint(equalTo: myView.centerXAnchor).isActive = true
label.centerYAnchor.constraint(equalTo: myView.centerYAnchor).isActive = true
after
myview.addSubview(label)
self.view.addSubview(myView)
My solution
let codedLabel:UILabel = UILabel()
codedLabel.frame = CGRect(x: myView.center.x, y: myView.center.y, width: 51, height: 30)
codedLabel.textAlignment = .center
codedLabel.text = "q"
codedLabel.numberOfLines = 1
codedLabel.textColor=UIColor.red
codedLabel.font=UIFont.systemFont(ofSize: 22)
codedLabel.backgroundColor=UIColor.lightGray
self.myView.addSubview(codedLabel)
codedLabel.translatesAutoresizingMaskIntoConstraints = false
codedLabel.heightAnchor.constraint(equalToConstant: 30).isActive = true
codedLabel.widthAnchor.constraint(equalToConstant: 30).isActive = true
codedLabel.centerXAnchor.constraint(equalTo: codedLabel.superview!.centerXAnchor).isActive = true
codedLabel.centerYAnchor.constraint(equalTo: codedLabel.superview!.centerYAnchor).isActive = true
let headerView = UIView.init(frame: CGRect.init(x: 0, y: 0, width: tableView.frame.width, height: 50))
let label = UILabel()
label.frame = CGRect.init(x: headerView.center.x-60, y:headerView.center.y-15, width: 120, height: 30)
label.textAlignment = .center
label.textColor = #colorLiteral(red: 0.1290470958, green: 0.2743584514, blue: 0.6418049335, alpha: 1)
label.font = UIFont(name: "Roboto-Bold", size: 15)
label.text = "11-12-2020"
headerView.addSubview(label)
headerView.backgroundColor = #colorLiteral(red: 0.9967060685, green: 0.9998621345, blue: 0.9997505546, alpha: 1)

Subview passes touches to subview beneath it

I have added a subview like so:
func showPlayerView2() {
self.view.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height - 56)
//let theView = myView
let theView = PlayerView()
theView.willMove(toParentViewController: self.navigationController)
self.navigationController?.addChildViewController(theView)
theView.view.isUserInteractionEnabled = true
theView.playPauseButton.isUserInteractionEnabled = true
self.navigationController?.view.bringSubview(toFront: theView.view)
self.navigationController?.view.addSubview(theView.view)
theView.view.frame = CGRect(x: 0, y: self.view.frame.maxY, width: 375, height: 56)
theView.didMove(toParentViewController: self.navigationController)
self.view.layoutSubviews()
}
PlayerView Has a button that is supposed to print something to the screen when pressed.
Even after setting isUserInteractionEnabled to true, it still does not register touches and they pass through to the view below it. I have looked at nearly every SO question relating to this and none of the answers have worked. What can I do to fix this?
Try this code if your looking for a common custom navigation menu
func setupPageNavigationBar(){
navigationController?.navigationBar.barTintColor = UIColor(red:1.00, green:0.22, blue:0.22, alpha:1.0)
navigationController?.navigationBar.translucent = false
let backButton = UIButton(type:.System)
backButton.setImage(UIImage(named: "img_back")?.imageWithRenderingMode(.AlwaysOriginal), forState: .Normal)
backButton.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
let imgButton = UIButton(type:.System)
imgButton.setImage(UIImage(named: "img_logo_bar")?.imageWithRenderingMode(.AlwaysOriginal), forState: .Normal)
imgButton.frame = CGRect(x: 0, y: 0, width: 40, height: 40)
navigationItem.leftBarButtonItems = [UIBarButtonItem(customView: backButton),UIBarButtonItem(customView:imgButton)]
backButton.addTarget(self, action: #selector(self.goBack), forControlEvents: .TouchUpInside)
let titleLabel = UILabel()
titleLabel.text = "SOME TITLE"
let titleLabel2 = UILabel()
titleLabel2.text = "Some text"
titleLabel.font = UIFont.boldSystemFontOfSize(15)
titleLabel.textColor = UIColor.whiteColor()
titleLabel.textAlignment = .Left
titleLabel2.font = UIFont.systemFontOfSize(11)
titleLabel2.textColor = UIColor.whiteColor()
titleLabel2.textAlignment = .Left
let titleView = UIView()
titleView.frame = CGRect(x: 0, y: 0, width: view.frame.width-90, height: 50)
//titleView.backgroundColor = UIColor.whiteColor()
titleView.addSubview(titleLabel)
titleLabel.translatesAutoresizingMaskIntoConstraints = false
titleView.addSubview(titleLabel2)
titleLabel2.translatesAutoresizingMaskIntoConstraints = false
//titleLabel.frame = CGRect(x: 0, y: 0, width: 134, height: 34)
let viewDict = ["titleLabel":titleLabel,"titleLabel2":titleLabel2]
titleView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|-0-[titleLabel]-0-|", options: NSLayoutFormatOptions(), metrics: nil, views: viewDict))
titleView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|-0-[titleLabel2]-0-|", options: NSLayoutFormatOptions(), metrics: nil, views: viewDict))
titleView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|-5-[titleLabel(20)]-0-[titleLabel2(15)]", options: NSLayoutFormatOptions(), metrics: nil, views: viewDict))
//5+20+5+15+5
navigationItem.titleView = titleView
let homeButton = UIButton(type:.System)
homeButton.setImage(UIImage(named: "img_home")?.imageWithRenderingMode(.AlwaysOriginal), forState: .Normal)
homeButton.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
navigationItem.rightBarButtonItem = UIBarButtonItem(customView: homeButton)
homeButton.addTarget(self, action: #selector(self.gotoHome), forControlEvents: .TouchUpInside)
//CGRectMake()
}
And In viewControllers
override func viewDidLayoutSubviews()
{
self.setupPageNavigationBar()
}

Resources