David Foster
David Foster

Reputation: 3834

iPhone Checkboxes à la Mail

After reading the iPhone Human Interface Guidelines, I notice there's little mention of checkboxes in the style that one may encounter them on the desktop or web.

Checkboxes are generally handled by UISwitchs on the iPhone, but for an app I'm presently working on, they're really not the right control. Instead, the control you'll see in Mail is a much better fit:

Checkboxes in Mail

Actual mail blanked out. Obviously.

How would I go about using these checkbox controls in my app? Are they standard, or will I need to imitate them with a custom control?

Cheers friends.

Upvotes: 1

Views: 996

Answers (6)

newenglander
newenglander

Reputation: 2049

I also found a description of another way to do this using the same image/method that the Mail app uses:

http://networkpx.blogspot.com/2009/07/multiple-row-selection-with-uitableview.html

but as this implements undocumented features of the iOS SDK, it may not be best for apps intended for the official App Store.

Upvotes: 0

Dan Ray
Dan Ray

Reputation: 21893

Don't subclass UIControl. What you want is a UIButton of "custom" type. Load it with your "unlit" image in IB (or programmatically in -viewDidLoad--you can set it appropriate to its data there too, if you came here with that property already "checked").

Point its touchUpInside event at a method called -(void)toggleCheckBox, and in that method, toggle whatever setting you're toggling (probably a BOOL property of the objects you're listing), and toggle the "lit/unlit" status of the button image by using its -setImage: forState: method. Use the control state UIControlStateNormal.

I do something similar where I let people poke a button to toggle the "favorite" status of the thing ("thisEvent"--a member of an array of local cultural/arts events) they're looking at:

- (IBAction)toggleFavorite {

    if (self.thisEvent.isFavorite == YES) {
        self.thisEvent.isFavorite = NO;
        [self.favoriteButton setImage:[UIImage imageNamed:@"notFavorite.png"] forState:UIControlStateNormal];
    }
    else {
        self.thisEvent.isFavorite = YES;
        [self.favoriteButton setImage:[UIImage imageNamed:@"isFavorite.png"] forState:UIControlStateNormal];

    }
}

Upvotes: 2

paxswill
paxswill

Reputation: 1200

As said before, you'll need to subclass UIControl. The actual process was discussed here w little while ago.

Upvotes: 1

samsam
samsam

Reputation: 3125

I'd rather subclass UITableViewCell then UIImageView. UITableViewCell allready comes with selected/unselected states and handlers for editmodes etc.

Upvotes: 1

Jasarien
Jasarien

Reputation: 58448

You'll need to create a custom control. It won't be difficult since UIControl already has 'selected', 'highlighted' and 'state' properties at your disposal. You'll just need to draw and toggle appropriately.

Upvotes: 3

Ben Williams
Ben Williams

Reputation: 4695

I'm pretty certain there is no standard way to do this. However it's fairly simple to achieve, all you need is two images, one for each state. I would probably do something simple like subclass UIImageView and add a setState:(BOOL)theState method, which would then simply select the relevant image.

Upvotes: 1

Related Questions