создание авто Resizeable представления для различных размеров экрана в интерфейсе строителе Xcode 8, с использованием автоматической компоновки с использованием умножителей

Question

Я пытался добиться этого с помощью Autoresizing в IB, используя constraints, такие как

• пиннинга,
соотношения
• сторон ,
• вертикальное расстояние между ними,
• горизонтальное/вертикальное расстояние между ними,
• ведущей/ведомой пространство;

, но никто не работает равномерно для всех размеров экрана.

Например

4 вида изображения в iphone 7 это необходимые позициях вывода для них, но как только я проверить его в iphone 7 plus размере экрана или iphone SE размера экрана, эти представления изображения изменить позицию.

ниже ожидаемый выход как на Iphone 7.

iphone7 Изображение

Ниже приводится не ожидается выход как positon изменения просмотров 4 изображений на iphone 7 плюс. iphone7plus

Я хочу еще одно изображения на долю iPhone SE, в котором positon из всех 4 вида изображений изменяются более резко, но не в состоянии разделить причины репутации менее 10

Я объясню, например, с 1-го изображения, т.е. iphone 7, эти 4 маленьких изображения можно рассматривать как ожидаемое положение вместе с представлением изображения на белом фоне, но в других двух размерах экрана (iphone7 plus и iphoneSE) все виды (4 маленьких им возраст и вид с белым задним основанием) должен иметь , расположенный и , масштабированный соответственно по сравнению с внешним видом на первом.

Обновление: код добавлен Я просто сделал некоторые изменения в одном из ответа я получил в этом посте @diana_prodan, чтобы получить ожидаемый результат.

import UIKit 

class ViewController: UIViewController { 

@IBOutlet weak var imgOne: UIImageView! 

@IBOutlet weak var imgTwo: UIImageView! 

@IBOutlet weak var imgThree: UIImageView! 

@IBOutlet weak var imgFour: UIImageView! 

let icon_small : Float = 45.0 
let icon_medium : Float = 50.0 

override func viewDidLoad() { 
    super.viewDidLoad() 

    let viewSize = UIScreen.main.bounds.size 
    print(viewSize) 
    //image positioned 
    //for 4' screen 
    if (viewSize.height == 568.0){ 
     addImageAtPosition(imgOne, icon_small,41, 106) 
     addImageAtPosition(imgTwo, icon_small,105,91) 
     addImageAtPosition(imgThree, icon_small,105, 147) 
     addImageAtPosition(imgFour, icon_small,139, 197) 
    //for 4.7' screen 
    }else if(viewSize.height == 667.0){ 
     addImageAtPosition(imgOne, icon_medium,52, 135) 
     addImageAtPosition(imgTwo, icon_medium,127,106) 
     addImageAtPosition(imgThree, icon_medium,127, 172) 
     addImageAtPosition(imgFour, icon_medium,167, 230) 
    //for 5.5' screen 
    }else if(viewSize.height == 736.0){ 
     //add code woth cordinates for 5.5 screen size iPhone 
    } 
} 
//method to positon image views 
func addImageAtPosition(_ img:UIImageView, _ size: Float, _ y: Float, _ x: Float) { 
    let imageView = img 
    imageView.translatesAutoresizingMaskIntoConstraints = false 
    self.view.addSubview(imageView) 

    let imageSize: CGFloat = CGFloat(size) 

    let topConstraint = NSLayoutConstraint(item: imageView, attribute: .top, relatedBy: .equal, toItem: self.topLayoutGuide, attribute: .bottom, multiplier: 1, constant: CGFloat(y)) 

    let leftContraint = NSLayoutConstraint(item: imageView, attribute: .left, relatedBy: .equal, toItem: self.view, attribute: .left, multiplier: 1, constant: CGFloat(x)) 

    let widthConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: imageSize) 

    let heightConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: imageSize) 

    view.addConstraints([topConstraint, leftContraint, widthConstraint, heightConstraint]) 
} 

}

проблема с этим кодом, я должен получить координаты для всех просмотров изображения просмотра на экранах любого размера и жёстко его, что это не очень хорошая практика, я думаю

Answer 1

Для получения идеальной ожидаемого результата, я пошел к этой ссылке [ССЫЛКА]: https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/AutolayoutPG/AnatomyofaConstraint.html, поэтому все, что я должен был это

• выберите один из вида и удерживайте CTRL + перетаскивание на внешний вид
• затем удержания сдвига и выберите ширину, равную & ровная высота, центр горизонтально в контейнере & центр вертикально в контейнере.
• затем выбора каждой ТРУДНОСТЬ линии (желтый цвет) или из зрения колонки контроллера сцены и изменение множителя до желтого цвета линии стала синим т.е. до он удовлетворяет положение, в котором я положил свои взгляды изображения первоначально в виду контроллер.

here is the screen shot link it shows where to select constraints one by one(on left) and modify multiplier(on right).

Answer 2

Возьмите Вид A с половиной высоты. Ограничьте высоту основного вида.После этого дайте все изображения одинаковой высоты и ширины. задайте x, y изображения одного изображения с центром зрения A. и связать все изображения, установленные defullts constrain.

Answer 3

Вы должны установить случайные значения для верхних и левых ограничений ваших ImageViews.

func addImageAtRadomPosition() { 
    let imageView = UIImageView() 
    imageView.backgroundColor = UIColor.red 
    imageView.translatesAutoresizingMaskIntoConstraints = false 
    self.view.addSubview(imageView) 

    let imageSize: CGFloat = 50.0 
    let screenHeight = UIScreen.main.bounds.size.height 
    let screenWidth = UIScreen.main.bounds.size.width 

    // Get random values which will be used for top and left constraints 
    let randomYPosition = Int(arc4random_uniform(UInt32(screenHeight - imageSize))) 
    let randomXPosition = Int(arc4random_uniform(UInt32(screenWidth - imageSize))) 

    let topConstraint = NSLayoutConstraint(item: imageView, attribute: .top, relatedBy: .equal, toItem: self.topLayoutGuide, attribute: .bottom, multiplier: 1, constant: CGFloat(randomYPosition)) 
    let leftContraint = NSLayoutConstraint(item: imageView, attribute: .left, relatedBy: .equal, toItem: self.view, attribute: .left, multiplier: 1, constant: CGFloat(randomXPosition)) 
    let widthConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: imageSize) 
    let heightConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: imageSize) 

    view.addConstraints([topConstraint, leftContraint, widthConstraint, heightConstraint]) 
} 

этот метод вызывается как столько раз, сколько Сочти ImageViews

for _ in 0...5 { 
    addImageAtRadomPosition() 
} 

Answer 4

Если это ваш ожидаемый результат, то сообщите мне, так что я могу описать, как добиться этого, и если нет, то описать, что мне еще вы ожидаете.

комментарий ниже.

редактировать

Когда я запускаю тот же VC в iPhone 6+ я получил ниже выхода. Поэтому рассмотрим этот результат.