I have a UITableView and one of my table cells is a UICollectionViewController subclass that contains a UICollectionView of displayed email addresses. When a user adds an email the UICollectionView and it’s cell in the table view should get taller.
I’m currently attempting to do this setting my collectionView height constraint to collectionView.contentSize.height in the LayoutSubviews method of my collection controller/cell class. My issue is that the cell in the UITableView is not changing size when this happens.
I am assuming that this is because there is nothing telling the table view that the height of the email entry cell has changed. I am currently using dynamic cell sizing - or trying to anyway. Even, if I call tableView.reloadData() this still does not work. I’m wondering if someone could give me a high-level idea of how they would set this up.
UPDATE:
I had a broken constraint issue that was part of my problem, but this is still not solved. While have proven that I can update the height constraint and that will update the size of the collection view, it's out of sync. It's always one update behind. Here's an image showing the 'UICollectionView' in green and you can see in the logs that I'm updating the constraint (yes, multiple times) each time after adding a new item to the collection, but it is not updating the bounds of the view instance. In this example, if I were to add a new item to the collection, the next time I inspect bounds.height it would be at 149.5. What am I missing!?
i had answered this question in another tableview inside tableview cell that will work for collection view too ,i explained it in this thread
ask me if you faced any problem
It seems you want to set the height of your table view cell dynamically. This detailed tutorial walks you through making a custom cell class that will have dynamic height. Unfortunately, this tutorial only walks you through how to do this with auto layout constraints and a storyboard. In the tutorial you'll notice that the height of the cell depends on the constraints put on a title label within the cell. Try doing the same thing, but applying the constraints on the content in your cell (the collection view cell).
http://www.raywenderlich.com/73602/dynamic-table-view-cell-height-auto-layout
Related
Below attached image is representing my requirement:
In this image the yellow color UITableView will have list of different UITableViewCell items. In one of the UITableViewCell it has UICollectionView with its list of UICollectionViewCell items and the scroll direction for the UICollectionView is set to horizontal
Each UICollectionViewCell will have one UITableView (Highlighted in Red Color) and it will have its list of UITableViewCell (Highlited in Rose Color) items. Here, the UITableViewCell (Highlited in Rose Color) item can collapse/expand. Whenever the cell is collapse/expand the red table's content size is handled automatically. But, whenever the red table's content size is increased the collectionview size is not increasing.
I have added all relevant constraints to these UI elements. But, the content size or frame of the collectionview is not expanding when a tableview cell is expanded.
To understand better here i am breaking it down how the views are designed:
Yellow tableview embedded inside a UIViewController and it will have one simple UITableViewCell which has no custom class
To the cell programatically the UICollectionView will be added. This UICollectionView is placed in one xib file and it has embeded inside a UIView
UICollectionViewCell has been created in one xib and it will have UITableView element inside.
Also, UITableViewCell has its own xib to refer and this is the cell which will gets expand/collapse
I have tried modifying the intrinsicContentSize property to modify the UICollectionView property's height where it has embedded inside UIView element whenever the expand is happening. Please, refer the CardView.swift for the reference.
CardView.swift
I know the design is bit complex. But, what am i missing here?
Based on your requirement in the image, I just created a sample project here.
I did not use separate Xibs. However, I was able to achieve what you asked for.
You might have to handle the reload of the innermost tableView better based on your apps business logic.
Here's what I have implemented:
The top most view controller has a parent table view.
This table view cell consists of a child collection view.
The child collection view cell consists of a grand child table view.
The grand child table view is the one corresponding to the table view Highlited in Rose Color in the question.
To answer your question about the collection view not expanding: to expand the child collection view when the grandchild table view cell is tapped, I am reloading the parent table view by increasing the row height for the cell containing the collection view. Hence you don't have to worry about adjusting the constraints in auto layout
In case you want to add additional content into the child collection view cell, you can add a height constraint to the grand child table view with a low priority and modify that whenever you need to expand the content in the grand child table view.
if you want to achieve point 6, as suggested by #Ramy Al Zuhouri, you might have to call: collectionView.performBatchUpdates before collectionView.reloadData() to expand the cell size
Refer to the video below for better understanding
This doesn't necessarily solve your problem, but sometimes it's a matter of forcing the collection view to invalidate its layout and recalculating its size. I once received an answer to a TSI from an Apple enginner:
So this is old fashioned way of forcing a re-usable container (Collection || Table) to invalidate its layout. You may even be able to just call invalidate layout. There are oddities in the system with AutoLayout and animations that sometimes throw the system into an odd state. If we do the above the container and can invalidate its layout and make updates without need to re-calculate + incorporate animations. To summarize, calling performBatchUpdates with nil parameters can be useful if you need to force an update based on layout content (not necessarily datasource changes).
It looks like a hack to be used with caution, but it can be worth to give it a try. Whenever you need to recalculate the size of the collection view's cell to expand or shrink, you can do this:
UIView.setAnimationsEnabled(false)
collectionView.performBatchUpdates(nil, completion: nil)
UIView.setAnimationsEnabled(true)
collectionView.reloadData()
This forces a reload, and UIKit is able to recalculate the height of the cell given that you update the height. How? In my case I did by updating a height constraint, but there are multiple ways of doing this. However, it's intended that as the reload happens the collection view should be aware of the new cell height.
the good approach for this, you have to add collectionView in the tableViewHeader
then whenever you scroll up your tableView your collectionView section will also scroll up
to load cells on the specific indexes follow bellow steps:
if(indexpath.row == 0){
//load first tableView cell with collection view
}
else if (indexpath.row == 1){
//load second tableView cell with collection view
}
else{
//load table view cell here
}
I have a UITableView which have some cells that will be always be there, one cell with a UICollectionView in it that will act like tabs, and finally one cell with a UITableView in it, whose data will change.
Then when the user selects one of this "tabs", I want to reload the nested table to show the correct data rows (the height of this rows will be dynamic).
I have already achieved that the nested table changes on the collection item selection, but the problem I am facing is that the UITableView inside the cell is not sizing properly.
I have build a sample app just to simplify the views. As you can see in the screenshot, the cell that contains the table is not filling the rest of the screen, so the 10 rows are not visible unless you scroll this table.
What I want is this table to fill the rest of the screen. The user must be able to scroll the main tableview, not the nested one, and still see all of the nested table cells.
I can't do this with multiple sections because I will have a header section that will be always fixed on top, if I had another section, it's header will replace the sticky one on scroll.
I have set the rowHeight of the main UITableView to UITableViewAutomaticDimension and an estimatedRowHeight too. I have pinned it to top, left, right and bottom of the cell's ContentView.
Can you help me with this, please? If it helps, I could upload the sample project and link it here.
Thank you very much!
If you are using autolayout then,
Give height constant to nested table view, create outlet for that height constraint.
When you reload that nested table, you will get that table's content size.
Fetch height from that content size and modify height constraint.
I seem to be having a very strange problem with my UITableview cells and autolayout. So my tableview is set up as follows:
I have a UITableView within a UIViewController that I created via Interface builder using Autolayout
My tableview is using UITableViewAutomaticDimension so that the cells can resize based on the text within them.
Each cell has 2 subviews within it. A front view and a back view. The back view contains the buttons for my slide-able cells
I am using NSFetchedResults controller to update the tableview
The problem occurs when I tap on a cell and am taken to the next view. Then I create a core data item within that view and save so that it is inserted into my tableview (now behind the current view controller).
What happens is that the newly inserted cell seems to lose all autolayout constraints and all view elements are on top of each other in the top left of the cell. It also looks like they are not even contained within the front view for the cell (or the front view has a width and height of 0).
Example:
It gets even stranger. If I refresh the tableview by pulling down and the cells are reloaded it corrects itself. However, if I refresh the tableview again then the problem appears again but on a different cell. This bug does not happen consistantly which is rather frustrating.
Any help would be appreciated as I only have a few remaining hairs on my head to pull out at this stage.
Thanks in advance!
So I found out what the issue was. The issue was that I was using size classes in Interface builder but I was only using the iPhone Portrait size class and did all my work in there instead of the "any" size class. Disabling size classes and setting the project to iPhone only fixed all these problems.
Weird I know
I have a table with different cells and I need to add a scroller view with special UI in some cells:
I need to develop the UI which you can see in section 0.
So my questions are:
How can I add a scroller view?
How can I load data only for those items which are shown right now?
How can I change the width of "Line" column after scrolling to the right?
I'll answer as best I can with some starting pointers for you...
You need to subclass UITableViewCell and in your subclasses drawRect method you should add a UIScrollView to the contentView.
Not totally sure what you mean here, please expand.
In your new table cell, set it as the delegate of the scroll view you implemented, then you''ll get callbacks when the scrollview scroll with the contentOffset value, which you can use to calculate how much to grow or shrink the line items.
I have tried looking for an answer to this question but so far I haven't got any luck.
Context
I have a UITableView inside a standard UIViewController (NOT a UITableViewController..). I have subclassed UITableViewCell and all the cells in the tableview are from the same class.
Requirement
I would like to find an efficient way to resize the cells based on the scrolling of the tableview. For example, when the cell is at the bottom of the visible list, the height is X. When the cell moves up on the screen, its height should proportionally increase to 2X.
Additional Info
I am close to just ditch the UITableView way and start making my own control that would implement such a feat by subclassing a UIScrollView. However, I would like to see if it is possible before going this path. I did see some very interesting SO posts but nothing that would put me on the right path.
Any hint or help would be highly appreciated.
You would need to respond to the scroll view delegate method scrollViewDidScroll: and implement it to record the cell at the top of the table view and reload the table view. Then your table view delegate method tableView:heightForRowAtIndexPath: sets the cell height by the relationship between the index path and the top cell index path.
Your main issue is performance while reloading the table view all the time.
If you wanted to roll your own solution it would be along the lines of the above description anyway, but you would be able to be more efficient than the table view as the table view will call the tableView:heightForRowAtIndexPath: method once for every row for every reload in order to calculate the total height of the table content.