本文阐述 HybridOS Lite 的基本概念和编程方法。
HybridOS Lite 新特性
HybridOS Lite 的结构
用户操作与业务逻辑的分离：GUI 程序负责用户交互，业务数据的逻辑处理，由守护进程完成； 多进程：根据需求，将整个系统切分成若干个模块。每个模块均为一个可独立运行的应用程序。多进程的结构，保证了系统的可靠性； HiBus 总线：HybridOS Lite 是数据驱动的，所有数据通过 HiBus 总线进行传输。HiBus 总线数据使用 json 格式，具有跨平台性； CSS 调整布局：将 GUI 布局从可执行代码中分离出来，使用 CSS 进行布局 。这样同一个应用的不同实例，皆可通过调整 CSS 文件的方式，在不修改二进制代码的前提下得以实现。
HybridOS Lite 基本概念
屏幕的组成
屏幕分成四个区域，如下图：
Title Bar：显示每页的标题； Description Bar：显示每页的描述，以及时间； Page Area：显示不同的页。每页由一个或者多个应用程序组成； Indicator Bar：显示页选择器，当操作页选择器时，Page Area 显示选中的页。
页的构成与组织
HybridOS Lite 所有 GUI 应用，都展示在 Page Area 中。在一屏显示中，Page Area 中的内容，称为一页。根据用户需求，可以存在多个页，使得每个页展示有限的应用。应用在页中的位置，由 manifest.json 文件指定。
Page 1:
鼠标拖拽，进行页切换:
MiniGUI 的层（Layer）
z序和
z节点。当需要显示某层时，调用 SetTopmostLayer() 函数，将该层调整为最上层，在屏幕中显示；并将键盘、鼠标消息发送至该层。与此同时，其他层中的应用程序，依然在后台正常运行。
每一页对应了一个层； 每个层可以包含一个或多个应用程序，同时显示； 仅显示最上面的层（Topmost Layer)，其他层不显示。但是其他层的应用程序依然在运行； 键盘、鼠标消息，mginit 只发送给 Topmost Layer； mginit 负责进行层的切换以及切换效果。
MiniGUI 的合成器（Compositor）
HybridOS Lite 的编程思路与步骤
分析需求，将系统整体功能拆分成若干个单独的模块，完成系统级的功能解耦； 分析每个模块，将用户交互操作，与业务逻辑分离，完成 GUI 与数据的解耦； 确定每个模块的 GUI 部分与数据部分的 HiBus 通信协议，包括 HiBus
的事件与远程调用；确定各个模块间的 HiBus 通信协议，包括 HiBus 的事件与远程调用； 编写作用全局的 manifest.json 文件。明确屏幕布局，每页中应用程序的布局，明确各个模块之间通信的目的应用； 为每个模块的 GUI 部分编写布局用的 CSS 文件，及相关的用户数据文件。相同布局的模块可使用同一个 CSS 文件； 编写每个模块的 GUI 应用。HybridOS Lite 在应用层面的编码，与普通 MiniGUI 程序没有任何差别，只是多出了根据 CSS 文件的布局部分； 编写业务处理的守护进程。守护进程与各个其他部分之间，按照前面制定的 HiBus 协议进行通信； 如有需要，修改 mginit 中的合成器，达到页间切换的动态效果；
配置文件
在 HybridOS Lite 中，牵涉的配置文件主要有三个，每个文件与各个应用之间的关系如下：
manifest.json ───→ mginit：用户全局的屏幕布局，以及以应用程序为单位的页布局； 用户 CSS 文件 ───→ 用户程序：用于该程序各个 GUI 元素（Element）的布局； 用户配置文件 ───→ 用户程序：用于该程序的初始化及数据记录，与早期的 ini
文件功能相同；HiBus 协议 ───→ 包含 mginit 的全部程序（包含守护进程）。
manifest.json 文件
{
"defaultCSSFile":"default.css",
"direction": "horizental",
"tileBoxStyle": "display: inline-block; position: relative; left: 0%; top: 0%; width: 50%; height: 5%;",
"descriptionBoxStyle": "display: inline-block; position: relative; left: 0%; top: 0%; width: 50%; height: 5%;",
"pageBoxStyle": "display: inline-block; position: relative; left: 0%; top: 0%; width: 100%; height: 90%;",
"indicatorBoxStyle": "display: inline-block; position: relative; left: 0%; top: 0%; width: 100%; height: 5%;",
"page": [
{
"id": "1",
"title": {
"en": "page 1",
"zh_CN": "change configuration 1"
},
"windowLayoutStyles": null,
"runners": [
{
"name": "chgconfig",
"type": "exec",
"entry": "chgconfig -d chgconfig1.ini -c chgconfig1.css",
"runas": "window, default",
"class": "",
"dependencies": ["hibusd"],
"windowBoxStyles": "position: relative; left: 0%; top: 0%; width: 100%; height: 100%;"
}]
},
{
"id": "2",
"title": {
"en": "page 2",
"zh_CN": "svg example"
},
"windowLayoutStyles": null,
"runners": [
{
"name": "svgshow",
"type": "exec",
"entry": "svgshow -d svgshow1.ini -c svgshow1.css",
"runas": "window, default",
"class": "",
"dependencies": ["hibusd"],
"windowBoxStyles": "position: relative; left: 0%; top: 0%; width: 100%; height: 100%;"
}]
}
]
}
defaultCSSFile：HybridOS Lite 中有系统默认的 CSS 样式，用户可以根据自己的需求，编写一个自己的 CSS 文件，对默认样式进行覆盖；
direction：表明屏幕的方向，是横屏还是竖屏。这里表示屏幕是横屏； tileBoxStyle：Title Bar 的样式，这里表明其在屏幕左上方，宽度为屏幕 50% ，高度为屏幕 5%； descriptionBoxStyle：Description Bar 的样式，这里表明其在屏幕上方，仅跟 Title Bar，宽度为屏幕 50% ，高度为屏幕 5%； pageBoxStyle：Page Area 的样式，这里表明其在 Title Bar 下方，宽度为屏幕 100% ，高度为屏幕 90%； indicatorBoxStyle：Indicator Bar 的样式，这里表明其在 Page Area 下方，宽度为屏幕 100% ，高度为屏幕 5%； page：为一个 json 数组，每一个元素描述一页。这里表明一共有两页； name：在一个 manifest.json 文件中，每一个应用实例（不是每一个应用），都有自己唯一的名字。HiBus 利用这个名字，区分不同应用的实例，表示源地址和目的地址； entry：可执行程序的程序名，以及启动参数。启动参数由每个应用程序自行解析并实现。这里只是表明：应用程序名为 chgconfig，用户配置文件名为 chgconfig1.init，应用布局 CSS 文件名为 chgconfig1.css； windowBoxStyles：指定了该应用在 Page Area 中的位置。在这里，chgconfig 和 svgshow 占用了全部的 Page Area，也即全屏显示。
用户 CSS 文件
#caption
{
display:block;
position: relative;
left: 20%;
top: 20%;
width: 60%;
height: 10%;
font-size:30px;
}
#icon0
{
display:inline-block;
position: relative;
left: 38%;
top: 35%;
width: 8%;
height: 8%;
}
#icon1
{
display:inline-block;
position: relative;
left: 46%;
top: 35%;
width: 8%;
height: 8%;
}
由上面的 CSS 文件可知：
id 为 caption 的元素，左起窗口宽度的 20%，上起窗口高度的 20%，宽度为窗口宽度的 60%，高度为窗口高度的 10%，字体大小为 30 个像素点； id 为 icon1 的元素，宽度为窗口宽度的 8%，高度为窗口高度的 8%，左移窗口宽度的 38%，下移窗口高度的 35%； id 为 icon2 的元素，宽度为窗口宽度的 8%，高度为窗口高度的 8%，左移窗口宽度的 46%，下移窗口高度的 35%。
其他配置文件
HybridOS Lite 应用开发
由于对 manifest.json 文件的处理，全局的布局，应用程序的启动，都由 mginit 负责了。因此对于普通用户而言，只需要直接开发自己的应用程序即可。
MiniGUI程序开发，没有任何本质的不同。只是多了两个步骤，在这里进行说明。
应用程序的启动参数
-l layer_name：该参数为一字符串，必传，必须处理。每个应用都属于某层，所以必须调用 JoinLayer() 将该应用加入到某层。改参数即为层的名字； -b name：该参数为一字符串，必传，必须处理。该参数用于 HiBus 唯一标识某个应用的实例； -d config_file_name：该参数为一字符串，可选。该参数即是在 manifest.json 文件中 entry 中的 -d 部分，表明该应用使用的用户数据文件； -c css_file_name：该参数为一字符串，可选。该参数即是在 manifest.json 文件中 entry 中的 -c 部分，表明该应用使用的 CSS 文件； 其他参数：用户在 manifest.json 文件中 entry 中定义的其他参数，由应用程序自行解析处理。
应用程序的布局
调用 hilayout_css_create() 创建一个 HLCSS 对象； 调用 hilayout_element_node_create() 创建 dom 树根节点； 调用 hilayout_element_node_create() 创建各个元素节点； 调用 hilayout_element_node_set_xxx() 设置各个元素的 id、class、name，与用户 CSS 文件对应； 调用 hilayout_element_node_append_as_last_child() 为各个元素设置父子关系； 调用 hilayout_do_layout() 开始布局计算； 为各个元素调用 hilayout_element_node_get_used_box_value() 获得各个元素的位置； 如果元素用于显示文字，则调用 hilayout_element_node_get_used_text_value() 获得该元素显示文字的字体信息。
应用程序中的鼠标拖拽
附：商标声明
飛漫
FMSoft
合璧
HybridOS
HybridRun
MiniGUI
xGUI
miniStudio
文章转载自开源操作系统百家谈，如果涉嫌侵权，请发送邮件至：contact@modb.pro进行举报，并提供相关证据，一经查实，墨天轮将立刻删除相关内容。
