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
Related
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
In my app, I have a table view with an image, label and text view in each cell. I would like to be able to auto-resize the cells depending on the amount of content in the text view. (The text view is the lower most text.)
So far, I have added the correct constraints; leading, trailing, top and bottom to the text view and have disabled scrolling and editing.
In my tableViewController.swift file, I have written this code:
override func viewWillAppear(_ animated: Bool) {
tableView.estimatedRowHeight = 100
tableView.rowHeight = UITableViewAutomaticDimension
}
However, this is not working as when I add more text to the text view, it just cuts off.
Maybe this has something to do with the card like look, I have got a UIView in each cell acting as a card.
I honestly don't know what I am doing wrong
A picture is below of what my app looks like and if anyone could help that would be greatly appreciated
Check if your constraints are like this(based on your image) :
imageView : set to Top and Leading of your container, with fix height and width values.
label : you can set it to top and horizontal space of your image, with fix height and width as well.
textView : leading to image, top space to label, trailing and bottom to container.
And keep using
tableView.estimatedRowHeight = 100
tableView.rowHeight = UITableViewAutomaticDimension
in your viewWillAppear()
Update for swift 4.2
Use:
UITableView.automaticDimension
Instead of:
UITableViewAutomaticDimension
Make sure that the content mode is set to Scale To Fill of your UITextView
Make sure that there are no height constraints for the UITextView and the card UIView
Try to add the estimated height into viewDidLoad:
override func viewDidLoad() {
tableView.estimatedRowHeight = 100
tableView.rowHeight = UITableViewAutomaticDimension
}
Maybe the AutoHeight is not working because of the UIView above the UITextView. Try to call the sizeToFit and layoutIfNeeded methods for the UIView in the cellForRowAt:
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Identifier", for: indexPath) as! CustomTableViewCell
cell.vwCard.sizeToFit()
cell.vwCard.layoutIfNeeded()
return cell
}
You can also try the sizeToFit and layoutIfNeeded as well for the UITextView.
Hope this works........
Set bottom of your textView with bottom of that white UIView and make sure that white UIView has left,right,top and bottom constraints :)
Same type of example is explained here programmatically....
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 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)
}