【问题标题】:Confused in trying to understand .layoutMarginsGuide inside custom section Header for a tableView试图理解 tableView 的自定义部分 Header 中的 .layoutMarginsGuide 时感到困惑
【发布时间】:2018-11-14 20:59:12
【问题描述】:

我正在尝试为包含 textView 的表视图创建自定义节标题。我根据教程创建了一个简单的应用程序。这创建了一个工作示例。但是,当我将代码移动到我的生产应用程序时,它的布局不正确。简单的教程应用程序从 nib(没有 Main.storyboard)创建布局,生产应用程序没有。我假设这是问题的一部分。在这两种情况下,我都使用 .layoutMarginsGuide。

代码遵循自定义标头的设计。

class TextViewHeader: UITableViewHeaderFooterView {
static let reuseIdentifer = "TextViewHeaderReuseIdentifier"

let sectionTextView = UITextView.init()

override public init(reuseIdentifier: String?) {
    super.init(reuseIdentifier: reuseIdentifier)

    sectionTextView.font = UIFont.preferredFont(forTextStyle: .title2)
    sectionTextView.textColor = UIColor.blue
    sectionTextView.backgroundColor = UIColor.yellow
    sectionTextView.translatesAutoresizingMaskIntoConstraints = false

    self.contentView.addSubview(sectionTextView)
    let margins = contentView.layoutMarginsGuide
    sectionTextView.isScrollEnabled = false
    //sectionTextView.text = "Something"
    sectionTextView.frameLayoutGuide.leadingAnchor.constraint(equalTo: margins.leadingAnchor).isActive = true
    sectionTextView.frameLayoutGuide.trailingAnchor.constraint(equalTo: margins.trailingAnchor).isActive = true
    sectionTextView.frameLayoutGuide.topAnchor.constraint(equalTo: margins.topAnchor).isActive = true
    sectionTextView.frameLayoutGuide.bottomAnchor.constraint(equalTo: margins.bottomAnchor).isActive = true
}

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

注意布局是由以下驱动的:

 let margins = contentView.layoutMarginsGuide

为了便于跟踪 TextView 的大小和位置,我将背景设置为黄色。

  sectionTextView.backgroundColor = UIColor.yellow

在viewDidLoad中注册header需要额外编程,我已经做到了:

   override func viewDidLoad() {
    super.viewDidLoad()
    self.view.backgroundColor = UIColor.white
    self.tableView.frame = self.view.bounds
    self.tableView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
    self.tableView.dataSource = self
    self.tableView.delegate = self
    self.tableView.register(TextViewHeader.self, forHeaderFooterViewReuseIdentifier: TextViewHeader.reuseIdentifer)
    self.view.addSubview(self.tableView)
    self.tableView.rowHeight = UITableViewAutomaticDimension
    self.tableView.estimatedRowHeight = 300
}

并替换:

   tableView(_ tableView:, titleForHeaderInSection section:).

以下内容:

   func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    guard let header = tableView.dequeueReusableHeaderFooterView(withIdentifier: TextViewHeader.reuseIdentifer) as? TextViewHeader else {
        return nil
    }
    header.customTextView.text = "Section \(section + 1)"
    return header
    }

这可以正常工作并按预期插入带有布局的 textView。

但是,当我将编程转移到我的生产应用程序时,似乎没有发生同样的情况。在这种情况下,我将此程序化布局与 xcode 界面构建器上的布局合并。有东西干扰了布局。

在生产应用程序中,我在自定义标题设计中使用了类似的代码。 (为了完整起见,包括在下面)

class TextViewHeader: UITableViewHeaderFooterView {
static let reuseIdentifer = "TextViewHeaderReuseIdentifier"

let sectionTextView = UITextView.init()

override public init(reuseIdentifier: String?) {
    super.init(reuseIdentifier: reuseIdentifier)

    sectionTextView.font = UIFont.preferredFont(forTextStyle: .title2)
    sectionTextView.textColor = UIColor.blue
    sectionTextView.backgroundColor = UIColor.yellow
    sectionTextView.translatesAutoresizingMaskIntoConstraints = false

    self.contentView.addSubview(sectionTextView)
    let margins = contentView.layoutMarginsGuide
    sectionTextView.isScrollEnabled = false
    //sectionTextView.text = "Something"
    sectionTextView.frameLayoutGuide.leadingAnchor.constraint(equalTo: margins.leadingAnchor).isActive = true
    sectionTextView.frameLayoutGuide.trailingAnchor.constraint(equalTo: margins.trailingAnchor).isActive = true
    sectionTextView.frameLayoutGuide.topAnchor.constraint(equalTo: margins.topAnchor).isActive = true
    sectionTextView.frameLayoutGuide.bottomAnchor.constraint(equalTo: margins.bottomAnchor).isActive = true
}

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

这给出了以下布局。

查看我的故事板的 tableView 部分。我看到 Sections Header Height 设置为自动,而 Estimate for row height 设置为零。更改 Estimate 以自动更改结果:

设置:

得到的header如图所示:

更好但是textView上面的空间太大了。

尝试调查一下,我可以在休息后看到以下内容。

-8, -8 的边距来源让我感到困惑。此外,这正是我从完美运行的示例中得到的。

但是,在此休息时间进行调查时,我收到以下警告:

2018-11-14 15:21:54.086637-0500 appName[31946:1780119] [LayoutConstraints] 无法同时满足约束。 以下列表中的至少一个约束可能是一个 你不想要。试试这个:(1)查看每个约束并尝试 找出你没想到的; (2) 找到添加的代码 不需要的约束或约束并修复它。

接下来列出了几个关于leadingtrailing的约束,而不是topbottom。因此,没有明确指示要修复什么。

这里是列出的约束

 "<NSLayoutConstraint:0x600002364280 UILayoutGuide:0x6000039257a0'UIScrollView-frameLayoutGuide'.leading == UILayoutGuide:0x60000397a060'UIViewLayoutMarginsGuide'.leading   (active)>",
"<NSLayoutConstraint:0x6000023642d0 UILayoutGuide:0x6000039257a0'UIScrollView-frameLayoutGuide'.trailing == UILayoutGuide:0x60000397a060'UIViewLayoutMarginsGuide'.trailing   (active)>",
"<NSLayoutConstraint:0x60000231b840 'UIView-Encapsulated-Layout-Width' _UITableViewHeaderFooterContentView:0x7fe43a815410.width == 0   (active)>",
"<NSLayoutConstraint:0x60000231b4d0 'UIView-leftMargin-guide-constraint' H:|-(8)-[UILayoutGuide:0x60000397a060'UIViewLayoutMarginsGuide'](LTR)   (active, names: '|':_UITableViewHeaderFooterContentView:0x7fe43a815410 )>",
 "<NSLayoutConstraint:0x60000231b570 'UIView-rightMargin-guide-constraint' H:[UILayoutGuide:0x60000397a060'UIViewLayoutMarginsGuide']-(8)-|(LTR)   (active, names: '|':_UITableViewHeaderFooterContentView:0x7fe43a815410 )>"

我唯一的想法是“leftMargin”和“rightMargin”以及“.leading”和“.trailing”的混合。这可能是问题吗?但正如所讨论的,问题是顶部和底部对齐。

我对情节提要上 tableView 和 tableView Headers 设置的审查没有发现有关可能冲突的更多信息。

我可能错过了什么?

【问题讨论】:

    标签: swift uitableview nslayoutconstraint


    【解决方案1】:

    我发现这是一个有问题的方法。 NSLayoutConstraint 问题目前超出了我的 Swift 知识范围。它似乎是由事件发生的时间驱动的。此外,有一些讨论认为它有些错误。请参阅以下内容:What is NSLayoutConstraint "UIView-Encapsulated-Layout-Height" and how should I go about forcing it to recalculate cleanly?

    我决定放弃使用tableView.dequeueReusableHeaderFooterView。部分的数量将受到限制(2 或 3 个,大量使用),因此成本将最低。

    因此,我实现了一个简单的方法。

       //define size of font to use 
    let sectionFont = UIFont.preferredFont(forTextStyle: .title3)
    let fontsize = UIFont.preferredFont(forTextStyle: .title3).pointSize
    
    override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerView = UIView.init(frame: CGRect.init(x: 0, y: 0, width: tableView.frame.width, height: fontsize+10))
        let textView = UITextView()
        textView.frame = CGRect.init(x: 0, y: -10, width: headerView.frame.width-10, height: headerView.frame.height-0)
        textView.text = "Section \(section)"
        textView.font = sectionFont
    
        headerView.addSubview(textView)
    
        return headerView
    }
    
    
    override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return fontsize+10
    }
    

    【讨论】:

      猜你喜欢
      • 2015-07-28
      • 2013-05-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-04-24
      • 2013-01-13
      相关资源
      最近更新 更多