How to fix the Auto Layout issue on the official iOS app development tutorial?

🎤 General Discussion iOS
1

NOTE: To see the images of this post, please see this Stack Overflow question.

At end of Implement Edit and Delete Behavior section of the official iOS app development tutorial, it is mentioned that the layout has errors and fixing these errors using stack views is left as an exercise for the reader.

To fix them, I have followed the following steps:

  1. Add a horizontal stack view, which will contain the UIImageView and a vertical stack view.
  2. Constrain the edges of the horizontal stack view to the edges of the superview.
  3. Add the label and Rating Control to the vertical stack view.
  4. Set Content Mode to Aspect Fit in UIImageView.
  5. Set CHCR properties of UIImageView to all 1000.

see link for the image

However, the layout is still not to my liking. For example, I have started the app in iPhone 5 simulator and this is the situation:

see link for the image

The image views do not extend to cell top and bottom (with keeping the aspect ratio). Furthermore, when I tap “Edit”, the image views shrink instead of the Rating Control and Label:

see link for the image

Similarly, when we slide a row left, instead of the label and Rating Control being shrank, the image view is slided out of the view:

see link for the image

I would like the image view stay there completely and Rating Control and Label to shrank as necessary.

I have also tried replacing the Rating Control with a plain Horizontal Stack View, which contains 5 plain buttons. This is the result:

see link for the images

This time, the UIImageView covers the whole cell. I have expected:

  1. The UIImageView’s height equal to the height of the cell.
  2. The UIImageView’s width is proportional to its height (because I have set the Content Mode of UIImageView to Aspect Fit in the Interface Builder).
  3. The remaining space to be covered by the label and the new Rating Control. They should take up the remaining space, because I have set the CHCR of the UIImageView to all 1000.

How can I achieve the desired layout?