故事板上的UIStackView强制固有内容的大小

Question

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.

Ideas?

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

Answer 1

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”:

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

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

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

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”):