UICollectionView Assistance - ios

Question

I am in the process of creating an App to take care of Maintenance Planning for Harley Davidson enthusiasts.
The planned target is the iPad series at this point.
I wish do display a grid that shows detail for each fuel purchase. The following graphic hopefully shows what I am trying to achieve.
To get this, I’m using the UICollectionView as I don’t think there is another View that gives me what I am after.
The code below illustrates how I have done this – but I believe it’s a pretty chunky way of doing it:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
FuelCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"Cell" forIndexPath:indexPath];
cell.backgroundColor = [UIColor lightTextColor];
cell.cellLabel.text = [NSString stringWithFormat:#" %# %# %# %#",self.fuelDetailsForSelectedBike[indexPath.row][0],self.fuelDetailsForSelectedBike[indexPath.row][1],self.fuelDetailsForSelectedBike[indexPath.row][2],self.fuelDetailsForSelectedBike[indexPath.row][3]];
return cell;
}
What I would prefer is have a cell for each piece of information but unsure how I would achieve this using the UICollectionView.

Answer 1

You already have created a custom cell FuelCollectionViewCell which is a good starting point.
Probably you have a prototype cell in your Storyboard with subclass FuelCollectionViewCell right?
In this cell, add 4 UILabel aligned in one row as your design and 'link' them to your subclass .h file with a simple drag+alt (as you've done with cellLabel).
And update your cellForItemAtIndexPath method with something like:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
FuelCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"Cell" forIndexPath:indexPath];
cell.backgroundColor = [UIColor lightTextColor];
cell.dateLabel.text = self.fuelDetailsForSelectedBike[indexPath.row][0];
cell.litresLabel.text = self.fuelDetailsForSelectedBike[indexPath.row][1];
cell.distanceLabel.text = self.fuelDetailsForSelectedBike[indexPath.row][2];
cell.costLabel.text = self.fuelDetailsForSelectedBike[indexPath.row][3];
return cell;
}