1

In storyboard I have added a UIStackView to a UIView and inside the UIStackView I've added a UIImageView with an image specified. The image specified is in XCAssets and has a 2X size of 59X60. The UIImageView is getting its width set to this intrinsic size but I want it to be 44X44 and the image to scale to fit. However in Storyboard with and Height settings are disabled and set to 59X60 for the ImageView and for the UIStackView as well. I want to have 5 of these same ImageViews with stars stack horizontally at 44X44 inside the UIStackView.

enter image description here

Ideas?

Update: It seems that adding a height constraint to the UIStackView will cause the scaling but the star is then distorted in appearance.

bhartsb
  • 1,316
  • 14
  • 39

1 Answers1

5

The width and height fields are grayed out because the image view is inside a stack view. You must use constraints to control the size of a stack view's arranged subviews.

First, make sure all five star views have “Content Mode” set to “Aspect Fit”:

set content mode to aspect fit

Then, constrain all five star views to have equal width and height to each other:

equal widths and heights constraints

Finally, constrain one of the star views to have a constant width of 44 and a constant height of 44:

constant width and height constraints

If you want space between the stars, set the “Spacing” of the stack view:

stack view spacing

If you want padding around the stars, you can do that outside the stack view, or you can set the stack view's “Layout Margins” to fixed constants (and turn off “Safe Area Relative Margins”):

stack view layout margins

rob mayoff
  • 375,296
  • 67
  • 796
  • 848