Центрирование двух кнопок с помощью Cocoa Автоматическая компоновка

У меня проблема с Cocoa Автоматом и не могу решить эту проблему. Все, что я хотел бы достичь, состоит в том, чтобы иметь две кнопки, всегда центрированные в виде, как показано ниже.

enter image description here

Я пробовал много разных подходов без всякого успеха:( пожалуйста, помогите мне здесь.

Ответ 1

Другим трюком для этого является выравнивание правой части button на половину размера пространства от центра superview, а в левой части button2 - половину размера вдали от центра superview.

Это действительно работает, только если у вас есть супервизор, который окружает только два вида, которые вы хотите центрировать.

Ответ 2

Я пишу это из памяти, поэтому, надеюсь, вся информация правильная. Я использую XCode5. Вот как я закончил это, начиная с каких-либо ограничений:

  • Выберите обе кнопки и добавить ограничения, чтобы установить их высоту и ширина в окне "Добавить новые ограничения", доступное из второго в правом нижнем углу холста IB.

  • Если обе кнопки по-прежнему выбраны добавить ограничения, чтобы установить их Y положение. Либо пробел выше, либо пробел ниже в окне "Добавить новый" Окно Constraints.

  • Теперь выберите Button 1 и добавьте ограничение выравнивания "Горизонтальное Центр в контейнере в окне "Добавить новые выравнивания" доступный с первой кнопки внизу справа от холста IB. По умолчанию "постоянное" значение добавленного ограничения равно 0. Мы хотите изменить это, потому что это неправильно.

  • В этот момент кнопка 1 будет иметь желтую полосу, работающую вертикально через это. Это предупреждение, указывающее, что горизонтальный центр кнопки не равна горизонтальному центру контейнера + константа ограничения (0). число на вертикальной панели - это расстояние от центра кнопки. Помните это число.

  • Или дважды щелкните вертикальную желтую полосу на кнопке 1 (ловкость требуется) или выберите кнопку 1, перейдите в левую панель и нажмите линейка и "выберите и отредактируйте" ограничение, называемое "Выровнять центр X" в:".

  • Введите число с шага 4 в текстовое поле с надписью "константа" . Теперь кнопка 1 удовлетворяет всем ограничениям, которые необходимы для ее дисплей. Он имеет ширину, высоту, Y (верхнее пространство или нижнее пространство ограничение), а теперь X (горизонтальное выравнивание по центру). Кнопка 2, однако по-прежнему отсутствует его позиция X, которую он может отключить Кнопка 1.

  • Выберите кнопку 2, перейдите в окно "Добавить новые ограничения" и просто установите ведущее место для кнопки 1 (левая полоса от верхнего белого блока).

Теперь вы должны иметь две кнопки, которые всегда будут находиться в центре их контейнера на фиксированной ширине друг от друга.

Ответ 3

Чистый трюк с Автоматом - использовать невидимые представления в качестве прокладок. Система ограничений все еще выставляет их как обычно. В этом случае это пространство между двумя кнопками может быть невидимым. Вы можете использовать ограничения из этой строки ограничения:

@"[button][invisibleView(5)][button2(==button)]"

Затем создайте настройку ограничения invisibleView.centerX = superview.centerX.

Ответ 4

Если у вас есть фиксированные кнопки ширины и вы хотите установить фиксированное расстояние между двумя, то следующие шаги могут выполнить работу:

  • добавить Width и Height constraint в button1 Пример значения: 100 height и 100 width.
  • выберите обе кнопки и добавьте constraint Equal Widths и Equal Heights.
  • добавьте Horizontal Spacing между button1 и button2. или мы можем сказать, добавьте Leading Space в button2 из button1. Пример: 150
  • выберите button1 и добавьте constraint Horizontally in Container значение -125.
  • добавить другие constrains как Vertical Spacing to Container и т.д. по мере необходимости.

Пример значения 125 равен (button1 Width/2) + (Horizontal Spacing/2), который равен 100/2 + 150/2 = 125.

Таким образом, добавление Horizontal in Container в -125 приведет к перемещению buttons влево, и это сделает этот центр макета на экране.

Ниже приведены примеры компоновки и ограничений: Пример макета

Ограничения на button1

Ответ 5

В принципе, у меня есть два UIButtons внутри моего UITableViewCell, расположенного ниже, который должен быть всегда центрирован и с одинаковой шириной. Вот как я работал в Xcode 7.2. Я использую Swift, кстати, если это так или иначе связано.

  • В левой кнопке я дал ей ведущие и нижние ограничения
  • В правой кнопке я дал ей конечные и нижние ограничения
  • В правой кнопке я дал ей ведущее пространство левой кнопки
  • Наконец, в моей правой кнопке я дал ей ограничения равной ширины левой кнопки.
  • Готово.

Ответ 6

Вы также можете сделать так, как показано ниже.

1.Take Ведущее место для левой кнопки, Промежуточное пространство для правой кнопки.
2. Конструировать розетки как для ведущих, так и для трейлинг-ограничений.

 __weak IBOutlet NSLayoutConstraint *leadingConstraint;
 __weak IBOutlet NSLayoutConstraint *trailingConstraint;

3. Определите константы каломерации, как указано ниже.

NSInteger constant = (SCREEN_WIDTH - (CGRectGetWidth(leftButton.frame) + CGRectGetWidth(rightButton.frame))) / 3;
    leadingConstraint.constant = constant;
    trailingConstraint.constant = constant;

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

Ответ 7

Отличные советы. В моем случае я хотел, чтобы кнопки были центрированы на 10 пикселей отдельно от центра моего представления, поэтому моя математика немного отличается

leadingConstraint.constant = (self.frame.size.width / 2.0) + 5.0;
trailingConstraint.constant = (self.frame.size.width / 2.0) + 5.0;