web-dev-qa-db-fra.com

Comment configurer une taille de cellule UICollectionView par classe de taille?

Je constate des frictions lorsque j'essaie de créer UICollectionViewCells réactif/adaptatif dans UIStoryboard.

Le problème que je vois est que vous ne semblez pas être en mesure de définir le Cell Size par Size Class et j'essaie de déterminer la bonne approche à cet égard. J'ai conçu les cellules pour s'adapter à leurs conteneurs, de sorte qu'elles should autosize, quelle que soit la classe de taille. Cela fonctionne principalement en ce que si je change la classe de taille, sélectionne ma vue de cellule et fais Update Frames, ils seront tous redimensionnés pour s’adapter à leur nouvelle taille. Cependant, il s’agit d’un accord ponctuel. Si je retourne à la classe de taille Any/Any, je vois toujours cette version redimensionnée.

Voici ce que je sais que je pourrais essayer:

  • Créez plusieurs cellules, avec des dimensions fixes, une par classe de taille et dans la vue Storyboard. Je ne pouvais alors que utiliser le bon au moment de l'exécution, mais je pourrais alors voir leur au moment de la conception.
  • I Could créer une vue de collection par classe de taille, chacune étant uniquement installée pour cette taille. Cela fonctionnerait, mais ce serait difficile de gérer plusieurs UICollectionViews
  • Créer mon interface et/ou mes contraintes par programme (perte de visibilité de la conception).

J'espère que le scénario est résolu et qu'il me manque quelque chose, mais je suis conscient qu'il se pourrait que les outils de l'IB ne correspondent pas au code pour l'instant.

iosxcodeuistoryboard
21
Tristan Warner-Smith

La solution que j'ai proposée consistait simplement à implémenter la variable UICollectionViewDelegateFlowLayout et à la méthode sizeForItemAtIndexPath. Cela signifie que les dimensions de la cellule peuvent être définies pour correspondre aux dimensions disponibles de Size Class.

Ce n'est toujours pas idéal car vous ne pouvez pas voyez les modifications apportées au storyboard et vous ne pouvez pas créer une conception universelle et la voir dans chacun des différents formats.

J'espère toujours que quelqu'un a une meilleure option.

15
Tristan Warner-Smith

Voici une solution similaire codée dans Swift. Je viens de styler mes deux cellules dans le story-board et de les laisser visibles pour toute combinaison de classe de taille. Lorsque la collection de traits change, je mets à jour les valeurs cellSize et cellReuseID que je souhaite utiliser et demande à la collectionView de recharger toutes les cellules visibles. ensuite 

collectionView(collectionView: UICollectionView,
    layout collectionViewLayout: UICollectionViewLayout,
    sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize

et

override func collectionView(collectionView: UICollectionView,
    cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell

(n'apparaissent pas dans l'exemple de code) sont appelés, ce qui me permet de mettre à jour la taille de la cellule et de mettre à jour le style de son storyboard. Donc, pas entièrement terminé dans le storyboard, mais suffisant jusqu'à ce qu'un support supplémentaire soit fourni dans Xcode.

struct MyCollectionViewConstants{
    static let CELL_ANY_ANY_REUSE_ID = "cell";
    static let CELL_COMPACT_REGULAR_REUSE_ID = "cellSmall"
    static let CELL_ANY_ANY_SIZE = 100;
    static let CELL_COMPACT_REGULAR_SIZE = 70;
}

class MyCollectionView: UICollectionViewController, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {

    var cellSize = MyCollectionViewConstants.CELL_ANY_ANY_SIZE
    var cellReuseID = MyCollectionViewConstants.CELL_ANY_ANY_REUSE_ID


    func collectionView(collectionView: UICollectionView,
        layout collectionViewLayout: UICollectionViewLayout,
        sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize{

        return CGSize(width: cellSize, height: cellSize)
    }

    override func traitCollectionDidChange(previousTraitCollection: UITraitCollection?) {
        super.traitCollectionDidChange(previousTraitCollection)

        if (self.traitCollection.horizontalSizeClass == UIUserInterfaceSizeClass.Compact
            && self.traitCollection.verticalSizeClass == UIUserInterfaceSizeClass.Regular){
            cellSize = MyCollectionViewConstants.CELL_COMPACT_REGULAR_SIZE
            cellReuseID = MyCollectionViewConstants.CELL_COMPACT_REGULAR_REUSE_ID
        } else {
            cellSize = MyCollectionViewConstants.CELL_ANY_ANY_SIZE
            cellReuseID = MyCollectionViewConstants.CELL_ANY_ANY_REUSE_ID
        }

        self.collectionView.reloadItemsAtIndexPaths(
            self.collectionView.indexPathsForVisibleItems())
    }
}
7
Martin Woolstenhulme

J'étais coincé avec le même problème après la mise en œuvre de la classe de taille (iPad et iPhone). Eh bien, j'ai trouvé une solution. J'espère que ça aide!

Implémentez UICollectionViewDelegateFlowLayout.

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize
    {
         var device = UIDevice.currentDevice().model  
         var cellSize:CGSize = CGSizeMake(155, 109)

         if (device == "iPad" || device == "iPad Simulator") {
            cellSize = CGSizeMake(240, 220) 
         }

         return cellSize
    }
1
A.G

Swift 4
Bonjour chers développeurs,

Ceci est facile à faire si la hauteur et la largeur de UICollectionViewCell sont identiques.

 enter image description here

Pas
1. Importer ** UICollectionViewDelegateFlowLayout **
2. Ajoutez la méthode sizeForItem IndexPath de UICOllectionView comme suit 

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

Note: Que se passe-t-il si vous définissez la hauteur de UICollectionView comme hauteur et largeur de UICollectionViewCell

Bonne codage :)

0
Ariven Nadar