Swift - bar button item image / set size and width - swift

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.)

Related

CollectionViewController does not show searchbar and navigation bar

I'm trying to follow along with a video course to implement photo gallery with Unsplash.
First I implemented UIViewController with searchbar and navigation bar in it
PhotoCollectionViewController: UIViewController
and manually adding searchbar and navigation bar
//MARK: - Nav bar inelkaar steken hier
private func setupNavigationBar(){
let titleLabel = UILabel()
titleLabel.text = "Photos"
titleLabel.font = UIFont.systemFont(ofSize: 15)
titleLabel.textColor = .black
navigationItem.leftBarButtonItem = UIBarButtonItem.init(customView: titleLabel)
navigationItem.rightBarButtonItems = [addBarButtonItem, actionBarButtonItem]
}
and the same for searchbar
so I got the result as this:
after this the PhotoCollectionViewController: UIViewController inheritance seemed be wrong what I did, and I need to change it to UICollectionViewController
I make then another controller inherited from UICollectionViewController with the same logic PhotoCollectionViewController: UICollectionViewController
It compiles without any issues, but I don't see navigation an search bar anymore
How can I fix this?
May be your collectionView is hiding search bar and navigation bar. check collectionView constraints. (specially top anchor)
// PS: I could comment, but I don't have 50 reputation.
maybe you can try this:
Check the top constraint first of your collectionView. And maybe you can add this code to you viewDidLoad() :
self.navigationController?.setNavigationBarHidden(true, animated: false)
if you use ScollView at fullscreen (SuperView), you can use this :
scrollView.contentInsetAdjustmentBehavior = .never
for searchBar IBOutlet you can add this :
searchBar.becomeFirstResponder()

I want to rotate a bar button item - Swift

I encountered with an issue. I want to display 3 buttons, that are used for filtering my tableView. I found an appropriate images from “SF symbols.” Except one, which is the same I used for filtering(bigger to smaller) but is rotated on 180 degrees. I don’t know how to rotate bar button item, so I decided add custom button to bar button item.
There’s a problem occur – button is very small.
After adding button to bar button item:
I tried to use image configuration, but it’s not very good because it looks different and not with the same spacing.
After configuring button's image:
In the debug view hierarchy I found that symbol config is “Medium”, meanwhile other bar button items have “Body, Large”. But I haven’t found anything how to change it.
I have few questions:
Is there a way to flip bar button item without adding custom button in it?
If the way in the first question impossible, is this real to configure image “dynamically” the same way as other are displayed?
My code:
class viewController: UIViewController {
#IBOutlet var youngToOldfilterButton: UIBarButtonItem!
enter code here
override func viewDidLoad() {
let filterButton = UIButton(type: .custom)
var image = UIImage(systemName: "line.3.horizontal.decrease.circle", withConfiguration: UIImage.SymbolConfiguration(pointSize: 22))
filterButton.setImage(image, for: .normal)
filterButton.sizeToFit()
filterButton.addTarget(self, action: #selector(action), for: .touchUpInside)
//rotation transform
filterButton.transform = CGAffineTransform(rotationAngle: 180 * .pi/180)
youngToOldfilterButton.customView = filterButton
}
#objc func action {
...
}
}
symbol config is “Medium”, meanwhile other bar button items have “Body, Large”. But I haven’t found anything how to change it.
That way is to use a symbol configuration. Your problem is you are using the wrong configuration:
SymbolConfiguration(pointSize: 22))
Does that say Body, Large? No. You want this:
SymbolConfiguration(textStyle: .body, scale: .large)
https://developer.apple.com/documentation/uikit/uiimage/symbolconfiguration/3294246-init
However, the very best solution would likely be to design your own custom symbol image based directly on the "decreasing" image. This takes some time, but it isn't difficult, and you obviously care a lot about the exact thickness and position of the bars, so it might be worth it. Watch https://developer.apple.com/videos/play/wwdc2021/10250 for info.

how does instagram's custom navigation bar created?

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

Using UINavigationItem on UITabBarController

I have a project with a UITabBarController and a couple of views. Sort of like this:
In this project, the tab bar controller is called by tapping the Tab button on the UIViewController. I would like to get rid of the back button with "Title", and replace it with an "X" icon. When tapped, the "X" icon would dismiss the UITabBarController and return to the caller. I do this all of the time on UINavigationController using a UINavigationItem, but that does not appear to work in this situation. I drag the UINavigationItem to the view and it allows it, but it does not show up on the view and any UIBarButtonItem that I drag and drop on it do not appear.
Is there a way to actually do this? I'd even be ok with leaving the existing back button as it is and just getting rid of "Title"
I figured it out right after posting the question. Just a bit more research is all it took.
To fix this, add the following to the UITabBarController code.
override func viewDidLoad() {
super.viewDidLoad()
let buttonImage = UIImage(named: "back")
let leftButton = UIBarButtonItem(image: UIImage(named: "back"), style: .plain, target: self, action: #selector(dismissTabBar))
leftButton.tintColor = UIColor.black
self.navigationItem.leftBarButtonItem = leftButton
}
#IBAction func dismissTabBar() {
self.navigationController?.popToRootViewController(animated: true)
}
This gives me a black back button with my image. When I tap it, it brings me back to the calling 'UIViewController.

UISearchController without use of Navigation Controller

Is it possible to use the UISearchController without the SearchBar being displayed in the Navigation Controller? I basically want the SearchBar to stay on the screen and display the TableView beneath it:
What I was trying to do is this:
I've created a UITableViewController on the storyboard and linked it to the custom NPTableViewController class. Then I did this:
let resultsTable = storyboard!.instantiateViewController(withIdentifier: "LocationSearch") as! NPTableViewController
searchController = UISearchController(searchResultsController: resultsTable)
searchController?.searchResultsUpdater = resultsTable
let searchBar = searchController!.searchBar
searchBar.sizeToFit()
searchBar.placeholder = "Search for places"
searchBar.frame.origin.y = 100.0
self.view.addSubview(searchBar)
Now when I run it, the searchBar is displayed but when I click on it the background dims, the searchBar disappears my resultsTable is also not displayed.
The solution I came up with is actually very simple. Instead of using UISearchController, I used a normal UISeachBar and UITableView. Since UISearchController doesn't do so much to help you, the work is pretty much the same if I kind of build my own SearchController.