Screen Adaptation size class

Screen Adaptation size class
1. Three Dimension types (size class)

If the screen length and width are divided into three types by length (size class on the official website): compact, any (any), regular (regular ), there are nine types of combinations of length and width. Here I call each type a pattern.

In addition, the screen status can be divided into many situations based on the size and direction. The Mode corresponds to the status of the screen, either one-to-one or one-to-many. For example, a mode is called any mode, that is, the length is arbitrary, and the width is arbitrary. This mode can correspond to all the screen states.

You can define the layout of the interface in different modes. When the app is running, it checks the screen status (screen size and screen direction) of the device to determine the layout in which mode to use.
Controls and constraints added in "any mode" take effect in all modes.
Controls and constraints added in a mode are private in this mode.
The most efficient way is to adapt the layout in any mode to all screen states. But sometimes, due to the limitation of the displayed content, the layout of different sizes, or horizontal and vertical screens may be quite different, and sometimes the control may be increased or decreased. In this case, we need to separate different modes to deploy the user interface.

2. mode switching

Mode switching is implemented through the size class tool in. The text at the bottom of the tool shows the screen status (screen size, landscape screen, or landscape screen) that the mode applies ). Note that the number of grids indicates the size type. The number of grids in the horizontal direction indicates the size type of the width, and the number of grids in the vertical direction indicates the size type of the height. The number of grids corresponding to compact, any, and regular is one, two, and three respectively.

VcHLoaPOqsHLsry + 1rXEyrG68r + 0tcPK5rf + o6y/large + large/large + DQo8cD48aW1nIGFsdD0 = "here write picture description" src = "http://www.bkjia.com/uploads/allimg/160423/0420214459-1.png" title = "\"/>

The relationship between the screen status and the wide and high size types mentioned above is shown in the following table (from the official website of Apple ):

3. View display in different modes

As mentioned above, we need to separate different modes for layout. the horizontal and vertical screens are very different and may even increase or decrease views. In this case, the view may need to be displayed in a certain mode, but not in a certain mode. Set whether the view is displayed in a certain situation, as shown in (you need to click the view to be set first ). If you select "Installed", the view is displayed in "any mode", or click "+", select a mode, and check "Installed" to determine whether the view is displayed in this mode.

4. display of slices of different modes

To adapt to different modes, a single image may require multiple versions. In this case, Assets. xcassets are used to manage these images. Create an Image Set. On the right side of the Image Set, you can select the desired device:

You can also select Width and Height to combine different modes, and then provide the corresponding image version for some modes according to the actual situation. Enter the corresponding image in the corresponding mode. An Image Set that contains several modes is displayed. The figure indicates the meaning of the identifier:

5. User-triggered screen status changes

The screen status has been mentioned many times, including screen size and screen direction. This information is encapsulated into a class-UITraitCollection.
After the user changes the screen status (horizontal screen, vertical screen, and other actions), the following actions occur:
(1) When the screen status changes, UIKit will call this method to notify various view controllers.
WillTransitionToTraitCollection: withTransitionCoordinator:
(2) when the size of the View Controller is about to change, UIKit calls
ViewWillTransitionToSize: withTransitionCoordinator:
(3) When the screen status changes, UIKit calls
TraitCollectionDidChange:

The parent controller can fix its subview controller mode so that it is not affected by changes in the screen status. There are two ways to achieve this (iOS 8.0 and later ):

-(void)setOverrideTraitCollection:(UITraitCollection *)collection?            forChildViewController:(UIViewController *)childViewController`

-(UITraitCollection *)overrideTraitCollectionForChildViewController:(UIViewController *)childViewController