Detailed explanation of the usage of autoresizing dimension Auto-adaptation in IOS application development _ios

Foreword: Now is not as before the only one size, now the least iphone development needs to fit at least three dimensions. So before we can use hard coordinates to set the position of each control, but now the words are no longer, we need to do a fit, perhaps you say you can use two sets of UI or more than two sets of UI, but that is not efficient and not in line with the design. iOS has two big automatic layout tools: Autoresizing and AutoLayout (AutoLayout is added after IOS6). Autoresizing is a UIView attribute that has been in existence and is relatively simple to use, but not as powerful as AutoLayout. If your interface is simpler and requires less detail, you can use autoresizing to automate the layout. The following will be discussed for autoresizing.

0, autoresizing before the use of the explanation:

Uiviewautoresizing is an enumeration type, which defaults to Uiviewautoresizingnone, which means no processing.

Copy Code code as follows:

typedef ns_options (Nsuinteger, uiviewautoresizing) {
Uiviewautoresizingnone = 0,
Uiviewautoresizingflexibleleftmargin = 1 << 0,
Uiviewautoresizingflexiblewidth = 1 << 1,
Uiviewautoresizingflexiblerightmargin = 1 << 2,
Uiviewautoresizingflexibletopmargin = 1 << 3,
Uiviewautoresizingflexibleheight = 1 << 4,
Uiviewautoresizingflexiblebottommargin = 1 << 5
};

Explanation of each attribute:

In this note, if you are often using Storyboard/xib settings autoresizing, then the transformation of the use of code settings autoresizing, it is easy to understand the error problem. For example Uiviewautoresizingflexibletopmargin, may be mistaken for the top of the distance is not changed, in fact, the bottom distance is unchanged. This solution is also very simple, only need to use the code and the use of storyboard settings autoresizing, they are the opposite, you just have to remember it.

Autoresizing Combination use:

That is, the values in the enumeration can be separated by a function that has multiple values, and can be changed differently for different scenarios. For example:

Uiviewautoresizingflexiblewidth | Uiviewautoresizingflexiblebottommargin
This means that the width of the view is scaled in proportion to the width of the parent view, and the distance from the top of the parent view remains unchanged.

Other combinations are similar, and I'm not going to list them here.

Attention:

1 if the Autoresizessubviews property of view is yes (the default is yes), the autoresizing will not take effect.

2 starting from XCODE6, storyboard&xib the default is automatic layout, so we need to manually adjust to use autoresizing.

The concrete operation as the figure (open storyboard file, you will see the following diagram interface):

Here will be a simple example to give you a more intuitive understanding, and will be at the end of this article with a demo download address, please continue to watch OH.

Demo:

1 The top of the distance from the parent view is unchanged

2 width is stretched by parent view scale

3 view is the same as the left and right margin of the parent view

Using code to control Autoresizingmask

The following are the macros that the project uses:

Copy Code code as follows:

#define TOPSPACE 64
#define Kmargin 20

#define Ktopviewheight 44
#define KTOPVIEWWIDTH 300

#define KTEXTLABELWIDTH 200
#define Ktextlabelheight 30

No code prior to adaptation:

Copy Code code as follows:

Sets the position of each control based on Iphone4 (320, 480)
Note: All controls must be initialized one at a time based on Iphone4 (320, 480), or the error will occur if scaled proportionally!
UIView *topview = [[UIView alloc] Initwithframe:cgrectmake (Kmargin, Topspace, Ktopviewwidth, Ktopviewheight)];
CGFloat textlabeltop = (topview.frame.size.width-ktextlabelwidth)/2;
CGFloat textlabelwidth = (topview.frame.size.height-ktextlabelheight)/2;
Uilabel *textlabel = [[Uilabel alloc] Initwithframe:cgrectmake (Textlabeltop, Textlabelwidth, Ktextlabelwidth, Ktextlabelheight)];

Set Text and center
[Textlabel settext:@ "Garvey"];
[Textlabel Settextalignment:nstextalignmentcenter];

Set styles separately
[TopView Setbackgroundcolor:[uicolor Redcolor]];
[Textlabel settextcolor:[uicolor whitecolor]];//Add view
[TopView Addsubview:textlabel];
[Self.view Addsubview:topview];

It will show:

Use Autoresizing for interface adaptation:

Add: You can initialize the controls on the interface by other device sizes first, because the autoresizing will change with the parent view.

Copy Code code as follows:

Sets the position of each control based on Iphone4 (320, 480)
Note: All controls must be initialized one at a time based on Iphone4 (320, 480), or the error will occur if scaled proportionally!
UIView *topview = [[UIView alloc] Initwithframe:cgrectmake (Kmargin, Ktopspace, Ktopviewwidth, Ktopviewheight)];
CGFloat textlabeltop = (topview.frame.size.width-ktextlabelwidth)/2;
CGFloat textlabelwidth = (topview.frame.size.height-ktextlabelheight)/2;
Uilabel *textlabel = [[Uilabel alloc] Initwithframe:cgrectmake (Textlabeltop, Textlabelwidth, Ktextlabelwidth, Ktextlabelheight)];

Set Text and center
[Textlabel settext:@ "Garvey"];
[Textlabel Settextalignment:nstextalignmentcenter];

Set styles separately
[TopView Setbackgroundcolor:[uicolor Redcolor]];
[Textlabel Settextcolor:[uicolor Whitecolor]];

To set the width of a text control to scale by the ratio of the previous view (TopView)
[Textlabel Setautoresizingmask:uiviewautoresizingflexiblewidth];
Sets the width of the view control to scale in proportion to the parent view, away from the top, left, and right margins of the parent view
[TopView setautoresizingmask:uiviewautoresizingflexiblewidth | Uiviewautoresizingflexiblebottommargin | Uiviewautoresizingflexiblerightmargin | Uiviewautoresizingflexibleleftmargin];

Add a View
[TopView Addsubview:textlabel];
[Self.view Addsubview:topview];

Note: The code to reset the TopView position must be written in the back of the add view, or the autoresizing position calculation will be wrong!
CGFloat topviewwidth = Kuiscreen.size.width-kmargin * 2;
[TopView Setframe:cgrectmake (Kmargin, Ktopspace, Topviewwidth, Ktopviewheight)];

Final display:

Second, in the storyboard control Autoresizingmask

Autoresizingmask either implemented in storyboard or implemented in code, is essentially six lines.

The use of Autoresizingmask in storyboard requires that AutoLayout be disabled.

As shown in figure:

There are six lines in the diagram (the distance between the top and bottom to the periphery and the inner two lines).

If one of the top and bottom lines is selected, the distance from the parent control's bounds is unchanged.

For example, the line on the left and the top of the diagram indicates that the blue view distance from the left and top edges of the self.view is unchanged.

If you select both the top and bottom of the line, then the behavior will be the same as the left line selected, it is the default behavior.

If you want the child control size to change with the size of the parent control, you need to use the inner two lines. The inner line indicates that the control is allowed to stretch in both horizontal and vertical directions. If you do not select an inner line, you do not want the control to stretch, which is fixed size.

That is, the surrounding line is selected to indicate a fixed distance, and the inner line is checked to allow stretching.

If you set Autoresizingmask with code, you will find that the Autoresizingmask property of a view is an enumeration:

Copy Code code as follows:

Uiviewautoresizingnone = 0,
Uiviewautoresizingflexibleleftmargin = 1 << 0,
Uiviewautoresizingflexiblewidth = 1 << 1,
Uiviewautoresizingflexiblerightmargin = 1 << 2,
Uiviewautoresizingflexibletopmargin = 1 << 3,
Uiviewautoresizingflexibleheight = 1 << 4,
Uiviewautoresizingflexiblebottommargin = 1 << 5

Except the first one is none, the remaining six corresponds to the six lines in the storyboard.

Watch the top.

Copy Code code as follows:

Uiviewautoresizingflexiblewidth
Uiviewautoresizingflexibleheight

This is exactly the same as the two antennas within the storyboard set in the Autoresizingmask: the width and height of the stretch.

The rest needs to be noted:

Copy Code code as follows:

Uiviewautoresizingflexibleleftmargin
Uiviewautoresizingflexiblerightmargin
Uiviewautoresizingflexibletopmargin
Uiviewautoresizingflexiblebottommargin

In storyboard, if the surrounding line is selected, the distance is fixed. For example, I checked the left side of the line, so that I want to the left of the distance fixed, so in the code I should choose Uiviewautoresizingflexiblerightmargin, that means the right side of the distance is not fixed, then the default left of the distance fixed.

The disadvantage of Autoresizingmask is that only the relationship between the parent control and the child control is guaranteed, and the relationship between the sibling controls is not guaranteed, which means that some requirements, autoresizingmask, are not possible. More energy should be put on the AutoLayout.