I want cell separators in every single one of my sections other than section 0.
Between "New Game", "Friends", "Random", "Judge", and "Challenges" I don't want any separators. The cell type in section "0" or "New Game" is different than the other sections' cell types so I tried this: iOS swift remove UITableView Cell separator space but it didn't work.
Another issue I'm facing is how to erase the space left when a header is gone because it has no rows in it.
Here is a picture:
As you can see, "Waiting For Opponent" has disappeared because there are no rows in the section.
So to be extremely clear:
How do I conditionally hide the separators in section 0 without hiding the entire tableView's separators?
How do I hide the space that is created when I hide a section header?
I can think of two options:
Hide the separators entirely and implement your own separator by adding a UIView with 1-2pt height placed at the bottom of the cell which can then be hidden/unhidden based on your requirements in cellForRowAtIndexPath. OR
In cellForRowAtIndexPath, change the insets of the separator for that cell so that the separator goes out of the view. Eg:
cell.separatorInset = UIEdgeInsetsMake(0.f, 0.f, 0.f, cell.bounds.size.width-cell.layoutMargins.left)
Have you tried returning zero in tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat ??
Related
I have a tableview. Some cells contain images, other text.
I want to be able to collapse and expand the cells. In order to be able to do so I did the following:
I created a variable isExpanded = true
In cellForRowAt I check if the cell contains text and then...
if textIsExpanded {
cell.textLabel?.sizeToFit()
cell.textLabel?.numberOfLines = 0
}
so that the cell can be as tall as the text inside of it.
In the action I toggle textIsExpanded and reload the table:
textIsExpanded.toggle()
table.reloadData()
This procedure perfectly works with tableviews only containing text.
Something that would work was expanding the if statement and in the false branch calling:
cell.textLabel?.invalidateIntrinsicContentSize()
cell.textLabel?.layoutIfNeeded()
BUT this doesn't work when I toggle the variable, this only works on launch.
How can I collapse and expand back the cells in my tableview?
Create your cell with a stack of two views, Upper view and lower View, Add a Bool key to your Model isExpandable that is triggered and changed on didSelect and check on this to hide or show your view, EIther keep the text as text or TextView up to you.
I am currently trying to offset HeaderView for UITableView to get some feel of passbook view but doesn't need to behave like a passbook, just that the upper view gets offset certain pixels to overlay the sections.
Below are a couple of examples I have been working on.
If you notice the first picture, the layout is completed customized in CollectionView, however, I feel like it's over-engineered to get the feel of something based on UITableView in UICollectionView. However the context of the output needs to be rendered just like the one in UITableView based on the second picture, but I am curious if there is any way to offset the "y" value to overlap the previous section header in UITableView?
You need to use a custom UICollectionViewLayout.
Basically, use a UICollectionView with vertical scroll, set the items width equal to the screen's width and implement a custom UICollectionViewLayout instead using UICollectionViewFlowLayout.
You can't overlap two cells in UITableView, because doesn't exist the concept of layout. Cells in UITableView are sequentially.
Here a possibile library.
as #Fry mentioned in his answer, UITableView not really expect you to "move" the section header or cell, and UICollectionView maybe a better option as it give a high degree of flexibility (but of course you will need some work to implement a custom UICollectionViewLayout).
But if you insist to use UITableView, here is a simple idea to achieve what you asked for. Just set the backgroundColor of the section header of next section to match the previous section. This really just give you the "feel" of passbook view but not behave like it.
For example,
let mockData = [(key: "section 1", value: [], color: UIColor.red),
(key: "section 2", value: [], color: UIColor.blue),
(key: "section 3", value: [3, 4, 5], color: UIColor.green)]
...
override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let header = tableView.dequeueReusableHeaderFooterView(withIdentifier: "header") as! TestViewHeader
header.containerBackground.backgroundColor = mockData[section].color
// here .white is just an example, you can add any color you want to match with the background or the navigationBar, depends on your design
header.contentView.backgroundColor = (section == 0) ? .white : mockData[section - 1].color
header.containerLabel.text = mockData[section].key
header.containerBackground.roundCorners(corners: [.topLeft, .topRight])
return header
}
And here is the result:
also attached my tableView Header and my helper function for your reference:
I have a TableViewController which contains 2 sections:
Section 1 - is a cell which is loaded from a xib file. This cell just contains a TextView.
Section 2 - Contains multiple cells populated from an Array.
The section 1 only exists if the master (previous) UITableView cell you select contains a certain piece of data.
All of the above works as expected, below is the parent view. The list of items come from a database, some items have a description, and some do not. For example below this image, you'll see the view is 'Classic Starters' is selected. Then below that, you'll see the view if 'Stir Frys' is selected. Stri Frys contains a description:
Now, what I want is, the description cell which is shows on the Stir Frys page, to automatically grow depending on the length of the text inside it. So if a description is 10 lines long, it will grow to show all 10 lines.
Does this have to be done programmatically, or is their a feature in XCode I'm missing ?
You can use UITableViewAutomaticDimension.
1)
Set properties estimatedRowHeight and rowHeight of your tableview, in viewDidLoad for example. Like this :
self.tableView.estimatedRowHeight = 50
self.tableView.rowHeight = UITableViewAutomaticDimension
2) Return UITableViewAutomaticDimension in your heightForRowAt delegate method :
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return UITableViewAutomaticDimension
}
First you need to do is to set estimatedRowSize to a value that best estimates most common size, and rowSize to UITableViewAutomaticDimension:
self.tableView.estimatedRowHeight = 44
self.tableView.rowHeight = UITableViewAutomaticDimension
In your case, since except the first one all the other cells are supposed to be the same, you can use the height of the rest of the cells as the estimatedRowHeight.
You don't have to implement heightForRowAt at all.
The second step you need to do is to setup proper constraints on the cells. That means you have to constrain the contents of the cell to the left, right, top and bottom of the cell, so that when contents grow, the cell will need to grow, too. Common mistake is to forget to constrain bottom, so then the cell does not grow and the contents leak through the bottom of the cell.
Third, since your dynamic cell contains UITextView, you need to make sure that it will grow with its text. That is not automatic. To achieve that, based on this answer, this should suffice (in the cell):
textView.isScrollEnabled = false
If you are using storyboard, just uncheck scroll enabled.
I have a UITableView with grouped style. I have set the footer height to 0.
tableView.sectionFooterHeight = 0.0
When I scroll down all the way I get a grey area at the bottom of the table view.
How do I get rid of this area?
Edit: This problem only happens for grouped table style. If I use plain style I don't get the blank area. But using a plain style is not an option for other reasons.
It must be the height of section footer which is consuming this area. Try setting the following:
func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return CGFloat.min
}
Instantiate the tablefooter view with a UIView eg:
`tableView.tableFooterView = UIView()`
I've an issue for few days and really I can't explain why it goes like that.
I'm doing a chat, set up with a tableView, printing message into cell. These cells are designed with prototypes, there are 3 different type (but anyway it doesn't matter). Text is typed, message is send, cell is inserted in table and then we scroll to the bottom of the tableView.
As you know, in a chat view the container of the message has to fit this text (which is a view), and then the cell has to fit to this container (Label in orange, container in purple).
This container has a variable height and grow along the text, changing cell height.
I've set many constraint for auto-layout display but I didn't have different cell height than the height I initially set for it in the project (no adaptative behaviour). Chat Message were cut.
So, I've tried to set each rowHeight by myself using the method heightForRowAtIndexPath, calculating constraint along text size but it create a real bad behaviour (changing cells when scrolling for example). The size was often wrong calculated/recalculated.
That's why I'm finally using estimatedRowHeight set to 44 combine with UITableViewAutomaticDimension. Here it does the trick ! Waouh ! But it's not as good as expected..
When the table view appears all is good. Containers fit to their label, rows' height fit to their container and it's beautiful. The problem appears during an insert.
After many tests, I notice that this bad behaviour only appears when multilines label remains in the table view.
During an insert, each cell seems to resize to 44 before adapt its height to content, and then create a gap compared to previous state which create a strange scroll of the table view :
If I change the estimatedRowHeight it made this worst.
I can show my code if you want, but I don't think it will be very useful here because I'm not using complicated function.. only insert, automatic height for cells and scroll down which are functions delegate for tableView.
Can you help me please ? Really I don't know how to change that.. every chat application does the trick but I can't found out the way.
Thank you for answer, excuse my english level I'm a poor french student..
If you need some code comment I'll give it.
I think you can cache height value for every cell in cellForRowAtIndex method and in HeightForRowAtIndex set the corresponding height for that cell.
You can just do this way :
var cellCached = Dictionary<Int,AnyObject>()
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
{
table.rowHeight = yourCell.yourLabel.frame.origin.y + yourCell.yourLabel.frame.height + 10
cellCached[indexPath.row] = yourTable.rowHeight
}
func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
if(tableView == yourTable)
{
if(cellCached[indexPath.row] != nil)
{
return cellCached[indexPath.row] as! CGFloat
}
else
{
return 200
}
}
else
{
return UITableViewAutomaticDimension
}
}