Verschiedene Layout in verschiedenen Tabellenansicht Abschnitte

Question

Hallo Ich möchte verschiedene Layouts in verschiedenen Abschnitten von UITableView haben, möchte ich es mit dynamischen Prototyp-Zellen tun und nicht mit statischen Zellen. Ich weiß nicht, wie man es erstellt, bitte helfen. Irgendwelche Verbindungen oder etwas. Ich möchte so, siehe das Bild pls download the pic

Bitte geben Sie Ihren Code, wenn in swift.

Answer 1

Nach Ihren Angaben scheint es, als ob Sie eine gruppierte tableView wünschen, in der Ihre verschiedenen Abschnitte unterschiedliche Zellentypen haben. Das ist ziemlich einfach.

Also lass uns anfangen. Ich erklärte den ganzen Durchlauf von Grund auf durch die Screenshots. Wenn Sie nur dem folgen, werden Sie das Konzept und den Prozess verstehen.

(Ich gehe davon aus, wissen Sie, wie notwendig Einschränkungen hinzufügen)

Zum einen in das Storyboard gehen und eine Tableview in der Controller ziehen.

Erstellen Sie dann 2 Benutzerdefinierte UITableViewCell

classes-

jetzt per Drag & Drop 2 Tableview Zellen in Ihrem Tableview in Storyboard.

Also, Sie haben 2 Tableview Zellen in Ihrem Tableview, für die Sie bereits zwei benutzerdefinierte Zellen angelegt haben.

Jetzt müssen wir die Zellklassen zuordnen, damit sie verstehen kann, welcher Klasse sie entsprechen soll. Wählen Sie die erste Zelle im Storyboard, klicken Sie auf den Klasseninspektor und weisen ihre Klassen-

das gleiche für die zweite Zelle -

Wir müssen auch sie geben eindeutige Kennungen. Wählen Sie die erste Zelle und weisen eine Kennung wie -

Sie das gleiche für die zweite Zelle -

Wir sind fast die Benutzeroberfläche einrichten getan. Das letzte Stück soll dem UITableView mitteilen, dass es sich um einen "Gruppen" -Typ handelt.

erneut die Tableview auswählen und ordnen ihre Art zu „Gruppe“ wie-

Jetzt sind wir gut zu gehen.

Lassen Sie uns einige IBOutlets in unseren benutzerdefinierten TableViewCells deklarieren, die wir zuvor erstellt haben.

TypeOneTableViewCell.swift klassen

import UIKit 

class TypeOneTableViewCell: UITableViewCell { 

    @IBOutlet weak var cellImageView: UIImageView! 
    @IBOutlet weak var cellTitleLabel: UILabel! 
    @IBOutlet weak var cellSubtitleLabel: UILabel! 

    override func awakeFromNib() { 
     super.awakeFromNib() 

    } 
} 

und TypeTwoTableViewCell.swift klassen

import UIKit 

class TypeTwoTableViewCell: UITableViewCell { 

    @IBOutlet weak var cellTitleLabel: UILabel! 
    @IBOutlet weak var cellSubtitleLabel: UILabel! 
    @IBOutlet weak var cellButton: UIButton! 


    override func awakeFromNib() { 
     super.awakeFromNib() 
    } 
} 

zum Storyboard gehen und ein Bild und zwei Etiketten in den ersten Prototyp Zelle hinzufügen und bringen Sie sie mit der Steckdosen.

nun in der zweiten Zelle, einen Knopf und zwei Labels hinzuzufügen und den Auslässen die gleichen wie vor-

genug mit der Einrichtung zu verbinden. Lass uns ein paar echte Sachen machen. Gehen Sie zu Ihrer Controller-Klasse und zunächst eine IBOutlet für Ihre Tableview erstellen wie-

@IBOutlet weak var groupedTableView :UITableView! 

Vergessen Sie nicht, die Tableview der Steckdose im Storyboard zu befestigen.

Nun müssen wir den Tableview Delegierten und Datenquelle. Also, lasst sie in der Protokollliste enthalten wie-

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { 

Gerade jetzt, können Sie einen Fehler bekommen, weil Sie nicht die erforderlichen Delegatmethoden implementieren haben, die in der UITableViewDataSource Protokoll ist, aber es ist in Ordnung, wird es werde bald gelöst werden.

Erste Sache zuerst. Geben Sie an, wer die Delegate- und Datenquellenmethoden implementieren wird. Gehen Sie zu Ihrem viewDidLoad Methode und fügen Sie diese -

override func viewDidLoad() { 
     super.viewDidLoad() 
     self.groupedTableView.dataSource! = self 
     self.groupedTableView.delegate! = self 
    } 

dann informieren Sie Ihren Tableview, dass Sie zwei Schnitte durch die numberOfSectionsInTableView Methode wie-

func numberOfSectionsInTableView(tableView: UITableView) -> Int { 
     return 2 
    } 

haben wird und dann angeben, wie viele der Zellen, wobei jeder Abschnitt wird gehalten. Nehmen wir an, der erste Abschnitt enthält vier Zeilen und der zweite enthält drei Zeilen. Verwenden Sie dazu die Methode numberOfRowsInSection.

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int{                     
     if section == 0{ 
      return 4 
     } 
     else{ 
      return 3 
     } 
    } 

und der letzte Teil, um die Zelle zu definieren und es ist daten-

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell{ 
     if indexPath.section == 0{ 
      let cell : TypeOneTableViewCell = tableView.dequeueReusableCellWithIdentifier("typeOneCell", forIndexPath: indexPath) as! TypeOneTableViewCell 

      cell.imageView!.image = UIImage(named: "noImage.png") 
      cell.cellTitleLabel.text = "Header " + "\(indexPath.section)" + "-" + "\(indexPath.row)" 
      cell.cellSubtitleLabel.text = "Details " + "\(indexPath.section)" + "-" + "\(indexPath.row)" 
      return cell 
     } 
     else{ 
      let cell : TypeTwoTableViewCell = tableView.dequeueReusableCellWithIdentifier("TypeTwoCell", forIndexPath: indexPath) as! TypeTwoTableViewCell 

      cell.cellTitleLabel.text = "Header " + "\(indexPath.section)" + "-" + "\(indexPath.row)" 
      cell.cellSubtitleLabel.text = "Details " + "\(indexPath.section)" + "-" + "\(indexPath.row)" 
      return cell 

     } 
    } 

Sie dort hin gehen! TableView hat viele Delegate-Methoden wie heightForRowAtIndexPath, um die Höhen von benutzerdefinierten Zellen anzugeben. In meinem Fall habe ich es als 80.0 like-

func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat { 
     return 80.0 
    } 

Sie können viel mehr Anpassungen mit diesen Delegierten Methoden. Überprüfen Sie die Apple-Anleitung für UITableView.

P.S. : Zur Verschönerung habe ich hier ein Bild hinzugefügt.Wenn Sie die gleiche Art und Weise implementieren, ich habe, sollten Sie die Ausgabe wie-

Hoffnung sehen, das hilft.

Answer 2

Für Zellen dynamisch zu sein, dies zu tun:

func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat { 
    if (indexPath.row==0 && indexPath.section==0){ 
     //static cell 
     return 120 //static height 
    } 

    return UITableViewAutomaticDimension //for dynamic cell height 
} 

func tableView(tableView: UITableView, estimatedHeightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat { 
    return UITableViewAutomaticDimension 
} 

Außerdem müssen Sie sicherstellen, dass Ihre Elemente in der Zelle mit automatischem Layout für die korrekte Platzierung der Elemente mit dynamischer Höhe gebunden sind.