Three20 – TableView(TTTableViewController)(2)

上次筆記了一下一般的TableView怎麼弄，搞了搞，繼續深入了研究了一下，看到很多app都有“下拉重新整理”的功能，比如人人的app，還有qq空間的app，覺得很酷，那麼我們怎麼用320來實現一下呢，就看看我下面這個筆記吧。

首先，建立項目，我這裡建立了一個叫freshtest的項目，然後把320的引入，ok，看看能不能build，能build就說明引入成功了，成功之後我們就開始寫一個320的TableView，具體怎麼寫在這篇文章裡面
已經寫了，這個地方的代碼我就不過多重複了。寫好後，先看看能不能運行，應該是下面這個效果。

好吧，運行成功之後，我們需要在RootViewController裡加上這樣一段代碼。

- (id)createDelegate {
return [[[TTTableViewDragRefreshDelegate alloc] initWithController:self] autorelease];
}

嗯，試試運行，看看把tableview往下拉，能不能看到一個很眼熟的“下拉後更新”呢，可以吧，是不是這段代碼很牛x？但是先別樂，因為這個只是展現了一個view，並沒有做什麼事情，不信你下拉一下，或者用抓包工具抓包一下，看看做了什麼。實際上，什麼也沒做！

所以，要到達做事情的地步還遠著呢。上面的代碼只是申明了一個委託，還沒又實際作用，因為我們還要寫datasource，model來實現細節，現在才剛剛開始，我們來實現細節。

我們就先什麼也不幹，請求一個網站然後讓這個東西先運作起來。我們暫時目標就定做請求一個Feed，我們先寫個Feed類，我們先建立一個Feed類，然後編寫代碼如下。

標頭檔。

#import
<
Three20
/
Three20.h
>

@interface Feed : NSObject {
    NSString*
_text;
    NSString
*
_source;
    NSString
*
_ftype;
    NSString
*
_img;
}

@property (nonatomic, copy)   NSString*
text;
@property (nonatomic, copy)   NSString
*
source;
@property (nonatomic, copy)   NSString
*
ftype;
@property (nonatomic, copy)   NSString
*
img;

 @end

實現。

#import
"
Feed.h
"

@implementation Feed

@synthesize text      =
_text;
@synthesize source    
=
_source;
@synthesize ftype    
=
_ftype;
@synthesize img
=
_img;

-
(
void
) dealloc {
    TT_RELEASE_SAFELY(_text);
    TT_RELEASE_SAFELY(_source);
    TT_RELEASE_SAFELY(_ftype);
    TT_RELEASE_SAFELY(_img);
    [super dealloc];
}

@end 

上面只是一個很簡單的Feed類，我們實現之後，就需要寫一個Model了，建立一個Model類，實現如下。

標頭檔。

#import
<
Three20
/
Three20.h
>

@interface Model : TTURLRequestModel {
    NSString*
_searchQuery;
    NSArray
*
  _feeds;
}

@property (nonatomic, copy)     NSString*
searchQuery;
@property (nonatomic,
readonly
) NSArray
*
  feeds;

-
(id)initWithSearchQuery:(NSString
*
)searchQuery;

@end 

具體實現。

#import
"
Model.h
"

#import
"
Feed.h
"

@implementation Model

@synthesize searchQuery =
_searchQuery;
@synthesize feeds      
=
_feeds;

-
(id)initWithSearchQuery:(NSString
*
)searchQuery {
    
if
(self
=
[super init]) {
        self.searchQuery
=
searchQuery;
    }
    
    
return
self;
}

-
(
void
) dealloc {
    TT_RELEASE_SAFELY(_searchQuery);
    TT_RELEASE_SAFELY(_feeds);
    [super dealloc];
}

-
(
void
)load:(TTURLRequestCachePolicy)cachePolicy more:(BOOL)more {
    
if
(
!
self.isLoading
&&
TTIsStringWithAnyText(_searchQuery)) {
        NSString
*
url
=

@"
http://api.douban.com/people/2449296/miniblog/contacts/merged?alt=json&max-results=20
"
;
        
        TTURLRequest
*
request
=
[TTURLRequest
                                 requestWithURL: url
                                
delegate
: self];
        
        request.cachePolicy
=
cachePolicy;
        request.cacheExpirationAge
=
TT_CACHE_EXPIRATION_AGE_NEVER;
        [request send];
    }
}

-
(
void
)requestDidFinishLoad:(TTURLRequest
*
)request {
}

@end 

其中，load方法和requestDidFinishLoad很重要，我們現在requestDidFinishLoad可以暫時什麼都不實現，就這樣空著。剩下，我們再寫一個DataSource，作為TableView的資料來源。ok，依然上代碼。

標頭檔。

#import
<
Three20
/
Three20.h
>

@class Model;
//
TTListDataSource


@interface DataSource : TTSectionedDataSource {
    Model
*
_feed_model;
}

-
(id)initWithSearchQuery:(NSString
*
)searchQuery;

@end 

記得上面的代碼是繼承自TTSectionedDataSource的，在demo中是繼承自TTListDataSource，當然，這兩個都是
可以的，但是還是有區別的，繼承自TTListDataSource的話，就是普通的TableView。而繼承自
TTSectionedDataSource的話，是可以有分類標題的，下回再說。

繼續實現。

#import
"
DataSource.h
"

#import
"
Model.h
"

#import
"
Feed.h
"

@implementation DataSource

-
(id)initWithSearchQuery:(NSString
*
)searchQuery {
    
if
(self
=
[super init]) {
        _feed_model
=
[[Model alloc] initWithSearchQuery:searchQuery];
    }
    
return
self;
}

-
(
void
)dealloc {
    TT_RELEASE_SAFELY(_feed_model);
    
    [super dealloc];
}

-
(id
<
TTModel
>
)model {
    
return
_feed_model;
}

-
(
void
)tableViewDidLoadModel:(UITableView
*
)tableView {
}

-
(NSString
*
)titleForLoading:(BOOL)reloading {
    
if
(reloading) {
        
return
NSLocalizedString(
@"
Updating feed…
"
,
@"
Feed updating text
"
);
    }
else
{
        
return
NSLocalizedString(
@"
Loading feed…
"
,
@"
Feed loading text
"
);
    }
}

-
(NSString
*
)titleForEmpty {
    
return
NSLocalizedString(
@"
No feed found.
"
,
@"
Feed no results
"
);
}

-
(NSString
*
)subtitleForError:(NSError
*
)error {
    
return
NSLocalizedString(
@"
Sorry, there was an error loading the Feed stream.
"
,
@""
);
}

@end

實現完了，我們再改我們的RootViewController，改的地方不多，我們就改m檔案就行了。先增加一個import。

#import “DataSource.h”

然後在修改createModel方法。

-(void)createModel {
self.dataSource = [[[DataSource alloc] initWithSearchQuery:@”haha”] autorelease];
}

運行試試看，是不是有一個loading介面？怎麼沒東西。

沒關係，我們現在來解決它。實際上很簡單，我們先開始留著的幾個代碼現在要實現，主要實現的是Model裡的requestDidFinishLoad方法和DataSource裡的tableViewDidLoadModel方法。

Model方法實現如下。

- (void)requestDidFinishLoad:(TTURLRequest*)request {
NSMutableArray* feeds = [[NSMutableArray alloc] initWithCapacity:1];
Feed* f = [[Feed alloc] init];
f.text = @”Hi”;
[feeds addObject:f];
_feeds = feeds;
[super requestDidFinishLoad:request];
}

然後再實現DataSource。

- (void)tableViewDidLoadModel:(UITableView*)tableView {
NSMutableArray* items = [[NSMutableArray alloc] init];
for(Feed *f in _feed_model.feeds) {
[items addObject:[TTTableTextItem itemWithText:f.text]];
}
self.items = items;
}

然後再運行，嗯，是不是出現了一個HI？然後再下拉看看，是不是很明顯，出現了load的感覺，而且更新時間也有了變化？

如果這樣，我們就程式就OK了，不過，如果想按照分類顯示的話（像連絡人那樣），還需要改一些東西。下篇文章我會說說這個，然後說說如何真正請求網
上的API然後parse之後展現到View裡面，其實這裡已經說的比較明顯了，但是還是應該提一下，有些小的很magic的地方。：）

代碼範例可以看這裡

本文轉載自http://www.jguoer.com/blog/index.php/archives/1368