May 26

UPDATE 29-Apr-2010:

By popular demand, here is a git repository with an updated sample:

git clone git@github.com:mitchallen/TableSize2.git

Note that I have NOT updated the code in this post. Look at the repository for the new code. This new sample fixes two issues: missing IBOutlet and the deprecated setText method on the cell.

To see how it looks in “boxed” mode on the iPad, set the compiler to: Simulator – 3.2 | Debug.


ORIGINAL POST

Here is an example of how to create a view that contains a UITableView that doesn’t take over the whole screen.  An example of an application that uses a small table is the Stocks application that comes with the iPhone / iPod Touch.  You may think you need a UITableViewController – but that only gets in the way and takes over the view.

  • Create a View-based iPhone application and call it TableSize1
  • Modify TableSize1ViewController.h so that it looks like this:

TableSize1ViewController.h

//
//  TableSize1ViewController.h
//  TableSize1
//
//  Created by Mitchell Allen on 5/26/09.
//  Copyright __MyCompanyName__ 2009. All rights reserved.
//
 
#import 
 
@interface TableSize1ViewController : UIViewController {
 
	UITableView *tableView;
}
 
@property (retain, nonatomic) UITableView *tableView;
 
@end
  • Modify TableSize1ViewController.m so that it looks like this:

TableSize1ViewController.m

//
//  TableSize1ViewController.m
//  TableSize1
//
//  Created by Mitchell Allen on 5/26/09.
//  Copyright __MyCompanyName__ 2009. All rights reserved.
//
 
#import "TableSize1ViewController.h"
 
@implementation TableSize1ViewController
 
@synthesize tableView;
 
- (void)viewDidLoad {
 
}
 
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
 
    return 1;
}
 
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 20;  // Test hack to display multiple rows.
}
 
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
 
    static NSString *CellIdentifier = @"Cell";
 
    UITableViewCell *cell = [self.tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];
    }
 
	NSString *szCell = [[NSString alloc] initWithFormat: @"Row %i", indexPath.row ];
 
	[cell setText:szCell];
 
	[szCell release];
 
    // Set up the cell
    return cell;
}
 
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    // Navigation logic -- create and push a new view controller
}
 
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning]; // Releases the view if it doesn't have a superview
    // Release anything that's not essential, such as cached data
}
 
- (void)dealloc {
    [super dealloc];
}
 
@end
  • In the Resources folder, double-click TableSize1ViewController.xib to launch Interface Builder
  • From Library / Cocoa Touch Plugin / Data Views drag a Table View on to the View and make it about half the height of the view (Select Tools / Library from the main menu if it isn’t visible)
  • Click on the new Table View
  • Click on the second tab in the Inspector window (Select Tools / Inspector from the main menu if it isn’t visible)
  • After clicking the second tab, the title of the Inspector window should be Table View Connections
  • Under Outlets: for both dataSource and delegate, drag the mouse from the circles next to them to the File’s Owner icon in the TableSize1ViewController.xib window.
  • Under Referencing Outlets: drag from New Referencing Outlet to the File’s Owner icon and select tableView.
  • With Interface Builder in focus, select File / Save
  • Go back to your project window and click Build and Go
  • Your application should now display a table that only takes up half the screen.

Tags: , , , , , ,

May 25

This is my first entry in a new category called “cheat sheet.”

I’m trying to build an iPhone GUI for an application. Every time I want to do something simple – like add a button – I need to pull out my books on the subject and filter through several pages to remind myself how to do it. So I’m putting the info here for myself and anyone else who finds the process unintuitive.

Let’s assume that you are adding a button to an existing UIViewController. The first thing that you need to do is add a handler for the button press to your controller class.

Your *.h file would look something like this:

#import  
 
@interface HomeViewController : UIViewController {
 
}
 
-(IBAction) configButtonPressed:(id)sender;
 
@end

Your *.m (or *.mm) file would contain the corresponding method like this:

-(IBAction) configButtonPressed:(id)sender
{
	NSLog( @"HomeViewController:configButtonPressed:sender" );
}

 

  1. Fire up Interface Builder by double-clicking on your *.xib file.  I’m assuming you already have a View set up.
  2. I’m also assuming that  Tools / Inspector and Tools / Library show when you click on the View.
  3. Under Library / Cocoa Touch Plugin / Inputs & Values drag a Round Rect Button on to your View.
  4. Double-click on the button and fill in a label.
  5. Click elsewhere on the View to get out of label editing mode and single-click the button again.
  6. Select the second tab in the Inspector (or press Apple-Key-2) – the title of the Inspector should say Button Connections.
  7. Put your mouse over the circle to the right of event labeled Touch Up Inside.
  8. Drag the mouse over the File’s Owner icon in the *.xib window.
  9. When you release the mouse, select the method that you added to your controller class (in this example configButtonPressed).
  10. Save the *.xib file, and select Build and Go to make sure you wired the button correctly.
  11. In this example when you click the button it should log something to the Debugger Console.

Tags: , ,