iPhone开发学习：使用UITableView

学习TableView很不错的一篇文章。 推荐原文。在此转载，并加入一些自己的comments.

Idea for Application:

So, this tutorial is about creating a Simple UITableView using NSArray (or you can use NSMutableArray). Follow the following steps to create a UITableView which output will look like this:

iphone programming tutorial steps to follow:

1. Start Xcode and Create a new Xcode Project. Name it, SimpleTable.










2. Open SimpleTableViewController.h file from “Group & Files” panel in Xcode. Write the following code after import and before @end:

view sourceprint?

1.

@interface SimpleTableViewController : UIViewController {

2.

IBOutlet UITableView *tblSimpleTable;

3.

}

3. Save SimpleTableViewController.h file and open SimpleTableViewController.xib from Xcode project (Tips, Press cmd + 1 to open ‘Attribute Inspector. Press cmd + shift + l to open Library) .

4. Now In Library, drag the ‘Table View’ in View Window.







5. Now press cmd + 2 to open ‘Connections Inspector’ and then press your mouse over the circle next to tbleSimpleTable and try to drag it to table





6. Now select ‘Table View’ inside View and you will see change in “Connection Inspector”. Again in ‘Connection Inspector’ circle next to ‘dataSource’, drag it to “File’s Owner”. Repeat this for ‘delegate’ 这个地方很关键，由于不太理解IB connection 的精神，所以容易忽略。








8. Now close Interface builder because you do not need it for now. Open SimpleTableViewController.m file and after dealloc method write following code (it should be before @end)



［如果有工具能帮助产生下面这些代码就好了 ］

view sourceprint?

01.

#pragma mark Table view methods

02.

03.

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {

04.

return

1;

05.

}

06.

07.

// Customize the number of rows in the table view.

08.

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

09.

return

0;

10.

}

11.

12.

// Customize the appearance of table view cells.

13.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

14.

15.

static

NSString *CellIdentifier = @

"Cell"

;

16.

17.

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

18.

if

(cell == nil) {

19.

cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];

20.

}

21.

22.

// Set up the cell...

23.

return

cell;

24.

}

25.

26.

- (

void

)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

27.

}

9. Now if you run the application by pressing cmd + r (or by pressing build and Go button in Xcode). You will see a simple table




10. Now change in numberOfRowsInSection method and write the following code

view sourceprint?

1.

// Customize the number of rows in the table view.

2.

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

3.

return

1;

4.

}

11. You need to change in cellForRowAtIndexPath method to show a single line text. You need to add one row to display that (cell.text = @”text”) which should look like this:

view sourceprint?

01.

// Customize the appearance of table view cells.

02.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

03.

04.

static

NSString *CellIdentifier = @

"Cell"

;

05.

06.

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

07.

if

(cell == nil) {

08.

cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];

09.

}

10.

11.

// Set up the cell...

12.

cell.text = @

"Text"

;

13.

return

cell;

14.

}

12. Run the application and you will see




13. Next step is to create an array and display it to UITableView. For that you have to add ‘NSArray’ in SimpleTableViewController.h file. So your SimpleTableViewController.h should look like this:

view sourceprint?

1.

#import

2.

3.

@interface SimpleTableViewController : UIViewController {

4.

IBOutlet UITableView *tblSimpleTable;

5.

NSArray *arryData;

6.

}

7.

8.

@end

14. Now open SimpleTableViewController.m file and uncomment the ‘viewDidLoad’ method and create a simple array:

view sourceprint?

1.

- (

void

)viewDidLoad {

2.

arryData = [[NSArray alloc] initWithObjects:@

"iPhone"

,@

"iPod"

,@

"MacBook"

,@

"MacBook Pro"

,nil];

3.

[super viewDidLoad];

4.

}

15. Last step is to change in cellForRowAtIndexPath method, so that it get the objects from arrayData and simply display it on UITableView. So code for that method should look like this:

view sourceprint?

01.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

02.

03.

static

NSString *CellIdentifier = @

"Cell"

;

04.

05.

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

06.

if

(cell == nil) {

07.

cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];

08.

}

09.

10.

// Set up the cell...

11.

cell.text = [arryData objectAtIndex:indexPath.row];

12.

return

cell;

13.

}

Final output will look like this

Code for iPhone Application:

Click here for the code Project code.

Follow iphone programming tutorial video here:

You can watch the screen cast here. or Watch in on YouTube (url http://www.youtube.com/watch?v=pCcZDrNCQzU) and subscribe to my videos.