免责声明：文中部分信息有参考到其他网站及牛人的资料，在引用到的地方会注明其来源，如有不宜之处可联系本人进行更正或者删除！学术看法及观点仅代表个人，仅供参考。知识共享，共同学习，来源于社会，回馈社会。
目录
1 前言
目前，TD官方的帮助文档非常有限，好多细节需要实际开发过程中经验性摸索。在原生控件的使用过程中，大多数小伙伴都是直接使用TD Realizer拖拽、配置属性、修改样式的方式完成界面布局及设计的，但是有很多细节需要在界面布局.ini文件和样式.rc文件中才能探个究竟。
2 使用示例
3 控件布局
3.1 一个例子
界面长这个样子
它的布局.ini文件是这样的
#这是注释(直到换行)
mainwindow = {
type="window"
x=20; y=20; w = 200; h=100
caption="hello"
#style=”style_name”
#flags=0
button_ok = {
type="button"
x=20; y=20; w=50; h=30
caption="ok"
#style="style_name"
#flags=0
}
button_cancel = {
type = "button"
x=100; y=20; w=50; h=30
caption="cancel"
#style="style_name"
#flags=0
}
}3.2 控件的基本属性
type：
控件的类型。一个字符串的 id，例如
type=“window”
x：
相对于父控件的横向位置。一个整数，例如 x=100
y：
相对于父控件的纵向位置。一个整数，例如 y=800
w：
控件的大小，宽。一个整数，例如 w=200
h：
控件的大小，高。一个整数，例如
h=50
style：
控件的风格名。一个字符串，例如
style=”hello”
flags：
控件的标志（公共标记和私有标记）。一个或多个标记，例如
flags=hide 或者 flags={no_focus; child_no_focus;}
caption：
控件的标题。一个字符串，例如
caption=”ok”
layout：
自动布局的信息（目前只针对窗口控件）
。一个字符串
min_w：
控件的排版属性。整数值，指定窗口控件(Window)
的最小宽高
（只针对窗口控件）
，这是窗口
min_h：
控件的排版属性。整数值，指定窗口控件(Window)
的最小宽高
（只针对窗口控件）
，这是窗口
其中，flags对应控件的标志：
no_focus：
TW_NO_FOCUS
child_no_focus：
TW_CHILD_NO_FOCUS
disable：
TW_DISABLE
hide：
TW_HIDE
layout_fix_w：
TW_LAYOUT_FIX_W
layout_fix_h：
TW_LAYOUT_FIX_H
layout_fix_size：
TW_LAYOUT_FIX_W|TW_LAYOUT_FIX_H
hide_h_scrollbar：
TW_HIDE_H_SCROLL
hide_v_scrollbar：
TW_HIDE_V_SCROLL
hide_scrollbar：
TW_HIDE_H_SCROLL|TW_HIDE_V_SCROLL
auto_hide_h_scrollbar：
TW_AUTO_HIDE_H_SCROLL
auto_hide_h_scrollbar：
TW_AUTO_HIDE_V_SCROLL
auto_hide_scrollbar：
TW_AUTO_HIDE_SCROLL
no_h_scroll：
TW_NO_H_SCROLL
no_v_scroll：
TW_NO_V_SCROLL
4 控件样式
4.1 一个例子
button.ok {
#[nd] 控件在normal和disable状态下的显示
bg = "file1.png", stretch_hv3
border = "file2.png", 2
border_margin = 2
text_aline = text_left, text_middle
image_aline = image_left, image_middle
text_margin = 1
image_margin = 1
text_color = rgb(0,0,0)
font = "*-12-*"
#[as] 控件在active和select状态下的显示
bg = rgb(255,0,0)
border = rgb(255,0,0), border_circle, 2
border_margin = 2,2
text_color = rgb(0,0,0),rgb(255,255,255)
#}4.2 一般的形式是
type 或者 type.name {
#[status]
item=value
item=value,value,...
#[status]
item=value
item=value,value,...
#}4.3 type 表示要设置的控件类型
button 按钮
bool_button 布尔值按钮
text 单行文本输入框的每行
scrollbar_v_top 垂直滚动条的上端按钮
scrollbar_v_bottom 垂直滚动条的下端按钮
scrollbar_v_thumb 垂直滚动条的滑块
scrollbar_v_background垂直滚动条的背景
scrollbar_h_left 水平滚动条的左端按钮
scrollbar_h_right 水平滚动条的右端按钮
scrollbar_h_thumb 水平滚动条的滑块
scrollbar_h_background水平滚动条的背景
processbar_h_thumb 水平进度条的滑块
processbar_h_process 水平进度条的进度指示
processbar_h_carrier 水平进度条的背景
processbar_v_thumb 垂直进度条的滑块
processbar_v_process 垂直进度条的进度指示
processbar_v_carrier 垂直进度条的背景
window 窗口
listview_node 多行列表的节点
listview_item 多行列表的节点里面的项
#**********************************************************************
name 表示要设置指定风格名的控件类型
如果不写name,表示设置该控件类型的默认风格。
当创建一个控件时,会在符合这个控件类型的所有风格中查找和控件的风格名一致的风格。
如果找不到或用户没有设置控件的风格名,就采用默认风格。
#**********************************************************************
#**********************************************************************
item表示可以设置的风格项,
value表示设置的值,有4种形式: 字符串"string", 10进制数, 颜色rgb(0~255,0~255,0~255), 关键词
不同的item会要求不同的value个数和形式,下面具体说明
#**********************************************************************
bg
设置控件的背景,可以为颜色值,也可以为图片。
当是图片时还可以指定图片的拉伸方式, 拉伸方式有
stretch_normal: 普通拉伸
stretch_hv3: 把图片分成3x3的9块,四个角的四块不拉伸,其他块拉伸
stretch_hv2: 把图片分成2x2的4块,四个角的四块不拉伸,对两条分隔线及其交叉点进行拉伸
stretch_tile: 平铺,不拉伸
例子
bg=rgb(255,200,200)
bg="bg.png",stretch_hv3 不写拉伸方式,默认是stretch_normal
bg="ParentRelative" 特殊的图片名,表示采用父控件的背景
bg="None" 特殊的图片名,表示没有背景
img
控件上显示的前景图片
img="img.png"
#----------------------------------------------------------------
border
设置控件的边框, 可以为颜色值,也可以为图片，
当是图片时，实际绘制时的图片拉伸方式和bg相同,还可以设置边框大小，
当是颜色时可以设置边框的类型和大小,边框的类型有
border_rect：矩形边框
border_circle: 圆角边框
border_down: 凹边框
border_up: 凸边框
border_right_br: 下边和右边有边框
border_right_b：下划线边框
border_right_b_d：下划线虚框
border_blank：空白框
例子
border=rgb(255,200,200),border_rect,2
border="bg.png",2
#----------------------------------------------------------------
text_aline
控件文本的对齐方式,分为水平对齐和垂直对齐,
text_left: 文本水平左对齐
text_right: 文本水平右对齐
text_top: 文本垂直上对齐
text_bottom: 文本垂直下对齐
text_middle: 文本水平或垂直居中
text_xfollow: 文本水平跟在图片后面
text_yfollow: 文本垂直跟在图片后面
例子
text_aline=text_left,text_middle 文本水平靠左边,垂直居中显示
#----------------------------------------------------------------
image_aline
控件图片的对齐方式,分为水平对齐和垂直对齐,
image_left: 图片水平左对齐
image_right: 图片水平右对齐
image_top: 图片垂直上对齐
image_bottom: 图片垂直下对齐
image_middle: 图片水平或垂直居中
例子
image_aline=image_left,image_middle 图片水平靠左边,垂直居中显示
#----------------------------------------------------------------
text_margin
控件中两行文本之间的间隔
例子
text_margin=1
#----------------------------------------------------------------
image_margin
当文本的对齐方式text_xfollow或text_yfollow时,图片和文本之间的间隔
例子
image_margin=1
#----------------------------------------------------------------
border_margin
边框四周和控件内部(文本和图片)的间隔,分为左left,上top,右right,下bottom
例子
border_margin=1 left=1,top=1,right=1,bottom=1
border_margin=1,2 left=1,top=2,right=1,bottom=2
border_margin=1,2,3 left=1,top=2,right=3,bottom=2
border_margin=1,2,3,4 left=1,top=2,right=3,bottom=4
文本和图片的对齐方式是左对齐时，间隔只考虑left, 右对齐时只考虑right，
居中时考虑left和right；垂直方向类似。
#----------------------------------------------------------------
text_color
设置文本显示的颜色和背景色
例子
text_color=rgb(0,0,0) 用黑色显示文本,没有文本的背景色
text_color=rgb(0,0,0),rgb(0,255,0) 用黑色显示文本,文本的背景为绿色
#----------------------------------------------------------------
font
控件中显示文本的字体名,默认是继承父控件的字体
如 font = "yahei-16"
#----------------------------------------------------------------
alpha
设置显示内容的alpha值，默认为255(不透明), 赋值范围为[0, 255]
如 alpha = 128
#**********************************************************************
status 一个控件在它的不同状态下会有不同的显示,所以在一个完整的风格
中要根据状态分组.当开始不写[status]时就表示设置的是所有状态下的显示
#**********************************************************************
每个单元都有四种状态,分为：
正常状态（normal）
激活状态（active）
被选择状态（select）
失效状态（disable）
其对应的状态值分别为n、a、s、d 或 N、A、S、D
例子
[nasd] [nas] [n] [sd]
注意：包含n状态的项一定要排在前面, 控件创建时n状态的项总会先设置.
427
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
