在UIView中添加具有動態寬度的UIButton

Question

我試圖在UIView中添加UIButton，按鈕的寬度將根據其標題而變化。 因此它可以是連續一個按鈕或連續三個按鈕。 如果同一行中沒有空格，則應在下一行中添加按鈕。 像這樣

如果將更多行添加到一定高度，則UIView高度應增加。

我正在考慮從UIStackViews開始，但不確定如何實現此功能。 任何幫助表示贊賞。

Answer 1

一個UICollectionView使用UICollectionViewFlowLayout會在默認情況下做到這一點。 您唯一要做的就是更新collevtionView的高度以使其內容大小匹配，如果您不希望它滾動的話。

使用UIStackView將需要您計算每個按鈕的大小，並在不合適時向下移動到新行。 盡管這聽起來並不困難，但您必須要做很多布局數學。

Answer 2

我能夠使用自定義按鈕生成器來執行此操作

    import Foundation
    import UIKit

        class ButtonGenerator {
            private var buttonTitleArray = [String]()
            private var buttonBackgroundColor: UIColor = UIColor.white
            private var buttonFontColor: UIColor = UIColor.black
            private var passedFunctionCall: Selector?
            private var passedParentView = UIScrollView()
            private var parentViewWidth = CGFloat()
            private var desiredMargin = CGFloat()
            private var buttonsToReturn = [UIButton]()

            func setButtonStyle(bkgColor:UIColor,fontColor:UIColor) {
                buttonBackgroundColor = bkgColor
                buttonFontColor = fontColor
            }

            func setMargin(to margin:CGFloat) {
                desiredMargin = margin
            }

            func addButtons(to parentView:UIScrollView,withTitles passedTitles [String],calling function:Selector){
                //Receive Passed Arguments
                passedParentView = parentView
                parentViewWidth = parentView.frame.width
                buttonTitleArray = passedTitles
                passedFunctionCall = function

                //Track current origin coordinates
                var XPos = desiredMargin
                var YPos = desiredMargin
                var buttonHeight = CGFloat()

                for i in 0..<buttonTitleArray.count {
                    let buttonToAdd = UIButton(type: .custom)
                    buttonToAdd.backgroundColor = buttonBackgroundColor
                    buttonToAdd.setTitleColor(buttonFontColor, for: .normal)
                    buttonToAdd.setTitle(buttonTitleArray[i], for: .normal)
                    buttonToAdd.sizeToFit()
                    buttonHeight = buttonToAdd.frame.height
                    buttonToAdd.addTarget(self, action: passedFunctionCall!, for: .touchUpInside)

                    if XPos + buttonToAdd.frame.width < parentViewWidth-(2*desiredMargin) {
                        //buttonToAdd won't be clipped --> Okay to add to current row
                        buttonToAdd.frame.origin.x = XPos
                        buttonToAdd.frame.origin.y = YPos

                //no change in row --> only update X position
                XPos += buttonToAdd.frame.width + desiredMargin
            }
            else {
                //buttonToAdd will be clipped --> display on next row
                XPos = desiredMargin
                YPos += buttonHeight + desiredMargin

                //set button position
                buttonToAdd.frame.origin.x = XPos
                buttonToAdd.frame.origin.y = YPos

                //update X position
                XPos += buttonToAdd.frame.width + desiredMargin
            }
            //Add Button to return array
            buttonsToReturn.append(buttonToAdd)
        }

        //Set YPos to position of content bottom
        YPos += buttonHeight + desiredMargin

        //Set content size of the parent scroll view to the generated height
        passedParentView.contentSize = CGSize(width: parentViewWidth, height: YPos)

        //Add the buttons to the scroll view
        for i in 0..<buttonsToReturn.count {
            passedParentView.addSubview(buttonsToReturn[i])
        }
    }
}

然后在ViewController中調用按鈕生成器，您需要添加以下內容：

    let btnGen = ButtonGenerator()
    btnGen.setButtonStyle(bkgColor: UIColor.white, fontColor: UIColor.blue)
    btnGen.setMargin(to: 10)
    btnGen.addButtons(to: hashtagScrollView, withTitles: PostModel.Post.genericMusicHashtags, calling:#selector(buttonClicked(sender:)))

同樣，由於選擇器的原因，您必須將@objc函數添加到ViewController類。

    @objc func buttonClicked(sender: UIButton) {
         print(sender.titleLabel!.text!)
    }

它沒有限制高度的功能，但是您應該能夠修改按鈕生成器，使其包含if語句以停止添加按鈕。