IOS Development Full Model adaptation solution _ios

Source: Internet
Author: User
Tags uikit

The recent project, for the iphone model adaptation is very headache, so tidy up the online data, recorded, may be able to help you read the article,

I'm going to talk to you today about the full model fit idea of the latest research.

Currently, we need to adapt to the iphone models are 4s, 5s, 6s, 6Plus four kinds of models. Their size is

iphone4s {320, 480} 960*640
Iphone5 5s {320, 568} 1136*640
Iphone6 6s {375, 667} 1334*750
Iphone6plus 6sPlus {414, 736} 1920*1080

And generally I am accustomed to in the actual project development, use Masonary to build UI interface, although in masonary we can easily set the constraints between the controls, but for similar 4s models and 6s Plus models of large height difference, Sometimes only by a one-time molding constraints or build a very reasonable interface.

So in the process of building the UI, one of my ideas is to follow the scale, for each model fine-tuning. Ideas are as follows:

The artwork provided by the artist is based on the IPhone6 effect chart

And I just need to compare each dimension on the callout to IPhone6, so that some spacing will be different depending on the size of the model.

For controls that consider the interaction experience, fine-tune the details on the basis of keeping the dimensions unchanged.
In the specific code, I encapsulate a class that defines two classes of methods to fit the height and width of all models. The idea is that the above according to the different models for the proportion of IPhone6 and fit.

Code I also posted part out.

Definition of header file

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

typedef ns_enum (Nsinteger, Iphonetype) {
  Iphone4type = 0,
  iphone5type,
  iphone6type,
  iphone6plustype
};

@interface calculatelayout:nsobject

/**
 * Full-model height fit for IPhone6 design based on UI design *
 * @param height View Heights
 *
 * @return Suitable height * *

(cgfloat) Neu_layoutforalliphoneheight: (cgfloat);
/**
 * Full model width fit for IPhone6 design based on UI design * *
 *
 @param width Width
 * *
 * @return the appropriate widths * *
 *
( CGFloat) Neu_layoutforalliphonewidth: (cgfloat) width;

The parts of the. m file are as follows:

#define Iphone4height (480.F) #define IPHONE4WIDTH (320.F) #define IPHONE5HEIGHT (568.F) #define IPHONE5WIDTH (320.F) # Define Iphone6height (667.F) #define IPHONE6WIDTH (375.F) #define IPHONE6PLUSHEIGHT (736.F) #define IPHONE6PLUSWIDTH (414
  . f) #pragma mark-fit all models height + (cgfloat) Neu_layoutforalliphoneheight: (cgfloat) Height {cgfloat layoutheight = 0.0f;
  if (iPhone4) {layoutheight = (height/iphone6height) * iphone4height;
  else if (iPhone5) {layoutheight = (height/iphone6height) * iphone5height;
  else if (iPhone6) {layoutheight = (height/iphone6height) * iphone6height;
  else if (iphone6p) {layoutheight = (height/iphone6height) * iphone6plusheight;
  else {layoutheight = height;
return layoutheight;
  } + (CGFloat) Neu_layoutforalliphonewidth: (cgfloat) Width {cgfloat layoutwidth = 0.0f;
  if (iPhone4) {layoutwidth = (width/iphone6width) * iphone4width; else if (iPhone5) {layoutwidth = (width/iphone6widTH) * IPHONE5WIDTH;
  else if (iPhone6) {layoutwidth = (width/iphone6width) * iphone6width;
  else if (iphone6p) {layoutwidth = (width/iphone6width) * iphone6pluswidth;
return layoutwidth;

 }

The code I have also put on the GitHub, if it helps you, can give a star in the clone code.

Thank you for reading, I hope to help you, thank you for your support for this site!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.