Shulou(Shulou.com)05/31 Report--

How to make a set of code adapt to all iOS device size, I believe many inexperienced people are helpless about this, for this reason this article summarizes the causes and solutions of the problem, through this article I hope you can solve this problem.

Responsive is based on the same set of code, developing an APP can be compatible with the display of multiple size and multi-terminal devices, dynamically adjust the layout of pages and containers, make full use of the size of the current screen, provide better browsing experience for users, and improve APP development efficiency and iteration efficiency.

iOS layout size pre-study

At present, there are five main size types on iOS: iPhone, iPad vertical screen, iPad horizontal screen, iPad floating window, iPad split screen. Typically, apps are developed in iPhone size and need to fit the remaining four iPad size.

iPad horizontal, vertical screen is more common, rotate the device, more special is floating window and split screen mode. Since Apple iPad iOS 9, when users open an app, they can slide up from the bottom to open the Dock and drag another App into floating window mode:

Drag to the edge of a split-screen enabled iPad to turn on split-screen mode:

2. Responsive solutions for iOS

The core of responsive layout is to design uniform adaptation rules, and re-layout according to layout rules when screen size changes to adapt to different screen size. However, most apps generally only adapt to iPhone version when developing. When adapting more models through responsive layout, three problems should be solved, namely, how to obtain and update responsive status for corresponding adaptation, and how to calculate layout parameters such as width and column number of App content under different screen widths. How to process responsive data to solve difficult components and reduce page white space, etc. Based on this, we developed a responsive layout SDK, which is responsible for unified management of responsive state, processing layout logic, clipping mapping data, etc.

1 Responsive App Configuration

In addition to configuring the App as a universal version, some configurations are required to support floating window or split screen mode:

(1) LaunchScreen.storyboard needs to be provided as the startup diagram. Since the App supports too many running size, it is no longer suitable to use pictures as the startup diagram.

(2) You need to configure info.plist to support all screen orientations:

(3) Note that you cannot check the Requires full screen configuration item or configure UIRequiresFullScreen to YES, which will declare that the App requires full screen operation, naturally indicating that floating windows or split screens are not supported:

(4) The main Window of the App that supports split screen requirements needs to use the system UIWindow, which cannot be inherited, and must be initialized by the init method or initWithFrame:[UIScreen mainScreen].bounds.

After the floating window and split screen capability are enabled through the above steps, the device orientation can no longer be controlled through relevant codes in the App. In the past, the ViewController can be controlled to be vertical screen through the following codes, but after supporting split screen, the following methods are no longer called by the system. By default, all ViewControllers support all screen orientations:

The following black methods for forcing screen orientation have also failed:

The main reason for this design is that when an App supports split screens, it no longer occupies the entire screen alone, and when another App runs at the same time, it is impossible to have one horizontal screen and another vertical screen on the same screen. There is no perfect solution to such problems. In order to ensure the user experience, apps that support split screens must adapt all pages to all screen orientations, which also reflects Apple's ultimate pursuit of user experience.

2 Responsive SDK

Responsive state management

Responsive status provides relevant status quantities such as whether responsive is currently enabled, responsive layout size type, current layout window size, etc. Responsive SDK will update responsive status after screen size changes, and notify relevant business parties through system notification and custom notification mechanism.

//Responsive on off status typedefNS_ENUM(NSInteger, YKRLLayoutStyle) { YKRLLayoutStyleNormal =0, //Responsive Status Off YKRLLayoutStyleResponsive =1, //Responsive status enabled}; //Responsive screen size type, according to which pages can distinguish whether to split screens, etc. typedefNS_ENUM(NSInteger, YKRLLayoutSizeType) { YKRLLayoutSizeTypeS =0, // eg. Phone pad floating window YKRLLayoutSizeTypeL =1, // pad YKRLLayoutSizeTypeXL =2, //Reserved}; //Responsive screen status types (there are ten types) typedefNS_OPTIONS(NSUInteger, YKRLLayoutScreenType) { YKRLLayoutScreenTypeUnknown = (1

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.