title: Swift 5 Collection View Layout of Cell and all the items inside the cell
body: <p>I'm new to <code>IOS</code> development and I'm just trying to get my feet wet. For the past couple of days I've been trying to wrap my head around how to embed horizontal and vertical scrolling inside swift for views.
  One thing that people seemed to mentioned and use when it came to this was Collection Views. I've been trying to learn how to properly use them and build the picture you can see below in Swift.</p>
  
  <p><a href="https://i.stack.imgur.com/5jCpT.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5jCpT.png" alt="Goal or what I&#39;m trying to build in Swift"></a></p>
  
  <p>Under the label <strong>Browse Categories</strong> there is a container that allows horizontal scrolling,the categories container.
  Below the label <strong>discover</strong> there is another container that should allow for vertical scrolling, the feed container(Similar to instagram, Airbnb , Pinterest etc)</p>
  
  <p><strong>2. What I've tried</strong></p>
  
  <p>From countless hours of googling and stackoverflowing I found out that Collection Views might be suitable for this task so I digged in.
  The apple documentation lacked some examples so I searched for tutorials to help me out.
  At the end of the day I was able to achieve the horizontal scrolling for the categories.
  This looked like this.
  <a href="https://i.stack.imgur.com/DySGv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DySGv.png" alt="Horizontal Scroll for categories"></a></p>
  
  <p>So far so good!
  The trouble actually starts as soon as I try adding the next collection scroll view(the vertical for the feed).
  After adding the feed collection the screen looks like this.</p>
  
  <p><a href="https://i.stack.imgur.com/e7MHn.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/e7MHn.png" alt="Feed Collection View"></a></p>
  
  <p>So what exactly is my problem?
  Well my problem is that although I set the constraints within the storyboard for the <code>UIIMage</code> view to fill the entire Content View I am presented with something else.
  I want to know how I can perfectly control the size and shape of the <code>UIImageView</code> and any other element.
  For simplicity I omitted things such as the star, username etc.
  But when I tried implementing this the project included everything.</p>
  
  <p>I can't wrap my head around how to control the size and position of the contents of the <code>CollectionViewCell</code>.</p>
  
  <p>I was assuming that positioning and size was taken care of by the constraints I set inside the storyboard for each element but that does not seem to be the case and now I'm lost.</p>
  
  <p>I saw some post where people mentioned <strong>UICollectionViewLayoutAttributes</strong> but I just don't know how ti incorporate this in to my project.</p>
  
  <p>I'm open to suggestions and I also have some more closing questions.</p>
  
  <ol>
  <li>Am I going in the right direction?</li>
  <li>Is there a more simple way to do this? Seems to be a lot of code for what the web takes maybe 15 lines of code.</li>
  </ol>
  
  <p>Thx in advance</p>
  
  <p>Github: <a href="https://github.com/Taharcca/LayoutChallenge.git" rel="nofollow noreferrer">https://github.com/Taharcca/LayoutChallenge.git</a></p>
  
  <p>Code Snippets</p>
  
  <pre><code>        import UIKit
  
  class ViewController: UIViewController {
  
      @IBOutlet weak var categoriesCollectionView: UICollectionView!
      @IBOutlet weak var feedCollectionView: UICollectionView!
  
      let categories = Category.load() // Load data
      let feeds = Feed.load()
      override func viewDidLoad() {
          super.viewDidLoad()
          categoriesCollectionView.dataSource = self
          categoriesCollectionView.delegate = self
          feedCollectionView.dataSource = self
          feedCollectionView.delegate = self
          // Do any additional setup after loading the view.
      }
  }
  
  extension ViewController: UICollectionViewDelegate {
      // Not sure when to use this
  }
  
  // Diese Erweiterung legt die Datenquelle einer Collection View fest
  extension ViewController: UICollectionViewDataSource {
      // Wie viele Reihen?
      func numberOfSections(in collectionView: UICollectionView) -&gt; Int {
          return 1
      }
      // Wie viele Objekete soll es geben?
      func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -&gt; Int {
          if collectionView == categoriesCollectionView {
              return categories.count
          }
          else {
              return feeds.count
          }
      }
  
      func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -&gt; UICollectionViewCell {
          if collectionView == categoriesCollectionView {
              let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CategoryCollectionViewCell", for: indexPath) as! CategoryCollectionViewCell
              let category = categories[indexPath.item]
              cell.category = category
              return cell
          }
          else {
              let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "FeedCollectionViewCell", for: indexPath) as! FeedCollectionViewCell
              let feed = feeds[indexPath.item]
              cell.feed = feed
              return cell
          }
      }
  }
  
  // Größe der Zellen...Sehr intuitiv..... Danke Apple
  extension ViewController: UICollectionViewDelegateFlowLayout {
          func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout:
              UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -&gt; CGSize {
              if collectionView == categoriesCollectionView {
                  return CGSize(width: 150, height: 75) // Collection View size right?
              }
              else {
                  return CGSize(width: 374, height: 494)
              }
  
  }
  
  }
  
      import UIKit
  
  class FeedCollectionViewCell: UICollectionViewCell {
      @IBOutlet weak var backgroundImage:UIImageView!
  
      var feed:Feed! {
          didSet {
              self.update()
          }
      }
      func update() {
          if let feed = feed {
              backgroundImage.image = feed.image
          }
      }
  }
  </code></pre>