CODEWITHSUNDEEP
iosiphoneuicollectionview
Sudhanshu Gupta
Sudhanshu Gupta

Reputation: 2315

Creating a view as shown in Picture for iOS

I am creating an app where I need to show the data in this formatData representation

Now, this is inside a UITableView, let's say its a UITableViewCell.

What I am thinking of doing:-

1. Lets create a UICollectionView inside the UITableViewCell, this will have 
   3 rows. Every row will contain another UICollectionView where I will put 
   the data
   FLow will be like this :-
   UITableView -> UITableViewCell -> UICollectionView -> UICollectionViewCell -> UICollectionView -> UICollectionViewCell

2. create a UICollectionView inside the UITableViewCell, this will have 
       3 rows. Now I will create a view which contains data as whole and put it on cell. Height will be calculated programatically and view is put inside UICollectionViewCell

So other solutions are like that but I am not satisfied with the solutions I am getting in my mind.

If anyone knows a proper solution to do this. Let me know. Doing in a better way is what I prefer.

Do let me know if you need more details on this

Upvotes: 1

Views: 72

Answers (2)

Sudhanshu Gupta
Sudhanshu Gupta

Reputation: 2315

I have done this in a hacky way.

This is a UITableViewCell in a UITableView, put UICollectionView inside this cell and have 3 UICollectionViewCell.

Logic to create UICollectionViewCell to look the way it is looking in the picture.

1. Use label1 and make it look like the header.
2. for all the subData make a label, make it multiline and when we are passing the data in the label append newLine to every single word.

Label1.text -> "Skill"
Label2.text = "Swimming\n Running\n surfing\n athletic"

Now we can get the height of the labels which would become the height of UICollectionViewCell. I found this the easiest way to do this type of screen.

Upvotes: 0

Sandeep Rana
Sandeep Rana

Reputation: 3441

Create a UICollectionView Add UICollectionViewCell to the view in storyboard Add a Vertical UIStackView to the cell with attributes Fill, and Equal Spacing. Add Layout Constraints to top,left,right,bottom to the Cell.

now inside cellForRowAtIndexPath function you can add as many addArrangedSubviews to the UIStackView.

To customize the size of Cell override function sizeForItemAtIndexPath

Upvotes: 1

Related Questions