0

Am a very newbie to swift and IOS. I would like to implement a view like below and also make each section able to swipe horizontally. a prototype I have several design questions:

  1. Should I have one UICollectionView or three?
  2. If I further want to open each section like click the "Breakfast" to go to the full view of breakfast, is the answer still the same for question 1?
  3. For the header, is it better to have a label or make it a section header. Since I think just have a label is much easier.
  4. Is there any example available on swift to do this? Kind of feel that this is a very standard normal one.
Kayathiri
  • 779
  • 1
  • 15
  • 26
DashengMa
  • 1
  • 3

1 Answers1

2

  1. It can be implemented either way, but I would probably go with one collection view. Splitting it up would be done by different sections which you would implement by using the function 

        override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {

           return 3
}

Then you would decide the number of items in each section with:

override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 3
    }

Then you would define the contents of each cell with:

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

    // Configure the cell

    return cell
}

Then you would move onto a new viewcontroller when they selected a cell using 

override func collectionView(collectionView: UICollectionView, shouldSelectItemAtIndexPath indexPath: NSIndexPath) -> Bool {
        return true
    }

indexPath has indexPath.section and indexPath.row which allow you to access exact loccations of each cell when needed in the functions. You will also need to set up a delegate/datasource for the collectionView to make it work and call collectionView.reloadData() anytime the contents of the cells are updated without leaving the viewController. Using a header is easier then a label if you use a single collectionView with 3 sections, and if you use 3 table views, using a label or a header are simularly as complicated, but I don't recommend this way. And last... link to collectionView tutorial

Sethmr
  • 3,046
  • 1
  • 24
  • 42
  • Thanks @Sethmr, this is very helpful and I tried the way and it worked great. One more concern is that, is it possible to make each section scrollable horizontally and the whole collectionView scrollable vertically? – DashengMa Jun 25 '16 at 20:49
  • It is possible, but this would require a lot more work. You always have to be extremely careful when using both vertical and horizontal scrolling. Priorities have to be setup and I don't have time to get into it all. I would read the documentation on ScrollViews and Collection view thoroughly before trying to delve into all of that. – Sethmr Oct 31 '16 at 19:04