Add trailing constraint between two views

Question

I got stuck with a weird behaviour

I added programmatically a trailing constraint between 'UISlider' and 'UILabel', it looks like this:

NSLayoutConstraint *timeLabelTrailing = [NSLayoutConstraint
                                             constraintWithItem:_timeLbl
                                             attribute:NSLayoutAttributeTrailing
                                             relatedBy:NSLayoutRelationEqual
                                             toItem:_seekBar
                                             attribute:NSLayoutAttributeTrailing
                                             multiplier:1
                                             constant:0];

    [timeLabelTrailing setActive:true];
    [self layoutIfNeeded];

And the 'UILabel' trailing wont match the 'UISlider' trailing.

I tried to do the same between the 'UILabel' and the 'UIViewControoler' view and it works just fine, but with the 'UISlider' it goes wrong.

Attached some photos from ViewDebugger:

slider

label

It's unclear in your image what's what. 1) Is the first screenshot on the UISlider and the other one on the label only? 2) have you changed your viewdebugger settings? — mfaani, Aug 23 '18 at 15:31
Have you set `translatesautoresizingmaskintoconstraints` on your label and slider to `false`? — mfaani, Aug 23 '18 at 15:32
1.I didn’t do any thing to the debugger 2.yes I set it to false — dudi hisine, Aug 23 '18 at 15:34
Are you doing something odd with your `_seekBar`? Based on your image, its `frame width` is greater than its `bounds width`... — DonMag, Aug 23 '18 at 15:36
It's because you've placed these in a stackview. Am I right? That complicates things... — mfaani, Aug 23 '18 at 15:37
So how I can do it and keep the slider inside the stackView? — dudi hisine, Aug 23 '18 at 15:40
you might want to edit the question and include your stackview setup... — mfaani, Aug 23 '18 at 15:45

mfaani · Accepted Answer · 2018-08-23T17:23:51.620

It's because you've placed these in a stackview! Hence the stackview is suppressing other contraints.

How do I know it's getting suppressed?

The viewdebugger is an extremely powerful tool, yet most of its features are unknown.

The color of the constraints on the right side convey meaning.

The dark black constraints are having an affect.
The light gray constraints are ignored either due to being suppressed by a higher priority or conflicts among constraints meaning the Layout engine would decide on its own. The behavior of this decision is unpredictable.

FWIW both the gray & black colored constraints are active, yet not every active constraint gets applied. e.g. you could have hundred constraints on the width of a label, each with a different priority. While all of them are active, they would get ignored except for the constraint with highest priority.

As you can see ☝️the label.trailing = self.trailing @1000 is getting ignored. And when you have a priority with '1000' ignored then I'm pretty much sure that debugger is dumping warnings to you, but you didn't mention them in your question.

Long story short when you place things inside a stackview, then you shouldn't be adding much constraints yourself.

'position' related constraints should be heavily avoided.
'size' related constraints are slightly acceptable.

I think what you possibly need is

stackView.alignment = .trailing

And make sure you remove the other trailing constraints.

And if you want your slider to stretch to the full width of the stackview then constrain it to the stackview's width. The label is getting its width from its intrinsicContentSize and that's fine.

TBH I'm not sure if this is the best approach but I think it works. If anyone knows of a better way then please leave a comment.

Add trailing constraint between two views

1 Answers1