如何在表視圖中使用VFL約束定製單元格

|我在我的視圖控制器中使用自定義UITableViewCell（單元格）的TableView（alertTableView）。對於這個UITableViewCell我想設置一些約束;如何在表視圖中使用VFL約束定製單元格

單元格需要水平調整大小以匹配屏幕寬度，並且間距爲50pts。左和右。
細胞的高度是10pts
細胞之間我想有一個垂直2點的小空間。

要做到這一點，我用VFL添加約束，但約束沒有設置/尊重。我假設我必須在AlertTableView上設置約束，而不是在視圖上。無論如何嘗試過，但正如我所預料的那樣，這沒有什麼區別。

/* 
     VFL constraints Table View Cell 
    */ 
    let cell:ReportTableviewCell = self.alertTableView.dequeueReusableCellWithIdentifier("cell") as! ReportTableviewCell 
    cell.translatesAutoresizingMaskIntoConstraints = false 
    alertTableView.addSubview(cell) 
    let cellDictionary = ["ReportTableviewCell": cell] 

    alertTableView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|-(50)-[ReportTableviewCell]-(50)-|",options: [], metrics: nil, views: cellDictionary)) 
    alertTableView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[ReportTableviewCell(cellHeight)]-(cellVSpacing)-|",options: [], metrics: ["cellHeight" : 40, "cellVSpacing" : 2], views: cellDictionary))

什麼做錯了？該示例的

==新修訂==

// Register ReportCell 
    let nib = UINib(nibName: "ReportCell", bundle: nil) 
    alertTableView.registerNib(nib, forCellReuseIdentifier: "cell") 

    /* 
     VFL constraints Table View Cell 
    */ 
    let cell:ReportTableviewCell = self.alertTableView.dequeueReusableCellWithIdentifier("cell") as! ReportTableviewCell 

    cell.translatesAutoresizingMaskIntoConstraints = false 
    alertTableView.addSubview(cell) 

    var cellAllConstraints = [NSLayoutConstraint]() 
    let cellDictionary = ["ReportTableviewCell": cell, 
          "reportCellDateTime": cell.reportCellDateTimeOutlet] 

    let cellHorizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat("H:|-50-[ReportTableviewCell]-50-|",options: [], metrics: nil, views: cellDictionary) 
    let cellVerticalConstraints = NSLayoutConstraint.constraintsWithVisualFormat("V:|[ReportTableviewCell(cellHeight)]-(cellVSpacing)-|",options: [], metrics: ["cellHeight" : 10, "cellVSpacing" : 2], views: cellDictionary)   
    cellAllConstraints += cellHorizontalConstraints   
    cellAllConstraints += cellVerticalConstraints 
    NSLayoutConstraint.activateConstraints(cellAllConstraints) 


    // set constraint on UILabel reportCellDateTimeOutlet in cell ReportCell   
    cellAllConstraints.removeAll()   
    let dateTimeHorizontalConstrains = NSLayoutConstraint.constraintsWithVisualFormat("H:|-50-[reportCellDateTime]-|",options: [], metrics: nil, views: cellDictionary) 
    cellAllConstraints += dateTimeHorizontalConstrains 
    NSLayoutConstraint.activateConstraints(cellAllConstraints)

時錯誤地增加一個細胞或的UILabel到的UITableView像alertTableView.addSubview(cell.reportCellDateTimeOutlet)一個隱藏的小區被添加到拖累頂電池時變成可見的UITableView的。正如bsmith11指出的那樣，這是錯誤的。

使用一個UITableView自定義單元格和設置在該小區中的特定的UILabel的約束時儘管如此，約束不受影響。

let cell:ReportTableviewCell = self.alertTableView.dequeueReusableCellWithIdentifier("cell") as! ReportTableviewCell 
    var cellAllConstraints = [NSLayoutConstraint]() 
    let cellDictionary = [ 
            "reportCellDateTime": cell.reportCellDateTimeOutlet, 
            "reportCellViewedIndicator" : cell.reportCellViewedIndicatorOutlet, 
     "reportCellDescription" : cell.reportCellDescriptionOutlet ] 
    cell.reportCellDateTimeOutlet.translatesAutoresizingMaskIntoConstraints = false 
    let dateTimeHorizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat("H:|-50-[reportCellDateTime(300)]-|",options: [], metrics: nil, views: cellDictionary) 
    cellAllConstraints += dateTimeHorizontalConstraints 
    NSLayoutConstraint.activateConstraints(cellAllConstraints)

正如bsmith11所示，我將代碼從ViewController移到了擴展UITableViewCell的類中。還改變了從VFL到佈局錨的編程應用約束。不幸的是我不適合。

class ReportTableviewCell : UITableViewCell { 

    @IBOutlet weak var reportCellViewedIndicatorOutlet: UIImageView! 
    @IBOutlet weak var reportCell: UIView! 

    override func awakeFromNib() { 
     super.awakeFromNib() 

     // Internal border 
     self.layer.borderColor = UIColor(red: 245/255, green: 166/255, blue: 35/255, alpha: 1.0).CGColor 
     self.layer.cornerRadius = 8.0 
     self.layer.masksToBounds = true 
     self.layer.borderWidth = 4.0 

     reportCell.translatesAutoresizingMaskIntoConstraints = false 
     reportCellViewedIndicatorOutlet.bottomAnchor.constraintEqualToAnchor(reportCell.bottomAnchor, constant: 10) 
     reportCellViewedIndicatorOutlet.rightAnchor.constraintEqualToAnchor(reportCell.rightAnchor, constant:-10) 
     reportCellDescriptionOutlet.translatesAutoresizingMaskIntoConstraints = false 
     reportCellDescriptionOutlet.leftAnchor.constraintEqualToAnchor(reportCell.leftAnchor, constant: 10).active = true     reportCellDescriptionOutlet.rightAnchor.constraintEqualToAnchor(reportCell.rightAnchor, constant: 10).active = true 

     ...

來源

2016-04-25 pcvnes

您是不是要找：中

"H:|-(50)- ...

代替

"H:-(50)-| ...

來源

2016-04-25 20:10:25

我的確的意思是，固定它的問題。雖然沒有解決這個問題。 – pcvnes

你似乎使用UITableView不正確。

https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/TableView_iPhone/CreateConfigureTableView/CreateConfigureTableView.html#//apple_ref/doc/uid/TP40007451-CH6-SW10

你應該爲你UITableViewCell子內的子視圖設置的限制。 UITableView將處理實際單元格的佈局。

來源

2016-04-25 20:47:37 bsmith11

據我所知，當需要爲這些子視圖設置約束時，我必須在* UITableViewCell *子類內的子視圖上設置約束。但我需要在* UITableView *中的* UITableViewCell *上設置約束。我已經用示例的修改版本更新了問題，並在單元格中的UILabel上添加了約束。這似乎也不起作用。 – pcvnes

您不應該手動將'UITableViewCell'作爲子視圖添加到'UITableView'或手動設置兩者之間的約束。請閱讀Apple文檔，瞭解適當的「UITableView」用法。 – bsmith11

我已經瀏覽了蘋果文檔，再次閱讀了Ray Wenderlichs教程之一。（https://www.raywenderlich.com/110393/auto-layout-visual-format-language-tutorial）但仍然不知道我在這裏做錯了什麼。添加了一個新的簡單片段。 – pcvnes

最後，我已經能夠設置約束。正如@ bsmith11所示，我改用NSConstraints來支持VFL。還將編程定義的約束從ViewController移動到擴展UITableViewCell類的類。

@IBOutlet weak var reportCellViewedIndicatorOutlet: UIImageView! 
@IBOutlet weak var reportCell: UIView! 

override func awakeFromNib() { 
    super.awakeFromNib() 

    reportCell.translatesAutoresizingMaskIntoConstraints = false 

    // viewed Indicator constraints 
    let viewedIndicatorConstraints: [NSLayoutConstraint] = [ 
     reportCellViewedIndicatorOutlet.rightAnchor.constraintEqualToAnchor(self.rightAnchor, constant: -3), 
     reportCellViewedIndicatorOutlet.bottomAnchor.constraintEqualToAnchor(self.bottomAnchor, constant: -3) 

    ] 

    NSLayoutConstraint.activateConstraints(viewedIndicatorConstraints)

來源

2016-05-10 19:55:04 pcvnes

如何在表視圖中使用VFL約束定製單元格

回答

相關問題