以编程方式将按钮对齐到 UITableView 单元格的左侧答案

【问题标题】：Align Button To Left Side Of UITableView Cell Programmatically Swift以编程方式将按钮对齐到 UITableView 单元格的左侧
【发布时间】：2020-05-06 03:45:13
【问题描述】：

我正在使用 Swift 5、Xcode 11 和 ui 表视图控制器创建一个简单的应用程序。在 ui 表视图中，我想要 2 个按钮：一个在我的表视图左侧，另一个在右侧。我尝试了许多其他相关/类似问题的答案，但都失败了（可能是因为 1. 太旧，2. 答案用 OBJ-C 编写）。

这是我的表格视图控制器：


import UIKit

@objcMembers class CustomViewController: UITableViewController {

    var tag = 0

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func viewDidAppear(_ animated: Bool) {
    }

    override func numberOfSections(in tableView: UITableView) -> Int {
        // #warning Incomplete implementation, return the number of sections
        return 1
    }

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }

    // 3
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        tag = tag + 1

        let cell = tableView.dequeueReusableCell(withIdentifier: "themeCell", for: indexPath) as! ThemeCell
        var cellButton: UIButton!


        cellButton = UIButton(frame: CGRect(x: 5, y: 5, width: 50, height: 30))
        cell.addSubview(cellButton)
        cell.img.image = UIImage(named: SingletonViewController.themes[indexPath.row])
        cell.accessoryView = cellButton
        cellButton.backgroundColor = UIColor.red
        cellButton.tag = tag
        return cell
    }

}

这是我目前得到的：

【问题讨论】：

分享你目前收到的截图。
为什么不用“themeCell”.xib 文件添加那些按钮？
@iOSArchitect.com 查看我的编辑
像这样试试 cell.contentView.addSubview(cellButton) 可能有用
@RuchiMakadia 这似乎不起作用

标签： ios swift xcode uitableview uicollectionview

【解决方案1】：

为应用约束添加下面的代码

let cellButton = UIButton(frame: CGRect.zero)
cellButton.translatesAutoresizingMaskIntoConstraints = false
cell.addSubview(cellButton)
cell.accessoryView = cellButton
cellButton.backgroundColor = UIColor.red

cellButton.leadingAnchor.constraint(equalTo: cell.leadingAnchor, constant: 5).isActive = true
cellButton.topAnchor.constraint(equalTo: cell.topAnchor, constant: 5).isActive = true
cellButton.widthAnchor.constraint(equalToConstant: 50).isActive = true
cellButton.heightAnchor.constraint(equalToConstant: 30).isActive = true

【讨论】：

当你设置cellButton.translatesAutoresizingMaskIntoConstraints = false时，框架设置被忽略它没有任何效果
是的，你可以像 UIButton(frame: CGRect.zero) 一样设置

【解决方案2】：

您可以从约束中实现左右对齐按钮。下面是我的代码来左右对齐视图。

override func viewDidLoad() {

        let leftButton = UIButton(type: .custom)
        leftButton.backgroundColor = UIColor.red
        self.view.addSubview(leftButton)
        
        leftButton.translatesAutoresizingMaskIntoConstraints = false
        let horizontalConstraint = leftButton.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20)
        let verticalConstraint = leftButton.centerYAnchor.constraint(equalTo: view.centerYAnchor)
        let widthConstraint = leftButton.widthAnchor.constraint(equalToConstant: 100)
        let heightConstraint = leftButton.heightAnchor.constraint(equalToConstant: 100)
        NSLayoutConstraint.activate([horizontalConstraint, verticalConstraint, widthConstraint, heightConstraint])
        
        let rightButton = UIButton(type: .custom)
        rightButton.backgroundColor = UIColor.red
        self.view.addSubview(rightButton)
        
        rightButton.translatesAutoresizingMaskIntoConstraints = false
        let horizontalConstraintRight = rightButton.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20)
        let verticalConstraintRight = rightButton.centerYAnchor.constraint(equalTo: view.centerYAnchor)
        let widthConstraintRight = rightButton.widthAnchor.constraint(equalToConstant: 100)
        let heightConstraintRight = rightButton.heightAnchor.constraint(equalToConstant: 100)
        NSLayoutConstraint.activate([horizontalConstraintRight, verticalConstraintRight, widthConstraintRight, heightConstraintRight])
        
        
    }

[![左右对齐视图约束][1]][1] [1]：https://i.stack.imgur.com/tMJ8N.jpg

【讨论】：

还有一件事，为什么按钮在表格视图单元格中脱线？（我的按钮在测试时脱线）
下线了？是什么意思？
垂直下线？

【解决方案3】：

随着单元格的重复使用，您必须将按钮放入您的 xib 文件中。您不应该每次都制作一个按钮并将其添加到单元格中。通过在 xib 中添加一个按钮来试试这个。

【讨论】：

【解决方案4】：

class ThemeCell: UITableViewCell { 


  //MARK:- Initialize View

  private let button : UIButton = {

   let button = UIButton()
   button.setTitle("Hello", .normal)
   button.backgroundColor = .red
   button.translatesAutoresizingMaskIntoConstraints = false
   return button

  }()

  //MARK:- View Life Cycle

   required init?(coder aDecoder: NSCoder) {

    super.init(coder: aDecoder)

}

override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {

    super.init(style: style, reuseIdentifier: reuseIdentifier)

    setup()

}

override func awakeFromNib() {

    super.awakeFromNib()

}

override func setSelected(_ selected: Bool, animated: Bool) {

    super.setSelected(selected, animated: animated)

    selectionStyle = .none


}

//MARK:- User Defined Function

private func setup() {

   addSubView(button)
   button.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 20).isActive = true

   button.topAnchor.constraint(equalTo: topAnchor, constant: 20).isActive = true
   button.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -20).isActive = true


}
}

您可以使用这样的自动布局约束来设置按钮。无需在cellForRow 方法中调用。

【讨论】：