在 UITableViewController (Swift) 頂部添加按鈕

Question

我正在嘗試在 uitableview 控制器表視圖的頂部添加一個按鈕。 視圖控制器有一個導航控制器和靜態單元格，這就是為什么它是 uitableviewcontroller 而不是 uiviewcontroller 的原因。 現在我正在嘗試在屏幕底部添加一個按鈕，該按鈕連接到導航控制器，以便它不會隨表視圖一起滾動。

我正在嘗試制作類似於下面的內容。 它有一個頂部欄的導航控制器，一個帶有靜態單元格的表格視圖，然后是一個按鈕，但他們是如何制作按鈕的？

圖片： http : //postimg.org/image/ilsmqqrip/

謝謝！

更新：如何使用 Swift 將 uiviewcontroller 與帶有靜態單元格的 tableview 一起使用？

Answer 1

我發現容器視圖在這種情況下非常有用！ 一個干凈的解決方案，非常容易實施。

只需創建一個普通的 UIViewController，添加你的按鈕和一個 ContainerView 作為這個 UIViewController 的子視圖（下圖中的中間部分）。 最后從 ContainerView 創建 Embed Segue 到你的 UITableViewController （右邊的那個）。

這樣您就可以使用靜態單元格原型，而不僅限於同時使用 UITableView。

結果：

Answer 2

對此有更好的解決方案。 您可以通過禁用相應 Button 或任何用於浮動按鈕的 UIView 的 Auto Layout(button.translatesAutoresizingMaskIntoConstraints = false) 屬性來執行此操作：

斯威夫特 4

//create a button or any UIView and add to subview
let button=UIButton.init(type: .system)
button.setTitle("NEXT", for: .normal)
button.frame.size = CGSize(width: 100, height: 50)
self.view.addSubview(button)

//set constrains
button.translatesAutoresizingMaskIntoConstraints = false
if #available(iOS 11.0, *) {
     button.rightAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.rightAnchor, constant: -10).isActive = true
     button.bottomAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.bottomAnchor, constant: -10).isActive = true
} else {
     button.rightAnchor.constraint(equalTo: tableView.layoutMarginsGuide.rightAnchor, constant: 0).isActive = true
     button.bottomAnchor.constraint(equalTo: tableView.layoutMarginsGuide.bottomAnchor, constant: -10).isActive = true
}

Answer 3

我對UITableViewController和靜態數據源做了類似的事情。 我在表格視圖的頁腳視圖中添加了按鈕。

為了使其與屏幕底部對齊，我需要在我的視圖控制器中使用以下代碼：

override func viewWillAppear(animated: Bool) {
        super.viewWillAppear(animated)

        // Make footerview so it fill up size of the screen
       // The button is aligned to bottom of the footerview 
       // using autolayout constraints
        self.tableView.tableFooterView = nil
        self.footerView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.tableView.frame.size.height - self.tableView.contentSize.height - self.footerView.frame.size.height)
        self.tableView.tableFooterView = self.footerView
    }

簡而言之，我調整了footerview的大小以占用table view的contentsize被移除后的所有剩余空間。 由於按鈕與自動布局的 footerView 底部對齊，因此它將停留在屏幕底部。

故事板：

結果如下：

Answer 4

UITableViewController 將占據整個空間，因此您將無法添加按鈕。 將基於 UITableViewController 的代碼重構為 UIViewController 並手動添加 UITableView。 這樣你就可以設置表格視圖的大小並將按鈕放在底部。

Answer 5

不幸的是 UITableViewController 有一個 tableView 作為它的頂級視圖。 當然，如果您查看視圖調試器，您可以看到 tableview 不是根視圖。 因此，您可以以編程方式將按鈕添加到 tableView 的窗口中。 如果事后必須這樣做，這可能是在 UITableViewController 上添加頂級元素的最簡單方法。 否則，如果您在初始設計中這樣做，您可以為按鈕使用容器視圖，為 TableView 使用 UITableViewController。 這種方法的缺點是你最終會得到兩個視圖控制器，一個用於容器，一個用於表，並且通常需要在它們之間傳遞信息。 如果您使用 swift，您可以通過將 tableViewcontroller 嵌套在容器視圖控制器類中來簡化此操作。

如果你想在窗口中添加一個按鈕，一旦你確定視圖有一個窗口，你就可以懶惰地這樣做。 請注意，按鈕屬於窗口而不是視圖控制器，因此您有責任在視圖控制器消失時將其刪除。

    private weak var button: UIButton!
    ...
    override func didMove(toParentViewController parent: UIViewController?) {
        super.didMove(toParentViewController: parent)
        guard self.button == nil, let window = tableView.window else {
            return
        }
        let button = UIButton(frame: CGRect(x:0, y:40, width: 200, height: 20))
        button.setTitle("This is a red button", for: .normal)
        button.backgroundColor = UIColor.red
        window.addSubview(button)
        self.button = button
    }

    override func viewWillDisappear(_ animated: Bool) {
        super.viewWillDisappear(animated)
        button?.removeFromSuperview()
    }

Answer 6

您需要做的就是將您的頂視圖添加到navigationController.view如下所示：

self.navigationController?.view.addSubview(YOUR_TOP_VIEW)

因此，如果您需要在不隨 tableView 滾動的 TableViewController 之上使用粘性按鈕/視圖等，請使用此方法。

Answer 7

第1步 ：-

將一個 uiview 拖放到 UITable 視圖控制器（靜態）它會自動粘在底部。

如果需要，您還可以在 UIView 中添加兩個按鈕...這取決於您的要求。

第2步 ：-

為 uiview 連接插座（outletView）

第 3 步：-

在 View Will Appear 中添加以下代碼。

override func viewWillAppear(_ animated: Bool) {

    outletViewBottom.backgroundColor = .red
    tableView.addSubview(outletViewBottom)

    // set position
    outletView.translatesAutoresizingMaskIntoConstraints = false
    outletView.leftAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.leftAnchor).isActive = true
    outletView.rightAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.rightAnchor).isActive = true
    outletView.bottomAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.bottomAnchor).isActive = true
    outletView.widthAnchor.constraint(equalTo: tableView.safeAreaLayoutGuide.widthAnchor).isActive = true
    outletView.heightAnchor.constraint(equalToConstant: 50).isActive = true // specify the height of the view

}

第四步 ：-

現在運行代碼...快樂編碼。

Answer 8

這是一個 UIViewController，其中添加了一個 UITableView 作為子視圖。 在右上角，您可以看到一個下拉菜單，上面寫着內容：動態原型。 將其更改為靜態單元格。