Diviser tableau d'images et les organiser sur un UIView

Question

Je suis en train d'organiser de manière dynamique ensemble de données d'image dans un tableau sur un UIView Je veux quatre par rôle et le rôle max est de 12 en faisant 4 par rôle. C'est le problème, je peux diviser le tableau et placer les images uniformément là où tout le monde devrait être. Par exemple:

12 Images

======|=====|======|======| 
     |  |  |  | 
     |  |  |  | 
    ======|=====|======|======| 
     |  |  |  | 
     |  |  |  | 
    ======|=====|======|======| 
     |  |  |  | 
     |  |  |  | 
    |=====|=====|======|======| 

Je sais comment arranger l'image, mais diviser le tableau est le problème. Que faire si j'ai 7 images dans le tableau qui seraient 4 en haut, 3 en bas ou 10, ce qui serait 4,4,2. Je ne sais pas comment y aller. C'est pourquoi je n'ai aucun code collé du tout. Toute aide sur la division et l'arrangement du tableau serait appréciée. Merci

Answer 1

Le stockage de valeurs dans un seul tableau et l'utilisation du tableau comme source de données pour une structure 2D est assez courant. Vous pouvez obtenir les positions X et Y en fonction de l'index de l'article et de la largeur et la hauteur de la structure.

// number of images across the view 
let width = 4; 

// number of images down the view 
let height = 3; 

// index of the image in the array 
let index = 10; 

// index of the space from the left 
// starting with 0 
let xLocation = index % width; // 2 

// index of the space from the top 
// starting with 0 
let yLocation = index/width; // 2 

Une fonction qui renvoie les valeurs sous la forme d'un tuple est ci-dessous. Tout ce que vous devez faire est de parcourir votre tableau et il va retourner les positions des éléments en fonction des informations fournies.

func getPosition(width:Int, index:Int) -> (Int,Int) { 
    return (index % width, index/width); 
} 

modifier: clarification Code

Answer 2

Alors, voici ce que je faisais. J'ai écrit une fonction qui étend Array pour partager mon tableau uniformément

extension Array { 
func splitBy(subSize: Int) -> [[Element]] { 
    return 0.stride(to: self.count, by: subSize).map { startIndex in 
     let endIndex = startIndex.advancedBy(subSize, limit: self.count) 
     return Array(self[startIndex ..< endIndex]) 
    } 
} 
} 

Puis, je l'ai fait le bit d'afficher les images avec ce

private func setGridView(gridCell: ProfileGrid, indexPath: NSIndexPath) {//140813008 
    let (location, photoCount, images) = dummyGrid[indexPath.row] 
    gridCell.imageCount.text = photoCount 
    gridCell.location.text = location 
    if images.count > 0 && images.count <= 4 { 
     for index in 0..<images.count { 
      let dedicatedWidth = self.view.frame.size.width/4 - 8 
      let imageView = UIImageView(frame: CGRect(x: (dedicatedWidth + 2) * CGFloat(index), y: 0, width: CGFloat(dedicatedWidth - 2), height: 80)) 
      imageView.image = UIImage(named: images[index]) 
      imageView.layer.cornerRadius = 5 
      imageView.clipsToBounds = true 
      gridCell.imageHolder.addSubview(imageView) 
     } 
    } else if images.count > 4 && images.count <= 8 { 
     let split = images.splitBy(4) 
     let firstSplit = split[0] 
     let secondSplit = split[1] 

     for index in 0..<firstSplit.count { 
      let dedicatedWidth = self.view.frame.size.width/4 - 8 
      let imageView = UIImageView(frame: CGRect(x: (dedicatedWidth + 2) * CGFloat(index), y: 0, width: CGFloat(dedicatedWidth - 2), height: 80)) 
      imageView.image = UIImage(named: firstSplit[index]) 
      imageView.layer.cornerRadius = 5 
      imageView.clipsToBounds = true 
      gridCell.imageHolder.addSubview(imageView) 
     } 

     for jDex in 0..<secondSplit.count { 
      let dedicatedWidth = self.view.frame.size.width/4 - 8 
      let imageView = UIImageView(frame: CGRect(x: (dedicatedWidth + 2) * CGFloat(jDex), y: 82, width: CGFloat(dedicatedWidth - 2), height: 80)) 
      imageView.image = UIImage(named: secondSplit[jDex]) 
      imageView.layer.cornerRadius = 5 
      imageView.clipsToBounds = true 
      gridCell.imageHolder.addSubview(imageView) 
     } 
    } else if images.count > 8 { 
     let split = images.splitBy(4) 
     let firstSplit = split[0] 
     let secondSplit = split[1] 
     let thirdSplit = split[2] 

     for index in 0..<firstSplit.count { 
      let dedicatedWidth = self.view.frame.size.width/4 - 8 
      let imageView = UIImageView(frame: CGRect(x: (dedicatedWidth + 2) * CGFloat(index), y: 0, width: CGFloat(dedicatedWidth - 2), height: 80)) 
      imageView.image = UIImage(named: firstSplit[index]) 
      imageView.layer.cornerRadius = 5 
      imageView.clipsToBounds = true 
      gridCell.imageHolder.addSubview(imageView) 
     } 

     for jDex in 0..<secondSplit.count { 
      let dedicatedWidth = self.view.frame.size.width/4 - 8 
      let imageView = UIImageView(frame: CGRect(x: (dedicatedWidth + 2) * CGFloat(jDex), y: 82, width: CGFloat(dedicatedWidth - 2), height: 80)) 
      imageView.image = UIImage(named: secondSplit[jDex]) 
      imageView.layer.cornerRadius = 5 
      imageView.clipsToBounds = true 
      gridCell.imageHolder.addSubview(imageView) 
     } 

     for tDex in 0..<thirdSplit.count { 
      let dedicatedWidth = self.view.frame.size.width/4 - 8 
      let imageView = UIImageView(frame: CGRect(x: (dedicatedWidth + 2) * CGFloat(tDex), y: 164, width: CGFloat(dedicatedWidth - 2), height: 80)) 
      imageView.image = UIImage(named: thirdSplit[tDex]) 
      imageView.layer.cornerRadius = 5 
      imageView.clipsToBounds = true 
      gridCell.imageHolder.addSubview(imageView) 
     } 
    } 
} 

Si vous avez un meilleur de le faire, ça ne me dérange pas. Mon code est trop grand et pas très professionnel de ma part. Idées s'il vous plaît