火山PC从零开始学炫彩UI 第五课
火山PC从零开始学炫彩UI 第五课
作者：灰羊羊
一、本文学习内容
上一课，我们通过在界面设计器中设置界面来制作出了一个好看的界面，
本文学习怎么把设计器设计的文件放到火山里面来。
二、界面设计UI流程
首先我们打开上节课的设计器项目
上节课我们把布局做好了，并没有给组件取名字，如果想要给加载给火山用，我们就需要给组件取个名字。我们选中一个按钮。看右边它有三个属性，一个是uid，另一个是ID和名称（name）。这三个属性都是用来区分组件的
我们随便选择用一个属性就好了，这里我们用名称，比如说我现在选中的这个按钮，我给他取名叫 按钮_用户中心。
我现选中的第二个按钮，我给他的ID设为22。
我现在选中的第三个按钮，我给他的ID设置为33。
最后一个退出按钮，我给他的名称设置为 按钮_退出。上面三个按钮，分别用不同的属性方式来设置，下面再给这四个按钮设置好之后，我们来打包文件。
记得打包之前要先点保存文件，保存之后。在工具里面点这个打包图标。在弹出的对话框选择您的保存位置
![G) （ 文 视 图 调 试 工 具 帮 助 项 目 视 图 一 火 山 零 基 诎 玄 彩 课 程 些 课 炫 彩 素 材 n13 》 n 到 —O 0 已 远 块 •-@windowUl [ 0 ] „@buttonUl [ 22 ] 起 始 页 用 F 中 心 会 员 权 益 @ 定 位 功 能 应 用 中 心 0](https://www.lkuaiy.com/image/editor/1644324864801546.png)
保存完毕之后我们可以打开保存的zip压缩包看一下里面的结构，我们的素材以及窗口的文件都在这里面
我们新建一个火山项目，新建项目的流程我就不多说了，在第一节课上说的很详细。照样子，我们建一个第四课的项目。老规矩先把最基础的模块加载上，写上初始化代码
![] ） 囗 卜 决 方 案 火 山 PC 炫 彩 零 基 础 课 程 第 四 课 气 包 名 属 性 名 属 性 值 备 注 火 山 彩 零 基 础 课 程 第 四 课 火 山 ． 程 序 0 模 块 聚 0 [ 视 窗 基 本 类 ] 聚 0 [ 炫 彩 界 面 支 持 库 ] 名 基 础 公 开 属 性 名 属 性 值 备 注 生 ma i n. V 2 启 动 类 窗 口 程 序 类 ． ． ／ 亞 钞 启 动 类 静 态 属 性 名 属 性 值 备 氵 启 动 方 法 3 返 回 值 型 ： 整 数 返 回 值 备 注 ： 并 坤 LO · 0 乛 / 0 · O 以 》 0 炫 彩 一 初 始 化 Q) 炫 彩 一 运 行 0 炫 彩 一 退 出 0 返 回 （ 丁 0 解 决 方 类 查 《 替](https://www.lkuaiy.com/image/editor/1644324864885853.png)
然后这个时候我们新建变量，类型为视窗文件资源，把我们打包的压缩包添加进来
新建一个变量窗口，类型为普通窗口。
下面我们开始加载设计文件，这里我们用到的是压缩包，并且把压缩包放在了视窗文件资源，所以说我们使用加载从内存ZIP
按照参数的提示输入。我们没有修改资源文件的名字，所以说名字是他默认的这个，在设计器里面可以看到全名。
![炫 彩 一 初 始 化 0 炫 彩 一 加 载 资 源 文 件 内 存 Z 》 P (Resource ， r e S 0 u r C e ． r e S 炫 彩 一 运 行 炫 彩 一 退 出 0 0 [ 静 态 方 法 ] 逻 辑 型 炫 彩 一 加 载 资 源 文 圣 所 处 类 ： 资 源 ； 所 处 包 ： xc. gu i ． ytx 炫 彩 一 加 载 资 源 文 件 内 在 Z 》 P XC LoadResourceZipMem 参 数 1 ： 数 据 资 源 ， 数 据 类 型 ： 视 窗 文 圣 内 存 块 指 针 参 数 2 ： 文 件 名 ， 数 据 类 型 ： 文 本 型 资 源 文 件 名 ， 如 ： 资 源 文 件 \ \ res 。 urce “ 参 数 3 ： 密 码 ， 数 椐 类 型 ： 文 本 型 ， 默 z i p 压 缩 包 密 码](https://www.lkuaiy.com/image/editor/1644324934914120.png)
到这里这个资源文件我们加载好了，下面我们来加载窗口。这里使用加载布局文件从内存zip，这里布局文件的名称。我们没有修改，就是main.xml。这个函数的返回值是变整数，这里返回的是窗口的句柄。所以直接把这个函数的返回值给窗口就可以了。
![炫 彩 一 加 载 布 局 文 件 内 存 Z 》 P (Resource ， ma in. xml [ 静 态 方 法 ] 变 整 数 炫 彩 一 加 载 布 局 文 件 内 存 z 》 P 〔 视 窗 文 件 资 源 数 据 资 源 ， 文 本 型 布 所 处 类 ： 资 源 ； 所 处 包 ： xc. gu i ． ytx 炫 彩 一 如 载 布 局 文 件 内 在 Z 》 P XC LoadLayoutZipMem 参 数 1 ： 数 据 资 源 ， 数 据 类 型 ： 视 窗 文 件 资 源 请 确 认 z i 0 文 件 正 确 ， 否 则 报 错 参 数 2 ： 布 局 文 件 名 ， 数 据 类 型 ： 文 本 型 布 局 文 件 名 ． 如 果 ： " 布 局 文 件 \ 划 a yout ． xm 》 " 参 数 3 ： z i p 密 码 ， 数 据 类 型 ： 文 本 型 ， 默 认 值 ： 空 对 象 《 z i 0 密 码 ． 参 数 4 ： 父 句 柄 ， 数 据 类 型 ： 变 整 数 ， 默 认 值 ： 0 父 对 象 句 柄 ， 窗 口 句 柄 或 引 元 素 句 柄 ． 参 数 5 ： 布 局 窗 口 ， 数 类 型 ： 整 数 ， 默 认 值 ： 0 附 如 到 指 定 窗 口](https://www.lkuaiy.com/image/editor/1644324935238291.png)
我们加载好窗口之后，就可以先调试一下了。这里我们需要让窗口调整一下布局。使用设计器布局的时候，都要让窗口自己调整一下布局，这里您可以理解为固定使用，然后让窗口显示。
调试运行的结果，这个窗口已经完美显示在屏幕上了。我们仅用几行代码就可以做一个好看的界面，这比直接用代码做界面要简洁不少。
下面我们要操作这几个按钮。首先要如下图创建几个按钮的变量
这里我们要用到一个函数。取对象，他可以把设计器组件的句柄取出来，这有好几种方法取。我们常用的就是前三种，一个是从ID，一个从名称，最后是从UID。函数返回值是组件的句柄，变整数。
我们在这里将函数的返回值赋给按钮的句柄，炫彩取对象从ID（），我们需要输入窗口的句柄。我们只有一个窗口，这个组件属于唯一的窗口。其他两种都需要输入一个参数就可以了。
最后我们获取到退出按钮的句柄之后，我们要给这个退出按钮赋予一个窗口关闭的属性。这和我们第三节课学习的是一样子的。
![按 钮 一 用 户 中 心 ． 句 柄 二 炫 彩 一 取 对 象 从 名 称 、 按 0 一 用 户 中 心 按 钮 一 会 员 仅 益 ． 句 柄 二 炫 彩 一 取 对 象 从 用 （ 窗 口 ． 句 柄 ， 22 〕 按 钮 一 定 位 功 能 ． 句 柄 二 炫 彩 一 取 对 象 从 山 D （ 33 冫 按 钮 一 退 出 ． 句 柄 二 炫 彩 一 取 对 象 从 名 称 的 按 钮 一 退 出 按 钮 一 退 出 ． 置 类 型 （ 按 钮 类 型 标 识 ． 窗 口 关 闭 冫 [ 静 态 方 法 ] 变 整 数 炫 彩 一 取 对 象 从 》 D 〔 整 数 窗 口 句 柄 ， 所 处 类 ： 炫 彩 全 局 ； 所 处 包 ： xc. gu i ． ytx 炫 彩 一 取 对 象 从 》 D XC_Get0bjectBy ID 参 数 1 ： 窗 口 句 柄 ， 数 据 类 型 ： 变 整 数 所 属 窗 口 句 柄 ， 如 果 不 属 于 任 何 窗 口 填 NULL. 参 数 2 ： n 》 D, 数 椐 类 型 ： 整 数 》 D 值 ． 整 数 n 》 D)](https://www.lkuaiy.com/image/editor/1644324935233291.png)
到这里我们使用火山加载布局文件的基本工作已经做完了。这里您发现了吗？我们设置了五个按钮。而获取对象呢，这只有四个。因为应用列表那个按钮我们并没有给它设置名称或者是ID，所以说无法将它从设计器里面获取出来。
下面我们给这三个按钮注册一下按钮点击事件
然后进入按钮的点击回调事件，点击闪电图标，选择按钮_点击
在这里面呢，我们用了一个新的函数，它叫做通知信息_窗口弹出。这里就相当于弹出一个气泡提示，他过一会儿会自动关掉，你也可以手动关掉
这里我们可以看到这些参数说明的非常详细，您按照自己的需求往里面填就可以了。
![39 42 43 44 和 果 （ 来 源 对 象 = 按 钮 一 用 户 中 心 冫 通 知 消 息 一 窗 口 弹 出 （ 窗 口 ． 句 柄 ， 位 置 标 识 ． 上 ， 和 果 （ 来 源 对 象 = 按 钮 一 会 员 仅 益 冫 L 通 知 消 息 一 窗 口 弹 出 （ 窗 口 ． 句 柄 ， 位 置 标 识 ． 上 ， 用 户 中 心 被 半 击 啦 我 是 一 个 通 知 会 员 权 益 被 单 击 啦 通 知 消 息 皮 肤 ． 成 功 冫 通 知 消 息 皮 肤 ． 成 功 〕 [ 静 态 方 法 ] 变 整 数 通 知 消 息 一 窗 口 弹 出 〔 变 整 数 窗 口 句 柄 ， 整 数 位 置 ， 文 本 型 标 题 ， 文 本 型 内 容 ， 整 数 图 标 = 0 ， 所 处 类 ： 炫 彩 全 局 ； 所 处 包 ： xc. gu i ． ytx 使 用 基 础 元 素 作 为 面 板 ， 弹 出 一 个 通 知 消 息 ， 返 回 面 板 句 柄 ， 通 过 此 句 柄 可 对 其 作 返 回 元 素 句 柄 参 数 1 ： 窗 口 句 柄 ， 数 据 类 型 ： 整 数 参 数 2 ： 位 置 ， 数 据 类 型 ： 整 数 整 数 四 亚 标 识 ． * * 参 数 3 ： 标 题 ， 数 据 类 型 ： 文 本 型 参 数 4 ： 内 容 ， 数 据 类 型 ： 文 本 型 版 ， 参 数 5 ： 图 标 ， 数 据 类 型 ： 变 整 数 ， 默 认 值 ： 0 ． 283E 参 数 6 ： 外 现 类 型 ， 数 椐 类 型 ： 整 数 ， 默 认 值 ： 通 知 消 息 皮 肤 ． 默 认 到 炫 通 知 消 息 皮 朕 ． * *](https://www.lkuaiy.com/image/editor/1644324959213476.png)
写好之后，下面我们来运行一下。
三、本文到此结束
2. 本站资源,除文章特别指明外,均限定付费者本人使用,禁止二次 转载 传播 分发!
3. 本站资源多为第三方用户投稿 定价由资源提供者设定 收益人为资源提供者大家下载资源前仔细甄别需求与其描述是否可达预期 除非较明显的与说明不符资源外的纠纷尽量与作者点对点直接解决
4. 资源提供者发布作品请提供作品详细说明 与 截图 源码作品若引用了 其它模块或依赖请诚实说明 明细与版本！以及依赖是否开源。尽量做到资源下载后 可以直接使用与运行
5. 本站资源会员享受折扣开一个吧只有这个才是站长能拿到手的
炫彩资源网 » 火山PC从零开始学炫彩UI 第五课
