it-swarm.com.ru

Пользовательская ячейка UICollectionView для заполнения ширины в Swift

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

enter image description here

Я пытался настроить его из раскадровки, но я думаю, что нет возможности для этого, или это должно быть сделано программно. enter image description here

мой UICollectionViewController: 

 @IBOutlet var collectionView2: UICollectionView!

    let recipeImages = ["angry_birds_cake", "creme_brelee", "Egg_benedict", "full_breakfast", "green_tea", "ham_and_cheese_panini", "ham_and_Egg_sandwich", "hamburger", "instant_noodle_with_Egg.jpg", "japanese_noodle_with_pork", "mushroom_risotto", "noodle_with_bbq_pork", "starbucks_coffee", "thai_shrimp_cake", "vegetable_curry", "white_chocolate_donut"]

    override func viewDidLoad() {
        super.viewDidLoad()

        // Uncomment the following line to preserve selection between presentations
        // self.clearsSelectionOnViewWillAppear = false

        // Do any additional setup after loading the view.

    }


    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
        //#warning Incomplete method implementation -- Return the number of sections
        return 1
    }


    override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        //#warning Incomplete method implementation -- Return the number of items in the section
         return recipeImages.count
    }

    override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as! RecipeCollectionViewCell

        // Configure the cell
        cell.recipeImageView.image = UIImage(named: recipeImages[indexPath.row])

        return cell
    }
33
AaoIi

Вы должны сделать это программно.

Реализуйте UICollectionViewDelegateFlowLayout в вашем контроллере представления и укажите размер в collectionView:layout:sizeForItemAtIndexPath:

func collectionView(_ collectionView: UICollectionView,
                        layout collectionViewLayout: UICollectionViewLayout,
                        sizeForItemAt indexPath: IndexPath) -> CGSize {
        let kWhateverHeightYouWant = 100
        return CGSizeMake(collectionView.bounds.size.width, CGFloat(kWhateverHeightYouWant))
}

Вы также захотите вызвать collectionView.collectionViewLayout.invalidateLayout() внутри viewWillLayoutSubviews() контроллера вашего представления, чтобы при изменении размеров основного вида (например, при вращении) представление коллекции перестраивалось.

Swift 4 Обновление

func collectionView(_ collectionView: UICollectionView,
                            layout collectionViewLayout: UICollectionViewLayout,
                            sizeForItemAt indexPath: IndexPath) -> CGSize {
            let kWhateverHeightYouWant = 100
            return CGSize(width: collectionView.bounds.size.width, height: CGFloat(kWhateverHeightYouWant))
}
82
Matthew Quiros

Используйте следующий код для установки ширины UICollectionViewCell.

func collectionView(_ collectionView: UICollectionView,
                    layout collectionViewLayout: UICollectionViewLayout,
                    sizeForItemAt indexPath: IndexPath) -> CGSize {        
    return CGSize(width: screenWidth/3, height: screenWidth/3);
}
10
Nimit Parekh

Внутри вашего контроллера представления переопределите метод viewDidLayoutSubviews

@IBOutlet weak var collectionView: UICollectionView!

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    if let layout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
        let itemWidth = view.bounds.width / 3.0
        let itemHeight = layout.itemSize.height
        layout.itemSize = CGSize(width: itemWidth, height: itemHeight)
        layout.invalidateLayout()
    }
}

(свойство collectionView является вашим collectionView)

10
mustafa

Также в Swift 3,

Убедитесь, что ваш контроллер представления соответствует следующему:

UICollectionViewDelegate,
UICollectionViewDataSource,
UICollectionViewDelegateFlowLayout

7
brycejl

Swift 3

Если вы используете Swift 3, используйте этот метод:

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

    }

Обратите внимание на изменения:

  1. добавьте _ перед collectionView в имя метода
  2. NSIndexPath изменяется на IndexPath
4
JPetric

У меня такое же требование, в моем случае ниже решение работает. Я устанавливаю UIImageView верхний, левый, нижний и правый ограничения на 0 inside UICollectionviewCell

@IBOutlet weak var imagesCollectionView: UICollectionView!

override func viewDidLoad() {
    super.viewDidLoad()
    // flowlayout
    let screenWidth = UIScreen.main.bounds.width
    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    layout.sectionInset = UIEdgeInsets(top: 5, left: 5, bottom: 10, right: 0)
    layout.itemSize = CGSize(width: screenWidth/3 - 5, height: screenWidth/3 - 5)
    layout.minimumInteritemSpacing = 5
    layout.minimumLineSpacing = 5
    imagesCollectionView.collectionViewLayout = layout

}
1
Raju Abe

Для моего случая я хотел показать два столбца и 3 строки в UICollectionView

Я добавил делегат UICollectionViewDelegateFlowLayout в свой класс

тогда я переопределяю sizeForItemAt indexPath

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let cellHeight = (collectionView.bounds.size.height - 30) / 3 // 3 count of rows to show
    let cellWidth = (collectionView.bounds.size.width - 20) / 2 // 2 count of colomn to show
    return CGSize(width: CGFloat(cellWidth), height: CGFloat(cellHeight))
}

30 - межстрочный интервал, 20 - отступ между ячейками

0
F.sh

В моем случае, предположим, что каждая ячейка имеет ширину 155 и высоту 220. Если я хочу показать 2 ячейки в строке в портретном режиме и 3 для ландшафта. 

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    var itemsCount : CGFloat = 2.0
    if UIApplication.sharedApplication().statusBarOrientation != UIInterfaceOrientation.Portrait {
        itemsCount = 3.0
    }
    return CGSize(width: self.view.frame.width/itemsCount - 20, height: 220/155 * (self.view.frame.width/itemsCount - 20));
}
0
Eduardo Irias

Программно установите itemSize в [UIScreen mainScreen].bounds.size.width/3

0
rounak

Лучшее решение - изменить itemSize вашего UICollectionViewFlowLayout в viewDidLayoutSubviews. Именно здесь вы можете получить наиболее точный размер переменной UICollectionView. Вам не нужно называть недействительным на вашем макете, это уже будет сделано для вас.

0
ZaBlanc