Setting up a tableviewcontroller with multiple sections and buttons - ios

I would like to know how to develop an IOS Table View Controller with multiple sections.
For example attached is a screenshot from DrawSomething account page. They have different headings like account settings, password, then some buttons below.
Would this be setup as one UITableViewController then setup image backgrounds for the headers and customized cells for each table cell, or would this be setup using multiple different view controllers all within one main view controller?
Further to this, could this be setup and designed using a NIB or would it be alot easier using code to generate this. I understand that it the choice of the developer and your opinion but in common practice if it is possible to design (as such) within the NIB it would be easier. Although designing a table view layout in NIB does not appear to be possible...

For something like this, since there's nothing really dynamic about the content, I would use a UIScrollView and just place the various elements on it directly.

Looks to me like each "section" of that table is actually a custom cell. The "heading" of the cell is just a label with textFields place in it etc...
Get a UIImageView to back the cells and you're good to go.
I've done stuff very similar to this using Interface Builder.
Make each cell use a different reuse Identifier so that when you load the table you know which cell is which.

You can create a table view with multiple sections. You need to create custom cells for headings and the contents.

Related

How i can use multiple nib files with multiple arrays?

I am creating my iOS app, and i during that , now i have to build scrollable screen where there is image view, labels, collection view, Reviews etc (Prototype Image is attached). I am wondering is it possible to make that type of screen with UITable view using multiple Nib files? (If it is possible, kindly guide me as how i should use multiple Nib files with multiple arrays). And , if it is not possible, how else i can go for it? Kindly guide me, and sorry if thats a duplicate because i have searched but i was not able to find any good answer.
There are several approaches that you can do.
If you want to use UItableview, then you need to create multiple
UITableviewCells, where each cells is based on the section of the design. Then you can load it by using array, as you logic stated above. For example indexpath[0] you'll load the cell with the picture(lets call this pictureCell), then indexpath[1] you'll load descriptionCell, and so on.
The other approach is using Scrollview, with several UIViews on a vertical stackview. And then you'll create a UIView Subclass based on the section of the design. This is usually my go to solution.
I'm not sure what "array" is refering to here, but by the look of your screenshot, I would go with a StackView inside a UIScrollView, or something like that. No need for a UITableView if you don't have a repeting pattern, you can just stack multiple views in a scroll view.
I hope it's clear enough.

Static table cells with detail

I'm trying to make an iOS 'information' or 'guide' app in Swift. I wanted to utilise the Master Detail template so that when the user clicks a cell it will take them to a relevant ViewController with either basic text labels or a PDF file.
From what I understand, Dynamic Cells can be dynamically changed whilst the app runs however I want to set static cells from the storyboard (or programmatically) and their relevant content/PDF files so the user can view each one. I don't want any "new cell" or "editing" functionality.
How can I make this work? I would post my code so far but it's almost identical to the Master Detail template so I don't see any use. I know this is quite a vague question but I need help and don't know where to start.
Any help will be so appreciated!
A static table cell can entirely be created via storyboard. In the storyboard once you add a tableviewcpntroller you can prototype call added to it.You can add as many prototype cells to your table ( not necessarily every one should have common layout). After all cells are added you can assign individual tags to the cells if you need identify these cells from your code.You can add segue from each cells to move to different page.
Let me know if something more is needed.
In Interface Builder set the Content of the table view to Static Cells.
Drag as many table view cells as you need into the table view.
In the controller create IBOutlets for the labels and the other UI elements.
Connect the outlets in Interface Builder.
Rather than using the datasource methods assign the values directly to the UI elements via the outlets.

Tips for how to code a very complicated custom UITableViewCell

Please see my mockup pictured above. I am a bit puzzled as how to code this. I guess I would use one UITableView and have all customizations on one cell. Any other ideas? I wasn't sure if it would be better to have multiple tableviews on one controller or something instead.
First off, this design really won't work except on iPad. It's just too much to try to cram onto an iPhone screen.
Collection views are like a more flexible form of table view. You can arrange collection views in rows, columns, rows AND columns, circles, or whatever you want.
You can make a collection view act like a table view, but it's more work, and a little more confusing.
If your UI is a vertical list of cells, a table view might still be a better fit, since it matches what you're doing.
Assuming this app is iPad only:
Create a custom subclass of UITableViewCell, with it's own XIB file. Define the contents as desired. Making each "tile" (the 5 boxes shown in each cell) in the table view cell a separate custom subclass of UIView might make sense, or it might not, depending on how you expect to use them. If they are always in the same order, and never used anywhere else but in this table view, then no. Just build the cell from components. If you ever think you might use one of these tiles somewhere else, or if you might ever display them in a different order, then yes, make each tile a separate custom UIView subclass, and use those custom views in constructing your cell.
Having multiple UITableView is bad idea – when you scroll one of them others will remain static. I would recommend you to use one table view but decouple a cell in the separate views (or even view controllers) and have a special view (maybe with .xib) for each of 5 components.

When to use UICollectionView instead of UITableView?

I found that UICollectionView is like an upgraded version of UITableView introduced in iOS6, but when should I choose UICollectionView instead of UITableView?
There are still Apps using UITableView, if UICollectionView can do anything UITableView can do , why people still use UITableView? Is there a difference as far as performance is concerned?
Thanks!
That depends on the requirements. How the application flows determines which type of UI to integrate into the application.
People mainly use the UICollectionview for creating types of UIs with multiple images shown in a grid. This would have complex logic using UITableView, but with UICollectionview, it would be easy.
When using UICollectionview, you don't need to set buttons with tags or other things by getting selected items values. You can simply get -(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath and in UITableViewDelegate:
`-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath`
You get the selected row instead of the item, so for creating grid or modified items, using UICollectionview is best.
For the listing details of each item, people use UITableView because it shows more info on each item.
Apple Docs:
UICollectionView Class Reference
The UICollectionView class manages an ordered collection of data items and presents them using customizable layouts. Collection views provide the same general function as table views except that a collection view is able to support more than just single-column layouts. Collection views support customizable layouts that can be used to implement multi-column grids, tiled layouts, circular layouts, and many more. You can even change the layout of a collection view dynamically if you want.
UITableView Class Reference
A table view displays a list of items in a single column. UITableView is a subclass of UIScrollView, which allows users to scroll through the table, although UITableView allows vertical scrolling only. The cells comprising the individual items of the table are UITableViewCell objects; UITableView uses these objects to draw the visible rows of the table. Cells have content—titles and images—and can have, near the right edge, accessory views. Standard accessory views are disclosure indicators or detail disclosure buttons; the former leads to the next level in a data hierarchy and the latter leads to a detailed view of a selected item. Accessory views can also be framework controls, such as switches and sliders, or can be custom views. Table views can enter an editing mode where users can insert, delete, and reorder rows of the table.
Here's my criteria:
If a UITableView can do it, use it
If a UITableView needs lots of code to do it or can't do it at all, use UICollectionView.
You have to consider the restrictions on UITableView before making a decision: It's a single column. And you can only customize the cells, but not section backgrounds and such. So if you have a straight-up list of things with no extra frills - that looks like a bog standard iOS view, basically - then use UITableview. If you have custom insets, or a border around each section, use UICollectionView.
I'm actually considering UICollectionView for all things simply because it's very expensive when you start developing your view as a table view, then later find out it can't do that one thing that you need it to do. 1st hand experience ;)
Edit after even more experience with the two: Disregard that last paragraph. UICollectionView requires a lot of boilerplate code to make it work like a UITableView. Use UICollectionView only when really needed. ;)
For simple lists and forwards/backwards navigtaion, use UITableView.
If you need a high degree of customisability, use UICollectionView.
Generally speaking, in software development, it's best to choose the approach which represents "The Simplest Possible Thing".
EDIT: As of iOS 14, UICollectionView can now do lists as well and is now the recommended approach. See this session from WWDC20 for more information and implementation details: https://developer.apple.com/videos/play/wwdc2020/10026/
According to my point of view main difference between collectionView and tableView is that
TABLEVIEW --> show list of items in only one column.
COLLECTION-VIEW -->show list of items in multiple column.
Hope it will help you.
If you choose UITableView for iPhone, make sure you have considered your iPad strategy first. If you want an iPad-specific layout, you may want that single-column layout to become a grid.
Although it's not required, I always use a collectionview. That way I can easily adapt how my collections are presented for differing resolutions. A plus is that it's ready to quickly add new types of cells when refactoring in the future.
I see no point of tableviews. It's very simple to use a collection view to represent a table. IMO.
From my personal experience the two elements should only be compared loosly.
TableView
A TableView is a UI element designed for showing data in a list format. There is certain functionality that comes as standard with a UITableView, such as:
Accessory View
Cell Selection Style
Editting Style (Delete and edit buttons).
The above elements enhance the usability of data when displaying and interacting in a list format. Such as viewing emails.
CollectionView
A CollectionView is a UI element designed for showing content using a custom layout (usually anything that isn't a list). CollectionViews improve functionality of displaying data in completely bespoke layout styles and also dynamically changing layouts on the fly. Some examples are:
Horizonal Lists
Photo Galleries
Thumbnail views
Carousels
Dials
Laying out elements on a map
etc.
CollectionViews also allow for multiple selections.
Conclusion
As you can see from the above, both have completely different use cases and are designed for enhancing the development and usability of their own specific data sets.
If you are looking at displaying anything in a list style with the followin interactions:
- Adding
- Deleting
- Re-ordering
Then a UITableView will simplify this process by providing the support straight out of the box.
Anything else, you should leverage the benefits of CollectionView as you have more flexibility.
Its totally dependent on how your data to be shown.
As mentioned by many above, if you require only single set of data and that too not complex, go for UITableView else use UICollectionView.
UICollectionView is customization friendly.
If you are dealing with multiple cell heights or so, then go for UICollectionView.
Both are depends on the requirements. Table Views also have support for a variety of editing scenarios. This support has not been implemented in the Collection View classes.
If you are converting from a Table View that relies on these methods, expect to do a little extra heavy lifting in the Collection View.
Collection View section headers can be placed anywhere within the view.
and UITableView don't need to set buttons with tags or other things by getting selected items values.
In practice, everyone uses UICollectionView that I've come across, when they only need a UITableView. "It's one-dimensional. It goes up and down. Why are you adding unnecessary delegate methods for layout AND data?". I once spent an extra 2 hours helping a startup find out why their UICollectionViewCell got squished because the owner, who didn't read the Animations manual, nor HIG, nor the UICollectionView guide, decided to use it and add variable heights and anims. Needless to say, he gave himself a headache and much lost time on a non-business-critical issue he could have avoided by simply using a table cell, since there's no extra layout delegate + Nib.
Let me get this straight, I am all for UICollectionView's when your data and display need it. They're very powerful. But in practice, most people I've seen have been using them on lists.
This brings up another flaw. They're also used on short, constant lists that won't change, ever. In this case, just make a Xib. Or write a custom view that stacks them. Why? Because you don't need the memory management for 5 sets of labels with a button or switch. If they might change, then yes, use a list. If you want physics, then UICollectionView works well with a some cool effects. But do you really need to add 5 delegate methods and a layout system for 5 labels that will never move?
Also, I'm not forgetting that iOS has a native stacking view now too. I can never get it to deform how I want, even though I'm quite adept at the 2D and animation systems, so I never use the built-in one.
All I'm saying is, define your requirements. Maybe you don't need either of these, if your UI isn't adding/removing items and refreshing itself. Or maybe you want to write a Card Game and throw them out virtually on a table, then use UICollectionView with a physics system for its layout guide.
Personally I think the UICollectionView can do most of the work which UITableview can do. well, at the same time, it's more complex to use.
I suggest you use UICollectionView as TableView just in case your manager change requirements in the future.
Based on our need we are choosing TableView or CollectionView.
Example:
For phone contacts tableView is best option.
For photo gallery, collection view will be best option.
I had this issue in my current project. Which to use. In my case it was simple really. I needed both. I needed my view to look like UITableView and also to change its change / layout. So, UICollectionView was used. I also use UITableView everywhere I don't need any extra customisation. Since UiTableView comes with a default layout that includes images and text - I use it for simplicity.
Based on our requirement we choose UITableView or UICollection view.
If we want to display images or items in grid type or if we need more customisability we use UICollectionview.
For listing each item with details and subdetails we use UITableView.
UICollectionView:
The UICollectionView class manages an ordered collection of data items and presents them using customizable layouts. Collection views provide the same general function as table views except that a collection view is able to support more than just single-column layouts.
UITableView: A table view displays a list of items in a single column. UITableView is a subclass of UIScrollView, which allows users to scroll through the table, although UITableView allows vertical scrolling only.
As per my view for Grid View display use UI Collection View.All other list view use UITable View

Table view, manual and settings in one screen: Best practice?

I am writing a text editing app. I target iOS 6 and 7, and use storyboards and autolayout.
I thought this layout for the welcome screen would work well:
<Files in a table view>
<Instructions to user>
<Settings>
The settings view is pretty complex, and will probably benefit from having its own view controller. The instructions view is static, and has no logic.
I can think of three ways to organize this:
Create this as a table with three sections, where the 1st section is the list of files, and the 2nd and 3rd section are big, custom cells with.
Wrap all three views in a scrollview
Wrap the instructions and settings in a scrollview
I prefer the first solution, as it seems to be the, most natural way for the user to navigate, but I haven't seen any examples of adding a viewcontroller as a cell for a tableview anywhere, and haven't been able to google me any. Prototype cells do not seem like the right way to go for the settings view/controller either.
Best practice, suggestions, input?
Apple recommends only one view controller per "screen," so that rules out option 1. I wouldn't want to even start to attempt to embed a viewcontroller in a table cell and that just smells very wrong in any case.
You have three independent views that you want to scroll, and that clearly calls for a UIScrollView. As for the best way to organize this, I recommend creating modular UIView subclasses: one for the table, one for the instructions, one for the settings. See my answer on this question as to how you can package up views as reusable (not important in your case) and modular widgets: UIView and initWithFrame and a NIB file. How can i get the NIB file loaded?. Then you can create delegate interfaces for each one, and set your main view controller to implement them in order to communicate with each of the three "widgets."

Resources