Понимание мультипликатора в макете автомата для использования относительного позиционирования

Я пытаюсь понять, как можно использовать Auto Layout для позиционирования элементов по отношению к другим представлениям в процентах.

Например, недавно я узнал, что вы можете указать дно представления, должно лежать на 4% выше, чем нижнее нижнее нижнее значение, используя это:

self.view.addConstraint(NSLayoutConstraint(item: label, attribute: .Bottom, relatedBy: .Equal, toItem: self.view, attribute: .Bottom, multiplier: 0.96, constant: 0))

Это имеет смысл для меня, потому что множитель из 1 выравнивает его прямо на дне представления, поэтому вы можете уменьшить эту сумму на 4 процента, изменив множитель на 0,96.

Но как вы можете сделать то же самое в другом направлении? Вы хотите указать верхнюю часть этикетки, которая должна начинаться на 4% вниз сверху. Если вы используете ту же строку, но изменяете атрибуты на .Top, это означает, что она будет на 4% выше, чем верх супервизора (но на самом деле она не сдвигает ее с экрана). Вы не можете иметь отрицательный множитель, я не думаю, и я не верю, что значение больше 1 делает что-либо, когда константа равна 0. Итак, как вы это настроили?

У меня есть тот же вопрос для реализации ведущего и конечного. Трейлинг - это просто. Если вы хотите это на 10% справа:

self.view.addConstraint(NSLayoutConstraint(item: label, attribute: .Trailing, relatedBy: .Equal, toItem: self.view, attribute: .Trailing, multiplier: 0.9, constant: 0))

Это имеет смысл, потому что вы набираете его на 0,1 или 10% вместо того, чтобы полностью выравнивать значение 1.0. Но как вы делаете то же самое для руководства? Я думал, что вы можете установить метку, ведущую относительно трейлинг-представления, а затем установить множитель в 0,1. На мой взгляд, это означало бы, что ярлык начнется очень далеко, а затем набирается на 90%, поэтому получая желаемые 10% слева. Но это не так, я не знаю, почему.

Можете ли вы объяснить, как это работает, как правильно использовать множитель для получения этих относительных макетов?

Чтобы упростить задачу, скажем, вы бы хотели создать ярлык с верхним и нижним 10% высоты надписи и длиной 10% ширины супервизора. На iPhone в портрете будет больше надписи над и под меткой, чем есть прокладка слева и справа от нее, например (да, она нарисована в масштабе):

Но пусть говорят на iPad, это будет показано в представлении, что идеальный квадрат. Поэтому набивка будет одинаковой для всех вокруг, так вот:

Вопрос в том, как вы определяете такие ограничения как динамические по значению, в отличие от установки фиксированного значения для константы. Я уже знаю, как делать дно и трейлинг, но топ и ведущий меня озадачивают. Я надеюсь понять, как использовать множитель для более продвинутых макетов, например, указание вершины этикетки должно лежать на 10% ниже нижней нижней метки, а не устанавливать ее на фиксированную константу.

Ответы

Ответ 1

Есть несколько способов сделать это. В простейшем случае вы уже почти получили это: если вы хотите, чтобы горизонтальные границы были на уровне 10% и 90%, тогда вам нужно указать оба ограничения по отношению к заднему фронту супервизора - поэтому Subview.Trailing блокирует до Superview.Trailing с помощью множителя 0.9, как вы говорите, но затем Subview.Leading также блокируется на Superview.Trailing, просто с множителем 0.1:

(и аналогично для верхнего/нижнего)

С другой стороны, случай, который вы упоминаете в конце, немного сложнее: "указание вершины этикетки должно лежать на 10% ниже нижней метки". Для этого вы, вероятно, не сможете использовать фиксированные процентные вставки, как в предыдущем случае. Вместо этого вы можете создать невидимый проспект между ними: добавьте ограничение с Spacer.Height = 0.1 * Superview.Height, а затем присоедините его между двумя метками. (Вы также можете обрабатывать предыдущий случай с этими представлениями spacer, но в этом случае это не обязательно.)

Ответ 2

По моему мнению: "У вас не может быть отрицательного множителя, я не думаю, и я не верю, что значение, большее, чем 1, когда-либо, когда константа 0, подвергается вашему пониманию отклонения.

Правило под капотом - это просто линейное уравнение:

FirstItem.Attribute1 = (SecondItem.Attribute2 * Multiplier) + Constant

Все измеряется в точках. Как вы видите, множитель (свойство NSLayoutConstraint) не является множителем константы. Следуйте уравнению, то, что вы не понимаете, будет ясным.

Что касается вашего конкретного примера, @Archaeopterasa представила отличное решение, другое показано ниже:

Исходя из того факта, что вы знаете, как делать дно и конечный результат, я полагаю, вы сделали эти два. Затем добавьте еще два ограничения, эффект будет тем, что вы хотите:

Наконец, если вы хотите указать верхнюю метку, лежащую на 10% ниже нижней метки, кажется, что вы не можете реализовать ее без написания строки кода. Вы должны использовать код для установки константы объекта NSLayoutConstraint, соединяющего FirstItem и SecondItem после того, как высота надписи известна во время выполнения.

Во-первых, перетащите элемент управления с одной метки на другую и выберите "Вертикальный интервал". (Или вы можете сделать это другими способами)

Во-вторых, нужна ссылка для ссылки:

@IBOutlet weak var tenPercentOfSuperview: NSLayoutConstraint!

Затем сделайте это в соответствующем месте (например, в viewDidLoad())

let heightOfSuperview = self.view.bounds.height
tenPercentOfSuperview.constant = heightOfSuperview * 0.1

Теперь все в порядке.

Если вы хотите узнать больше об этой теме, рекомендуется использовать документ Apple: https://developer.apple.com/library/ios/recipes/xcode_help-IB_auto_layout/chapters/EditingConstraintAttributesintheAttributesInspector.html

Ответ 3

Здесь

НЕВЕРОЯТНО ПРОСТОЕ

способ сделать это.

Просто добавьте "хелпер" или "меру":

В примере примеры "подсчет калькулятора" являются желтыми.

Общая техника настолько проста и очевидна - ей не нужно никакого объяснения, вы можете получить ее из изображения.

Это один из тех "слонов в комнате", о которых они "не учат вас" в iOS. Но он используется постоянно во всех макетах.

(Действительно, Apple должна была сделать специальный подкласс "UIView" для этой цели - и действительно, многие крупные команды делают именно это с очевидными функциями.)

Значок значка # 1 находится по центру в правом конце вспомогательного представления "Просмотр 1/4".

Значок значка # 3 находится по центру в левом конце вспомогательного представления "Просмотр 3/4".

Вы закончили, имеете Шардоне.

Удобно, в представлениях помощника просто установите множитель на все, что угодно, в зависимости от желаемого ощущения. Невероятно легко изменить их в вашем коде, использовать IBInspectable, анимировать и т.д. И далее...