I've got a UITableView (filling whole screen) with several dynamic sections (these could be added/removed at any time). These sections are pulling data from various sources and if there are no data the section wouldn't show. There is one section in the middle which is always there and if there are no data for that one either it should show single row filling the whole screen (minus the header) showing label like "no data found".
So say I've got sections A, B, C, D, E. Section D is always visible but the rest might or might not be there. I'm resizing the D cell based on table's contentSize but the problem happens when there is something in section E. In that case when drawing the section D the contentSize seems to be wrong - I guess it's because at that time section E hasn't been drawn yet. It works fine when there is no section E visible.
Is there any way how I can have cell in the middle of the table dynamically resize based on how much space the table content is taking on the actual screen?
Or maybe my solution is completely wrong and there is a better way?
EDIT
I've added a picture - please excuse my terrible drawing. Basically if there is not enough data in other sections - the single cell in section D (green rectangle) should expand to take remainder of the screen in case the table content is not taking up the whole screen.
[
Related
I am trying to recreate a menu similar to the ones in the detail view of the iOS 13 Health app. Please refer to the marked up screenshot.
I know that this can be done with a table view. There's a section title and list items. But what I want to achieve is similar to the look shown in the screenshot whereby there's a background colour on the list items (not including the section title) and rounded corners at the top and bottom of the list.
Can anybody tell me how I can achieve this with the table view? Or point me towards the right direction? I already know how to setup table views and programmatically add the details. I just need help on how to achieve the styling as shown below.
Thanks!
So, I was able to figure it out. For the benefit of the devs who stumble in the same dilemma, I'm posting my solution here. But I will be tagging Glenn's answer above as the correct answer as it lead me to find the solution. Thanks again Glenn!
It appears that I didn't have to do anything special with my code. I just discovered that on XCode 11 and iOS 13, there's a new table view style called "Inset Grouped". You may set this property from IB or via code.
With a quick experimentation I was able to come up with the result as shown on the screenshot below.
It's not that complex to do. This one of the multiple ways that that style can be done.
a. You can use grouped tableView, as what you've indicated in the screenshot.
b. Provide section title, or better yet, a section view (for more customization!).
c. For each section, you have ONE tableViewCell.
d. For each cell of that c., you will have a tableView.
e. For each tableView of that d., you will have your a new cell of course (item cell).
f. How to compute for the height of the tableView of e.? There are multiple ways.
Provide static height (if your number of items are static).
If dynamic count, but you have constant height of each cell, then you can just compute it like so: itemsCount * heightConstantOfCell
If again you have dynamic count of rows/items, and you have iether constant height of each cell or dynamic height of each cell, then you can observe the frame key of the whole tableView.
g. Finally, just add some corner radius to each container view of your tableView in d..
Note, this screenshot ONLY shows the item g.. It's merely a corner radius of each container view of your tableView in a tableViewCell that is a cell of your main tableView.
Another way is to use UICollectionView, but kinda more complex than what I've discussed - at least for me.
I'd like to implement the following view (circled blue):
However, I'm not sure what view to use.
On the one hand, when using a UITableView, the cells' width cannot be changed.
On the other hand, when using a UICollectionView, I need to have sections (exactly three sections; each section represents a game state, either 'running', 'waiting' or 'ended').
Cells shall be added dynamically (the data for the cells is retrieved through an API).
What is the preferred basic structure (basically the view) to use?
I'm not looking for a fully coded solution! I'd just like to know what view I should be using.
Given that you have a simple one-column set of cells, it looks like a table view would be a good fit. A collection view can do everything a table view can, but it's more work.
I'd suggest using a sectioned table view with section headers, and a custom header view that's mostly transparent and shows the background behind it. (The section header's view would still be the same width as all the other cells, but it would be transparent, have a fill color of clear, and have a subview that draws the boxes with your section headers in it.
I don't know enough about the content (can't understand that language) but looks like a quiz app?
The basic outline for displaying the majority of the dataset looks to be a UITableView in grouped mode (where "Warten Auf" and "Beendete Spiele" are groups).
If the first row (under the green button) is part of the data set you can either leave that without a section/group header, use the green button as a header view for that group or use the green button as a header view for the UITableView itself.
I just successfully set up content inset adjustment to make visible, dealing with the keyboard of iPhone, of the active text field on a cell row managed by a tableViewController (dynamic table view and different custom cell types - some from XIB and others from code). Well... almost success; except for the below issue:
a section footer doesn't move up the same extent of the rows of the section so that often the footer makes the active text field invisible. A user has to scroll the table view a bit to show the row with the active text field (strangely the footer stays floating above the rows in scrolling).
Anyone has seen such weird thing before? Is it the section footer moving with the section rows together as an integral unit? How can the footer stay floating above the scrolling rows of the section? Please shed me some light and I even don't know where/how to start debugging such issue.
Thanks folks for editing my post. After many hours of struggling, I finally find the reason from reading pages of Apple document, which is of enum UITableView.Style having two cases:
.plain : Section headers and footers are displayed as inline separators and float when the table view is scrolled.
https://developer.apple.com/documentation/uikit/uitableview/style/plain
.grouped: Section headers and footers do not float when the table view scrolls.
https://developer.apple.com/documentation/uikit/uitableview/style/grouped
Apple should rename the enum to HeaderFooterStyle instead to make our finding easier (another example of clarity over brevity)
I hope someone else bumping into the headache might find the post useful.
Looking to keep Columns A-C stay still whole scrolling up and down. My worksheet has a lot of information on it and i need the first columns to stay still. I've tried freezing panes, but the columns only stay still when i scroll left and right, not up and down.
Can this be done?
To keep an area of a worksheet visible while you scroll to another area of the worksheet, you can lock specific rows or columns in one area by freezing or splitting panes.
When you freeze panes, you keep specific rows or columns visible when you scroll in the worksheet. For example, you might want to keep row and column labels visible as you scroll.
A solid line indicates that row 1 is frozen to keep column labels in place when you scroll.
When you split panes, you create separate worksheet areas that you can scroll within, while rows or columns in the non-scrolled area remain visible.
https://support.office.com/en-ca/article/Freeze-or-lock-rows-and-columns-3439cfe6-010c-4d2d-a3c9-d0e8ba62d724
I have an iPad app which always stays in landscape mode. It is more of a data centered app with 5 columns and couple of hundreds of rows.
In current implementation, I have used UITableView. The rows' height could be anything depending on the data that comes in from server and all the columns can have different size.
The question is, can I use UICollectionView instead of UITableView? Will there be any performance issues? If yes, which is better in grid like layout? I understand UICollectionView is to be used in iOS pictures app like layout but how it behaves for grid like layout?
Thanks,
Pruthvid
What you describe is exactly what UICollectionView is designed for, it's the perfect solution. The limitation is only to the version of iOS you will be able to support (if you need to go back that far).
The choice really comes down to the visuals you want. Of you want each row to have a height defined by the maximum height of any column value in that row and the row appears as a single row item and the last row of the table should be full width then you may prefer to use a table view.
The collection view gives you more options for accessory views (as opposed to just the headers and footers of the table view).