UIStackview выровнять по левому краю

Я пытаюсь выровнять элементы в UIStackview по горизонтали слева.

Есть ли способ сделать это программно? Я пытался сделать это с помощью раскадровки, но безуспешно. По какой-то причине элементы в UIStackView центрируются сами по себе.


person Yong Jia Pao    schedule 28.12.2016    source источник
comment
Я надеюсь, что этот ответ будет вам полезен. Вам нужно применить тот же подход, но по горизонтали, а не по вертикали.   -  person Ahmad F    schedule 28.12.2016


Ответы (6)


Если вы используете для свойства оси StackView значение «Горизонтально», я думаю, вы не сможете выровнять его по левому краю.

Но есть способ сделать его левым визуально.

  1. установить ведущее ограничение StackView с отношением «равно»
  2. установите конечное ограничение StackView со значением «больше или равно»

как это

stackView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
stackView.trailingAnchor.constraint(greaterThanOrEqualTo: view.trailingAnchor).isActive = true
person shtnkgm    schedule 07.02.2018
comment
Это сработало для меня, чтобы элементы выравнивались по левому краю с желаемым интервалом между элементами. - person Augie; 13.05.2018
comment
Отличное решение! Если вы работаете с раскадровкой и ограничениями, у вас возникнут некоторые проблемы. Просто поместите заполнитель, который вы удалите во время выполнения, чтобы скрыть эту проблему. - person Tom; 26.07.2018

Попробуйте добавить одно представление пространства в представление стека, например

 // To Make Our Buttons aligned to left We have added one spacer view
    UIButton *spacerButton = [[UIButton alloc] init];
    [spacerButton setContentHuggingPriority:UILayoutPriorityFittingSizeLevel forAxis:UILayoutConstraintAxisHorizontal];
    [spacerButton setContentCompressionResistancePriority:UILayoutPriorityFittingSizeLevel forAxis:UILayoutConstraintAxisHorizontal];
    [self.buttonsStackView addArrangedSubview:spacerButton];

И сделать

self.buttonsStackView.distribution = UIStackViewDistributionFill;
person Ankit Maurya    schedule 09.05.2018
comment
Я обнаружил, что простое добавление пустого UIView отлично работает - person Andy Weinstein; 22.12.2020

Тестирование Swift 4.2 + iOS 12.1:

    let stackView: UIStackView = UIStackView(frame: .zero)
    stackView.translatesAutoresizingMaskIntoConstraints = false
    stackView.axis = .vertical
    stackView.alignment = .leading // <- aligns each of your items to the left. 

    // further setup + setup constraints
    // ...
person Baran Emre    schedule 31.10.2018
comment
stackView.translatesAutoresizingMaskIntoConstraints = false это помогло иметь чистый журнал без предупреждений uisv-spacing о нарушенных ограничениях - person Serj Rubens; 07.05.2019
comment
Выравнивание leading недоступно при настройке в раскадровке? - person Hemang; 04.12.2019
comment
@Hemang Я могу ответить на твой вопрос. Я только строю свои представления в коде. Но вы могли бы сделать следующее. Создайте представление стека с помощью раскадровки, свяжите его с кодом и настройте представление стека в коде, а не в раскадровке. - person Baran Emre; 05.12.2019
comment
Спасибо @BaranEmre за подсказку. - person Hemang; 06.12.2019
comment
.leading работает только с .vertical, а вопрос по горизонтали - person beryllium; 19.10.2020

Используйте свойство UIStackView.alignment.

Ссылка: https://developer.apple.com/reference/uikit/uistackview/1616243-alignment

person crizzis    schedule 28.12.2016

Спасибо за совет, ребята. Я пытался играть с параметрами в UIStackView.alignment, но это никогда не работало так, как хотелось бы. В конце концов я напортачил с шириной UIStackView, чтобы добиться желаемых результатов.

if(prdDTO.getShellIcn() == "Y")
    {
        let icon = UIImageView()
        icon.contentMode = UIViewContentMode.scaleAspectFit
        icon.image = #imageLiteral(resourceName: "Shellfish")
        prdIngredients.addArrangedSubview(icon)
        stackviewWidth += 25
    }

    if(prdDTO.getVegeIcn() == "Y")
    {
        let icon = UIImageView()
        icon.contentMode = UIViewContentMode.scaleAspectFit
        icon.image = #imageLiteral(resourceName: "Vege")
        prdIngredients.addArrangedSubview(icon)
        stackviewWidth += 25
    }

    if(prdDTO.getSpicyIcn() == "Y")
    {
        let icon = UIImageView()
        icon.contentMode = UIViewContentMode.scaleAspectFit
        icon.image = #imageLiteral(resourceName: "Spicy")
        prdIngredients.addArrangedSubview(icon)
        stackviewWidth += 25
    }

    prdIngredients.widthAnchor.constraint(equalToConstant: CGFloat(stackviewWidth))
person Yong Jia Pao    schedule 29.12.2016

Раскадровка

  1. Нажмите Attributes Inspector
  2. Выберите Trailing в раскрывающемся меню, когда выбрано Alignment.

Программно

  1. Измените свойство UIStackView.alignment при инициализации.
person Will Boland    schedule 28.12.2016