Swift - これを行うにはどうすればuicollectionviewを使うことができますか？

Question

こんにちは私は以下のデザインを迅速に使用したいと思っていました。 。

スクロールバーでUICollectionViewを使用していますが、UICollectionViewにはスクロールバーをオブジェクトの中央で停止させるカスタムスペーシングパディングが必要でした。

Answer 1

セルの幅と高さがUICollectionView'sの幅と高さで表示され、ラベルとテキストを含むカスタムスペースパディングを実現するには、その内側にUIViewを入れてください。

私はちょうどSampleを作成しました。

カスタムアイデアは、カスタムスペースパディングを実現するためにカスタムコレクションビューのセル内で表示することをすでに提案しています。

ViewController、myCollectionViewおよびpageControlで2つのIBOutletsを撮影しました。

import UIKit 

class ViewController: UIViewController { 

    @IBOutlet weak var pageControl: UIPageControl! 
    @IBOutlet weak var myCollectionView: UICollectionView! 
    override func viewDidLoad() { 
     super.viewDidLoad() 
     // Do any additional setup after loading the view, typically from a nib. 
    } 
} 

extension ViewController:UICollectionViewDataSource,UICollectionViewDelegateFlowLayout { 

    //MARK:- CollectionView Datasource 
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { 
     return 3 
    } 

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

    //MARK:- CollectionView Delegate 
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { 
     return CGSize(width: collectionView.frame.size.width, height: collectionView.frame.size.height) 
    } 

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat { 
     return 0 
    } 

    //MARK:- ScrollView Delegates 
    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) { 
     let pageWidth = myCollectionView.frame.size.width; 
     let page = floor((myCollectionView.contentOffset.x - pageWidth/2)/pageWidth) + 1 
     pageControl.currentPage = Int(page) 
     print(page) 
    } 
} 

scrollViewDidEndDeceleratingはあなたがどのインデックスに決めるとそれに応じて上記のmapViewを更新することができます。ページ番号0は、その最初のセル（indexPath.row = 0）を示します。 2番目のインデックスに移動すると、2番目のインデックスを意味する1.0が表示されます。

ですUICollectionViewCell

import UIKit 

class CustomCollectionViewCell: UICollectionViewCell { 

    @IBOutlet weak var cellView: UIView! 

    override func awakeFromNib() { 
     super.awakeFromNib() 

     //To make corners round 
     cellView.layer.cornerRadius = 10.0 
    } 
} 

マイビューの階層構造の私のカスタムセルクラス

と出力

はあなたには、いくつかの私を得るホープDEA。

Answer 2

UIScrollViewのようになり、isPagingEnabledをtrueに設定します。下の3つのドットはUIPageControlです。

UIScrollViewDelegateとscrollViewDidEndDeceleratingを使用して、他のコンテンツの変更を管理してください。