Найти тему
Learn Swift

Collection View с картинками

Создадим новый проект ImageCollection

Будем использовать второй метод создания коллекции во ViewController. Для этого как во втором уроке в Main.storyboard добавим Label и коллекцию на ViewController.

Закрепим элементы и настроим внешний вид:

Создаем новый Фаил CollectionImageCell для ячейки коллекции :

Откроем Main.storyboard выберем ViewController и откроем ассистента( код)

  • Выберем Label поменяем текст
  • протянем аутлет для коллекции
@IBOutlet weak var collectionView: UICollectionView!

Откроем ViewController.swift и добавим необходимые методы для работы с коллекцией.( далее будет картинки, если получится пробуем без них)

Пропишем делегаты в override func viewDidLoad() {

collectionView.delegate = self
collectionView.dataSource = self

Зарегистрируем ячейку в коллекции в методе func viewDidLoad() { добавим следующее

collectionView.register(UINib(nibName: "CollectionImageCell", bundle: nil), forCellWithReuseIdentifier: "CollectionImageCell")

Добавим extension для следующих методов

  • UICollectionViewDelegate
  • UICollectionViewDataSource
  • UICollectionViewDelegateFlowLayout
-6

Настроим внешний вид коллекции откроем CollectionImageCell.xib

  • добавим в ячейку картинку и подпись.
  • уберем safe area .
  • закрепим картинку и label.

Откроем ассистент для CollectionImageCell.xib протянем outlet для картинки текста.

@IBOutlet weak var imageView: UIImageView!
@IBOutlet weak var textLabel: UILabel!
-8

Добавим функцию конфигурирование ячейки

func configure(image: UIImage, text: String) {
imageView.image = image
textLabel.text = text
}
-9

( еще будет обновление )