現状
現在TableViewのCell内にCollectionViewを設け、横スワイプできるようにしました。
問題点
cellの横をすこし開けてNavigationのBigTitleの文字の位置とCellを合わせて
Leftに余白をConstraintsで設定しているのですがスワイプしたら
画像のように(わかりにくいですが...)余白分空いたところまでしかスワイプできないと思うのですが
AppleStoreのようにNavigationControllerのBigTitleと横幅が同じなのにも関わらず
横に抜けていくようにスワイプできるようにするのはどうすれば良いですか?
![]
下のリンクを参考に
【Xcode】UITableViewの区切り線のすきまについて
separatorInsetを試してみたのですが反映されませんでしたので制約で無理やりBigTitleと揃えている状態です。
気になる質問をクリップする
クリップした質問は、後からいつでもMYページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
回答1件
0
ベストアンサー
セル幅が画面幅であればページングを有効にすれば良いのですが、セル幅が小さい場合にはCollectionViewFlowLayout
を独自に実装することになると思います。
基本的には
の通りなのですが、これだと右余白が適切にならないので、こんな感じに実装することになるかと思います。
カスタムクラスとして UICollectionViewFlowLayout
をベースクラスとした MyCollectionViewFlowLayout
を作り、Interface Builder で作っている ContentsTableViewCell.xib の Collection View Flow Layout をこのカスタムクラスに置き換えると、思ったような動作になるかと思います。
Swift
1import UIKit 2 3class MyCollectionViewFlowLayout: UICollectionViewFlowLayout { 4 override func awakeFromNib() { 5 super.awakeFromNib() 6 7 // ここは CollectionView 内の画像サイズに合わせて変更する 8 self.itemSize = CGSize(width: 104, height: 136) 9 10 self.minimumInteritemSpacing = 10.0 11 self.minimumLineSpacing = 10.0 12 self.scrollDirection = .horizontal 13 14 // 右余白の計算 15 let w: Int 16 if let collectionView = self.collectionView { 17 w = Int(collectionView.frame.width) % Int(self.itemSize.width + self.minimumLineSpacing) 18 } else { 19 w = 10 20 } 21 22 self.sectionInset = UIEdgeInsets(top: 10.0, left: 10.0, bottom: 10.0, right: CGFloat(w) - (self.minimumLineSpacing - 10)) 23 } 24 25 override func targetContentOffset(forProposedContentOffset proposedContentOffset: CGPoint, withScrollingVelocity velocity: CGPoint) -> CGPoint { 26 27 guard let collectionView = self.collectionView else { 28 let latestOffset = super.targetContentOffset(forProposedContentOffset: proposedContentOffset, withScrollingVelocity: velocity) 29 return latestOffset 30 } 31 32 // Page width used for estimating and calculating paging. 33 let pageWidth = self.itemSize.width + self.minimumInteritemSpacing 34 35 // Make an estimation of the current page position. 36 let approximatePage = collectionView.contentOffset.x/pageWidth 37 38 // Determine the current page based on velocity. 39 let currentPage = velocity.x == 0 ? round(approximatePage) : (velocity.x < 0.0 ? floor(approximatePage) : ceil(approximatePage)) 40 41 // Create custom flickVelocity. 42 let flickVelocity = velocity.x * 0.3 43 44 // Check how many pages the user flicked, if <= 1 then flickedPages should return 0. 45 let flickedPages = (abs(round(flickVelocity)) <= 1) ? 0 : round(flickVelocity) 46 47 // Calculate newHorizontalOffset. 48 let newHorizontalOffset = ((currentPage + flickedPages) * pageWidth) - collectionView.contentInset.left 49 50 return CGPoint(x: newHorizontalOffset, y: proposedContentOffset.y) 51 } 52}
2020年12月4日追加
少し計算し直してみました。
これだと綺麗に表示されるようです。
Swift
1override func awakeFromNib() { 2 super.awakeFromNib() 3 4 // ここは CollectionView 内の画像サイズに合わせて変更する 5 self.itemSize = CGSize(width: 104, height: 136) 6 7 self.minimumInteritemSpacing = 10.0 8 self.minimumLineSpacing = 10.0 9 self.scrollDirection = .horizontal 10 11 // 右余白の計算 12 let w: Int 13 if let collectionView = self.collectionView { 14 w = Int(collectionView.frame.width) % Int(self.itemSize.width + self.minimumInteritemSpacing) 15 } else { 16 w = 10 17 } 18 19 self.sectionInset = UIEdgeInsets(top: 10.0, left: 10.0, bottom: 10.0, right: CGFloat(w) - (self.minimumInteritemSpacing + 10)) 20 }
投稿2020/12/02 23:02
編集2020/12/04 08:05総合スコア5086
あなたの回答
tips
太字
斜体
打ち消し線
見出し
引用テキストの挿入
コードの挿入
リンクの挿入
リストの挿入
番号リストの挿入
表の挿入
水平線の挿入
プレビュー
質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/12/03 13:59
2020/12/03 14:11
2020/12/03 14:37
2020/12/03 15:38 編集
2020/12/04 04:04
2020/12/04 08:06
2020/12/04 14:38
2020/12/04 14:59
2020/12/06 14:52