update docs

README.md

@@ -79,15 +79,21 @@ demos\demo1
 
 * [LFTK脚本绑定的实现原理 - lua绑定](docs/binding_lua.md)
 * [LFTK控件的布局参数介绍](docs/layout.md)
+* [LFTK界面描述文件介绍](docs/ui_desc.md)
 
 ## 任务完成情况
 [TODO.md](TODO.md)
 
 ## 最新动态
 
+* 2018/03/17
+    * 支持将Qt的UI文件转成LFTK的UI文件。
+    * 支持将VC的RC文件转成LFTK的UI文件。
+    * 编写LFTK UI界面描述的文档。
+
 * 2018/03/11
     * 增加XML界面描述文件预览工具。
-    * 支持极速模式(定义FAST_MODE启用)，只绘制顶层的窗口中变化的控件，绘制效率非常高，但不支持透明背景。
+    * 支持极速模式(定义FAST\_MODE启用)，只绘制顶层的窗口中变化的控件，绘制效率非常高，但不支持透明背景。
     * 支持基本的layout功能。
 
 * 2018/03/10 

docs/binding_lua.md

@@ -16,7 +16,7 @@
 
 基于以上这些原因，我决定自己实现[LFTK](https://github.com/xianjimli/lftk)的脚本绑定机制。它的实现原理如下：用特定格式的API注释来描述要脚本化的API，用一个名为gen_idl的工具把注释提取出来生成JSON的接口描述文件，然后用不同的代码产生器生成对应语言的绑定：
 
-![1](images/lftk_binding.png) 
+![1](images/script_binding.png) 
 
 ## 注释格式
 

docs/ui_desc.md

@@ -0,0 +1,142 @@
+# LFTK中的界面描述数据
+
+LFTK可以直接加载XML格式的和二进制格式的界面描述数据，从性能和资源开销的角度考虑，二进制格式是更好的选择，LFTK提供了工具将XML格式转换成二进制格式的界面描述数据，也提供了将QT的UI文件和微软的RC文件转换成LFTK XML格式的界面描述文件的工具，其工作流程如下：
+
+![](images/ui_desc.png)
+
+> LFTK的UI Builder还在意淫之中，打算用LFTK本身来开发，可能需要等到2018年底了，目前可以使用Qt Designer或微软的VC来做界面(主要生成各个控件的坐标)，再转换成LFTK XML UI文件，适当的编辑之后，转换成LFKT二进制的UI数据。
+
+## 一、界面描述数据的使用方法
+
+### 1.创建XML格式的界面描述文件
+
+LFTK XML界面描述数据非常紧凑和直观：
+
+* name 是控件的名称，创建完成之后可以用widget\_look\_up函数找到指定名称的控件。
+* x x坐标
+* y y坐标
+* w 宽度
+* h 高度
+* text 文本
+* value 值
+
+x/y/w/h 可以使用[LFTK的layout参数](layout.md)。
+
+```
+<window name="main" x="0" y="0" w="320" h="480">
+  <button name="inc" x="10" y="5" w="40%" h="30" text="Inc"/>
+  <button name="dec" x="right:10" y="5" w="40%" h="30" text="Dec"/>
+  <image name="img" x="10" y="230" w="100" h="100"/>
+  <label name="" x="10" y="40" w="80" h="30" text="Left"/>
+  <label name="" x="100" y="40" w="80" h="30" text="Center"/>
+  <label name="" x="200" y="40" w="80" h="30" text="Right"/>
+  <progress_bar name="bar1" x="10" y="80" w="168" h="30" value="40"/>
+  <progress_bar name="bar2" x="260" y="80" w="30" h="118" value="20" vertical="true"/>
+  <check_button name="c1" x="10" y="150" w="80" h="30" text="Book"/>
+  <check_button name="c2" x="100" y="150" w="80" h="30" text="Food"/>
+  <radio_button name="r1" x="10" y="200" w="80" h="30" text="Book"/>
+  <radio_button name="r2" x="100" y="200" w="80" h="30" text="Food"/>
+  <radio_button name="r3" x="190" y="200" w="80" h="30" text="Pencil" value="true"/>
+  <button name="dialog" x="10" y="260" w="40%" h="30" text="Dialog"/>
+  <button name="dialog2" x="right:10" y="260" w="40%" h="30" text="Dialog2"/>
+</window>
+```
+
+### 2.预览XML格式的界面描述文件
+
+XML UI文件写好后，可以用预览工具预览。如：
+
+```
+./demos/prefix_xml_ui tools/ui_gen/xml_to_ui/window1.xml
+```
+
+### 3.转换成二进制格式的界面描述文件
+
+对XML预览的效果满意之后，把它转换成二进制的格式：
+
+```
+ cd tools/ui_gen/xml_to_ui
+ ./xml_to_ui window1.xml window1.data
+```
+
+为了方便在没有文件系统的嵌入式系统中使用，直接生成常量数据，和程序一起编译。如：
+
+```
+  1 const unsigned char ui_window1[] = {
+  2 0x07,0x00,0x00,0x00,0xdb,0x02,0x00,0x00,0x77,0x69,0x6e,0x64,0x6f,0x77,0x31,0x00,0x64,0x61,0x74,0x61,
+  3 0x00,0x00,0x00,0x00,0x12,0x12,0x22,0x11,0x01,0x00,0x02,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,
+  4 0x00,0x00,0x00,0x00,0x40,0x01,0x00,0x00,0xe0,0x01,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x6d,0x61,0x69,
+  5 0x6e,0x00,0x00,0x01,0x00,0x0a,0x00,0x00,0x00,0x01,0x00,0x0a,0x00,0x00,0x00,0x05,0x00,0x00,0x00,0x28,
+  6 0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x69,0x6e,0x63,0x00,0x74,0x65,0x78,0x74,
+  7 0x00,0x49,0x6e,0x63,0x00,0x00,0x00,0x01,0x00,0x0a,0x00,0x03,0x00,0x01,0x00,0x0a,0x00,0x00,0x00,0x05,
+  8 0x00,0x00,0x00,0x28,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x64,0x65,0x63,0x00,
+  9 0x74,0x65,0x78,0x74,0x00,0x44,0x65,0x63,0x00,0x00,0x00,0x01,0x00,0x0b,0x00,0x00,0x00,0x00,0x00,0x0a,
+ 10 0x00,0x00,0x00,0xe6,0x00,0x00,0x00,0x64,0x00,0x00,0x00,0x64,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,
+ 11 0x69,0x6d,0x67,0x00,0x00,0x00,0x01,0x00,0x09,0x00,0x00,0x00,0x00,0x00,0x0a,0x00,0x00,0x00,0x28,0x00,
+ 12 0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x00,0x74,0x65,0x78,0x74,
+ 13 0x00,0x4c,0x65,0x66,0x74,0x00,0x00,0x00,0x01,0x00,0x09,0x00,0x00,0x00,0x00,0x00,0x64,0x00,0x00,0x00,
+ 14 0x28,0x00,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x00,0x74,0x65,
+ 15 0x78,0x74,0x00,0x43,0x65,0x6e,0x74,0x65,0x72,0x00,0x00,0x00,0x01,0x00,0x09,0x00,0x00,0x00,0x00,0x00,
+ 16 0xc8,0x00,0x00,0x00,0x28,0x00,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,
+ 17 0x00,0x00,0x74,0x65,0x78,0x74,0x00,0x52,0x69,0x67,0x68,0x74,0x00,0x00,0x00,0x01,0x00,0x0d,0x00,0x00,
+ 18 0x00,0x00,0x00,0x0a,0x00,0x00,0x00,0x50,0x00,0x00,0x00,0xa8,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,
+ 19 0x61,0x6d,0x65,0x00,0x62,0x61,0x72,0x31,0x00,0x76,0x61,0x6c,0x75,0x65,0x00,0x34,0x30,0x00,0x00,0x00,
+ 20 0x01,0x00,0x0d,0x00,0x00,0x00,0x00,0x00,0x04,0x01,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,
+ 21 0x76,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x62,0x61,0x72,0x32,0x00,0x76,0x61,0x6c,0x75,0x65,0x00,
+ 22 0x32,0x30,0x00,0x76,0x65,0x72,0x74,0x69,0x63,0x61,0x6c,0x00,0x74,0x72,0x75,0x65,0x00,0x00,0x00,0x01,
+ 23 0x00,0x0f,0x00,0x00,0x00,0x00,0x00,0x0a,0x00,0x00,0x00,0x96,0x00,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,
+ 24 0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x63,0x31,0x00,0x74,0x65,0x78,0x74,0x00,0x42,0x6f,0x6f,0x6b,
+ 25 0x00,0x00,0x00,0x01,0x00,0x0f,0x00,0x00,0x00,0x00,0x00,0x64,0x00,0x00,0x00,0x96,0x00,0x00,0x00,0x50,
+ 26 0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x63,0x32,0x00,0x74,0x65,0x78,0x74,0x00,
+ 27 0x46,0x6f,0x6f,0x64,0x00,0x00,0x00,0x01,0x00,0x10,0x00,0x00,0x00,0x00,0x00,0x0a,0x00,0x00,0x00,0xc8,
+ 28 0x00,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x72,0x31,0x00,0x74,
+ 29 0x65,0x78,0x74,0x00,0x42,0x6f,0x6f,0x6b,0x00,0x00,0x00,0x01,0x00,0x10,0x00,0x00,0x00,0x00,0x00,0x64,
+ 30 0x00,0x00,0x00,0xc8,0x00,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,
+ 31 0x72,0x32,0x00,0x74,0x65,0x78,0x74,0x00,0x46,0x6f,0x6f,0x64,0x00,0x00,0x00,0x01,0x00,0x10,0x00,0x00,
+ 32 0x00,0x00,0x00,0xbe,0x00,0x00,0x00,0xc8,0x00,0x00,0x00,0x50,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,
+ 33 0x61,0x6d,0x65,0x00,0x72,0x33,0x00,0x74,0x65,0x78,0x74,0x00,0x50,0x65,0x6e,0x63,0x69,0x6c,0x00,0x76,
+ 34 0x61,0x6c,0x75,0x65,0x00,0x74,0x72,0x75,0x65,0x00,0x00,0x00,0x01,0x00,0x0a,0x00,0x00,0x00,0x01,0x00,
+ 35 0x0a,0x00,0x00,0x00,0x04,0x01,0x00,0x00,0x28,0x00,0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,
+ 36 0x00,0x64,0x69,0x61,0x6c,0x6f,0x67,0x00,0x74,0x65,0x78,0x74,0x00,0x44,0x69,0x61,0x6c,0x6f,0x67,0x00,
+ 37 0x00,0x00,0x01,0x00,0x0a,0x00,0x03,0x00,0x01,0x00,0x0a,0x00,0x00,0x00,0x04,0x01,0x00,0x00,0x28,0x00,
+ 38 0x00,0x00,0x1e,0x00,0x00,0x00,0x6e,0x61,0x6d,0x65,0x00,0x64,0x69,0x61,0x6c,0x6f,0x67,0x32,0x00,0x74,
+ 39 0x65,0x78,0x74,0x00,0x44,0x69,0x61,0x6c,0x6f,0x67,0x32,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,};
+```
+
+### 4.使用二进制格式的界面描述文件
+
+在程序中引用，并放入资源管理器中：
+
+```
+#include "res/ui/window1.data"
+...
+
+resource_manager_add((const resource_info_t*)ui_window1);
+```
+
+在需要打开该窗口时，调用window\_open函数(对话框用dialog\_open):
+
+```
+  widget_t* win = window_open(name);
+
+  widget_child_on(win, "ok", EVT_CLICK, on_ok, win);
+  widget_child_on(win, "cancel", EVT_CLICK, on_cancel, win);
+```
+
+## 二、将Qt的UI文件转成
+
+转换工具在tools/ui\_gen/qt\_to\_xml目录下，使用方法：
+
+```
+Usage: ./tools/ui_gen/qt_to_xml/qt_to_xml in_filename out_filename
+   Ex: ./tools/ui_gen/qt_to_xml/qt_to_xml demo1.ui demo1.xml
+```
+
+## 三、将Qt的UI文件转成
+
+转换工具在tools/ui\_gen/rc\_to\_xml目录下，使用方法：
+
+```
+Usage: ./tools/ui_gen/rc_to_xml/rc_to_xml rcfile
+```
+> RC文件需要先转换成UTF-8编码。

tools/ui_gen/rc_to_xml/rc_to_xml.cc

@@ -136,7 +136,7 @@ void gen(const char* in) {
 
 int main(int argc, char* argv[]) {
   if(argc != 2) {
-    printf("Usage: %s in out\n", argv[0]);
+    printf("Usage: %s rcfile\n", argv[0]);
     exit(0);
   }