Reputation: 481
Is it possible to design the below UI using tableview ?
I know, I can define numberOfSections in the tableview. In each cell, I can define number of column. But, i am not sure how to add the image in the tableView ? What i understand is the image will be on the right side merging some cells. But how to do it or is it possible or not ?
Any help will be highly appreciated.
Upvotes: 0
Views: 85
Reputation: 2740
Yeah its possible. You need to do some calculation for Y Position, trailing space from tableview, etc
Add your image view into tableView.
let imageWidth: CGFloat = 150.0
let imageHeight: CGFloat = 150.0 //Addition of height of meging cells
let trailingSpace: CGFloat = 25.0
let yPosition: CGFloat = 100 //Calculate Y position depend on NavigationBar, Name cell, etc...
let imgView = UIImageView(frame: CGRect(x: view.frame.width - imageWidth - trailingSpace, y: yPosition, width: imageWidth, height: imageHeight))
imgView.backgroundColor = .clear
imgView.image = UIImage(named: "Waterfall")
imgView.contentMode = .scaleAspectFit
tableView.addSubview(imgView)
Upvotes: 1
Reputation: 19765
You will not be able to add an image to those 4 cells at once.
As I see it, there are two options:
create a single cell for those 4 cells, in which use UIStackView
s or just autolayout to lay the contents out along with the image.
Change the tableView
to a collectionView
with custom layout implementation, then you can have the image as a single cell laid out to the right of those cells.
I myself would chose the first approach, because I believe it will be easier and faster to implement.
Upvotes: 2