This article has participated in the good article call order activity, click to see: back end, big front end double track submission, 20,000 yuan prize pool for you to challenge!

Autoresizing profile

AutoresizingAt that time, there were few models of iOS devices, the screen size was single, and the APP interface was relatively simple. Screen adaptation was not as complicated as it is now. All UI controls only needed to be laid out relative to their parent controls.AutoresizingIs a layout solution relative to the parent control

After Xcode5, new projects are used by defaultAutoLayout. AutoresizingIt is disabled by default and we can remove ituse Auto LayoutTo enableAutoresizing

Autoresizing usage

XIBThe use ofAutoresizing

Autoresizing core usage is 6 line, the up and down or so as well as the space between the two Red Cross line below The up and down or so four red line respectively the view from the parent view of how much all around the edge of the constraints Up and down between two cross line, whether the height and width of this view as the change of parent view and scale changes

For example: when we make the left and top dotted lines solid, it means that the spacing between the child and parent is fixed in this direction. When we click on the dotted lines inside the child view, it also becomes solid, indicating that the width or height of the child view is fixed

Use Autoresizing in the code

@property(nonatomic) BOOL autoresizesSubviews; // The default value is YES, which means that the parent control changes size with the child control
@property(nonatomic) UIViewAutoresizing autoresizingMask;    // Is an enumeration that automatically adjusts the margin between the child control and the parent control or the width and height of the child control. The default enumeration value is UIViewAutoresizingNone
Copy the code
typedef NS_OPTIONS(NSUInteger, UIViewAutoresizing) { 
    UIViewAutoresizingNone = 0./ / the default
    UIViewAutoresizingFlexibleLeftMargin = 1 << 0.// Spacing is fixed on the right and variable on the left
    UIViewAutoresizingFlexibleWidth = 1 << 1.// View width is variable
    UIViewAutoresizingFlexibleRightMargin = 1 << 2.// Spacing with the superview is fixed on the left and variable on the right
    UIViewAutoresizingFlexibleTopMargin = 1 << 3.// The spacing between the bottom and the superview is fixed, and the top is variable
    UIViewAutoresizingFlexibleHeight = 1 << 4.// View height variable
    UIViewAutoresizingFlexibleBottomMargin = 1 << 5 // The spacing between the top and the superview is fixed and the bottom is variable
};
Copy the code

Note:UIViewtheautoresizesSubviewsProperties forYES(default is YES),autoresizingMaskThat is, when we want to useautoresizingMaskWhen specifying the relationship between a control and its parent control, you mustAutoresizesSubviews = YES.

Preview of various combinations of Autoresizing

  • UIViewAutoresizingNone

viewtheframeNot with thesuperview(This constraint conflicts and defaults to fixed left spacing and upper spacing)

  • UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleBottomMargin

viewAnd itssuperViewThe left spacing and the upper spacing are fixed, the width and height are fixed, and the right spacing and the bottom spacing are scaled according to the scaling of the parent control

  • UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleBottomMargin

viewWith its superView ‘on the pitch fixed, right pitch fixed, width and height fixed, left pitch, pitch lock parent control zoom and zoom

  • UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleTopMargin

viewWith itssuperViewThe right spacing, the bottom spacing is fixed, the width and height are fixed, the upper spacing and the left spacing are scaled with the scaling of the parent control

  • UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin

viewWith itssuperViewThe left spacing and the bottom spacing are fixed, the width and height are fixed, and the right spacing and the upper spacing are scaled with the scaling of the parent control

  • UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleHeight

viewWith itssuperViewThe upper spacing, the left spacing, the bottom spacing and the width are fixed. The height and right margin are scaled with the parent control

  • UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleWidth

The left spacing, upper spacing and right spacing of the view and its superView are fixed, and the height is fixed. The width and bottom spacing are scaled as the parent control is scaled

  • UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight

viewWith itssuperViewThe upper spacing, right spacing, bottom spacing and width are fixed. The height and left spacing are scaled as the parent control is scaled

  • UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth

The left spacing, right spacing, bottom spacing and height of the view and its superView are fixed. Width, spacing with the parent control scale and scale

  • UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight

The left spacing, top spacing and bottom spacing of the view and its superView are fixed. The width, height, and spacing to the right are scaled as the parent control is scaled

  • UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight

viewWith itssuperViewThe left spacing, the upper spacing and the right spacing are fixed. The width, height, and bottom spacing are scaled as the parent control is scaled

  • UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight

The upper spacing, right spacing, and lower spacing of the view and its superView are fixed. The width, height, and left spacing are scaled as the parent control is scaled

  • UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight

The left spacing, bottom spacing, and right spacing of the view and its superView are fixed. The width, height, and spacing are scaled as the parent control is scaled

  • UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottom

The width-height ratio of a view to its superView remains the same, and the upper, lower, left, and right spacing is scaled as its superView is scaled

  • UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin

viewWith itssuperViewThe left and right spacing is fixed, the height is fixed, and the width, top spacing, and bottom spacing are scaled with the scaling of the parent control

  • UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin

viewWith itssuperViewThe ratio of the upper, lower, left and right margins remains unchanged, and the width and height are fixed, which is reflected instoryBoardIn, you don’t set anything, right

  • UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleRightMargin

The left margin, right margin and width are proportionally adjusted, the top margin is fixed, the bottom margin is fixed, and the height is fixed. The vertical direction is the same, so it is not listed

  • UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight

Automatically adjust the width and height of the view to ensure that the left and right margins remain unchanged

As long as we fix both the left and right margins in the horizontal direction, we must not fix the width of the child controlsstoryBoardYou must change the dotted line that controls the width of the child to a solid line. Similarly, if the vertical direction fixes both the top and bottom margins, then we cannot fix the height of the child control (reflected instoryBoardYou must change the dotted line that controls the height of the child to a solid line.

Autoresizing shortcomings

Autoresizing can satisfy most simple layout needs, but it has a fatal flaw. It can only set the subview’s changes relative to the superview, but it can’t specify how much the changes are. Therefore, it is not enough for complex and precise layout needs

Common layout screen adaptation methods

  • Autoresizing
  • AutoLayou
  • VFL
  • Masonry
  • SnapKit