黑暗模式
1. 简介
AWTK 中内置了丰富的基础控件(比如 button、label、edit等)和扩展控件(gif、gauge、rich_text等),开发者通过组合这些控件可以快速构建复杂的 GUI 界面,但当 AWTK 内置的这些控件无法满足更复杂的应用场景时,我们还可以通过开发自定义控件来实现这些功能。
AWTK 提供了非常便利的实现框架,只需定义好控件的结构类型并编写几个重载函数即可。本文将介绍 AWTK 自定义控件的规范,以及通过 AWTK Designer(下面简称Designer)创建、导入并使用的自定义控件的步骤,帮助用户深入了解并开发属于自己的自定义控件。
AWTK Designer 是专门用来制作 AWTK 应用程序 UI 界面的实用工具,只要通过拖拽和点击就可以完成复杂的界面设计。
1.1 自定义控件的目录结构
本文主要以显示数值的文本控件 number_label 为例,该控件可以在 Designer 中直接安装,如下图所示,也可以前往 JihuLab 下载,比如此处下载 awtk-widget-number-label。
下载完成后,可以打包资源并编译示例程序,查看自定义控件的示例效果,具体步骤可以参考控件目录下的 README.md 文档,自定义控件目录结构如下表所示:
目录/文件夹 | 说明 | 备注 |
---|---|---|
bin | 存放动态库和可执行文件 | 编译后生成 |
demos | 存放示例程序的源代码 | |
design | 存放示例程序的原始资源,可在 Designer 上编辑 | |
docs | 存放相关说明文档 | |
idl | 存放生成的 IDL 文件 | |
lib | 存放静态库动态库 | 编译后生成 |
res | 存放示例程序运行时需要的资源 | 打包资源后生成 |
scripts | 存放打包资源的脚本 | |
src | 存放自定义控件的源代码 | |
tests | 存放单元测试源代码 | |
LICENSE | 许可证 | |
project.json | 项目描述文件,包含项目设置等信息 | |
README.md | 说明文档 | |
SConstruct | SCons编译脚本 |
1.2 自定义控件的描述文件
在上一小节介绍的自定义控件目录中,project.json 文件包含了控件的基本描述信息,详见下表:
参数 | 说明 |
---|---|
name | 控件的类型名,全小写英文字母,单词之间用下划线连接 |
version | 版本号 |
date | 创建日期 |
team | 开发团队名称 |
author | 作者联系方式 |
desc | 控件的功能描述 |
copyright | 版权声明 |
以上信息均可在 Designer 创建自定义控件时填写,例如,awtk-widget-number-label/project.json 文件中包含的信息如下:
json
{
"name": "number_label",
"version": "1.0.0",
"date": "2020-05-31",
"team": "AWTK Develop Team",
"author": "Li XianJing <xianjimli@hotmail.com>",
"desc": "用于显示数值的文本控件。",
"copyright": "Guangzhou ZHIYUAN Electronics Co.,Ltd.",
......
}