火山PC从零开始学炫彩UI  第五课

火山PC从零开始学炫彩UI  第五课

作者：灰羊羊

一、本文学习内容
    上一课，我们通过在界面设计器中设置界面来制作出了一个好看的界面，
    本文学习怎么把设计器设计的文件放到火山里面来。
    
二、界面设计UI流程
首先我们打开上节课的设计器项目
上节课我们把布局做好了，并没有给组件取名字，如果想要给加载给火山用，我们就需要给组件取个名字。我们选中一个按钮。看右边它有三个属性，一个是uid，另一个是ID和名称（name）。这三个属性都是用来区分组件的
我们随便选择用一个属性就好了，这里我们用名称，比如说我现在选中的这个按钮，我给他取名叫 按钮_用户中心。

我现选中的第二个按钮，我给他的ID设为22。

我现在选中的第三个按钮，我给他的ID设置为33。

最后一个退出按钮，我给他的名称设置为 按钮_退出。上面三个按钮，分别用不同的属性方式来设置，下面再给这四个按钮设置好之后，我们来打包文件。

记得打包之前要先点保存文件，保存之后。在工具里面点这个打包图标。在弹出的对话框选择您的保存位置

保存完毕之后我们可以打开保存的zip压缩包看一下里面的结构，我们的素材以及窗口的文件都在这里面

我们新建一个火山项目，新建项目的流程我就不多说了，在第一节课上说的很详细。照样子，我们建一个第四课的项目。老规矩先把最基础的模块加载上，写上初始化代码

然后这个时候我们新建变量，类型为视窗文件资源，把我们打包的压缩包添加进来

新建一个变量窗口，类型为普通窗口。

下面我们开始加载设计文件，这里我们用到的是压缩包，并且把压缩包放在了视窗文件资源，所以说我们使用加载从内存ZIP

按照参数的提示输入。我们没有修改资源文件的名字，所以说名字是他默认的这个，在设计器里面可以看到全名。

到这里这个资源文件我们加载好了，下面我们来加载窗口。这里使用加载布局文件从内存zip，这里布局文件的名称。我们没有修改，就是main.xml。这个函数的返回值是变整数，这里返回的是窗口的句柄。所以直接把这个函数的返回值给窗口就可以了。

我们加载好窗口之后，就可以先调试一下了。这里我们需要让窗口调整一下布局。使用设计器布局的时候，都要让窗口自己调整一下布局，这里您可以理解为固定使用，然后让窗口显示。

调试运行的结果，这个窗口已经完美显示在屏幕上了。我们仅用几行代码就可以做一个好看的界面，这比直接用代码做界面要简洁不少。

下面我们要操作这几个按钮。首先要如下图创建几个按钮的变量

这里我们要用到一个函数。取对象，他可以把设计器组件的句柄取出来，这有好几种方法取。我们常用的就是前三种，一个是从ID，一个从名称，最后是从UID。函数返回值是组件的句柄，变整数。

我们在这里将函数的返回值赋给按钮的句柄，炫彩取对象从ID（），我们需要输入窗口的句柄。我们只有一个窗口，这个组件属于唯一的窗口。其他两种都需要输入一个参数就可以了。
最后我们获取到退出按钮的句柄之后，我们要给这个退出按钮赋予一个窗口关闭的属性。这和我们第三节课学习的是一样子的。

到这里我们使用火山加载布局文件的基本工作已经做完了。这里您发现了吗？我们设置了五个按钮。而获取对象呢，这只有四个。因为应用列表那个按钮我们并没有给它设置名称或者是ID，所以说无法将它从设计器里面获取出来。

下面我们给这三个按钮注册一下按钮点击事件

然后进入按钮的点击回调事件，点击闪电图标，选择按钮_点击

在这里面呢，我们用了一个新的函数，它叫做通知信息_窗口弹出。这里就相当于弹出一个气泡提示，他过一会儿会自动关掉，你也可以手动关掉

这里我们可以看到这些参数说明的非常详细，您按照自己的需求往里面填就可以了。

写好之后，下面我们来运行一下。

三、本文到此结束