Swift ile Birden Fazla Özel Hücre ile UITableview


111

Farklı özel tableViewCells ile bir UITableview kullanmak istiyorum. 3 hücrem şöyle:

  • Hücre1: bir resim ve bir etikete sahip olmalıdır.
  • Hücre2: iki etikete sahip olmalıdır.
  • Hücre3: bir dayPicker olmalıdır.

Hücreler için bir etiket kodlamak istemiyorum. Bunu Swift ile nasıl yönetebilirim? Her hücre için kendi sınıfımı kodlamalı mıyım? Bir tableviewController kullanabilir miyim? Verileri farklı hücrelerde nasıl doldurabilirim?

Bir iOS cihazının iletişim uygulaması gibi bir tableView oluşturmak istiyorum.



Yanıtlar:


270

Önce sorularınızı cevaplayarak başlayayım.

Her hücre için kendi sınıfımı mı kodlamalıyım? => Evet, öyle olduğuna inanıyorum. En azından ben öyle yapardım.

Bir tableviewController kullanabilir miyim? => Evet, yapabilirsiniz. Bununla birlikte, Görüntü Kumandanızın içinde bir tablo görünümüne de sahip olabilirsiniz.

Verileri farklı hücrelerde nasıl doldurabilirim? => Koşullara bağlı olarak, verileri farklı hücrelere doldurabilirsiniz. Örneğin, ilk iki satırınızın ilk hücre türü gibi olmasını istediğinizi varsayalım. Yani, sadece ilk hücre tiplerini oluşturursunuz / yeniden kullanırsınız ve verilerini ayarlarsınız. Sanırım size ekran görüntülerini gösterdiğimde daha net olacak.

Size ViewController içinde TableView olan bir örnek vereyim. Ana konsepti anladıktan sonra, istediğiniz gibi deneyebilir ve değiştirebilirsiniz.

Adım 1: 3 Özel TableViewCells oluşturun. Ben buna FirstCustomTableViewCell, SecondCustomTableViewCell, ThirdCustomTableViewCell adını verdim. Daha anlamlı isimler kullanmalısınız.

görüntü açıklamasını buraya girin

Adım 2: Main.storyboard'a gidin ve View Controller'ınızın içine bir TableView sürükleyip bırakın. Şimdi, tablo görünümünü seçin ve kimlik denetçisine gidin. "Prototip Hücreleri" 3'e ayarlayın. Burada, TableView'ınıza 3 farklı hücre türüne sahip olabileceğinizi söylediniz.

görüntü açıklamasını buraya girin

Adım 3: Şimdi, TableView'ınızdaki 1. hücreyi seçin ve kimlik denetçisinde, Özel sınıf alanına "FirstCustomTableViewCell" yazın ve ardından tanımlayıcıyı öznitelik denetçisinde "firstCustomCell" olarak ayarlayın.

görüntü açıklamasını buraya girin

görüntü açıklamasını buraya girin

Diğerleri için de aynısını yapın - Özel Sınıflarını sırasıyla "SecondCustomTableViewCell" ve "ThirdCustomTableViewCell" olarak ayarlayın. Ayrıca tanımlayıcıları art arda secondCustomCell ve thirdCustomCell olarak ayarlayın.

Adım 4: Özel Hücre Sınıflarını düzenleyin ve ihtiyacınıza göre çıkışlar ekleyin. Sorunuza göre düzenledim.

Not: Çıkışları sınıf tanımının altına koymanız gerekir.

Dolayısıyla, FirstCustomTableViewCell.swift'te,

class FirstCustomTableViewCell: UITableViewCell {

etiketinizi ve resim görüntüleme çıkışlarınızı koyarsınız.

 @IBOutlet weak var myImageView: UIImageView!
 @IBOutlet weak var myLabel: UILabel!

ve SecondCustomTableViewCell.swift içinde, şu iki etiketi ekleyin:

import UIKit

class SecondCustomTableViewCell: UITableViewCell {

    @IBOutlet weak var myLabel_1: UILabel!
    @IBOutlet weak var myLabel_2: UILabel!

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

    override func setSelected(selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
}

ve ThirdCustomTableViewCell.swift şöyle görünmelidir-

import UIKit

class ThirdCustomTableViewCell: UITableViewCell {

    @IBOutlet weak var dayPicker: UIDatePicker!

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

    override func setSelected(selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
}

Adım 5: ViewController'ınızda, TableView'unuz için bir Çıkış oluşturun ve bağlantıyı film şeridinden ayarlayın. Ayrıca, protokol listesi olarak sınıf tanımına UITableViewDelegate ve UITableViewDataSource eklemeniz gerekir. Yani, sınıf tanımınız şöyle görünmeli:

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

Bundan sonra, tablo görünümünüzün UITableViewDelegate ve UITableViewDatasource'unu denetleyicinize ekleyin. Bu noktada, viewController.swift'iniz şöyle görünmelidir:

import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    @IBOutlet weak var tableView: UITableView!

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

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

Not: ViewController içinde TableView yerine TableViewController kullanacak olsaydınız, bu adımı atlamış olabilirsiniz.

Adım 6: Hücre sınıfına göre hücrenizdeki görüntü görünümlerini ve etiketleri sürükleyip bırakın. ve ardından film şeridinden çıkışlarına bağlantı sağlar.

Adım 7: Şimdi, UITableViewDatasource'un gerekli yöntemlerini görünüm denetleyicisine yazın.

import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    @IBOutlet weak var tableView: UITableView!

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

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

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 3
    }

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        if indexPath.row == 0 {
            let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "firstCustomCell")
            //set the data here
            return cell
        }
        else if indexPath.row == 1 {
            let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "secondCustomCell")
            //set the data here
            return cell
        }
        else {
            let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "thirdCustomCell")
            //set the data here
            return cell
        }
    }

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

1
Func cellForRowAtIndexPath içinde "'UITableViewCell' (0x1dfbfdc) türünün değeri 'Projekt.TitelTableViewCell' (0x89568) 'e dönüştürülemedi" mesajını alıyorum. Bir UITableViewController kullanıyorum ve "TitelZelle" Hücresinin kimlik denetçisinde ayarladığım özel hücrem "TitelZelle" için bir "TitelTableViewCell" sınıfım var. Ne yapmam gerek?
Easyglider

Ben hücremi gibi attım! Bu hücrede özel UI öğelerimi doldurmak için TitelTableViewCell.
Easyglider

7
bunu deneyin => let cell = tableView.dequeueReusableCellWithIdentifier ("TitelZelle", forIndexPath: indexPath) as TitelTableViewCell
Natasha

2
@PradipKumar, sorun nedir? Senin hatan ne? Btw, herhangi bir sorunuz varsa bir soru sormalısınız. Yazar, belirli bir sorunla ilgili olarak bunu anlamaya veya açıklığa kavuşturmaya yardımcı olması gerekiyordu. Bir sorununuz varsa, soru sormaya gitmeli ve kendi görevinize başlamalısınız.
Natasha

1
numberOfRowsInSection, tablo görünümünün kaç satır istediğimizi belirlemesine yardımcı olur. Bu nedenle, yalnızca yöntemin satır sayısını belirlemesine yardımcı olacak cümle sağlamalısınız. indexpath.row == 0, zaten bir satırınız olduğu anlamına gelir, ancak o sırada tablonuzda bir satır olup olmadığını bilmiyordur. Yani, böyle yapmalısın.
Natasha

32

Minimum kodla Swift 3.0 + güncelleme

Temel kavram: Dinamik hücre prototipleriyle bir tablo görünümü oluşturun. Her hücre prototipi için tanımlayıcı atayın ve özel tablo görünümü hücre sınıfı oluşturun. Tablo görünümünün temsilci yönteminde özel hücreleri başlatın ve gösterin.

1. Film şeridinde hücreler oluşturun

Bir tableView'i görünüm denetleyicinize sürükleyin, prototip hücreleri ekleyin ve ardından UI öğesini tablo görünümü hücrelerinize bırakın, gerekirse kısıtlamayı düzgün şekilde ekleyin.

görüntü açıklamasını buraya girin

2. Özel UITableViewCellsınıflar oluşturun

Aşağıdaki kodu projenize ekleyin. Bunu view controller sınıfının hemen üstüne koyuyorum.

class FirstTableCell: UITableViewCell {
}

class SecondTableCell: UITableViewCell {
}

class ThirdTableCell: UITableViewCell {   
}

3. Hücre prototiplerine özel sınıf ve tanımlayıcı atayın

Film şeridindeki hücre prototiplerinin her biri için, 2. adımda oluşturulan özel sınıfı atayın ve ardından benzersiz bir tanımlayıcı girin.

görüntü açıklamasını buraya girin

4. UI öğelerini hızlı koda bağlayın

Kontrol tablo görünümünü sürükleyin ve görünüm denetleyicisi sınıfına bağlanın. 1. adımda hücre prototiplerine eklenen UI öğelerini kontrol edin ve ilgili tablo görünümü hücre sınıfına bağlanın.

görüntü açıklamasını buraya girin

5. Denetleyiciyi görüntülemek ve tablo görünümünü denetlemek için kod ekleyin

Görünüm denetleyicinizi tablo görünümü temsilcisine uygun hale getirin

class YourViewController: UIViewController, UITableViewDataSource, UITableViewDelegate

İçinde viewDidLoad, tablo görünümünün temsilcisini ve veri kaynağını ayarlayın.

override func viewDidLoad() {
    super.viewDidLoad()

    self.tableView.dataSource = self
    self.tableView.delegate = self

}

Son olarak, minimum gereksinime göre tablo görünümünüzü kontrol etmek için iki temsilci yöntemi ekleyin.

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 3
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    if indexPath.row == 0 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "firstTableCell") as! FirstTableCell
        // Set up cell.label
        return cell
    } else if indexPath.row == 1 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "secondTableCell") as! SecondTableCell
        // Set up cell.button
        return cell
    } else {
        let cell = tableView.dequeueReusableCell(withIdentifier: "thirdTableCell") as! ThirdTableCell
        // Set up cell.textField
        return cell
    }
}

6. Deneyin :)

görüntü açıklamasını buraya girin


Fantastik! Animasyonlarınıza bayılıyorum.
iphaaw

Lütfen bana söyler misiniz, Her hücreye bir başlık koymak mümkün mü? Öyleyse nasıl?
Pruthvi Hariharan

@PruthviHariharan Hücrelerinizin her biri veya çoğu için bir "başlık" olmasını istiyorsanız, yönetmek için daha fazla koda ihtiyaç duyan ve performansı etkileyecek bir başlık hücresi veya bölüm başlıkları uygulamak iyi bir fikir değildir. Önerim, prototip hücrenizin üzerine bir görünüm koymak ve onu bir "başlık" gibi görünmesini sağlamak
Fangming

@FangmingNing Lütfen küçük bir örnekle açıklar mısınız? Teşekkürler
Pruthvi Hariharan

UIViewController yerine UITableViewController kullanıyorsanız 5. adıma ihtiyacınız yoktur.
Deepak Thakur

0

Yukarıdaki cevaplar en iyi cevaplardır, ancak bu sorunu almanın TONS nedeni vardır. İşte bu sorunu yaşayan herkes için başka bir olası çözüm:

Benim sorunum, storyboard görünümüne değil, ViewController sınıfına geçiş yapmamdı. Yani film şeridi hücresine atıfta bulunmam anlamsızdı çünkü film şeridi kullanılmıyordu.

Ben bunu yapıyordum:

let viewControllerB = SubViewController()
viewControllerB.passedData = diseases[indexPath.row].name
navigationController?.pushViewController(viewControllerB, animated: true)

Ve bunun gibi bir şey yapmam gerekiyordu:

let storyBoard : UIStoryboard = UIStoryboard(name: "Main", bundle:nil)
let nextViewController = storyBoard.instantiateViewController(withIdentifier: "SubViewStoryboardController") as! SubViewController
nextViewController.passedData = diseases[indexPath.row].name
self.present(nextViewController, animated:true, completion:nil)

Umarım bu birine yardımcı olur.


-22

UITableViewControllerUIViewControllerzaten kendi üzerinde UITableviewDataSource& UITableviewDelegateeşlenmiş olanı miras alıyor .

Sen alt sınıfı olabilir UITableViewControllerveya kullanmak TableViewgözündeki ViewController. Gerekli yöntemler uygulamalıdır Bundan sonra ( cellForRowAtIndexPath and numberOfRowsInSection) 'de beyan edildiği UITableviewDataSource.

Ayrıca film şeridinde, benzersiz kimliğe sahip hücre prototipleri oluşturmanız gerekir.

Temel hücre türleri vardır, (örneğin başlık, alt başlık) - özel yapılandırmaya ihtiyacınız yoksa bunları da kullanabilirsiniz.

Yani, seçici için, evet, kendi özel hücrenizi oluşturmanız gerekir. Gerekli özel UITableViewCellsınıf tutma tarihi seçiciyi oluşturun ve istediğiniz sonucu ViewController.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.