在TTCatalog这个Example中, 有一个TTStyleTextLabel如何使用的样例,就从这个开始入手吧.
1) 创建一个TTStyledTextLabel对象,很简单,把它加入到view中就可以显示了
NSString* kText = @"\
This is a test of styled labels. Styled labels support \
<b>bold text</b>,.......";
TTStyledTextLabel* label1 = [[TTStyledTextLabel alloc] initWithFrame:self.view.bounds] autorelease];
label1.font = [UIFont systemFontOfSize:17];
label1.text = [TTStyledText textFromXHTML:kText lineBreaks:YES URLs:YES];
TTStyleTextLabel自身实现的功能主要就是监听touch事件,然后反馈给内部的链接和其他可touch的节点.
2) TTStyleTextLabel的神奇之处在于它包含的 text:TTStyleText
TTStyleText的两个属性是核心:
TTStyledNode* _rootNode; // 实现了内部样式化文本块的链表
TTStyledFrame* _rootFrame; //存储文本块所占用的空间的链表
在把xhtml解析成多个node后, 使用TTStyledLayout对其计算空间,然后记录在_rootFrame中
3) TTStyleText对于XHTML文本块使用解析器: TTStyledTextParser:
TTStyledTextParser* parser = [[TTStyledTextParser alloc] init] autorelease];
parser.parseLineBreaks = lineBreaks;
parser.parseURLs = URLs;
[parser parseXHTML:source];
4) TTStyleTextParser处理<img><b><a>等tag,然后拆分成一块块简单内容(文本或者图片),在_rootNode中串联起来
处理xhtmltag的代码在- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName
namespaceURI:(NSString *)namespaceURI qualifiedName:(NSString *)qualifiedName
attributes:(NSDictionary *)attributeDict; 有兴趣的童鞋可以去看看.
学习Three20和TTStyledTextLabel的初衷是建立一个类似facebook中消息列表中显示的一个包含文字和图片的消息.
可惜试了Three20的例子后发现, 只能使用inline的方式排版,看来要实现更复杂的布局还是需要自己动手~
初步尝试写了一个只是支持多个样式的UILabel, 还在琢磨在加入图片后怎么布局. 这个功能就真有点像是一个mini浏览器了,就怪apple 的ios sdk的布局功能太弱了......