how to set leading and trailing constraint for a xib used as titleView

Question

I have Xib file with two labels, left and right. left one has 0 on leading and right 0 on trailing. in between a >= 15 constraint. This view is used as title view in a navigation bar. My Question is: How to set this xib in order to get left label close to leftItem and right one close to the rightItem?

how the xib is called

headerVC = HeaderViewController(nibName: "HeaderViewController", bundle: nil)

how the xib is filled

    navigationItem.titleView = headerVC?.view
                headerVC?.lbl1.text = name
                headerVC?.lbl2.text = balance

//test purpose
                    //        headerVC?.backgroundColor = .red
                    //this try of mine not working
                    let leftWidth = self.navigationItem.leftBarButtonItem?.width ?? 0.0
        let rightWidth = self.navigationItem.rightBarButtonItem?.width ?? 0.0
        let sides = leftWidth + rightWidth
        let screenSize: CGRect = UIScreen.main.bounds
        let screenWidth = screenSize.width
//        NSLayoutConstraint.activate([
//            headerVC?.view.width = screenWidth - leftWidth - rightWidth
        headerVC?.view.widthAnchor.constraint(equalToConstant: screenWidth - sides).isActive = true
//        ])

solution, related to the answer below and to this answer

        headerVC?.backgroundColor = .red
        headerVC?.view.translatesAutoresizingMaskIntoConstraints = false
        let screenSize: CGRect = UIScreen.main.bounds
        let screenWidth = screenSize.width
        headerVC?.view.widthAnchor.constraint(equalToConstant: screenWidth * 0.75).isActive = true

matt · Accepted Answer · 2020-06-17T17:07:43.087

0

Your constraints configure the title view to be as small as possible while still showing the labels. If you want the title view to be wider, you will have to add a width constraint making it wider. The title view cannot "see" the left and right items in the nav bar in any way; you'll just have to figure out what the width should be, yourself, and set it.

Here's an example; the title view is given a width constraint of 100 and 250, respectively.

So for example the second one is

let v = UIView()
v.backgroundColor = .red
v.translatesAutoresizingMaskIntoConstraints = false
v.widthAnchor.constraint(equalToConstant: 250).isActive = true
v.heightAnchor.constraint(equalToConstant: 20).isActive = true
self.navigationItem.titleView = v

edited Jun 17 '20 at 17:07

answered Jun 17 '20 at 15:39

matt

515,959
87
875
1,141

but, the width should be dynamic right? with is the right way to achieve this? – biggreentree Jun 17 '20 at 15:49
What I'm saying is that it isn't dynamic. It is completely self-contained; it isn't aware of its surroundings. – matt Jun 17 '20 at 15:54
I see, what do you think about calculating the window's width? – biggreentree Jun 17 '20 at 15:58
Absolutely, just remember you are basically guessing. :) Give it a shot and see if you can get satisfactory results. Of course if we rotate you're going to have to cope with that, but let's cross that bridge later. – matt Jun 17 '20 at 16:10
I updated the question with my new try, but not working. – biggreentree Jun 17 '20 at 16:22
I updated the answer with screen shot that shows this kind of thing does work. – matt Jun 17 '20 at 16:34
1

sure, did so - remember, it's just a proof of concept, but it does prove the concept – matt Jun 17 '20 at 17:08
added a solution starting from yours. What do you think about it? if it is good enough, what about crossing that bridge? – biggreentree Jun 18 '20 at 07:30

how to set leading and trailing constraint for a xib used as titleView

1 Answers1