UICollectionViewのフローレイアウトを水平スクロール付き垂直リストに変更するには

Question

基本的には、3つのセルが積み重なったテーブルが作成されています。しかし、3つ以上のセルがある場合は、コレクションビューで左にスワイプしてより多くのセルを表示できるようにしたいと考えています。ここに説明する写真があります。

今、私はセルをリストに配置していますが、何らかの理由でスクロール方向を変更できないようです。 - 彼らはまだここでは、垂直

をスクロールフローレイアウトのための私の現在のコードです：

注：私は、私は考えていないとして、私のビューコントローラであるコレクションビューのコードを含めるつもりはありません関連性があります。

輸入財団 輸入のUIKit

class HorizontalListCollectionViewFlowLayout: UICollectionViewFlowLayout { 

    let itemHeight: CGFloat = 35 





    func itemWidth() -> CGFloat { 
     return collectionView!.frame.width 
    } 

    override var itemSize: CGSize { 
     set { 
      self.itemSize = CGSize(width: itemWidth(), height: itemHeight) 
     } 
     get { 
      return CGSize(width: itemWidth(), height: itemHeight) 
     } 
    } 

    override func targetContentOffset(forProposedContentOffset proposedContentOffset: CGPoint) -> CGPoint { 
     return collectionView!.contentOffset 
    } 

    override var scrollDirection: UICollectionViewScrollDirection { 

     set { 
      self.scrollDirection = .horizontal 

     } get { 

      return self.scrollDirection 
     } 
    } 


} 

Answer 1

あなたが正しいサイズのあなたの細胞を持っている場合は、水平流レイアウトは...正確に何をしたいんダウン記入し、横断ます。ここで

簡単な例（このクラスにだけ設定ビューコントローラ - 不要IBOutlets）である：私はあなた次第「ページングを有効にする」の部分を残しておきます

// 
// ThreeRowCViewViewController.swift 
// 
// Created by Don Mag on 6/20/17. 
// 

import UIKit 

private let reuseIdentifier = "LabelItemCell" 

class LabelItemCell: UICollectionViewCell { 
    // simple CollectionViewCell with a label 

    @IBOutlet weak var theLabel: UILabel! 

    let testLabel: UILabel = { 
     let label = UILabel() 
     label.font = UIFont.systemFont(ofSize: 14) 
     label.textColor = UIColor.black 
     label.translatesAutoresizingMaskIntoConstraints = false 
     return label 
    }() 

    override init(frame: CGRect) { 
     super.init(frame: frame) 
     addViews() 
    } 

    func addViews(){ 
     addSubview(testLabel) 
     testLabel.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 8.0).isActive = true 
     testLabel.centerYAnchor.constraint(equalTo: self.centerYAnchor, constant: 0.0).isActive = true 
    } 

    required init?(coder aDecoder: NSCoder) { 
     fatalError("init(coder:) has not been implemented") 
    } 

} 

class ThreeRowCViewViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout { 

    // 3 gray colors for the rows 
    let cellColors = [ 
     UIColor.init(white: 0.9, alpha: 1.0), 
     UIColor.init(white: 0.8, alpha: 1.0), 
     UIColor.init(white: 0.7, alpha: 1.0) 
    ] 

    var theCodeCollectionView: UICollectionView! 

    override func viewDidLoad() { 
     super.viewDidLoad() 

     // height we'll use for the rows 
     let rowHeight = 30 

     // just picked a random width of 240 
     let rowWidth = 240 

     let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout() 

     // horizontal collection view direction 
     layout.scrollDirection = .horizontal 

     // each cell will be the width of the collection view and our pre-defined height 
     layout.itemSize = CGSize(width: rowWidth - 1, height: rowHeight) 

     // no item spacing 
     layout.minimumInteritemSpacing = 0.0 

     // 1-pt line spacing so we have a visual "edge" (with horizontal layout, the "lines" are vertical blocks of cells 
     layout.minimumLineSpacing = 1.0 

     theCodeCollectionView = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout) 
     theCodeCollectionView.dataSource = self 
     theCodeCollectionView.delegate = self 
     theCodeCollectionView.register(LabelItemCell.self, forCellWithReuseIdentifier: reuseIdentifier) 
     theCodeCollectionView.showsVerticalScrollIndicator = false 

     // set background to orange, just to make it obvious 
     theCodeCollectionView.backgroundColor = .orange 

     theCodeCollectionView.translatesAutoresizingMaskIntoConstraints = false 

     self.view.addSubview(theCodeCollectionView) 

     // set collection view width x height to rowWidth x (rowHeight * 3) 
     theCodeCollectionView.widthAnchor.constraint(equalToConstant: CGFloat(rowWidth)).isActive = true 
     theCodeCollectionView.heightAnchor.constraint(equalToConstant: CGFloat(rowHeight * 3)).isActive = true 

     // center the collection view 
     theCodeCollectionView.centerXAnchor.constraint(equalTo: view.centerXAnchor, constant: 0.0).isActive = true 
     theCodeCollectionView.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 0.0).isActive = true 

    } 

    func numberOfSections(in collectionView: UICollectionView) -> Int { 
     return 1 
    } 
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { 
     return 12 
    } 

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { 
     let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath) as! LabelItemCell 

     cell.backgroundColor = cellColors[indexPath.row % 3] 
     cell.testLabel.text = "\(indexPath)" 

     return cell 
    } 

} 

:)