how does instagram's custom navigation bar created? - swift

I'm working on an iOS app and gonna work on the navigation controller part.
The UI of the navigation bar is not complex in my app; basically, it should have an app logo on the left an app name in the middle, and two bar button items on the right.
While I was researching, I saw the Instagram's navigation is sort of similar to what I want to try, especially the "Instagram" logo on the left.
I'm not sure if I can make a navigation bar like an instagram's navbar with a default UI navigation bar, so I guess I need to make a custom navigation bar with .xib file or something? or is it possible to make it with the default navigation bar and some codes??
If you can walk through the approach you take, please let me know...

This can be easily done with a default UINavigationController. For the logo you can create a UIBarButtonItem and set the image to whatever image you want (e.g a logo).
I have a function that sets the collection view's offset to 0 when tapping on the logo similar to Instagram.
For the 3 buttons on the right, you can do something like this:
self.navigationItem.rightBarButtonItems = [button1, button2, button3]
Each button would be their own UIBarButtonItem and then add a selector to each of them.
Here is something similar to what I have in my app:
let calendarButtonItem = UIBarButtonItem(
image: UIImage(
systemName: "calendar.badge"),
style: .done,
target: self,
action: #selector(handleCalendarTap))
let navLogoButtonItem = UIBarButtonItem(
image: UIImage(named: "nav-logo"),
style: .plain,
target: self,
action: #selector(handleNavLogoTap))
self.navigationItem.rightBarButtonItem = calendarButtonItem
self.navigationItem.leftBarButtonItem = logo

Related

How can I hide or add a BarButtonItem dynamically when I change the current ViewController?

I want to add a BarButtonItem every time the user jumps to the Controller and remove it dynamically when the user selects another ViewController in the navigation bar.
let filterBtn = UIBarButtonItem(title: "", style: .plain, target: self, action: #selector(action(sender:)))
navigationItem.rightBarButtonItem = filterBtn
}
I added two BarButtonItem in my UIStoryBoard and now I want to add one more button dynamically but only if the ViewController is selected like shown above.
It it possible to do it like this? I appreciate any input!
So, navigationItem.rightBarButtonItems is an array and you can remove/append elements. I'll suggest you to try removing "humburger" button item and adding the new one when DocumentationViewController is presented.
navigationItem.rightBarButtonItems?.popLast()
navigationItem.rightBarButtonItems?.append(filterBtn)

back button title color not changed while we open popover or present form controller in iOS 13

In iOS 13 back button title color not dimmed whenever we open popover or present other controller. Other part of application grayed out but not back button.
also tintColorDidChange function is not available for UIBarButtonItem so is there any way to do grayed out all back button titles.
Note: Back button image is being grayed.
Have you try by changing tint color of bar button?
I got same problem and solved by using
self.navigationController?.navigationBar.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.clear]
self.navigationController?.navigationBar.tintColor = .red // put your desire color
self.navigationItem.backBarButtonItem = UIBarButtonItem(title: "", style: .plain, target: nil, action: nil)

Avoid showing "back" for back button when navigation title is long in Swift

There is a navigation in my project which I want to config it's navigation back item.
First case: When the UINavigation title is long the title of back button is set to "back"
replacing back button title to "back"
Second case: when it is longer this "back" is not shown.
delete back button title and just show back icon
But I want to show just back icon in the first case too.
Swift 3 - Through Storyboard:
To make navigation bar back button have only back arrow and no "Back" text written, follow the steps:
Go to navigation bar of the root view controller(titled "Home" in screenshot below)
Go to its attribute inspector. Set the back button to a space as shown below:
And that's it!!
This is the simulator screenshot:
Hope it helps!
Add this in viewDidLoad of ViewController which is pushing next ViewController (View Controller Linguini Arabbiatta)
navigationItem.backBarButtonItem = UIBarButtonItem(title: "", style: .plain, target: nil, action: nil)
It will show just a back icon in all the View Controllers which are pushed from that View Controller.
Try this code
if let title = self.navigationController?.navigationBar.backItem?.title {
if title.characters.count > 5 {
self.navigationController?.navigationBar.backItem?.title = "Anything Else"
}
}
Here's Objective-C
[self.navigationItem setHidesBackButton:YES];
Here's Swift
self.navigationItem.setHidesBackButton(true, animated:true);
Edit: if you wish to remove the text only, then here's Objective-C
[self.navigationItem.title = #""];
Here's Swift
self.navigationItem.title = ""
Then you'll need to refresh the nav bar
self.navigationController?.navigationBar.setNeedsLayout()
self.navigationController?.navigationBar.setNeedsDisplay()

Left Bar Button Item - show name of previous View Controller

If you have a Navigation Controller with no Bar Button Items, a navigation back button will be shown with the name of the last View Controller.
I want to keep that name, as in I don't want to have to hardcode it. I do know how to add it in but I don't want to have to do that because that leaves more room for bugs.
Is there a way that I can have a left Bar Button Item and for the default one to not go away?
Add this in viewController where you want to have default back button and custom bar button item. You can customise the bar button item.
override func viewDidLoad() {
super.viewDidLoad()
let newBtn = UIBarButtonItem(title: "new", style: .plain, target: self, action: #selector(anotherMethod))
self.navigationItem.leftItemsSupplementBackButton = true
self.navigationItem.leftBarButtonItem = newBtn//self.navigationItem.leftBarButtonItems = [newBtn,anotherBtn]
}

Swift - bar button item image / set size and width

Feel like I've been wasting a lot of time on this one and would love some help. I'm trying to use a custom menu icon (20px x 20px) in my barButtonItem. The problem it that is scales to fill the bar button item and is distorted.
Normally this shouldn't be too complicated. But I'm using tabbed view controllers and not a navigation controller. The navigation bar I have dropped into the view controller is just an outlet.
Normally I could do something like this:
let image = UIImage(named: "menu_white")
let frame = CGRectMake(0, 0, image!.size.width, image!.size.height)
let button = UIButton()
button.frame = frame
button.setImage(image, forState: .Normal)
let rightMenuButton = UIBarButtonItem(customView: button)
self.navigationItem.setRightBarButtonItem(rightMenuButton, animated: true)
But this doesn't work because self.navigationItem doesn't actually refer to anything in the view controller.
I need to somehow get the image into the outlet programmatically but setRightBarButtonItem is not a method of UINavigationBar.
#IBOutlet weak var navBar: UINavigationBar!
Would really appreciate some help if anyone's got some ideas.
The way a "loose" navigation bar works is that you configure a UINavigationItem and set an array containing that to be the navigation bar's items, as in this example code (from my book):
let ni = UINavigationItem(title: "Tinker")
let b = UIBarButtonItem(title: "Evers", style: .Plain, target: self, action: "pushNext:")
ni.rightBarButtonItem = b
self.navbar.items = [ni]
So, you could presumably do something like that.
The self.navigationItem thing is merely a way of causing that to be done automatically in the special situation where you're using a UINavigationController. But you say that you're not doing that. (Of course, you could do that; there's no law that says you have to use a navigation controller to do any actual navigation. I often use a navigation controller just to get the navigation bar, because it's a good place to put things like little menu buttons.)