So it's trivial to create a Settings style table on the iPhone. The problem is, they add a great deal of code as your Settings have a gamut of options/styled cells. One section might have a check list, another might have cells with accessory disclosures to drill down further, another might be labels with UITextFields.
My question here is, what's the cleanest way to go about creating this table. Do you typically create a subclass of UITableViewController and then subclass UITableViewCell for each different type of cells, and write supporting classes for those cells? Meaning if you have a Settings style table with 4 sections, all different types of cells, you will load 4 nibs into the table and import 4 class files? Programmatically set the frame, views, textfields and tag them for later access?
The answer(s) to this is probably subjective, but I'd like to know what you experts consider the most elegant approach to this common problem.
The easiest way to do this is to simply add your controls during the tableView:cellForRowAtIndexPath: method.
I also recommend this to help corral your code:
A technique for using UITableView and retaining your sanity
I would rather set most of the settings that I can in Interface Builder, instead of writing a whole bunch of code to make the visual/layout just right. As you can imagine, it will take quite a few rounds of "modify - build - test" in the iPhone Simulator to get this special table view laid out the way you want it.
I feel it's probably a bit easier to do all of these rough visual changes in IB, then load all of the custom UITableViewCell dynamically via their identifiers in code. You could then do one final round of tweaking on this code, if something that you want is not doable in IB.
Three20 library (extracted from Facebook iPhone app) has a set of ready-made cells that contain various controls.
(Not sure you want to use them, however. Three20 suffers from “not-invented-here” a little bit and tries to subclass and extend everything, so adding it adds quite a bit of a mess to your project. But at least you can use it as an example.)
P.S. Your question inspired me to open a “What are your favourite UITableView / UITableViewCell tricks?” thread on Stack Overflow, check it out for more tips.
Related
I wanna customize cells in MonoTouch.Dialog.
For example make custom background in BoolElement and make custom image for this small bool thing that can be on or off, sorry forgot the name, or make custom disclosure indicator image in StringElement.
Is there simple way to do this without making own custom elements?
In some cases you'll need to create custom Element-derived types to customize cells. In other cases you will be able to add some custom code inside your application. FWIW I think it's cleaner to create your own everytime.
You can find a lot of examples in the Sample application that is available on github along with MonoTouch.Dialog (that includes having a custom background and totally owner-drawn elements).
There are also several questions (with answers) about common MonoTouch.Dialog customizations here on stackoverflow. Click on the monotouch.dialog tag and read them.
If you get stuck on a particular customization then don't hesitate to ask for help.
I am very new to iphone application development and am struggling to create a table view page where each row contains a left-aligned label with an editable text next to it - just like how it works in the email account details page in the settings application on my iphone.
I have been googling the subject for hours and it is now somehow clear to me that I need to add UITextFields to UITableViewCells, but it is still not at all clear to me how I make these text fields take up the right amount of space:
How do I make the text fields align above each other?
How do I make the text fields expand as far as possible to the right?
How do I prevent the text fields from hiding part of the left-aligned label?
Read the Apple Docs on Tableviews there are a number of predefined table cells. Also look at the Tableview programming Guide. Pick the one that has the font characteristics that you want and Apple will take care of it for you. Also, in the Settings app, the settings are a Grouped style.
For the look you are describing I think it is called UITableViewCellStyleSubtitle.
You need custom UITableViewCells and there are a number of ways of making them. For your purposes, any one of the techniques detailed in the Apple documentation will probably suffice.
An alternative to those approaches is in GSUtils (full disclosure: open-source library written by me), where you can use the same approach to designing your table view cells as you would design a UIView.
This question already has answers here:
How to create a UITableView with editable components?
(2 answers)
Closed 3 years ago.
I need to present the user with a screen with controls (i.e. a dialog). It will display some labels and different types of controls so that the user can do some configuration:
select a color (custom color picker)
select a line width (slider)
select one value from a list of values (UISegmentedControl?)
enable / disable one option (On/Off)
...
I am evaluating different alternatives:
Create the layout with labels and controls in InterfaceBuilder
Use a UITableView, so that each cell contains a label and its control
I like option 2 because it is similar to iPhone Settings app, and it makes the screen look organized, giving you sections, scroll..., but it is a real pain to create in code all different cell layouts, taking into account each row heights...
The solution has to be easiliy maintainable, allowing easy reuse of code, DRY (low repetition), data-driven...
Is there a recommended or standard aproach to do this?
Instead of implementing it yourself you might also like to consider some of the open source solutions. I use InAppSettingsKit in my app. There are a few minor UI glitches but it works well. I also evaluated mySettings (indeed I submitted a couple of patches) and InAppSettings.
Even if you don't use them, you might be able to crib a few ideas from them.
You can create the tableview cells in IB and then just create IBOutlets to each cell, and then return each cell in the data source method (forgotten the exact name of it, its where you normally create cells)
You could create a cell in IB for each cell or create different types of cells in IB, say one slider based cell, etc and programmatically change the text, etc.
This is staticly creating a tableview, theres an Apple guide on it somewhere.
you said it. use a UITableView and create custom UITableViewCells (probably in Interface Builder!) and add these in.
Also, as far as selecting a value from a list of values.. a drill in UITableView (embed the root UITableView in a navigation controller) with all the options and then a checkmark is probably advisable (this is how most apps handle this behavior). The On/Off button is more suited for UISegmentedControl.
There are great examples of this in this book.
Good luck.
I have a table view where cells can display a variable amount of information. For example, the first cell could display 2 labels, the next cell 5 labels, and the third cell could display 1 label. The cell contents are stored in managed objects.
I would like to make this data driven, where I have a plist to configure the cells. I'm thinking that I can create a layout manager that reads in the config data and can intelligently determine how to display the labels.
Is there a better way to do this with UIKit? I realize that ultimately I could use Core Text to do the text rendering, but I would like for that to be an implementation detail. For starters I'd be happy with just have UILabels that are dynamically setup.
EDIT:
One side effect of making this driven from a configuration file is that I could update these configurations after the app has been deployed. I might consider generated xib files for download as well, but ideally I'd like to only delivery binary plists.
If all you're doing is configuring a single kind of table view cell with a variable number of labels, it seems like that's just a one-off piece of code for laying out the right number of labels. I can't quite tell from your question what your experience level with doing programmatic layout it; if you're new to doing UI outside of IB, let us know.
Speaking to the more varsity idea of a "layout manager", do consider that the NIB/XIB system is effectively a data-driven layout engine itself. If you're thinking about something that's generic enough to specify explicit layouts and properties of views, consider that that's what XIB files basically are-- a schematized XML layout. See the command line tool ibtool's documentation (manpage here) to learn more about how you can manipulate them.
If your layout needs are specific enough to your app but too general to handle with a set of fixed XIBs, then consider a lightweight manager like you describe. But I would think hard before going off and building something super-generic. The equivalent of Zawinski's law here is that any layout manager will eventually end up incorporating more and more of the XIB functionality.
I am designing an interface that basically looks the same as the Settings application. That is, I have a grouped TableView with cells that look like UITableViewCellStyleValue1. There are labels with values associated with them. The difference is, I am making custom UITableViewCell nibs so that the "value" can be a textbox, segmented control, etc., just like in the Settings app.
To keep my code general, I am giving each label a tag of 1, and the associated value a tag of 2. I would also like to incorporate generic UITableViewCells without having to use a special case. Are there default tags associated with the textLabel and detailTextLabel views with which I can match my customs cells? Other design suggestions are welcome too.
You may benefit from the hard work already done by people to achieve this:
http://furbo.org/2009/04/30/matt-gallagher-deserves-a-medal/
That blog post links to a Generic Table Views set of classes that really make this kind of interface simple to create. I use it in my own apps and it's perfect.
The only thing you'll need to do is rename some of the method calls to update them from 2.x APIs to 3.0 (replace initWithFrame:reuseIdentifier: to initWithStyle:reuseIdentifier: on the table cells).
Nice and simple, and looks great.