スポンサーリンク
iOSアプリ開発時に重要なAutoLayoutを手軽に実装できるStackViewというものがあること知ったので、使ってみた。
Storyboardを使わず、SwiftからコードでStackViewを入れ子にする。
以前の投稿で実装した画像3列表示をStackViewを使用し表示してみる。
// 列,行をカウントする変数 var colCnt = 1 var rowCnt = 1 // 親StackView(一覧全体表示用) var parentStack = UIStackView() let parStkHeight = CGFloat(self.view.bounds.height) * 0.7 let parStkWidth = CGFloat(self.view.bounds.width) * 0.7 parentStack.frame = CGRectMake(0, 0, parStkWidth, parStkHeight) parentStack = UIStackView() parentStack.axis = .Vertical parentStack.alignment = .Top parentStack.distribution = .FillEqually parentStack.spacing = 1 // 行StackView(一覧内の行用) var rowStack = UIStackView() // 画像StackView(各画像の画像と名前のセット用) var imageStack = UIStackView() // 取得した画像分ループしViewに配置 for i in 0 ..< json.length { if (colCnt == 1){ // 1列目のみの処理 // StackView初期化 rowStack = UIStackView() // 縦・横とも親viewの70% let rowStkHeight = CGFloat(self.view.bounds.height) * 0.7 let rowStkWidth = CGFloat(self.view.bounds.width) * 0.7 rowStack.frame = CGRectMake(0, 0, rowStkWidth, rowStkHeight) rowStack.axis = .Horizontal rowStack.alignment = .Top rowStack.distribution = .FillEqually rowStack.spacing = 1 } // 画像に付与する名前を生成 let eijiName = json[i]["eiji_name"].toString() let name = UILabel() name.text = eijiName // UIImageView インスタンスの生成 let imgName = eijiName + Const().PNG_EXTENSION let img = UIImage(named: imgName) let iconView = UIImageView(image:img) // アイコンのサイズを指定 iconView.bounds.size.width = 60 iconView.bounds.size.height = 60 // 画像StackViewを生成 imageStack = UIStackView() imageStack.frame = CGRectMake(0, 0, 60, 70) imageStack.axis = .Vertical imageStack.alignment = .Top imageStack.distribution = .FillEqually imageStack.spacing = 1 // 画像StackViewに追加 imageStack.addArrangedSubview(iconView) imageStack.addArrangedSubview(name) // StackViewに画像を追加 rowStack.addArrangedSubview(imageStack) if (colCnt == 3){ // 3列目のみの処理 // 親StackView parentStack.addArrangedSubview(rowStack) // 行を1加算、列をリセット rowCnt++ colCnt = 1 continue } colCnt++ } // スクロールビューに親StackView追加 scrView.addSubview(parentStack) // 行の数でスクロールの高さを変更 scrView.contentSize = CGSizeMake(240, 80 * CGFloat(rowCnt))
下記の参考サイトからコーディングしてみたが、なぜか何も表示されない。
WebでStackViewを入れ子にするコーディングを探してみたが見つからず。
何かAddする方法などが違うのか謎。
どなたか有識者がいましたら、教えてくださいませ。
スポンサーリンク
スポンサーリンク