某人的栖息地

three20中的TTTableCaptionItem实际使用效果是，左侧是较小字体的标题，右侧是大号字体的文本，如下图所示

但是在实际使用中，我希望左侧的字体能变大，右侧字体变小，所以我参照wiki的介绍 在TTTableViewController定制单元格 来进行调整，按文中介绍，我需要实现：

1. 自定义的tableItem
2. 自定义的tableItemCell
3. 自定义的datasource，以便支持新增的tableItem

但是考虑到three20的代码库中已经有个半成品的TTTableRightCaptionItem，所以我只需要在这个基础上加工一下。

实现TTTableTextCaptionItem

我将这个自定义的类命名为TTTableTextCaptionItem以示区别

TTTableTextCaptionItem

TTTableTextCaptionItem.h

#import <Three20/Three20.h>

@interface TTTableTextCaptionItem : TTTableRightCaptionItem {
}

@end

TTTableTextCaptionItem.m

#import "TTTableTextCaptionItem.h"

@implementation TTTableTextCaptionItem
@end

TTTableTextCaptionItemCell

TTTableTextCaptionItemCell.h

#import <Three20/Three20.h>

@interface TTTableTextCaptionItemCell : TTTableRightCaptionItemCell {
}
@end

TTTableTextCaptionItemCell.m

#import "TTTableTextCaptionItem.h"
#import "TTTableTextCaptionItemCell.h"

static const CGFloat kKeySpacing = 12;
static const CGFloat kKeyWidth = 75;

@implementation TTTableTextCaptionItemCell

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
#pragma mark -
#pragma mark UIView

///////////////////////////////////////////////////////////////////////////////////////////////////
- (void)layoutSubviews {
    [super layoutSubviews];

    self.detailTextLabel.frame = CGRectMake(kTableCellHPadding, kTableCellVPadding,
                                      kKeyWidth, self.textLabel.font.ttLineHeight);

    CGFloat valueWidth = self.contentView.width - (kTableCellHPadding*2 + kKeyWidth + kKeySpacing);
    CGFloat innerHeight = self.contentView.height - kTableCellVPadding*2;
    self.textLabel.frame = CGRectMake(kTableCellHPadding + kKeyWidth + kKeySpacing,
                                            kTableCellVPadding,
                                            valueWidth, innerHeight);
}

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
#pragma mark -
#pragma mark TTTableViewCell

///////////////////////////////////////////////////////////////////////////////////////////////////
- (void)setObject:(id)object {
    if (_item != object) {
        [super setObject:object];

        TTTableTextCaptionItem* item = object;
        self.textLabel.text = item.text;
        self.detailTextLabel.text = item.caption;
    }
}

@end

如何使用TTTableTextCaptionItem

首先实现一个自定义的DataSource，然后在后续代码中使用这个DataSource

#import "TTTableTextCaptionItemCell.h"
#import "TTTableTextCaptionItem.h"

@interface MyCustomDataSource : TTSectionedDataSource
@end

@implementation MyCustomDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id)object {
    if ([object isKindOfClass:[TTTableTextCaptionItem class]]) {
        return [TTTableTextCaptionItemCell class];
    } else {
        return [super tableView:tableView cellClassForObject:object];
    }
}

@end

代码下载

我把代码放到github上，方便大家参考 TTTableTextCaptionItem.git

作者: Volcano 发表于July 3, 2011 at 11:13 am

版权信息: 可以任意转载, 转载时请务必以超链接形式标明文章原始出处和作者信息及此声明

永久链接 - http://www.ooso.net/archives/605