Как установить угловой радиус для ячеек представления коллекции разного размера

Я хочу иметь ячейки коллекции овальной формы с шириной, основанной на длине метки/текста, но у меня возникают проблемы с тем, чтобы все ячейки выглядели овальными. Я не знаю, как изменить размер в зависимости от длины текста метки.

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

1) Как изменить размер, чтобы получить правильную овальную форму, а также 2) почему между некоторыми ячейками есть более длинные промежутки и как это исправить?

Идеальная картинка

Текущий контроллер

Ячейка раскадровки (ширина метки установлена ​​на 150)

class HobbiesViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate{

    @IBOutlet weak var collectionView: UICollectionView!

    var items = ["karateeeeeeeeeee", "signup", "last", "madur", "open", "somelongword", "nice", "looooooooong", "karate", "karate","karate", "signup", "last", "madur"]

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return self.items.count
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "hobbyCell", for: indexPath) as! HobbiesViewCell

        cell.label.text = self.items[indexPath.item]
        cell.backgroundColor=UIColor.blue //try with different values untill u get the rounded corners
        cell.layer.cornerRadius = cell.bounds.size.height / 2
        cell.layer.masksToBounds=true

        return cell
    }
}

extension HobbiesViewController: UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "hobbyCell", for: indexPath) as! HobbiesViewCell
        cell.label.text = items[indexPath.row]
        cell.label.sizeToFit()
        return CGSize(width: cell.label.frame.width + 10 , height: 70)
    }
}

person Elizabeth    schedule 08.06.2019    source источник
comment
Добавьте свою ячейку, чтобы быть более точным.   -  person SwiftiSwift    schedule 08.06.2019
comment
Добавил картинку выше раскадровки   -  person Elizabeth    schedule 08.06.2019
comment
Я имею в виду код `HobbiesViewCell`   -  person SwiftiSwift    schedule 08.06.2019
comment
это просто ярлык   -  person Elizabeth    schedule 09.06.2019


Ответы (1)


Ответ 1. При настройке ширины ячейки представления коллекции вам необходимо указать минимальную ширину ячейки, чтобы ячейка не стала настолько маленькой, что выглядела как круг. Ваша текущая высота равна 70, поэтому вы должны сохранить условие, что если cell.label.frame.width + 10 меньше 160, размер ячейки должен быть равен 160.

Ответ 2. Сам вид коллекции управляет расстоянием между ячейками в соответствии с рамкой, предоставленной для представления коллекции, и размером ячейки. Чтобы установить правильный интервал, может быть ссылка ниже будет вам полезна.

Интервал между ячейками в UICollectionView

На снимке экрана я вижу, что размер вашего шрифта также отличается от ожидаемого вывода, поэтому, возможно, вы также можете это проверить.

Надеюсь, это поможет вам в некотором роде.

person BhargavR    schedule 08.06.2019