用三个“列"来实现UITableView.在MapView中[快速] [英] Implementing UITableView with three "columns" in MapView [Swift]

问题描述

我正在尝试通过MapBox和TableView实现以下设计.

i'm trying to implement the following design with MapBox and a TableView.

我一直在考虑，我想使用UITableView作为结果，但据我所知，只有在&左侧有数据和详细信息，右边.有UITableView的替代方法吗?

I've been thinking about it and I wanted to use a UITableView for the results, but as far as I know, it's only possible to have data and detail on the left & right side. Is there an alternative to UITableView ?

如果没有，我还面临一个问题，即我的根"视图是 MapView (来自 MapBox )，并且我不能使用 MapViewController 作为 UITableViewController 或 UITableViewDelegate / UITableViewDataSource .是否可以将 MapView 嵌入另一个视图中?

If not, i'm also facing the problem that my "root"-View is a MapView (from MapBox) and that I can't use the MapViewController as UITableViewController nor as UITableViewDelegate/UITableViewDataSource. Is it possible to Embed the MapView in another View ?

如果您需要更多信息，请告诉我.并先谢谢您.

If you need any more information, just let me know. And thank you in advance.

推荐答案

假设你的故事板中有一个 UIViewController 或名为 ViewController 的 xib，它有两个 > UITableView 和 MKMapView (或您正在使用的任何一种)正确连接到以下代码中的两个插座:

Assuming that you have a UIViewController in your storyboard or xib called ViewController which has both a UITableView and an MKMapView (or whatever you are using) correctly connected to the two outlets in the code below:

import UIKit
import MapKit

class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate, MKMapViewDelegate {

    @IBOutlet weak var mapView: MKMapView!
    @IBOutlet weak var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Now tell the system that we are going to reference our
        // hand-made table cell from a xib called "MyCell"
        self.tableView.register(UINib(nibName: "MyCell", bundle: nil), forCellReuseIdentifier: "MyCell")
        // These next you can do here, or in IB...
        self.tableView.dataSource = self
        self.tableView.delegate = self
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    //MARK: - TableViewDataSource
    // ANY ViewController can do this, if we register the class as conforming
    // to the `UITableViewDataSource` protocol
    func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 3
    }
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // Get a reference to an instance of our very own UITableViewCell subclass,
        // Which we registered in `viewDidLoad`
        let c = self.tableView.dequeueReusableCell(withIdentifier: "MyCell", for: indexPath) as! MyCell

        // Whatever controls/outlets we have put in our cell subclass,
        // we need to populate with data now... (I just did a label)
        c.cellNumber?.text = "\(indexPath.row)"
        return c
    }
    //MARK: - TableViewDelegate
    //... implement whatever funcs you need ...

    //MARK: - MKMapViewDelegate
    //... implement whatever funcs you need ...

}

然后，您需要创建以下代码，以及一个独立的xib(在本例中为"MyCell.xib").Xib应该包含您想要在表格单元格中的所有控件.在我的示例中，它只有一个控件，即 UILabel 引用为 cellNumber .

You then need to create the following code, AND a stand-alone xib (called in this case "MyCell.xib"). The xib should contain all of the controls you want in your table cell. In my example it has only one control, the UILabel referenced as cellNumber.

要制作xib，请从Xcode菜单中选择文件"->新文件"->用户界面"->空"，然后将 UITableViewCell 从面板中拖放到xib中.确保将单元格的类从 UITableViewCell 更改为 MyCell .添加所需的任何控件(以及它们之间的约束).显然，将所有控件都连接到此类中的相关 @IBOutlets .

To make the xib, choose "File->New File->User Interface->Empty" from the Xcode menu, then drop a UITableViewCell into the xib from the palette. Make sure you change the class of the cell from UITableViewCell to MyCell. Add whatever controls (and constraints between them) that you need. Obviously, connect all of your controls to relevant @IBOutlets in this class.

class MyCell: UITableViewCell {
    // Create `@IBOutlet weak var ...` for all of the controls in your cell here
    @IBOutlet weak var cellNumber: UILabel!

    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        self.configureCell()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        self.configureCell()
    }

    func configureCell() {
        // Your stuff to load up the IBOutlet controls of your cell with defaults.
        // You will be able to override these when the instantiated cell is passed to
        // `tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell` 
        // in the `UITableViewDataSource`
    }
}

这篇关于用三个“列"来实现UITableView.在MapView中[快速]的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！