Custom title view as large title in iOS 11 new navigation bar

Question

I am using a button as a title view for my UITableViewController which opens a dropdown list of categories. Selecting a category filters content of the table view by the selected category.

The button shows the name of the selected category plus a small arrow, similar to how iBooks used to look (or maybe still looks? I haven't used it in a while). I would therefore like it to have the same behaviour as a standard title and have it be large at first and collapse when the table view is scrolled.

Is there a way to do this?

Thanks

Did you solved it some how? – Roi Mulia Sep 26 '17 at 23:31 — Roi Mulia, Sep 26 '17 at 23:31

iAmcR · Answer 1 · 2017-11-13T01:44:51.567

It seems because of the new large titles, IOS11 requires the constraints on the custom view in the navigationItem.titleView to be set.

Do this for example:

customView.widthAnchor.constraint(equalToConstant: 200).isActive = true
customView.heightAnchor.constraint(equalToConstant: 44).isActive = true

self.navigationItem.titleView = customView

Note this must be done for both width and height.

It should work. No need to add a button, at least in my case...

This was suggested by Apple to ensure that you don't have zero-size custom views. See slide 33 in https://developer.apple.com/videos/play/wwdc2017/204/

score 4 · Answer 2 · answered Aug 18 '17 at 13:45

4

Looks like touches are broken for navigationItem.titleView. Gestures, tap events and buttons - nothing works

answered Aug 18 '17 at 13:45

Aleksey Mazurenko

645
8
11

I just ran into this. Have you discovered a fix yet? – Clifton Labrum Sep 19 '17 at 06:52
Yes, specifically for iOS11 you'll have to add a button above your title view for touches to work. Handle button event same way you've handled gestures – Aleksey Mazurenko Sep 19 '17 at 10:18
Thanks for your reply. I'm not sure I follow you. By "title view" do you mean a title navigation item? I don't think you can place a `UIButton` above a nav item because it is the parent of the bar button items. – Clifton Labrum Sep 19 '17 at 17:00
1

No, u assign a view to navigationItem.titleView, then add a button that view and make call sendSubviewToFront – Aleksey Mazurenko Sep 20 '17 at 20:50
To the record, the right method is `bringSubviewToFront` – Shebuka Oct 20 '17 at 14:30

score 2 · Answer 3 · answered Sep 01 '17 at 11:52

Seems like a bug in iOS 11: https://forums.developer.apple.com/thread/82466

I provisionally implemented this workaround:

    private lazy var navBarActionButtonIOS11: UIButton = {
        button.addTarget(self.navTitleView, action: #selector(self.navTitleView.didTapView), for: .touchUpInside)
        return button
    }()

[...]

        navigationItem.titleView = navTitleView
        if #available(iOS 11.0, *), let navBar = navigationController?.navigationBar {
            navBarActionButtonIOS11.removeFromSuperview()
            navBar.addSubview(navBarActionButtonIOS11)
            navBarActionButtonIOS11.center.x = navBar.center.x
        }

Another solution could be to just assign a UIButton to navigationItem.titleView directly.

I hope Apple fixes this soon!

Juan, does the expected behavior would be that when I'm using Large Titles, and setting titleView, the titleView would display at the Large Title and not on the regular right? Or Apple meant to separate between the two? In other words, we can't assign TitleView to Large Titles (replacing the Large Title with our own title)? — Roi Mulia, Sep 26 '17 at 23:34

score 1 · Answer 4 · answered Sep 27 '17 at 13:55

Well, I had same problem. I have UIButtons in UINavigationItem.titleView and those were not reacting to touches at all. Problem is that the view where those buttons are where of size (0,0) because of auto layout. So to fix this problem you need to add additional view into your custom view, lets call it "contentView" and put all your controls inside that contentView. Also, contentView must have defined size with constraints. Quick test is to add width and height constraint to contentView. And all works again.

Hope that this helps someone.

I had a UIButton in the titleView and touches stopped with iOS 11. Adding a view to the titleView and putting the button inside did the trick for me. Thanks. — The Lone Coder, Oct 11 '17 at 13:48

Custom title view as large title in iOS 11 new navigation bar

4 Answers4

Linked