Silver challenge question

I thought I had this one working back when I first did the chapter, but going back now it appears my solution wasn’t working as well as I thought. If I have a long enough name to be close to filling 2 lines, it starts out looking correct:


but if I rotate the device to horizontal & then back to vertical, it no longer wraps the name correctly, instead it wants to shove the value label off the right side of the screen:

I have a constraint between the trailing edge of the value label and the trailing margin, but it seems to selectively ignore that. I don’t even get an error message in the log about conflicting constraints.

The only thing I’ve been able to do to fix this is to set a preferred width for the name label, but since that’s a fixed value it doesn’t update when you rotate the device or run on a different size screen, so that isn’t really a good solution.

Did you try tinkering :slight_smile: with the constraint’s priority?

You were on the right track. The problem turned out not to be the priority on the value label constraint, it was the priorities on the Name label. I forgot to lower its vertical content hugging and horizontal content compression resistance priorities. When I did that, the problem went away.

When I update layout, layout have error.
I change nameLabel trailing size.
It works fine.

error

I saw that same trailing edge constraint error. In theory, you could add a constraint to prevent the serial number label from overlapping the value label; in practice, the serial number isn’t ever going to be big enough for that to be an issue.

I saw the same error and ignored it for the same reason

I have the exact same problem and I am unable to fix the issue after rotation. Can you please explain how you fixed it as I don’t understand the solution?

It doesn’t quite make sense at this point because they don’t actually explain those priorities until the next chapter. In the series of steps you perform after Figure 10.4, they tell you to modify a couple of them without really telling you what they are or why you’re doing it.

The compression resistance priorities are used when there’s not enough room on the display to fit everything and something has to get smaller. The item with the lower compression resistance priority is the one that shrinks. In this case, the display isn’t wide enough for both the name and the value. Since by default the name and value labels both have the same horizontal compression resistance priority, that leaves it up to iOS to decide how to handle that and so it sometimes decides to shove the value label off the display (or maybe it’s just shrinking it to a very small width). By lowering the horizontal compression resistance priority of the name label we tell iOS that the name label width is less important than the value label width, so it will shrink the name label if needed to keep the value label displayed.

The content hugging priorities are used when there’s extra room on the display and one of the items has to get bigger to fill the extra space. The item with the lower priority is the one that stretches. In this case I’m not sure it was actually necessary to change the vertical content hugging priority of the name label, I think I just did it because it was done back in the series of steps following Figure 10.4. I just did a bit of testing without changing that value and it still seems to work OK. So I think the horizontal compression resistance was the important priority here.

1 Like