Swapping views in UIViewController
I have a view controller which lives in a TabBarController. It displays a table view.
I'd like to change the view if a connection can't be made to the database which holds the data (somewhere on the interwebs). The view controller listens for a notification that reachability to the database has changed. When the database is unreachable, I'd like to display instead just a view with a UILabel that says "data not available".
What would be the best way to do this?
Thanks!
Chapter 29 of Aaron Hillegass' book deals with View Swapping. I haven't bothered to explore this part of the book - however it's dealing with a tabbed dialog. So in effect you have two or more dialogs on top of each other and you can choose the one to be displayed.
Another possibility would be to display a sheet over the window saying "not available". I suspect that's pretty ugly. However you may be able to give that some transparency and add a graphic - so it could be rather pleasant.
Like many apects of UI design - taste, aesthetics and graphic design are as important as implementation technology.
I think it's probably worth looking in the HIG documentation from Apple (Human Interface Guidelines) for ideas.
Another (simple) design approach is to disable all the controls - so the user can't interact. If you do this, you should have a very clear visible label which says "Server Status : Available/Unavavailable". The "Available/Unavailable" part could be in a different color: Available is green, Unavailable is red. And maybe even additional information if you have it (eg no internet connection available, no network connection, or server down, database off-line - or whatever you know about it's unavailability).
Thanks for the replies. There are a number of different ways to do this, I am thinking. I'm just looking for the best practice. I'd appreciate everyone's feedback.
Hierarchy: [tab bar controller] -> [[splash page VC], [search VC], [data NC], [options VC]]
[data NC] -> [[overview VC], [detail1 VC], [detail2 VC], [detail3 VC], [Edit element VC]]
So far I've considered:
0) Just setting the dictionary containing the items that would be in [overview VC]'s table to nil, which means UITableView won't draw any cells, but shows an empty table (not too terribly user-friendly).
1) Swapping in a fake array of items in [overview VC] with an item that would fall in about the middle of the visible table that has the value "Data Unavailable", then disable scrolling on the tableview (a little clearer to the user).
2) adding an additional view to the [overview VC]'s nib file with a single UILabel explaining what's going on, then somehow swapping it in place of the tableview (having both the 'live data' view and a 'data offline' view within the same nib file seems logical to me, but so far implementing it successfully has alluded me).
3) Adding a UILabel to a common view shared with the table view to [overview VC], then hiding one and showing the other based on the current condition of the data. IB's default UIViewController With A TableView template, however, uses a "UITableView" item as the main view for the nib, and won't allow adding any additional UI elements to be placed along with it. I suppose I could delete the table view, replace it with a standard UIView, then drop in a UITableView and the UILabel...haven't tried that yet. This may be the easiest solution.
4) The one I'm pondering now... Create a UIViewController with a single centered UILabel saying "Data not available". Then, depending on availability of the data (handled through a notification posted to the default NC), swap that VC into the [tab bar controller]'s array of view controllers (well, grab a copy, make the mod, then set the updated array back to the tab bar controller). This could be used in several places...in fact, I may want to just use the "data offline" view controller for all tabs when the data is offline. I suppose I could even create set of "offline" view controllers as an array when I start up, and just swap out the tab bar controller's viewControllers array as needed:
Main viewControllers: [[splash page VC], [search VC], [data NC], [options VC]]
Offline VC's: [[splash page VC], [offline VC], [offline VC], [options VC]]
So, what do you all think?
On another note....
One side effect I'm still working on is that the view controller that shows the data table is part of a nav controller stack which handles clicks through to VC's with subsequently more granular data. In the default behaviour, a user can go to this tab and, when the data is online, click through a couple levels into the data. If they then click to another tab and click back, they see the same VC they last saw, still populated with cached data, even if in the interim the data is no longer offline. Somehow I need "rewind" the VC stack back to the top in these cases so the user doesn't try to make changes to data when it isn't online to update. Any thoughts on that?
Hi Avid
I'm in the office at the moment (in California). I'll have a look at this when I get home this evening. If you have any 'mock ups' (made with PhotoShop or Illustrator) that would be very helpful. I'm happy to talk on Skype 'clanmills' if you want to bounce ideas.
I think (4) was the one I thought of in my first reply - simply swap the view to 'data unavailable'. For sure, you want to be clear to the user about what's the matter. Just graying off everything is very hostile and the user wouldn't know what might be wrong. So you want him/her to be informed.
I think from you mention of UIViewController that you're running on an iXXXX device (iTouch, iPad or iPhone). I've never worked with them - I always use cocoa on the desktop. I'm sure there's something which will tell you why you can't get to the server. On the desktop, you can ping 127.0.0.1, your own IP (which you can get using ifconfig), the server (presumably you know the name or IP), and possibly even curl a database status from the server. So then you could tell the user:
- Service Unavailable - No network (can't ping yourself)
- Service Unavailable - No Internet connection (can ping anything on the network)
- Service Unavailable - Cannot connect to "whatever.name.it.is.com"
- Service Unavailable - Database at "whatever.name.it.is.com" is off-line
- Service Unavailable - Unknown reason
Try to avoid the dreaded "Unknown reason". If you don't know, it's unlikely that the user knows!
I've read through your email again - and of course without screen mockups, it's not easy to follow exactly what you're describing.
Be very cautious about driving up and down a UI stack. The developer may be able to follow it - the user usually can't. It just becomes a maze. Many web sites are like this. Some old ideas work best. Mac, Linux and Windows all use a menu bar at the top with drop-down menus. The user can navigate almost at will around an application. Unavailable places are grayed off when necessary. A status bar at the bottom of the UI is another common way to convey both context and status. Traffic lights in the status bar are fun to implement and use.
