TableView trong IOS (Simple TableView Project)

**traihalinh** · 30-01-2013, 10:49 AM

Do có nhiều người chưa biết cách làm việc với table view nên tôi quyết định để bài này ở phần thắc mắc để mọi người có thể tham khảo trước khi post câu hỏi

I. Thông tin chung:
- Nếu là một người sử dụng IOS lâu ngày thì bạn đã xem rất nhiều các ví dụ về table view. Đó chính là ứng dụng “Contact” và “Mail” của Apple (Không chỉ trên Iphone mà trên Ipad cũng là table view). Table View chính là cách tiện lợi nhất để người sử dụng tương tác ới chương trình.
- Do đặc tính của table view nên tôi quyết định sẽ giữ nguyên 2 thuật ngữ table và table view trong bài hướng dẫn này cho các bạn làm quen

II. Nội dung chính:
1. Các thứ cần lưu ý khi bắt đầu một table view:
- Number of Sections: Số lượng những phần trong table view. Những phần này được chia theo chiều dọc để làm cho table trở nên dễ hiểu, dễ nhìn hơn
- Number of Rows: Số lượng dữ liệu trong tableview để Xcode chuẩn bị để hiển thị
- Data inside each row: Dữ liệu hiện ra thế nào trong từng dòng

2. Lập trình với table view:
- Bây giờ chúng ta có thể bắt đầu với table view. Đây là các bước để chúng ta bắt đầu làm việc để có được một table view đơn giản:
+ Tạo một khung sườn cho chương trình
+ Tạo ra một vài dữ liệu để đưa vào trong table
+ Tạo ra một table view
+ Kết nối với datasource và delegate của table
+ Hoàn tất vài lệnh tương tác đơn giản với table view

a. Tạo khung sườn cho chương trình:
- Bạn tạo ra một chương trình (New Project)
- Tạo thêm một NSMutableArray lkTableData để lưu trữ dữ liệu.
- Tạo UILabel lblNotice để ghi nhận sự kiện click vào trong từng Cell
- Tạo UITextView txvNotice để ghi ra những thành phần có trong lkTableData

Mã:

    @property (nonatomic, strong) NSMutableArray *lkTableData;
    @property (strong, nonatomic) IBOutlet UILabel *lblNotice;
    @property (strong, nonatomic) IBOutlet UITextView *txvNotice;

* Trong IB, ta xây dựng các control như sau:
+ Một TableView để hiển thị dữ liệu
+ Một Label để ghi nhận sự kiện
+ Một UITextView để ghi nhận các thành phần có trong lkTableData
* Chúng ta sẽ có như trong hình:

* Lưu ý: Bạn cần phải set up DataSource và Delegate cho TableView để nó có thể chạy được trong chương trình. Bạn nhấn chuột phải vào trong Table View sẽ thấy hình như sau. Lúc này, dataSource và delegate chưa có kết nối. Bạn giữ Ctrl bấm vào cái vòng tròn rồi kéo vào File’s Owner. Sau khi có được hình như thế này là Okie:

b. Tạo dữ liệu mẫu để đưa vào trong table view:
* Khi view được tạo ra chúng ta thêm vào một số những item để test dữ liệu xem có thực sự TableView hoạt động hay không? Và ở đây tôi sẽ hiển thị nó lên trên TextView để chúng ta có thể tham khảo được những item nào có trong lkTableData.

Mã:

 - (void)viewDidLoad
    {
    [super viewDidLoad];
    self.lkTableData = [[NSMutableArray alloc] init];
     for (NSUInteger i=0; i<10; i++) {
    NSString *dataString = [NSString stringWithFormat:@"Item %d", i];
    [self.lkTableData addObject:dataString];
    }
     NSString *messageString = [NSString stringWithFormat:@"The lkTableData array contains %@", self.lkTableData];
    _txvNotice.text = messageString;
    }

Đầu tiên phải set số section của TableView và số dòng (Row) được hiển thị trong đó.

Mã:

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
    }
     -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return [self.lkTableData count];
    }

Set up phần hiển thị trên Table:

Mã:

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
     static NSString *cellIdentifier = @"Cell";
     UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier];
     if (cell == nil) {
    cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
    }
     cell.textLabel.text = [self.lkTableData objectAtIndex:indexPath.row];
     return cell;
     }

c. Thêm vào các sự kiện:
Đây là sự kiện khi người dùng chạm vào một dòng (row). Ở đây, tôi sẽ thay đổi thông báo lblNotice thành dòng mà người sử dụng chạm vào để chúng ta có thể thấy được việc chúng ta có thể bắt được những sự kiện này thành công:

Mã:

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString *messageString = [NSString stringWithFormat:@"You tapped row %d", indexPath.row];
    _lblNotice.text = messageString;
    }

III. Kết luận:
- Table view là một trong những hỗ trợ cho người dùng rất tốt để giúp cho chương trình hiển thị đồ họa tốt hơn dễ dàng hơn cho người sử dụng.

Source Code:

Google Drive: https://docs.google.com/file/d/0B3v7...UxWVY1aTQ/edit

Mediafire: http://www.mediafire.com/download.php?u54dk28ybtj540y

View more random threads:

**Non Dang** · 31-01-2013, 12:35 PM

Tiếp đi bác, còn phần click vào item nào đó thì chuyển sang màn hình khác, bấm nút back thì quay lại màn hình có table. Em bị mắc ở đoạn này

**seotop1** · 31-01-2013, 12:37 PM

Mình có 1 số lưu ý sau:
- Bạn đang dùng ARC trong project này nên bạn không quan tâm đến memory management, nếu dùng cách code của bạn trong non-ARC sẽ leak memory. Mình khuyên các bạn mới học iOS nên dùng non-ARC để tự quản lý bộ nhớ, nắm cái căn bản lúc nào cũng tốt.
- Nếu không adopt

Mã:

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

của protocol UITableViewDataSource thì mặc định table view sẽ có 1 section.
- Mỗi UITableViewCell đều có 2 label: textLabel và detailTextLabel, ứng với mỗi style các label sẽ ở những vị trí khác nhau. Apple cung cấp 4 style cho UITableViewCell:
UITableViewCellStyleDefault, UITableViewCellStyleSubtitle, UITableViewCellStyleValue1, UITableViewCellStyleValue2. Với style default chúng ta sẽ chỉ thấy mỗi textLabel còn với 3 style kia thì cả 2 label sẽ hiện ra.
- Reuse tableviewcell mục đích là để tránh tạo ra quá nhiều cell khi các cell đều có chung 1 hình dáng, khác nhau về nội dung.
- Mỗi section đều có header và footer, chúng ta có thể thay đổi text của header/footer bằng cách adopt methods sau:

Mã:

- (NSString *) tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
- (NSString *) tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section

hoặc thậm chí có thể thay đổi footer/header thành 1 view tự thiết kế bằng cách adopt 2 methods của protocol UITableViewDataSource:

Mã:

- (UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
- (UIView *) tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section

- TableView hỗ trợ Edit mode, chúng ta có thể move cell, delete cell khi edit mode được bật lên.
- TableView còn hỗ trợ insert cell kèm theo các hiệu ứng...

Còn rất nhiều thứ về Table View mà mình chưa kể hết ra trên đây... các bạn cứ từ từ tìm hiểu.

[IMG]images/smilies/2.gif[/IMG]

Thân.

-

**chieuthubay** · 31-01-2013, 12:46 PM

Gửi bởi gabk

Tiếp đi bác, còn phần click vào item nào đó thì chuyển sang màn hình khác, bấm nút back thì quay lại màn hình có table. Em bị mắc ở đoạn này

Thứ nhất:
- ViewController hiện tại của bạn phải nằm trong 1 UINavigationController

Mã:

UINavigationController *navController = [[UINavigationController alloc] initWithRootViewController:yourController];
/hớ release

Khi bạn tap vào 1 row thì bạn adopt method

Mã:

- (void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath

Tạo ra 1 viewcontroller khác, sau đó push view controller đó vào stack của UINavigationController

Mã:

[self.navigationController pushViewController:newViewController animated:YES];

từ khóa self chỉ viewController adopt method tableView:didSelectRowAtIndexPath:

Có gì khó khăn pm yahoo mình wataru_fqh, support tận tình [IMG]images/smilies/smile.png[/IMG]
Thân.

**hoannguyen64** · 01-02-2013, 03:26 PM

Bạn đang dùng ARC trong project này nên bạn không quan tâm đến memory management, nếu dùng cách code của bạn trong non-ARC sẽ leak memory. Mình khuyên các bạn mới học iOS nên dùng non-ARC để tự quản lý bộ nhớ, nắm cái căn bản lúc nào cũng tốt.

=> Nắm cái căn bản để làm gì ? Trở về thời đồ đá à ?
=> Cái chính khi đưa ra công cụ chính là làm cho công việc trở nên nhanh hơn và bỏ qua những thứ mà máy tính có thể làm được thay cho lập trình viên.
=> Nếu thực sự muốn nắm căn bản, hãy làm việc với các ngôn ngữ cấp thấp. Bạn sẽ nắm nhiều căn bản về máy tính hơn đấy, nó làm chương trình bạn chạy nhanh hơn nhiều nhưng vĩnh viễn bạn sẽ chả bao giờ có được một sản phẩm hoàn chỉnh.

=> Hãy ra sản phẩm cho người dùng, đừng tự kỉ trong không gian của chính bạn. Người sử dụng IOS không quan tâm đến bạn lập trình giỏi ra sao, họ chỉ quan tâm đến những gì họ nhận được mà thôi và đó chính là sản phẩm của bạn.

* Nếu bạn phát triển một sản phẩm mất 10 tuần thì dùng ARC sẽ giảm còn 7 tuần, nếu dùng IB thì còn chừng 3 tuần, bạn có thêm thời gian để thêm các hiệu ứng, đầu tư về mặt logic.
=> Hãy xài công nghệ mới đừng cứ mải miết nâng cấp cái khả năng lập trình lạc hậu của bạn nữa.

**khamnamkhoa** · 01-02-2013, 04:32 PM

Gửi bởi huygamer

=> Nắm cái căn bản để làm gì ? Trở về thời đồ đá à ?
=> Cái chính khi đưa ra công cụ chính là làm cho công việc trở nên nhanh hơn và bỏ qua những thứ mà máy tính có thể làm được thay cho lập trình viên.
=> Nếu thực sự muốn nắm căn bản, hãy làm việc với các ngôn ngữ cấp thấp. Bạn sẽ nắm nhiều căn bản về máy tính hơn đấy, nó làm chương trình bạn chạy nhanh hơn nhiều nhưng vĩnh viễn bạn sẽ chả bao giờ có được một sản phẩm hoàn chỉnh.

=> Hãy ra sản phẩm cho người dùng, đừng tự kỉ trong không gian của chính bạn. Người sử dụng IOS không quan tâm đến bạn lập trình giỏi ra sao, họ chỉ quan tâm đến những gì họ nhận được mà thôi và đó chính là sản phẩm của bạn.

* Nếu bạn phát triển một sản phẩm mất 10 tuần thì dùng ARC sẽ giảm còn 7 tuần, nếu dùng IB thì còn chừng 3 tuần, bạn có thêm thời gian để thêm các hiệu ứng, đầu tư về mặt logic.
=> Hãy xài công nghệ mới đừng cứ mải miết nâng cấp cái khả năng lập trình lạc hậu của bạn nữa.

[IMG]images/smilies/laughing.gif[/IMG] cái thái độ bố đời của bạn thì mình biết kỹ năng lập trình của bạn nó tới đâu rồi [IMG]images/smilies/17.gif[/IMG]

**lolista** · 01-02-2013, 07:19 PM

Kiểu cách lạc hậu của bạn thì mình gặp hàng đống ^.^

Bản thân không chỉ được lý do vì sao không sử dụng chỉ một lý do vớ vẩn là "nắm rõ cái căn bản" không đáng một xu?
Kỹ năng lập trình là cái gì đối với người sử dụng? Ai cần biết bạn lập trình giỏi như thế nào? Người ta cần là ứng dụng, game của bạn cho người ta sử dụng.

Thế ngoại trừ cái lý do "nắm rõ cái căn bản" không cần thiết của bạn thì còn lý do nào khác để bạn sử dụng cái công nghệ cổ lỗ xỉ của bạn không vậy hả Noob?

* Tôi vào IOS chậm hơn ông nhưng trình độ thì cứ tự mà xem thử lại mình đi [IMG]images/smilies/smile.png[/IMG]

**phuongnguyen** · 18-05-2013, 06:37 PM

Cho mình hỏi...mình có 1 view, khi ấn vào bt nó sẽ ra 1 TableView ( ví dụ : ấn vào photo library, nó sẽ ra 1 table danh sách hình) vậy cho hỏi làm sao để back lại view lúc đầu đc vậy? thankx.

**thaychuathd** · 23-05-2013, 11:33 AM

Dùng Navigator thì bạn có thể back lại màn hình trước một cách dễ dàng,

Nếu dùng code thì thay thế view lại thoai ^.^
Dùng Segue quay lại cũng được (liên kết với button hay event) nào đó ^,^

Chủ đề: TableView trong IOS (Simple TableView Project)

Công cụ Chủ đề

Tìm Chủ đề

Hiển thị

TableView trong IOS (Simple TableView Project)

View more random threads:

Quyền viết bài

Bàn luận thông tin các điều kiêng...

How to make and tie a gift basket...

Phương pháp để quý cô sử dụng cu...

Tìm hiểu để biết máy rung tình yêu...

Các yếu tố phụ thuộc khi mua...