5.3. ui
5.3.1. ui 模块介绍
杰理UI提供了电池电量，图片，文字，数字，时间，按钮，表格控件，垂直列表，水平列表，以及自定义控制等。每个模块都有自己的唯一ID号例如BaseForm_15。位置坐标，颜色等信息。
提供了ui_demo工程便于单独开发ui界面。
5.3.2. ui 介绍
首先找到发布工程中提供的UI工程：ui_project0.ui_templateui_320x240_test
双击“step1-打开UI绘图工具.bat” 就能打开杰理的UI工程。
“step2-打开 UI 资源生成工具.bat” 是将ui工程中的内容转换为文件存到 project/res内最终放在路径
cpu\wl82\tools\ui_res将文件下载进内存中“打开多国语言表格.bat” 是记录对应语言的对应字体以及内容
“打开图片资源文件夹.bat” 是保存工程中需要用要的一些图片等
Note
图片格式为PNG
打开 UI 示例工程后先浏览 UI 示例工程,最左边为布局， 旁边为控件列表中间为 UI 绘制 区域， 右边为 ui 工程预览区。
5.3.3. ui 绘制
点击新建页面。
点击控件列表中的图层，将中间区域填充满通过拉伸选择框的方式。
点击布局也建区域填充满，这个时候中间控件列表就能进行选择放置
具体应用 UI 如何绘制各个模块如何使用请产考发布工程中的 UI 工程
模块使用注意事项(第一次使用杰理 UI 请边阅读边浏览 ui_test示例工程)
所有控件均采用点击鼠标左键后不松手然后拖拽到对应 ui 绘制界面只有当绘制了图层然 后绘制好布局才能激活各个控件的使用
5.3.4. 电池电量
左键点击电池电量不放将鼠标放置在中间绘制区域松手。
观察中间唯一ID号最下面有个电池图标列表 可以自行选择电池图样
图片列表可以添加一个或者多个图片， 高亮图片也可以添加一个或者多个图片（ 一遍情 况都是采用在图片列表添加图片通过 UI 进行切换图片显示）
5.3.5. 文字控件
文字控件主要分为两种：
第一种表格文件文字这里要解释一下什么是表格文字就是显示“ 打开多国语言表 格.bat” 中的文字内容， 可以是任意语种。 其次还需要特别注意一点！ ！ ！ 编码格式为 strpic
第二种为字库文字， 这里需要自行选择对应的字库文件（ 字库文件有不同字体大 小之分） ， 还有对应语言字库之分具体请参考《各国语言代码页信息.pdf》 ， 文件字库代码对 应 fontinit.c 如需添加语种需要参考原有的添加即可。 其次还需要特别注意一点！ ！ ！ 编码格 式为 text
5.3.6. 时间控件
时间控件需要注意是否需要自动走时以及时间格式,一遍来说都是使用 RTC 走 时， 因此不需要配置自动走时， 还有就是注意时间格式年为 Y， 月为 M， 日为 D， 时分秒： hms 注意小写例如: 设置正常显示的时间就填写： h:m:s 即可。 设置的时间的数字图片， 没有设置 会从字库选取。
5.3.7. 数字控件
数字控件主要用来显示数字信息。 例如需要显示的一些变量数字。 4 位数字就是 %04d 依次类推。
5.3.8. 按键控件
通过该控件可以实现按键被按下的效果，即按下高亮，再次按下不亮。手机下拉菜单中的各种按钮类似。
5.3.9. 垂直列表和水平列表
需要注意滚动方式即可有 SCROLL 和 PAGE 模式两种使用默认 SCROLL 即可。 在绘制时候点击鼠标右键可以旋转调试宽度等。 表格控件下面每一个布局中可以复制 CSS 属性 即颜色等参数信息。 主要利于按键高亮显示（ 代码简单） ， 具体参考提供的示例工程中的例子
5.3.10. slider（ 滑块控件， 进度条控件）
该控件可以用于进度条显示， 剩余时间显示等场景。 该控件的进度小圆可以添 加背景图片。 WL80,82 常用控件如上。
5.3.11. 生成的资源文件说明
ascii.res和F_ASCII.PIX为ascii字库和索引 F_GB2112.PIX和F_GB2312.TAB为常用中文字库。 F_UNICODE.PIX为F_GB2312.TAB的补充. JL.sty, menu.res, str.res为生成的资源文件。 有关语言字库的库查看文档《字库使用说明》
5.3.12. 应用实例
示例演示：
example: 进入 apps/demo/demo_DevkitBoard/include/demo_config.h 中开启宏 USE_UI_TOUCH_DEMO 。