【Xcodeのお勉強】Navigation ControllerとTableView

土曜日の仕事終わりに虐殺器官を見てきた。「自由を捨てて自由を得る」という言葉が印象的だった。なかなかシリアスな映画だったけれども人間のネジ曲がった愛情と報復を現代の抱える問題になぞらえて映像化されたんだなと感じた。人間には「虐殺」的器官が存在してる、とかすごい設定だけど。

今日はNavigation ControllerとTableViewのお勉強です。

Navigation Controllerを配置してinitialに設定する

TableViewとNavigationControllerは割りと密接な関係らしい。確かにテーブル状のリストから各ページに遷移し、戻り、みたいなのはよく見かける。デフォルトではUtility areaからNavigationControllerを引っ張ってくると、TableViewControllerもセットで付随してくる。この時デフォルトで配置されていたViewControllerは使わなくなるので削除し、Navigation Controllerに「is Initial View Controller」のチェックをつけて起動時の最初の画面にする。

TableViewのセルを設定する

TableViewのセルの設定を以下のようにした

・Style
├Basic(タイトルだけ)
├Right Detail(タイトルと右側に説明みたいなやつ)
├Left Detail(上記の左バージョンっぽい)
└Subtitle(タイトルに小見出しがついてる)
・Identifier・・・Cell(名前みたいなもん)
・Accessory
├Disclosure Indicator(右側にやじるしがつく)
├Detail Disclosure(iマークとやじるし)
├Checkmark(チェック)
└Detail(iマーク)

 

セグエをつなげる

新しくViewControllerを配置し(最初のやつは消さなくてもよかったん。。。)Controllボタンを押しながらセグエをつなげる

セグエにIdentifierを設定する

セグエを選択してStoryboard Segue欄のIdentifierに「showWebPage」と設定する。

WebViewを配置する

Utility areaからWeb Viewをドラッグアンドロップして配置する。また、全画面表示のため、auto layoutを設定し、WebViewのScalingという項目で「Scales Page To Fit」を選択した。ページをぴったりにひょうじするやつぽい。

Outlet接続する

この時はまったのがControllボタンを押して.swiftファイルに線を引っ張っても接続できなかった。どうやらUIViewControllerのカスタムクラスを設定していなかったことが問題らしい。むずかしい。「ViewController」をカスタムクラスにしてなんとかなった。

カスタムクラスを作る

Webサイトのリストを作るためにTableViewのカスタムクラスを作る。「WebListTableViewController」という名前で以下の通り作成する。

作成したカスタムクラスを紐付ける

 

WebListTableViewControllerでwebリストを作成する

UITableViewControllerがUIViewControllerを継承している。そのためUITableViewDelegateとUITableViewDataSourceをプロトコルとして追加しているクラスに当たるのでUITableViewControllerクラスを継承するだけでテーブルビューを作成できる。

セルに表示するデータ

let webList = [
(name:"アップル", url:"http://www.apple.com/jp/"),
(name:"ほげほげ1", url:"http://hogehoge.jp"),
(name:"ほげほげ2", url:"http://hogehoge.jp"),
(name:"ほげほげ3", url:"http://hogehoge.jp")
]

セルのタイトルとサブタイトル

//セルを作る
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)

// テーブルにwebListのデータを表示する
let webData = webList[(indexPath as NSIndexPath).row]
cell.textLabel?.text = webData.name
cell.detailTextLabel?.text = webData.url

return cell
}

移動先のViewControllerにwebDataデータを受け渡す

override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
// Get the new view controller using segue.destinationViewController.
// Pass the selected object to the new view controller.
if segue.identifier == "showWebPage" {
//セグエがshowWebPageの時に実行
if let indexPath = self.tableView.indexPathForSelectedRow {
//行のデータを取り出す
let webData = webList[(indexPath as NSIndexPath).row]
//移動先のビューコントローラーのdataプロパティに値を設定する
(segue.destination as! ViewController).data = webData
}
}
}

Webページを表示するViewControllerクラス

class ViewController: UIViewController {

@IBOutlet weak var webView: UIWebView!

//シーン移動の際に設定されるWebデータ
var data:(name:String, url:String)?

//webページを開く
func openWeb() {
//dataが設定されていればwebDataに入れる
if let webData = data {
//アクセスするURLを作る
if let url = NSURL(string:webData.url) {
let urlReq = NSURLRequest(url: url as URL)
//webページを開く
webView.loadRequest(urlReq as URLRequest)
}
}
}


override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.

//webページを開く
openWeb()
}

override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}

ATSの設定

サイトのセキュリティ周りの設定と。info.plistにて。

 

コード完コピマンだから何も見ずにこれ作るのは未だ無理やな・・・

この記事が気に入ったら
いいね ! しよう