如何以编程方式将浮动标题栏添加到 UIScrollView答案

【问题标题】：How to programatically add floating header bar to a UIScrollView如何以编程方式将浮动标题栏添加到 UIScrollView
【发布时间】：2020-12-03 14:50:55
【问题描述】：

好的，请有人在这里阐明一下。我对编码还是很陌生。我已经学习了 swift 大约一个月左右，并将设计我的第一个超级简单的应用程序作为我的学习路径。这给了我其他应用构建所缺乏的目的，但它本身就是一个不同的学习曲线。

在这种情况下，我使用自动布局和图形在 Xcode Interface Builder 中创建了几乎整个 UI。这会造成 UI 根本没有代码的情况。很棒而且很容易快速学习，但是现在我需要以编程方式做一些事情（看起来如此），我什至不知道从哪里开始。

我有一个滚动视图，它在 9 列中输出大约 100 行计算。视图更大并且可以垂直和水平滚动。我还有一个标签标题来描述每一列。当用户向下滚动（数据向上）时，不可能跟踪哪一列是哪一列，因为标签标题消失了。我试图弄清楚如何在我的滚动视图中添加一个浮动标题，就像你在电子表格中“冻结”一个标题一样。

到目前为止，我已经在 Interface Builder 中尝试了所有我能做的事情，我所做的所有搜索都只出现了编程解决方案，这很好，只是我没有要附加的 UI 代码......

所以我真的有一个问题：

当没有初始代码时，如何以编程方式在 UI Builder 中添加浮动标题？我希望我的标签水平堆栈视图作为浮动标题静止不动。

非常感谢任何帮助，过去 3 天一直在为此绞尽脑汁，这是我完成应用程序之前的最后一次更改:(

编辑：这是我的代码和一些初始视图的屏幕截图，向右滚动并向下滚动。如您所见，实际上没有 UI 代码。我想做这样的事情，但不是用 tableView：https://mariusschulz.com/blog/adding-a-fixed-header-to-a-uiscrollview 更理想的是这样的东西，但不是表格或 collectionView...https://imgur.com/a/vwLzy2v

import UIKit

class MetricVerticalViewController: UIViewController, UITextFieldDelegate {

@IBOutlet weak var shelfHeight: UITextField!

@IBOutlet weak var squeezeFour: UILabel!
@IBOutlet weak var squeezeThree: UILabel!
@IBOutlet weak var squeezeTwo: UILabel!
@IBOutlet weak var squeezeOne: UILabel!
@IBOutlet weak var normalGauge: UILabel!
@IBOutlet weak var gainOne: UILabel!
@IBOutlet weak var gainTwo: UILabel!
@IBOutlet weak var gainThree: UILabel!
@IBOutlet weak var gainFour: UILabel!

override func viewDidLoad() {
    shelfHeight.delegate = self
    super.viewDidLoad()
}

// Calculate button tapped will cause math to occur and the text field to show the values
@IBAction func calculateSpacing(_ sender: UIButton) {
    squeezeFour.text = ""
    squeezeThree.text = ""
    squeezeTwo.text = ""
    squeezeOne.text = ""
    normalGauge.text = ""
    gainOne.text = ""
    gainTwo.text = ""
    gainThree.text = ""
    gainFour.text = ""
    // Resigns the keyboard when the button is pressed
    self.view.endEditing(true)
    calculateSpacing()
    
}
// Acts to dismiss number keyboard when user taps outside
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    brickHeight.resignFirstResponder()
}

func calculateSpacing() {
    let shelfHeight = Int(shelfHeight.text!) ?? 1
    let squeezeFourGauge = shelfHeight + 6
    let squeezeThreeGauge = shelfHeight + 7
    let squeezeTwoGauge = shelfHeight + 8
    let squeezeOneGauge = shelfHeight + 9
    let normalJoint = shelfHeight + 10
    let gainOneGauge = shelfHeight + 11
    let gainTwoGauge = shelfHeight + 12
    let gainThreeGauge = shelfHeight + 13
    let gainFourGauge = shelfHeight + 14
    for index in 1...100 {
        squeezeFour.text! += "Shelf \(index) = \(index * squeezeFourGauge)\n"
        squeezeThree.text! += "Shelf \(index) = \(index * squeezeThreeGauge)\n"
        squeezeTwo.text! += "Shelf \(index) = \(index * squeezeTwoGauge)\n"
        squeezeOne.text! += "Shelf \(index) = \(index * squeezeOneGauge)\n"
        normalGauge.text! += "Shelf \(index) = \(index * normalJoint)\n"
        gainOne.text! += "Shelf \(index) = \(index * gainOneGauge)\n"
        gainTwo.text! += "Shelf \(index) = \(index * gainTwoGauge)\n"
        gainThree.text! += "Shelf \(index) = \(index * gainThreeGauge)\n"
        gainFour.text! += "Shelf \(index) = \(index * gainFourGauge)\n"
    }
}


extension ViewController : UITextFieldDelegate {

// Acts to dismiss keyboard once user presses return (possibly unnecessary as this was used for text keyboard input in original code)
    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        textField.resignFirstResponder()
        return true
    }
}

【问题讨论】：

欢迎来到 SO。请使用tour 并阅读How to Ask。然后使用minimal reproducible example 编辑您的问题，显示您遇到问题的具体部分。您的问题目前过于宽泛。
感谢您的建议，我添加了一些代码和屏幕截图以便更好地描述。我很困惑自己到底该怎么做，所以很难描述......感谢您的理解:)
请仅针对每个主题提出问题。
已调整，谢谢 koen

标签： ios swift user-interface uikit

【解决方案1】：

从代码中访问 Interface Builder 项目的一种方法是通过插座连接。您必须在 Interface Builder 旁边打开您的代码，然后将项目控制拖动到您的视图控制器代码中，并确保选择“Outlet”作为连接类型。请参阅Apple's tutorial 了解更多信息。

【讨论】：

所以你的意思是我可以为滚动视图创建一个出口，并且在该出口内我可以访问属性和其他编程属性？
是的，通过在视图控制器代码中创建一个 outlet，您可以通过编程方式访问引用的视图（我建议在 viewDidLoad 方法中这样做）。

【解决方案2】：

所以我做了一些工作，实际上能够通过向滚动视图添加第二个视图并疯狂地限制它来创建上述屏幕截图中大小的浮动标题。它在 iPhone 11 Pro Max 尺寸上运行良好，因为它在使用该尺寸时受到限制，但随后所有其他设备都被搞砸了。我将尝试为其他尺寸设置“因特征而异”约束，看看它是否是一个稳定的解决方法。

如果它再次起作用，我会发布一些文章。

显然，在一个滚动视图中拥有多个视图是很糟糕的......对我来说还可以。

还有其他人对此有更好的解决方案吗？

【讨论】：