UICollectionView horizontale Paging mit Platz zwischen den Seiten

Question

Ich bin auf der Suche nach einer Möglichkeit, die ursprüngliche UIPageViewController horizontale Paging mit einem UICollectionView zu ersetzen.

bisher habe ich die folgende:

let layout = UICollectionViewFlowLayout() 
layout.scrollDirection = .horizontal 
layout.itemSize = collectionView.frame.size 
layout.minimumLineSpacing = 0 
layout.minimumInteritemSpacing = 10 

collectionView.setCollectionViewLayout(layout, animated: false) 
collectionView.isPagingEnabled = true 
collectionView.alwaysBounceVertical = false 

das funktioniert gut und ich bekomme einen horizontalen Paging-Effekt.

Jetzt möchte ich horizontalen Raum zwischen den Seiten hinzufügen

so weit (wie u mit UIPageViewControllerOptionInterPageSpacingKey auf UIPageViewController tun wird) konnte ich nicht einen Weg Fein die Räume hinzugefügt werden, ohne die Paging-Effekt zu beschädigen. Ich suche nach dem gleichen Verhalten wie mit der UIPageViewController: die Zelle sollte die gesamte Bildschirmbreite ausfüllen, und der Abstand zwischen den Zellen sollte nur sichtbar sein, wenn Sie eine Seite wechseln.

Answer 1

Lösung ein:

1. nicht verwenden collectionView.isPagingEnabled = true Sets es auf false
2. ein minimumLineSpacing für den Abstand zwischen den Seiten hinzufügen
3. targetContentOffsetForProposedContentOffset:withScrollingVelocity: implementieren, um die Content zur nächsten Seite zu gelangen. Sie können die Seite mit einfacher Mathematik basierend auf Ihren itemSize und minimumLineSpacing berechnen, aber es kann etwas dauern, um es richtig zu machen.

Lösung zwei:

1. collectionView.isPagingEnabled = true
2. eine minimumLineSpacing für den Abstand zwischen den Seiten hinzufügen
3. die Paging-Größe wird auf die Grenzen der Collection basiert. Also mach das CollectionView größer als dann screenSize. Wenn Sie zum Beispiel einen minimumLineSpacing von 10 haben, dann setzen Sie den Rahmen des collectionView auf {0, -5, width + 10, height}
4. setzen Sie ein contentInset gleich dem minimumLineSpacing, damit das erste und letzte Element korrekt angezeigt wird .

Answer 2

• Standardmäßig ist der UICollectionViewFlowLayout minimumLineSpacing 10,0, wenn Kollektionstück horizontal gefüllt ist (itemSize.width = collectionView.bounds.width) und Kollektion wird Paging aktiviert ist, größer als Null ‚minimumLineSpacing‘ wird eine unbeabsichtigte Leistung verursachen : Start von der zweiten Seite, jede Seite hat eine Lücke, die durch die Seitennummer angesammelt wird.
• Es scheint, dass wir die Breite von CollectionView um 'minimumLineSpacing' erweitern können, um dieses Problem zu beheben. Aber pratice negiert diese Lösung: Wenn es zwei oder mehr Seiten gibt, wird collectionView dem letzten keinen 'lineSpacing' geben, daher reicht 'contentSize' nicht aus, um den Inhalt dieser Seite vollständig anzuzeigen, was bedeutet, wenn 'minimumLineSpacing' 10.0 ist Das Ende der letzten Seite würde die contentSize der Kollektionsansicht um 10,0 überschreiten.
• Schließlich verwende ich die folgende einfache Lösung, um einen Rand zwischen jedem Element einzufügen (wie UIScrollView's preformance): Erweitern Sie die Breite jedes collectionViewItem um einen festen Wert 'pageSpacing' (zB 10.0), und erweitern Sie die Breite des collectionView um denselben Wert , auch. Und vergiss nicht, dass es bei den Unteransichten von layout collevtionViewCell einen zusätzlichen Abstand gibt, der nicht dazu dient, den echten Inhalt anzuzeigen.

Heres der Code geschrieben in Swift 3.1, ich bin sicher, dass es leicht für Sie zu verstehen:

let pageSpacing: CGFloat = 10 

class ViewController: UITableViewController { 
    override func viewDidLoad() { 
     super.viewDidLoad() 

     let layout = UICollectionViewFlowLayout() 
     layout.itemSize    = CGSize(width: view.frame.width + pageSpacing, height: view.frame.height) 
     layout.scrollDirection   = .horizontal 
     layout.minimumInteritemSpacing = 0 
     layout.minimumLineSpacing  = 0 

     let frame = CGRect(x: 0, y: 0, width: view.frame.width + pageSpacing, height: view.frame.height) 
     let collectionView = UICollectionView(frame: frame, collectionViewLayout: layout) 
     view.addSubview(collectionView) 
    } 
} 

class MyCell: UICollectionViewCell { 
    var fullScreenImageView = UIImageView() 
    override func layoutSubviews() { 
     super.layoutSubviews() 
     fullScreenImageView.frame = CGRect(x: 0, y: 0, width: frame.width - pageSpacing, height: frame.height) 
    } 
} 

Hoffnung, dass Ihnen helfen können.