6

I can't find Vary for Traits in Xcode 13. Thanks in advance for any help!

3
  • Did you find this button?
    – burningsun
    Commented Sep 24, 2021 at 8:10
  • 1
    No yet, still looking for it Commented Sep 25, 2021 at 13:44
  • 1
    I have created a youtube video for creating adaptive layout in Xcode13. Check that out and I hope this will be helpful. youtube.com/watch?v=pZuNhxR_uRg Commented Apr 19, 2022 at 13:28

4 Answers 4

6

You can set Trait specific variations in the Attributes and Size Inspector panes.

For example, suppose we have this layout:

enter image description here

with Stack View properties:

enter image description here

But -- when we have a Regular Width trait, we want it to look like this:

enter image description here

with these Stack View properties:

enter image description here

Switch back to our original layout (Vertical stack view, spacing: 8, Height: 120).

Select the stack view, and in the Attributes Inspector pane, click the + button to the left of Axis and from the popup select Width -> Regular / Height -> Any:

enter image description here

When we click the Add Variation button, we'll see a new wR variation where we can select Horizontal:

enter image description here

Now click the + to the left of Spacing and again select Width -> Regular / Height -> Any:

enter image description here

When we click the Add Variation button, we'll see a new wR variation where we can change 8 to 32:

enter image description here

Now we select the Height constraint, and in the Size panel click the + to the left of Constant and again select Width -> Regular / Height -> Any:

enter image description here

When we click the Add Variation button, we'll see a new wR variation where we can change 120 to 64:

enter image description here

Now when we switch the orientation in Storyboard / Interface Builder (and when we rotate the device at run-time), we'll get our desired result.

1
  • 2
    Thanks for sharing, but it just seems so horrid and worse than it was before. I can't visualise my changes anymore and I'm confused which constraints are applied and which aren't to a particular layout. Yuck!
    – JCutting8
    Commented Nov 10, 2021 at 10:35
2

You can Introduce any variations in Layout Constraints

enter image description here

1
  • 1
    Doing this for attributes like font color/size seems fine, but in a view controller with 50+ or even 100+ constraints, it is very tricky navigating through them all. The removal of the "Vary for trait" buttons just sucks (maybe even an unintentional change or bug?). I can't imagine this is how we need to manage size class constraints going forward. Apple's documentation still reference the button.
    – JCutting8
    Commented Dec 1, 2021 at 3:01
0

According to this, the only work around is doing the following:

  • You set constraints for the active size class
  • Trait Variations need to be enabled in the File Inspector tab
  • After that you can manually add traits by clicking the plus next to a property (it'll use the active size class but you can modify it while creating too)

Unfortunately, this only works for properties, and not constraints. There is no other work around for this.

Everyone who has these problems should post bug reports to let the Xcode developers know.

1
  • I am unable to setup the height of an image view based on iPhone and iPad Screen size. Constraint size remains the same regardless. Any demo will be much appreciated Commented Oct 17, 2021 at 18:18
0

I found one solution, let say you have leading, trailing, top and bottom constraint at 0 for the portrait. Now in the bottom bar, above the log window, tap to 'Orientation' to put the views in the landscape. Now find the constraint you want to change for that variation and double click on that constraint, then tap on + icon beside the Constant field and add a new variation, in this example for the landscape. Then change a value and those values will be implemented, one for portrait one for the landscape.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.