TableViewに2つのカスタムセルレイアウト

Question

私はmainStoryboardに2つのカスタムセルを持つtableViewを持っています。

別の行に2つ以上のセルを設定したいとします。私は答えを見つけようとしていたが、見つけられなかった。

以下に画像とコードが追加されています。代わりに、行としてステージを使用する

class HomeViewController: UIViewController, UITableViewDelegate, UITableViewDataSource, MFMailComposeViewControllerDelegate { 

     @IBOutlet var tblStoryList: UITableView! 

     var array = PLIST.shared.mainArray 



     override func viewDidLoad() { 
      super.viewDidLoad() 


     //spacing between header and cell 
      self.tblStoryList.contentInset = UIEdgeInsetsMake(-20, 0, 0, 0) 

      //delete separator of UITableView 
     tblStoryList.separatorStyle = .none 

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

     func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { 
      return self.array.count + 1 
     } 



     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 
      if indexPath.row == 0 { 
       let cell = tableView.dequeueReusableCell(withIdentifier: "HeaderCell", for: indexPath) as! HeaderCell 
       cell.headerTitle.text = "First Stage" 
       return cell 
      } 

      let cell = tableView.dequeueReusableCell(withIdentifier: "StoryTableviewCell", for: indexPath) as! StoryTableviewCell 


      //making plist file 
      let dict = self.array[indexPath.row - 1] 
      let title = dict["title"] as! String 
      let imageName = dict["image"] as! String 
      let temp = dict["phrases"] as! [String:Any] 
      let arr = temp["array"] as! [[String:Any]] 
      let detail = "progress \(arr.count)/\(arr.count)" 

      //property to plist file 
      cell.imgIcon.image = UIImage.init(named: imageName) 
      cell.lblTitle.text = title 
      cell.lblSubtitle.text = detail 

      cell.selectionStyle = UITableViewCellSelectionStyle.none 


      return cell 
     } 

Answer 1

はHeaderCellのためのあなたの条件を更新し、それは完全に働いたheaderTitle

if indexPath.row == 0 || indexPath.row == 3 || indexPath.row == 5 { 
    let cell = tableView.dequeueReusableCell(withIdentifier: "HeaderCell", for: indexPath) as! HeaderCell 
    cell.headerTitle.text = indexPath.row == 0 ? "First Stage" : indexPath.row == 3 ? "Second Stage" : "Third Stage" 
    return cell 
} 

Answer 2

、セクションヘッダーとして使用します。ヘッダーセクションにカスタムビューを配置できます。

主なアイデア： セクション-IZE、ステージと一緒にあなたの行を配列にセルのデータを入れて、そのキーとしてセクション値の辞書に追加します。あなたのケースを視覚化するために、辞書は以下のように見えます。

@{ 
    @"First Stage" : @[object_for_basic_grammar_1, 
         object_for_basic_grammar_2 
         ], 
    @"Second Stage": @[object_for_basic_grammar3], 
    ... 
    ... 
} 

、別の配列は、今のステップでリスト従わステップ

@[@"First Stage", @"Second Stage" 
] 

を以下に可視化します辞書のキーの順序を保存するために必要とされる：

1. 使用numberOfSections(in:)のためにそこに何段のステージがあるのでしょうか？セクションを格納している配列の数を返します。
2. tableView(_:numberOfRowsInSection:)を使用して、そのセクションの行数を指定します。後で宣言されたセクションリスト配列からセクション文字列オブジェクトを取得し、辞書内の行を検索します。ここに文法の配列があり、その配列の数を返します。
3. tableView(_:cellForRowAt:)を使用して、文法のセルで行ったように、その行の特定のセルを指定します。
4. セクションヘッダーの高さを指定する場合は、tableView(_:heightForHeaderInSection:)を使用します。
5. tableView(_:viewForHeaderInSection:)を実装して、セクションビューを指定するためのビューを返します。これはあなたの場合はステージです。

幸い、あなたに役立つことを願っています。