IOS: как выровнять центр просмотра с нижней стороны другого вида с помощью AutoLayout

Ответ 1

Есть много способов сделать это. Я просто покажу один из способов.

ОК, сделайте это шаг за шагом.

Шаг 1

Во-первых, чтобы выровнять центр овального изображения с нижней частью прямоугольного изображения, нам нужно встроить прямоугольный вид в другое представление, в котором мы могли бы назвать Container View.

Этот вид контейнера будет иметь атрибуты ff:

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

Для ограничений вида контейнера:

• Ведущий равен супер-представлению, ведущему
• верхнее пространство для супер-просмотра - 0
• Центрируется горизонтально в режиме супер-просмотра.
• установить соотношение сторон с самим собой.

Как только вы закончите, ограничения будут выглядеть следующим образом.

Шаг 2

Теперь для представления прямоугольного изображения ограничения будут:

• Ведущее значение соответствует представлению контейнера
• Верхнее пространство для представления контейнера равно 0
• Трейлинг равен завершению представления контейнера.

• Установить соотношение сторон с овальным изображением

  • Установив формат изображения с овальным изображением. Изменение размера этого прямоугольного вида будет пропорционально изменению размера овального вида.

Он будет выглядеть следующим образом:

Шаг 3

На этот раз контуры овального вида:

• по горизонтали в виде контейнера
• по вертикали также в виде контейнера

• установить соотношение сторон с self

  • Настройка аспекта с помощью self гарантирует, что при увеличении размера прямоугольного представления изменение размера овального представления не приведет к искажению.

Это будет результат:

Шаг 4

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

Манекен-представление будет иметь атрибуты ff:

• прозрачный цвет фона
• Значение ширины и высоты должно быть 1

Пункты фиктивного представления:

• по вертикали в представлении контейнера
• по горизонтали в виде контейнера
• ширина и высота фиксированы.
• назначить вертикальное расстояние с прямоугольным представлением

Вот как это должно быть сделано:

Хорошо, если вы сделали шаги выше, вы достигнете эффекта.

Это будет обзор ограничений:

Надеюсь, это поможет.:)

Доказательство того, что это работает!

Я запустил его в симуляторе...: D

iPhone 4:

iPhone 5:

iPhone 6:

iPhone 6 Plus:

Ответ 2

Шаг 1. Создайте свои представления, как показано ниже.

Шаг 2: Установите ограничения фонового представления для всех трех ребер.

Шаг 3: Установите собственное соотношение. Поскольку вы упомянули, что вы не знаете высоту.

Шаг 4. Выберите вид центра и добавьте ограничения ширины и высоты, как вы хотите.

Шаг 5: установите центральное представление в виде горизонтального центра в режиме супервизора, как показано ниже.

Шаг 6: Теперь выберите фон и вид в центре. Установите ограничение выравнивания на "Вертикальные центры".

Шаг 7: Теперь вы можете увидеть ограничение с предупреждением с неправильной константой, как показано ниже. Выберите это ограничение

Шаг 8: В инспекторе подключений выберите "второй элемент" и измените его на "внизу"

Шаг 9: Это. Если есть предупреждение, обновите свои ограничения. Вы можете проверить различные симуляторы с любыми размерами экрана.

Для этого вам не нужны супервизоры или новый брат. Легкий способ сделать любой вид в центре и сохранить его как снизу/сверху другого вида.

Ответ 3

Это может вам помочь. Полностью основанный на AutoLayout, дополнительный просмотр не требуется.

• Сначала установите некоторые ограничения на высоту и ширину и расположение изображения обложки. (синий)

Это 0,4 общей высоты, равной ширине ширины, вы можете видеть ее ограничения.

• Затем я фиксирую высоту и ширину изображения Avatar (зеленое), сделайте его горизонтально по ширине.

Затем выберите изображение обложки и изображения аватара, сделайте их выравниванием нижнего края.

Теперь он превращает это.

• На последнем шаге выберите "Выровнять снизу на обложку" и сделайте константу равной половине высоты изображения "Аватар". Готово!

Это самый простой способ, который я нашел сейчас.

Ответ 4

вам необходимо применить ограничения автоопределения по отношению к вашему изображению не с вашим видом. Чтобы получить более подробную информацию https://www.raywenderlich.com/115444/auto-layout-tutorial-in-ios-9-part-2-constraints

Ответ 5

Сначала я бы разместил фоновое изображение и сначала WHILE HODLING SHIFT вручную перетащил его, пока он не станет правильным размером. THEN коснитесь | o | в правом нижнем углу экрана я бы снял флажок с поля и оставил 0, верхний 0, правый 0, а затем нижний должен быть большим числом (должен автоматически генерировать для вас)

теперь разместите второй UIImage... поместите его и размер его, как вам нравится... теперь на той же иконке | o | коснитесь этого и дайте ему высоту и ширину... добавьте ограничения... теперь переходите к 2-му последнему слева (например, к двум уложенным прямоугольникам).. коснитесь этого и коснитесь "горизонтально в контейнере... СЕЙЧАС нажмите уменьшите изображение и удерживайте управление и перетащите на большее изображение и отпустите... нажмите вертикальное расстояние...

ПОСЛЕДНЕЕ.... значок справа, который выглядит как | o | но имеет треугольник... пока выбрано одно из изображений... коснитесь нижних "кадров обновления"

Ответ 6

Если у вас есть 2 вида (фиксированный и плавающий), а ваш поплавок имеет фиксированную высоту, вы можете установить вертикальное пространство от плавающего до фиксированного со значением -height/2. пример: если ваша кнопка имеет высоту 20, тогда установите вертикальное пространство для фиксированного просмотра со значением -10