StackView не выравнивается по левому краю программно - PullRequest
Новая
       55

StackView не выравнивается по левому краю программно

0 голосов
/ 21 ноября 2018

Мой StackView, который я создаю программно, выглядит следующим образом:

Два подпредставления:

Три подпункта:

Четыре подпункта:

Это мой код: 

    cameraButton.setImage(UIImage(named: "blueCamera"), for: .normal)
    cameraButton.addTarget(self, action: #selector(cameraTapped), for: .touchUpInside)
    cameraButton.widthAnchor.constraint(equalToConstant: 70.0).isActive = true
    calenderButton.setImage(UIImage(named: "calender"), for: .normal)
    calenderButton.addTarget(self, action: #selector(calanderTapped), for: .touchUpInside)
    calenderButton.widthAnchor.constraint(equalToConstant: 70.0).isActive = true

    stackView.frame = CGRect(x: 0, y: 0, width: scrollView.frame.size.width, height: scrollViewHeight)
    stackView.axis = .horizontal
    stackView.spacing = 5
    stackView.semanticContentAttribute = .forceLeftToRight
    stackView.alignment = .fill // .leading .firstBaseline .center .trailing .lastBaseline
    stackView.distribution = .equalSpacing // .fillEqually .fillProportionally .equalSpacing .equalCentering
    stackView.addArrangedSubview(calenderButton)
    stackView.addArrangedSubview(cameraButton)
    stackView.backgroundColor = UIColor(red: 0.161, green: 0.165, blue: 0.188, alpha: 1.00)
    scrollView.addSubview(stackView)

В чем проблема: StackView не выравнивает подпредставления послева.

Чего я пытаюсь достичь:

Я хочу, чтобы все подпредставления были выровнены по левому краю, я пытался сделать это с помощью stackView.semanticContentAttribute = .forceLeftToRight, но этопохоже, многого не достиг.

Ответы [ 3 ]

0 голосов
/ 21 ноября 2018

Этого можно добиться с помощью прозрачного UIView с динамической шириной.Таким образом, каждый вид изображения будет иметь ограничение по ширине, за исключением этого UIView.Также установите для свойств stackView.alignment и stackView..distribution значение .fill.

. С его помощью вы можете отображать / скрывать изображения с постоянным выравниванием по левому краю.

Вот быстрая настройка с использованием раскадровки.Как вы можете видеть, все изображения имеют ширину 60, кроме последних UIView имен "Blue Dynamic Width View".enter image description here

0 голосов
/ 21 ноября 2018

Пара вариантов ...

1) Ограничить просмотр стека Ведущий и Нижний, но не конечный;Ограничить ширину и высоту первого подпредставления;Ограничить дополнительные подпредставления равными ширине и высоте к первому подпредставлению;дать вид стека желаемое расстояние.

2) Ограничить просмотр стека Leading, Trailing и Bottom;Ограничить ширину и высоту первого подпредставления;Ограничить дополнительные подпредставления равными ширине и высоте к первому подпредставлению;дать стеку распределение: равный интервал;добавьте дополнительные четкие подпредставления, чтобы добавить до 4 полных подпредставлений.

3) Те же ограничения, что и для 2, но добавьте 4 четких подпредставления, затем добавьте кнопки в качестве подпредставлений этих подпредставлений.

0 голосов
/ 21 ноября 2018

Set: 

 stackView.alignment = .leading

и комментарий: 

//stackView.distribution = .equalSpacing

Ваш код будет выглядеть так: 

cameraButton.setImage(UIImage(named: "blueCamera"), for: .normal)
cameraButton.addTarget(self, action: #selector(cameraTapped), for: .touchUpInside)
cameraButton.widthAnchor.constraint(equalToConstant: 70.0).isActive = true
calenderButton.setImage(UIImage(named: "calender"), for: .normal)
calenderButton.addTarget(self, action: #selector(calanderTapped), for: .touchUpInside)
calenderButton.widthAnchor.constraint(equalToConstant: 70.0).isActive = true

stackView.frame = CGRect(x: 0, y: 0, width: scrollView.frame.size.width, height: scrollViewHeight)
stackView.axis = .horizontal
stackView.spacing = 5
stackView.alignment = .leadingZ     
stackView.addArrangedSubview(calenderButton)
stackView.addArrangedSubview(cameraButton)
stackView.backgroundColor = UIColor(red: 0.161, green: 0.165, blue: 0.188, alpha: 1.00)
scrollView.addSubview(stackView)
...