Разделы с разным размером ячейки с UICollectionView

Вопрос:

Мне нужно создать представление в проекте Swift с двумя разделами дифференцирования.
Первый имеет семь ячеек с квадратной формой. Второй имеет три ячейки с прямоугольной формой. Данные внутри ячеек являются статическими.
Во всех случаях секции должны соответствовать всей ширине экрана (в основном в ландшафтном режиме).

У меня нет большого опыта использования UICollectionViewController, поэтому я решил выполнить это, используя один класс UICollectionViewController и две повторно используемые ячейки, но когда я устанавливаю ширину ячейки первого раздела, также влияет вторая, а затем ширина ячеек разрезается.

Правильно ли моя точка зрения?
Должен ли я использовать разные UICollectionViewController (по одному для каждого раздела)?

Обновление: Код моего контроллера

import UIKit

class InverterController: UICollectionViewController, UICollectionViewDelegateFlowLayout {

let moduleCell = "moduleCell"
let parameterCell = "parameterCell"

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
if section > 0 {
return CGSizeZero
} else {
return CGSize(width: collectionView.frame.width, height: CGFloat(195))
}
}

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

var newSize = CGSizeZero

if indexPath.section == 0 {

newSize =  CGSizeMake(CGFloat(105), CGFloat(105))
} else {
newSize = CGSizeMake(CGFloat(313), CGFloat(200))
}

return newSize
}

override func collectionView(collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, atIndexPath indexPath: NSIndexPath) -> UICollectionReusableView {
switch kind {
case UICollectionElementKindSectionHeader:
let headerView = collectionView.dequeueReusableSupplementaryViewOfKind(kind, withReuseIdentifier: "inverterHeader", forIndexPath: indexPath)
return headerView
default:
assert(false, "Unexpected element kind")
}
}

/**
Two sections in this UICollectionView: First one for clock items, second one for other parameters.
*/
override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
return 2
}

/**
First section contains one cell
Second section contains three cells
*/
override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
var items = 0

if section == 0 {
items = 7
} else {
items = 3
}

return items
}

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

var cellIdentifier = ""

if indexPath.section == 0 {
cellIdentifier = moduleCell
} else {
cellIdentifier = parameterCell
}

let cell = collectionView.dequeueReusableCellWithReuseIdentifier(cellIdentifier, forIndexPath: indexPath)
cell.layer.cornerRadius = 6
cell.layer.masksToBounds = true

return cell
}
}

Конфигурация интерфейса Builder для CollectionView
введите описание изображения здесь

Скриншот Simulator (не желаемый результат, все ячейки имеют одинаковую ширину)
введите описание изображения здесь

Лучший ответ:

Вы можете использовать метод делегата collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize для настройки размера ячейки.

В вашем случае вы можете написать что-то вроде этого:

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

    let width : CGFloat
    let height : CGFloat

    if indexPath.section == 0 {
        // First section
        width = collectionView.frame.width/7
        height = 50
        return CGSizeMake(width, height)
    } else {
        // Second section
        width = collectionView.frame.width/3
        height = 50
        return CGSizeMake(width, height)
    }

}

Поместите этот код в свой класс collectionViewController.
Установите height на то, что должно быть на высоте вашей ячейки. Вы можете настроить width, если вы используете интервал между ячейками или вставками в вашем коллекции.

Ответ №1

для Swift 4

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

let width : CGFloat
let height : CGFloat

if indexPath.section == 0 {
// First section
width = collectionView.frame.width/7
height = 50
return CGSize(width: width, height: height)
} else {
// Second section
width = collectionView.frame.width/3
height = 50
return CGSize(width: width, height: height)
}
}

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

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

Оцените статью
TechArks.Ru
Добавить комментарий