tutorial tablas tabla efecto crear apple swift uicollectionview uicollectionviewcell ios-autolayout

tablas - uitableview swift4



¿Cómo configuro el tamaño de celda de la vista de colección a través del diseño automático? (5)

Hola, estoy tratando de cambiar el tamaño de la celda a través del auto layout .

Quiero mostrar la celda por el 3 por 3.

El margen izquierdo de la primera celda = 0

Margen derecho de la última celda = 0

Y todo el espacio de la celda tiene 1 pt. Como un instagram .

¿Debo establecer el tamaño de celda? Quiero establecer restricción a través del Autolayout.

También estoy tratando de establecer el tamaño de la celda usando el código.

Aquí está mi código:

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize { return CGSizeMake(123, 123); } func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat { return 1; } func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat { return 1; }

Pero ... creo que no es exactamente calcular el tamaño de la celda.

¿Cómo configuro el tamaño de la celda dependiendo del tamaño de la pantalla?

Tengo que configurar el espacio 1pt entre las celdas.

¿Hay alguna forma de configurar solo usando el guión gráfico?

Si no es así, ¿cómo lo configuro por el código?

Gracias.


Aquí hay otra solución pero solo funciona en iPhone6.

Voy a tratar de actualizar para iphone5 / 6plus

Un agradecimiento especial a @vacawama!

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize { // Compute the dimension of a cell for an NxN layout with space S between // cells. Take the collection view''s width, subtract (N-1)*S points for // the spaces between the cells, and then divide by N to find the final // dimension for the cell''s width and height. let cellsAcross: CGFloat = 3 let spaceBetweenCells: CGFloat = 1 let dim = (collectionView.bounds.width - (cellsAcross - 1) * spaceBetweenCells) / cellsAcross print(indexPath.row) var width = dim //last cell''s width if( (indexPath.row + 1) % 3 == 0){ width = 124 }else { width = 124.5 } print(width) return CGSizeMake(width, dim) } func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat { return 1; } func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat { return 1; }


Gran respuesta por vacawama pero tuve 2 problemas. Quería que el espacio que definí en el guión gráfico se usara automáticamente.

Y en segundo lugar, no pude conseguir que invocara esta función y nadie mencionó cómo. Para invocar el sizeForItemAt del collectionView es necesario extender UICollectionViewDelegateFlowLayout en lugar de extender UICollectionViewDelegate. Espero que esto le salve a alguien más tiempo.

extension MyViewController: UICollectionViewDelegateFlowLayout, UICollectionViewDataSource { func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { let cellsAcross: CGFloat = 3 var widthRemainingForCellContent = collectionView.bounds.width if let flowLayout = collectionViewLayout as? UICollectionViewFlowLayout { let borderSize: CGFloat = flowLayout.sectionInset.left + flowLayout.sectionInset.right widthRemainingForCellContent -= borderSize + ((cellsAcross - 1) * flowLayout.minimumInteritemSpacing) } let cellWidth = widthRemainingForCellContent / cellsAcross return CGSize(width: cellWidth, height: cellWidth) } }


Lo configuro utilizando los métodos delegados de CollectionView. Esto le dará una configuración de 2xN, pero puede convertirlo en un 3xN. Aquí hay una captura de pantalla y puedes consultar mi proyecto en GitHub ...

https://github.com/WadeSellers/GoInstaPro


No creo que pueda establecer el tamaño utilizando solo el Guión gráfico porque no puede establecer restricciones para elementos recurrentes, como las celdas de vista de colección que se crean sobre la marcha en tiempo de ejecución.

Puede calcular fácilmente el tamaño a partir de la información que se le proporciona. En collectionView(_:layout:sizeForItemAt:) puede acceder a los límites de collectionView para calcular el tamaño deseado de su celda:

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { // Compute the dimension of a cell for an NxN layout with space S between // cells. Take the collection view''s width, subtract (N-1)*S points for // the spaces between the cells, and then divide by N to find the final // dimension for the cell''s width and height. let cellsAcross: CGFloat = 3 let spaceBetweenCells: CGFloat = 1 let dim = (collectionView.bounds.width - (cellsAcross - 1) * spaceBetweenCells) / cellsAcross return CGSize(width: dim, height: dim) }

Esto entonces funciona para iPhones y iPads de todos los tamaños.


Código de la versión Swift 3 basado en la respuesta de vacawama:

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { let cellsAcross: CGFloat = 3 let spaceBetweenCells: CGFloat = 1 let dim = (collectionView.bounds.width - (cellsAcross - 1) * spaceBetweenCells) / cellsAcross return CGSize(width: dim, height: dim) }