質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

Swift 2

Swift 2は、Apple社が独自に開発を行っている言語「Swift」のアップグレード版です。iOSやOS X、さらにLinuxにも対応可能です。また、throws-catchベースのエラーハンドリングが追加されています。

Q&A

解決済

1回答

2123閲覧

Swift の UICollectionView 使い方について

shumach

総合スコア10

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

Swift 2

Swift 2は、Apple社が独自に開発を行っている言語「Swift」のアップグレード版です。iOSやOS X、さらにLinuxにも対応可能です。また、throws-catchベースのエラーハンドリングが追加されています。

0グッド

0クリップ

投稿2016/07/10 03:48

###前提・実現したいこと
iOS アプリを Swift で開発しています。
あるページで、以下のような 2 種類の高さが異なるセルを持ちかつ二列のテーブルを表示させたいと考えています。

・セルの要件
セルA:タイトルやセクションを表す。
セルB:タイトルに関連する文字列を表示する。セル A と、セル B は height が異なる。

セルAの高さ > セル B の高さ

表示されるページのイメージ

列1 列2 A A B B B B B A B B B B A A

列の要件
・列1 については、最上部と最下部にセル A が入る
・列2 については、最上部、最下部以外に真ん中当たりにセル A が存在する。(B のデータ数に依存するため何行目にセル A現れるかは不定だが、1 度は現れます。)

上記のテーブルを表示するために UICollectionView を利用しようと考えているのですが下記の点ご教示いただけますでしょうか。

  1. 各セルの上下の間隔は、一定値として作成したいと考えています。

そのためこの例の場合、列 2 列 4 行目に A が入っていますので、5 行目の列1,2 の B の Y 座標はそれぞれ異なる位置から開始されるようにしたいと考えています。
またその結果、7 行目終了時点で、列 2 の方が長くなるようなテーブルを作りたいと思っています。
このような実装が可能でしょうか。
もし可能な場合、サンプルコード、あるいはチュートリアル等のページがあれば教えていただけると大変助かります。

  1. UICollectionView を利用すると、どのサンプルも横方向に要素を挿入されているものが多いですが縦方向に値を入れる方法はありますでしょうか。

サーバー側のデータ構造として列毎にデータが入っているため、UICollectionView の際も横に走査するのではなく、縦に走査できた方が実装しやすいという状況です。
これも良い SDK、チュートリアル等あれば教えていただけると幸いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

列1、列2の意味がわかってないのでイメージしづらいのですが、もし行数が多くて画面サイズをはみ出した時、列1と列2は別々に縦スクロールするものですか?
別々に縦スクロールさせるのだったら、列1と列2は別々のUITableViewで作ればいいと思います。

もし列1と列2の各行に関連があって一緒にスクロールさせるものだったら、
列1行1
列2行1
列1行2
列2行2
列1行3
列2行3
列1行4
列2行4
の順にデータを表示することにして、
https://www.raywenderlich.com/107439/uicollectionview-custom-layout-tutorial-pinterest
とかを参考に、セルの高さに応じて詰めて表示するカスタムレイアウトを作ればよいと思います。


(2016/7/11 8:10追記)
2番目の質問に回答してなかったので追記します。

UICollectionView を利用すると、どのサンプルも横方向に要素を挿入されているものが多いですが縦方向に値を入れる方法はありますでしょうか。

縦に並べてデータを表示したいなら、UICollectionViewのFlow Layoutでスクロール方向をHorizontalにするか、カスタムレイアウトで縦に並べるようにレイアウトを作ればできます。
しかしこの場合、縦に並べてはみ出た分は、次(右)の列に続きのデータを縦並べで表示します。そしてどんどん右の列にデータを追加して行って、表示しきれなくなったら右にスクロールできるようにして続きのデータを縦並べで表示していきます。

あなたがやりたいのは、列は2列しかなくて、行がはみ出たら下にスクロールしたいんじゃないでしょうか?
でしたら、前述の通り
列1行1
列2行1
列1行2
列2行2
列1行3
列2行3
列1行4
列2行4
の順に2列の横並べでデータを表示することにして、 足りない行は縦スクロールで表示する必要があると思います。

投稿2016/07/10 22:43

編集2016/07/10 23:08
TakeOne

総合スコア6299

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

shumach

2017/03/18 04:38

遅くなりすみません。。いただいた情報でかいけつできました!ありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問