CollectionView внутри StackView - PullRequest
0 голосов
/ 04 мая 2018

У меня есть UICollectionView внутри UIStackView. UICollectionViewCell имеет UIImageView, который прикреплен к ячейке.

Что я пытаюсь сделать здесь:

  • Отображение картинок, выбранных пользователем на UICollectionView в строке.
  • UICollectionView будет иметь горизонтальную прокрутку (думая, отображая картинки, как на экране публикации Twitter).
  • UICollectionView отображается только тогда, когда пользователь добавляет фотографию.
  • Использование UIImagePickerController для съемки фотографий.

Проблемы, которые я получил:

  • UICollectionView показывает что-либо даже после того, как пользователь выбирает фотографию для добавления.
  • Я даже не знаю, что это проблема кода или storyBoard.

То, что я пробовал до сих пор. (Все попытки не увенчались успехом.):

  • Разделите UICollectionView и UIStackView.
  • Установите фиксированную ширину и высоту UICollectionView, UICollectionViewCell и UIImageView.
  • Установить конкретное изображение UIImageView.

Вот мой код и storyBoard.

ImageCell.swift

import UIKit

class ImageCell: UICollectionViewCell {
  @IBOutlet weak var cellImage: UIImageView!

  // Avoiding showing cached image
  override func prepareForReuse() {
    cellImage.image = nil
  }
}

ViewController.swift

import UIKit

class ViewController: UIViewController, UINavigationControllerDelegate, UIImagePickerControllerDelegate, UITextFieldDelegate, UITextViewDelegate {

@IBOutlet weak var albumTitle: UITextField!
@IBOutlet weak var pageTitle: UITextField!
@IBOutlet weak var date: UITextField!
@IBOutlet weak var location: UITextField!
@IBOutlet weak var bodyText: UITextView!
@IBOutlet weak var imageCollection: UICollectionView!
@IBOutlet weak var scrollView: UIScrollView!
@IBOutlet weak var frameStack: UIStackView!

var imageStore: ImageStore!
var images = NSMutableArray()
var selectedImage: UIImage?

override func viewDidLoad() {
  super.viewDidLoad()

  // UITextView
  self.bodyText.delegate = self

  // UITextFields
  self.albumTitle.delegate = self
  self.pageTitle.delegate = self
  self.date.delegate = self
  self.location.delegate = self

  // Create close button above the textView keyboard
  // Tool bar
  let closeBar = UIToolbar(frame: CGRect(x: 0, y: 0, width: 320, height: 40))
  closeBar.barStyle = UIBarStyle.default  // Style
  closeBar.sizeToFit()  // Size change depends on screen size
  // Spacer
  let spacer = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: self, action: nil)
  // Close Botton
  let closeButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.done, target: self, action: #selector(CreateVC.closeButtonTapped))

  closeBar.items = [spacer, closeButton]
  bodyText.inputAccessoryView = closeBar
}

  override func viewDidLayoutSubviews() {
    scrollView.contentSize = frameStack.bounds.size
    scrollView.flashScrollIndicators()
  }

  // Enable textView to close
  @objc func closeButtonTapped() {
    self.view.endEditing(true)
  }

  // Enable return key of UITextFields
  func textFieldShouldReturn(_ textField: UITextField) -> Bool {
    albumTitle.resignFirstResponder()
    pageTitle.resignFirstResponder()
    date.resignFirstResponder()
    location.resignFirstResponder()
    return true
  }

  // Open up device's camera
  @IBAction func takePicture(_ sender: UIButton) {
    let imagePicker = UIImagePickerController()
    if UIImagePickerController.isSourceTypeAvailable(.camera) {
      imagePicker.sourceType = .camera
    } else {
      imagePicker.sourceType = .photoLibrary
    }
    imagePicker.delegate = self

    // Place image picker on the screen
    present(imagePicker, animated: true, completion: nil)
  }

  // Open up device's camera
  @IBAction func pickPicture(_ sender: UIButton) {
    let imagePicker = UIImagePickerController()
    imagePicker.sourceType = .photoLibrary
    imagePicker.delegate = self
    // Place image picker on the screen
    present(imagePicker, animated: true, completion: nil)
  }

  func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) {
    // Get picked image from info directory
    let image = info[UIImagePickerControllerOriginalImage] as! UIImage

    // Put that image on the screen in the image view
    selectedImage = image
    images.add(selectedImage!)

    imageCollection.reloadData()

    // Take image picker off the screen
    dismiss(animated: true, completion: nil)
  }

}

extension CreateVC: UICollectionViewDelegate, UICollectionViewDataSource {

  func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

    return images.count
  }

  // Assign cells contents
  func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as! ImageCell

    cell.cellImage.isHidden = true
    if let image = cell.cellImage.image {
      cell.cellImage.isHidden = false
      cell.cellImage.image = images[indexPath.row] as? UIImage
    }

    return cell
  }

}

Изображение моей раскадровки. Ячейка кажется странной.

Я новичок в разработке для iOS и застрял здесь.

Дополнительные сведения:

Я обнаружил, что размер ячейки выглядит странно. Раскадровка говорит о чем-то таком.

Cell Ожидаемая ширина 0 Актуально: ширина 120

1 Ответ

0 голосов
/ 11 июня 2018

Я разобрался в проблеме. Это были ограничения камеры. Вот как я решил эту проблему.

override func viewDidLayoutSubviews() {
  let layout = UICollectionViewFlowLayout()
  layout.itemSize = CGSize(width: 120, height: 120)
  layout.minimumInteritemSpacing = 0
  layout.minimumLineSpacing = 10
  layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
  layout.scrollDirection = .horizontal
  imageCollection.collectionViewLayout = layout
}
  1. Установите конкретную высоту для CollectionView на раскадровке
  2. Установите ограничения ячейки в методе viewDidLayoutSubviews (), как указано выше
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...