Swift - Wie erstellt man benutzerdefinierte viewForHeaderInSection, eine XIB-Datei verwenden?

Question

Ich kann einfache benutzerdefinierte ViewForHeaderInSection in programmgesteuert wie folgt erstellen. Aber ich möchte viel komplexere Dinge tun, vielleicht eine Verbindung mit einer anderen Klasse und ihre Eigenschaften wie eine TableView-Zelle erreichen. Ich möchte einfach sehen, was ich tue.

Gibt es jemanden zu erklären, wie kann ich eine benutzerdefinierte TableView-Header-Ansicht mit Xib erstellen? Ich habe alte Obj-C-Themen kennengelernt, aber ich bin neu in der Swift-Sprache. Wenn jemand so ausführlich erklärt, wäre es großartig.

1.Ausgabe: Knopf @IBAction nicht mit meinem Viewcontroller anschließen. (Fixed)

mit Datei des Gelöst Besitzer, Viewcontroller Basisklasse

2.issue (geklickt links Umriss-Menü.): Kopfhöhe Problem (Fixed)

Gelöst, indem hinzugefügt wird headerView.clipsToBounds = true in viewFor HeaderInSection: Methode.

Für constraint Warnungenthis answer solved my problems:

Wenn ich auch Image gleiche Höhe constraint mit dieser Methode in Viewcontroller, es über tableview Reihen look like picture fließen hinzugefügt.

func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat { 
    return 120 
} 

Wenn ich, automaticallyAdjustsScrollViewInsets in viewDidLoad, in diesem Fall Bild fließt unter navigationbar. -fixed-

self.automaticallyAdjustsScrollViewInsets = false 

3.issue: Wird die Taste unter Ansicht (Fixed)

@IBAction func didTapButton(sender: AnyObject) { 
    print("tapped") 

    if let upView = sender.superview { 
     if let headerView = upView?.superview as? CustomHeader { 
      print("in section \(headerView.sectionNumber)") 
     } 

    } 
} 

Answer 1

Das typische Verfahren für NIB basierte Header wäre:

1. Erstellen UITableViewHeaderFooterView Unterklasse mit mindestens einer Steckdose für Ihr Etikett. Vielleicht möchten Sie ihm auch einen Bezeichner geben, mit dem Sie zurückentwickeln können, welchem ​​Abschnitt dieser Header entspricht. Ebenso können Sie ein Protokoll angeben, mit dem die Kopfzeile den View-Controller über Ereignisse informieren kann (z. B. das Antippen der Schaltfläche). So in Swift 3:

   // if you want your header to be able to inform view controller of key events, create protocol 
   
   protocol CustomHeaderDelegate: class { 
       func didTapButton(in section: Int) 
   } 
   
   // define CustomHeader class with necessary `delegate`, `@IBOutlet` and `@IBAction`: 
   
   class CustomHeader: UITableViewHeaderFooterView { 
       weak var delegate: CustomHeaderDelegate? 
   
       @IBOutlet weak var customLabel: UILabel! 
   
       var sectionNumber: Int! // you don't have to do this, but it can be useful to have reference back to the section number so that when you tap on a button, you know which section you came from 
   
       @IBAction func didTapButton(_ sender: AnyObject) { 
        delegate?.didTapButton(in: sectionNumber) 
       } 
   
   } 
   

2. Erstellen NIB. Persönlich gebe ich der NIB den gleichen Namen wie die Basisklasse, um die Verwaltung meiner Dateien in meinem Projekt zu vereinfachen und Verwirrung zu vermeiden.Wie auch immer, sind die wichtigsten Schritte:

   • erstellen Ansicht NIB, oder wenn Sie mit einem leeren NIB gestartet, fügen Sie im Hinblick auf die NIB;

   • Legen Sie die Basisklasse der Ansicht auf was auch immer Ihre UITableViewHeaderFooterView Unterklasse war (in meinem Beispiel CustomHeader);

   • Fügen Sie Ihre Steuerelemente und Einschränkungen in IB hinzu;

   • Einhängen @IBOutlet Referenzen zu Steckdosen in Ihrem Swift-Code;

   • Schalte die Taste zum @IBAction

3. Im viewDidLoad im View-Controller, das NIB registrieren. In Swift 3:

   override func viewDidLoad() { 
       super.viewDidLoad() 
   
       tableView.register(UINib(nibName: "CustomHeader", bundle: nil), forHeaderFooterViewReuseIdentifier: "CustomHeader") 
   } 
   

   Oder in Swift 2:

   override func viewDidLoad() { 
       super.viewDidLoad() 
   
       tableView.registerNib(UINib(nibName: "CustomHeader", bundle: nil), forHeaderFooterViewReuseIdentifier: "CustomHeader") 
   } 
   

4. In viewForHeaderInSection, dequeue wiederverwendbaren Ansicht, die die gleiche Kennung verwenden Sie in dem vorherigen Schritt angegeben. Nachdem Sie das getan haben, können Sie jetzt Ihre Steckdose verwenden, Sie müssen nichts mit programmatisch erzeugten Einschränkungen usw. tun. Die einzige Überlegung, die Sie machen müssen (damit das Protokoll funktioniert), besteht darin, seinen Delegaten anzugeben. Zum Beispiel in Swift 3:

   override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? { 
       let headerView = tableView.dequeueReusableHeaderFooterView(withIdentifier: "CustomHeader") as! CustomHeader 
   
       headerView.customLabel.text = content[section].name // set this however is appropriate for your app's model 
       headerView.sectionNumber = section 
       headerView.delegate = self 
   
       return headerView 
   } 
   
   override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat { 
       return 44 // or whatever 
   } 
   

   Oder in Swift 2:

   override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? { 
       let headerView = tableView.dequeueReusableHeaderFooterViewWithIdentifier("CustomHeader") as! CustomHeader 
   
       headerView.customLabel.text = content[section].name 
       headerView.sectionNumber = section 
       headerView.delegate = self 
   
       return headerView 
   } 
   
   override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat { 
       return 44 // or whatever 
   } 
   

5. Natürlich, wenn Sie gehen zu dem View-Controller als delegate für die Schaltfläche in der Kopfsicht angeben , müssen Sie zu diesem Protokoll entsprechen:

   extension ViewController: CustomHeaderDelegate { 
       func didTapButton(in section: Int) { 
        print("\(section)") 
       } 
   } 
   

das alles klingt verwirrend, wenn ich eine Liste aller st Eps beteiligt, aber es ist wirklich ziemlich einfach, wenn Sie es einmal oder zweimal getan haben. Ich denke, es ist einfacher als das Erstellen der Header-Ansicht programmgesteuert.