2D UiLabel Grid с последним столбцом UIStackView не заполняет пространство.UIStackView уважает ContentHuggingPriority?

Question

Я пытаюсь создать UIControl, который проще создать сетку, чем использование UICollectionView для определенных небольших задач.Я использую UIStackView из UIStackViews.Это горизонтальный контейнер вертикальных стеков (столбцов).Проблема в том, что мне нужен один столбец, чтобы быть столбцом расширения для заполнения дополнительного пространства.UIStackView соблюдает настройку setContentHuggingPriority для себя?В этом случае одна из моих вертикальных колонн.

Я включил игровую площадку, чтобы воссоздать эту проблему.

Ссылка на визуальное отображение сетки UILabel, где только один столбец должен заполняться по горизонтали

Вот код игровой площадки:

import Foundation
import UIKit
import PlaygroundSupport

class ViewController : UIViewController {
    override func loadView() {
        let view = UIView()
        view.backgroundColor = .white
        self.view = view

        let labMatrix = LabelMatrix( rows: 4, columns: 4)

        self.view.addSubview( labMatrix)

        labMatrix.labMatrix[0][0].text = "Test"
        labMatrix.frame = CGRect(x: 0, y: 0, width: 360, height: 520)
    }
}

class LabelMatrix : UIStackView {
    let rowCount : Int
    let colCount : Int

    var labMatrix = [[UILabel]]()

    required init(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    init ( rows: Int , columns : Int ) {
        rowCount = rows
        colCount = columns
        super.init(frame:.zero)
        create()
    }

    func create() {
        var columns : [UIStackView] = [UIStackView]()
        var rows : [UILabel] = [UILabel]()

        for acol in 0..<colCount {
            rows.removeAll()

            for arow in 0..<rowCount {
                let lab = UILabel()
                //                lab.translatesAutoresizingMaskIntoConstraints = false
                rows.append( lab )

                let str = "(\(arow),\(acol))"
                lab.text = str

                if !(arow%2 == 0) {
                    lab.backgroundColor = .lightGray
                } else {
                    lab.backgroundColor = .yellow
                }

                if arow == rowCount-1 {
                    print("This should make last row stretch vertically to fill any extra vertical space")
                    //                    lab.setContentCompressionResistancePriority(UILayoutPriority(rawValue: 20), for: .vertical)
                    lab.setContentHuggingPriority(UILayoutPriority(rawValue: 20), for:.vertical)
                }
            }

            labMatrix.append( rows )
            let curCol = UIStackView(arrangedSubviews: rows)
            columns.append( curCol )

            curCol.axis = .vertical
            curCol.distribution = .fill
            curCol.spacing = 2
            curCol.alignment = .center

            if acol == colCount-1 {
                print("TODO Fix This. It should make only the last column(e.g. uistackview) strech to fill extra space")
                curCol.setContentHuggingPriority(UILayoutPriority(rawValue: 20), for:.horizontal)
            }
        }

        for col in columns {
            self.addArrangedSubview( col )
        }

        self.axis = .horizontal
        self.distribution = .fill
        self.alignment = .top
        self.spacing = 4
    }
}

PlaygroundPage.current.liveView = ViewController()

Answer 1

Представления стека ведут себя несколько иначе, чем другие представления, во многих отношениях - сжатие и объятие.

Основной функцией представления стека является организация его подпредставлений .Когда одно или несколько его подпредставлений имеют свои собственные свойства размера / сжатия / объятия, компоновка стекового представления будет определяться (частично) его подпредставлениями.

Чтобы развернуть последний столбец (и последнюю строку)распределение должно быть fill, а представлениям (меткам) в этом столбце / строке должны быть изменены их приоритеты объятия.

Вы можете получить этот игровой результат:

, изменив код, как показано ниже (комментарии должны быть четкими):

import Foundation
import UIKit
import PlaygroundSupport

class ViewController : UIViewController {
    override func loadView() {
        let view = UIView()
        view.backgroundColor = .white
        self.view = view

        let labMatrix = LabelMatrix( rows: 4, columns: 4)

        self.view.addSubview( labMatrix)

        labMatrix.labMatrix[0][0].text = "Test"
        labMatrix.frame = CGRect(x: 0, y: 0, width: 360, height: 520)
    }
}

class LabelMatrix : UIStackView {
    let rowCount : Int
    let colCount : Int

    var labMatrix = [[UILabel]]()

    required init(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    init ( rows: Int , columns : Int ) {
        rowCount = rows
        colCount = columns
        super.init(frame:.zero)
        create()
    }

    func create() {
        var columns : [UIStackView] = [UIStackView]()
        var rows : [UILabel] = [UILabel]()

        for acol in 0..<colCount {
            rows.removeAll()

            for arow in 0..<rowCount {
                let lab = UILabel()
                rows.append( lab )

                let str = "(\(arow),\(acol))"
                lab.text = str

                // set the label text alignment to center
                lab.textAlignment = .center

                if !(arow%2 == 0) {
                    lab.backgroundColor = .lightGray
                } else {
                    lab.backgroundColor = .yellow
                }

                if acol == colCount-1 {
                    print("This will allow the last column to stretch horizontally")
                    lab.setContentHuggingPriority(UILayoutPriority(rawValue: 20), for:.horizontal)
                }

                if arow == rowCount-1 {
                    print("This will allow the bottom row stretch vertically")
                    lab.setContentHuggingPriority(UILayoutPriority(rawValue: 20), for:.vertical)
                }

            }

            labMatrix.append( rows )
            let curCol = UIStackView(arrangedSubviews: rows)
            columns.append( curCol )

            curCol.axis = .vertical
            curCol.distribution = .fill
            curCol.spacing = 2
            // .alignment should be .fill -- let the label center its own text
            curCol.alignment = .fill

            // not needed - hugging priority is controlled by the stack view's arranged subviews
            // if acol == colCount-1 {
            //  print("TODO Fix This. It should make only the last column(e.g. uistackview) strech to fill extra space")
            //  curCol.setContentHuggingPriority(UILayoutPriority(rawValue: 20), for:.horizontal)
            // }

        }

        for col in columns {
            self.addArrangedSubview( col )
        }

        self.axis = .horizontal
        self.distribution = .fill
        // .alignment needs to be .fill if you want the bottom row to expand vertically
        self.alignment = .fill
        self.spacing = 4
    }
}

PlaygroundPage.current.liveView = ViewController()