title: Best approach for a UICollectionView to look like the iOS calendar app
body: <p>I'm building an app where I really need to display a list like the one seen in the iOS calendar app. I need to create a collectionView where I can have cells that expand enough to cover their respective hours, like so:</p>
  
  <p><img src="https://i.stack.imgur.com/z1Snk.jpg" alt="enter image description here"></p>
  
  <p>I've tried various things, including <a href="https://github.com/erichoracek/MSCollectionViewCalendarLayout" rel="nofollow noreferrer">this project</a> at Github which I didn't understand how to use in another project</p>
  
  <p>As well as this project I quickly made with a UITableViewController while exploring different methods:</p>
  
  <p><img src="https://i.stack.imgur.com/ioA7f.png" alt="enter image description here"></p>
  
  <p>But I'm not really getting where I want to. I need to have the design seen in the first picture and was wondering if anyone could point me in the right direction to achieve that?</p>
  
  <p>Thank you so much for help!!</p>
  
  <p><strong>Update:</strong></p>
  
  <p>Shouldn't the actual cell frame represent the start of an hour, 10:00 in this example? (Rather than the custom-made separator)</p>
  
  <p><img src="https://i.stack.imgur.com/p2jZH.png" alt="enter image description here"></p>
  
  <p><strong>Update</strong></p>
  
  <p>Why does the hierarchy look like this:</p>
  
  <p><a href="https://i.stack.imgur.com/0vfep.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0vfep.png" alt="enter image description here"></a></p>
  
  <p>This kind of positioning appears to be "blocking" the touch of the cells and the <code>didSelectItemAtIndexPath</code> method doesn't get called. This applies to the cells that appear further back than the other ones.</p>
  
  <p><a href="https://i.stack.imgur.com/iZyoP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/iZyoP.png" alt="enter image description here"></a></p>