基于Spanned排版引擎初探

基于Spanned排版引擎初探

前言

****的我的中心的界面基本上都要求须要服务端可配置,实现灵活排版.但对于客户端来讲,这种方式实现起来不肯定因素带多了,仅用单纯的某一控件是很难实现的.其一解决方法是这些页面都用WebView控件排版,这样服务端只要填充web页面就能够了,可是WebView是重量级的,并且会伴有不肯定的WebKitCore的内存泄漏,再则因为Web页面数据大小,服务器,网络等因素页面加载有可能出现缓慢的现象.故这里提出一种基于android TextView控件的Spanned的排版和数据解析的实现方式.能够实现url点击,图文混排,颜色,背景等独立排版.如此服务端就可单独下发标签化数据,此外客户端又可根据不一样类型数据,实现不一样的数据请求策略.

利用上述的方法就可在我的中心的部分页面以及私信内容实现服务端可控图文混排.

1、格式化标签

    要想达到前言中的效果,就要规定一组可识别的格式化标签规范,该标签语法以下:

1.  一级标签: $span:<tag>[(arg0,arg1,…)];

. ’$span’为格式化标签开始,

.  ’;’为格式化标签结尾;

.  ’<tag>’标签主体,必有部分,例如图片:’img’,连接:’url’;

.  [(arg0,arg1,…)]是后随参数部分.例如:图片:$span:image(1, meta_account);

 

一级格式化标签具体详见:

1)  文本标签: $span:text(content, arg…),text标签也能够看成子标签嵌套到其余标签中;

. content: 须要排版的字符串; arg为二级标签,定义排版规则;

. arg: 能够是font/face/style标签组合;

2)  图片标签: $span:image(flag, src, width, heigh), image标签也能够看成子标签嵌套到其余标签中;

flag: 指明图片资源的类型; src: 说明图片资源的来源;

. flag=0,即图片是网络资源,其中src是图片的url,客户端会有一套完整的缓存机制来控制;

. flag=1,即图片为客户端资源,其中src是客户端规定目录下的某一图片资源,若是该src是相对路径,则指向的是客户端默认资源库中的图片资源;不然是资源绝对路径;

. flag=2,即图片为客户端资源,其中src是客户端系统中的资源名称,该资源是经过Context.getResource()加载的;

 

3)  连接标签: $span:url(alt, href);

alt: 说明该连接在客户端的显示名称; hrdf: 连接的url;

. alt能够是一串字符串,也能够嵌套img(flag, src)标签,还能够是排版标签,例如fnt(text_size, foreground_color, background_color);

. href: 连接的指向的url,同时也能够是Action脚本;

 

2.   二级标签: <tag>[(arg0,arg1,…)]

. 二级标签为嵌套标签,是一组辅助排版标签,不能独立使用;

. ’<tag>’标签主体,必有部分;

. [(arg0,arg1,…)]是后随参数部分;

二级格式化标签具体详见:

1)  字体大小颜色标签: font(text_size, foreground_color, background_color);

. text_size: 字体大小;

. foreground_color: 前景色,即字体颜色;

. background_color: 背景色;

 

2)  字体标签: face(flag, src);

. flag=0,即字体是网络资源,其中src是图片的url,客户端会有一套完整的缓存机制来控制;

. flag=1,即字体为客户端资源,其中src是客户端规定目录下的某一字体,若是该src是相对路径,则指向的是客户端默认字体库中的字体;不然是字体绝对路径;

. flag=2,即字体为客户端资源,其中src是客户端系统中的字体名称;

 

3)  字体样式: style(style);

style为解析器所能支持的样式:

. style=normal: 系统默认字体样式;

. style=bold: 粗体;

. style=italic: 斜体;

. style=under_line: 下划线;

. style=strike_through: 删除线;

. style=subscript: 上标;

. style= superscript: 下标;

 

4)  字体宽度: scaleX(float);

 

5)  字体水平对齐: align([left, right, center]);

 

6)  字体竖直对齐: valign([top, middle, bottom]);

2、解析引擎

解析引擎分红2部分,一部分是用来解析格式化标签;一部分是用来建立标签span对象;

格式化标签解析器,是用来将服务端下发的标签数据解析成客户端可识别的对象.

Span对象由BackgroundColorSpan, ForegroundColorSpan, ClickableSpan, URLSpan, StyleSpan, ScaleXSpan, TypefaceSpan UnderlineSpan等组成.

3、示例

1.  图文混排: 2.礼券: $span:image(2, p_coin);

2.  连接: 金秋…能够领1次~ $span:url(text([当即充值], font(23, #ff004100, #ff002000)), action:RechargeCoinAction);