UITableViewControllerの上下の幅を広げて、上下スクロールしたい。

Question

ブルーのメニューバーのすぐ下に、
UITableViewControllerを挿入しています。
Twitterライクのマイページを作りたいです。
ストーリーボードは未使用です。

画像ではSample Itemというセルが４つ表示されていますが、
例えば、このセルの表示をグッと下に大きく広げたいです。

下記のコードではreturn 30 = セルを30個作っていて、
この画像のスクロールバーの位置で、
30個の内20個位のセルが一目で見れる様に下にグッと広げて、
そして残り10個のセルを見るために下にスクロールできる、という感じにしたいです。
画像の真ん中から下のスペースが埋まるイメージです。

原因を調べていまして、このマイページを構成する別のクラス自体が上下にスクロールできないから、
このUITableViewController自体の表示が小さいのかと試行錯誤しましたが、
原因がそこでは無かった様です。

また、セルの設定をいくら調整しても、
20個位のセルを一目でツイッターの様に見える様に作成できませんでした。

本物のツイッターでは２、３個のセルが常に表示される様に出来ていて、
下にスクロールしてどんどんツイートを見れるUIですが、その様に作りたいです。

下記のUITableViewControllerクラスで、
ツイッターの様に作り変えることができるのでしょうか？

教えていただければ幸いです。

//UITableViewControllerクラス


import UIKit

class MyTableViewController: UITableViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
   
        tableView.register(MyCell.self, forCellReuseIdentifier: "cellId")
    }
    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 30
    }
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        return tableView.dequeueReusableCell(withIdentifier: "cellId", for: indexPath)
    }

}


class MyCell: UITableViewCell {
    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        
        setupViews()
    }
    
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
}

    
    let nameLabel: UILabel = {
        let label = UILabel()
        label.text = "Sample Item"
        label.translatesAutoresizingMaskIntoConstraints = false
        label.font = UIFont.systemFont(ofSize: 10)
        return label
    }()
    
    
    func setupViews() {

        addSubview(nameLabel)
        addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-16-[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0": nameLabel]))
        addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0": nameLabel]))
    }  
  }

Comments

[fuzzball]

セルの高さを高くしたいということでしょうか？「UITableViewControllerを挿入しています」というのは、どうやって挿入しているのでしょうか？viewDidLoad()に print(self.tableView.rowHeight) を追記して出力を教えて下さい。また、self.tableView.rowHeight = 100 を追記するとどうなるか教えて下さい。

[fuzzball]

516kさんの回答を見て、勘違いしていたことに気が付きました。上記依頼への返信は不要です。

[退会済みユーザー]

fuzzball様　わかりました！見ていただきありがとうございます。

Answer 1

ページを構成するViewControllerにUIContainerViewにてMyTableViewControllerを埋め込んでテーブル部分を表示しているのかな？と推測致します。
その場合、テーブル部分の可視領域が狭い広いという問題であれば、そのテーブルを表示しているUIContainerViewのレイアウトに依存します。
平たく言うと、UIContainerViewのレイアウトをもっと広く取ればテーブルももっとたくさんの行が一度に見えるようになると言うことです。

Twitterアプリのような挙動はUITableViewのテーブルヘッダとセクションヘッダを組み合わせればシンプルな実装で真似ができます。
スクロールすると上に画面から消えてしまう部分をテーブルヘッダ、スクロールしても画面から消えずに上部に張り付き続ける部分をセクションヘッダにて作ると良いでしょう。

Comments

[退会済みユーザー]

516k様　ありがとうございます。
516k様のおっしゃるシンプルな実装というのは、
実際のツイッターで例えると、
上に画面から消えてしまう部分 = (ユーザーが設定できる)ヘッダー画像 から　フォロー中、フォロワーまでの範囲で、
消えずに上部に張り付き続ける部分 = ツイート数が表示されるナビバー / ツイート、ツイートと返信、メディア、いいね　のメニューバー / ツイート群 という意味でしょうか？

[516k]

UINavigationControlelrの中にTableViewControllerをセット、そのTableViewControllerに背景色付きの大きめのテーブルヘッダとセクションヘッダをセットして、何度もスクロールしてテストしてみるのはどうでしょうか。
Twiiterのアプリとの挙動とつきわせてみるとどこがどの部分かはある程度把握できると思います。

[退会済みユーザー]

516k様 理解できる様にテストして見ます。
ありがとうございました！