I am replicating the effect in the image below. I created a custom UITableViewCell class with an UIImageView property. I set the prototype cell to my custom class. However, I cannot get the table cell's height to resize to the height of the image. There is always space above and below the image.
You can make the heigh of your UITableViewCell dynamic regarding the height of your image. The UITableViewDelegate has a function entitled tableView:estimatedHeightForRowAtIndexPath: that according to Apple:
Asks the delegate for the estimated height of a row in a specified location.
Then you can in your method ask for the height of the UIImageView and set the height for the row properly, see the following example:
func tableView(tableView: UITableView, estimatedHeightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
return self.getEstimatedHeightForImageAtIndex(indexPath.row)
}
func getEstimatedHeightForImageAtIndex(row: Int) -> CGFloat {
// here you need to get the height of image for the selected row.
}
There is a nice tutorial you can read to know more about the topic :
UITableView Tutorial: Dynamic Table View Cell Height
I hope this help you.
What I did was to create a custom UITableViewCell, added an UIImageView to the cell and resized it in the storyboard to fill the whole cell.
If you do that though, make sure you add the constraints to have it horizontally and vertically centred, and add the spacing constraints, but change the spacing not to margin (uncheck the box).
See the image below:
And another thing to remember is the content mode of the imageview. I learned a lot from #EmptyStack and #erkanyildiz answers to this question.
I hope you found any of this useful, and I am sorry if none of it helped! :)
Create a custom UITableViewCell, set cell style to custom in storyboard. Add an UIImageView to the cell and resize image to fill the whole cell. Add image outlet to your custom UITableViewCell and use that outlet when seting an image in your TableViewController.
In your viewDidLoad() function add
tableView.rowHeight = UITableViewAutomaticDimension
Then you need your image aspect ratio (width / height) so you can use it when you set your row height.
func tableView(tableView: UITableView, estimatedHeightForRowAtIndexPath
indexPath: NSIndexPath) -> CGFloat {
return view.frame.width / CGFloat(aspectRatio)
}
Related
My tableviewcell height stays fixed even though I do the following:
tableView.rowHeight = UITableView.automaticDimension
tableView.estimatedRowHeight = 150
I have one imageview and one label inside the cell and I gave constraints to each side.
Also, I tried:
func tableView(_ tableView: UITableView, estimatedHeightForRowAt indexPath: IndexPath) -> CGFloat {
return UITableView.automaticDimension
}
I need a fixed height for my cell. It doesnt need to be dynamic. But no matter what i tried the height stays around 50px.
Any help?
Setting automaticDimension is based on using auto layout in your cells.
This means you must add a NSLayoutConstraint to all sides of a UILabel (or any other control you use in your cells) and the UITableViewCell container in interface designer or in code. In case of a label, configure setting 'Lines' to 0 and 'Line Break' to Word Wrap.
you can set the height you want with heightForRowAtIndexPath, hopefully that helps
I have a TableViewController that has a custom TableViewCell under the identifier "customCell". Heres an image of the configuration of the cell along with the IBOulets connected to it:
The cell takes information from my backend and presents it. The description text view (just noticed that I accidentally named it descriptionLabel) doesn't allow scrolling so it expands based off of the content that it's holding. The database is being processed correctly from the database, and it's displaying on the app. The only problem is that the cell is not its correct height. On the TableViewControl that's registering this cell through its identifier, I automatically set the height of the cell using UITableViewAutomaticDimension in heightForRow:
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return UITableViewAutomaticDimension
}
but that's not working either. *The only thing that works is when I set the height of each cell to a standard value such as 200. That doesn't work for me because each cell will be a different height because of the length of the textView.
How do I set the height of a custom nib (tableViewCell) so that it adjusts based off of the content within it instead of setting the height to a specific value?
1-Remove both textViews and replace them with labels
2- Title lbl with theses constraints
top,leading,trailing , .lines = 0
3- Description lbl with theses constraints
bottom ,leading,trailing to contentView,top to bottom of title lbl , .lines = 0
Off course you can leave the 2 textviews , but you have to give each one an initial height and do this in
override func layoutSubviews() {
super.layoutSubviews()
self.titleTvHeight.constant = self.titleTv.contentSize.height
self.desTVheight.constant = self.desTv.contentSize.height
}
//
Don't forget to set this in viewDidLoad of the VC
tableView.estimatedRowHeight = 200
tableView.rowHeight = UITableViewAutomaticDimension
Anyway you can remove heightForRowAt
I have a tableView that containts a image in each cell. When the app starts I check if the user is using a iphone 5 or iphone 6 plus then I change the cell height and image height constraint to fit the device.
Right now I change the height constraint inside viewDidLoad but is this the right place?
I prefer to use a tableView function:
func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
return [DESIRED HEIGHT]
}
This way you can create conditions for each type of cell and set their height here.
The image constraints should be related to the cell's bounds.
I want to design a tableView like this
But when I adjust
In the cellForRowAtIndexPath, I put cell.contentView.frame.width = CGFloat(tableView.bounds.width - 40) to make the contentView of Cell smaller, but it shows error:
Cannot assign to property: 'width' is a get-only property
So how to make the cell smaller.
Any helps would be appreciated, thanks.
You can't directly assign to the width of a CGRect. A CGRect consists of position and size, and the size in turn consists of height and width.
In other words, frame.width is just a getter for frame.size.width
So the correct assignment would be:
cell.contentView.frame.size.width = CGFloat(tableView.bounds.width - 40)
But this altogether is a bad pattern.
You should design the cell as a custom cell, either in a new .xib file or as a prototype cell in the storyboard, and use AutoLayout to layout the subviews of the cell's contentView.
Use the heightForRowAtIndexPath method
override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
return calculatedHeightForSpecificIndexPath
}
To custom a cell like that image I posted, just create an UIView inside the contentView of cell, like this:
The result here:
I have a table view controller displaying square videos, and I want each table view cell to be a square as well. Is it possible to have each UITableViewCell dynamically resize according to the width of the screen (for example 320x320 for iPhone5 and 375x375 for iPhone6)?
In my view controller's viewDidLoad function I have:
frameWidth = self.view.frame.size.width
self.videosView.rowHeight = UITableViewAutomaticDimension
self.videosView.estimatedRowHeight = frameWidth
The constraints for the view that displays the video inside the UITableViewCell are:
Leading and trailing space to superview, top space to superview, 1:1 aspect ratio
I still can't get the cell to be a square though. Any help would be appreciated!
You can use this tableview method:
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return UIScreen.main.bounds.width
}
Note: Method in Swift 3
There is a good reason that this is hard to do. Cells inside UITableView is reused so it can be allocated once. (for performance)
Resizing view is performance wise costly, that's way you only put one number as height of cell.
What you can do is to have if statement and return accordingly to phone version.
try to use it with bounds instead of frame
frameWidth = view.bounds.size.width