基于双重注意力的图像界面自动生成代码方法及装置

1.本技术属于代码生成技术领域，尤其涉及一种基于双重注意力的图像界面自动代码生成方法及装置。


背景技术：

2.图像界面自动代码生成是指无需开发人员的参与，利用代码生成方法将ui设计师绘制的图像界面自动转换为能够运行代码，也称图像界面逆向工程。传统方法主要通过启发式规则、机器学习目标检测算法提取特征推测gui组件层次结构、位置信息。但定义规则需要专家的启发式经验，人为干涉强，对未知问题的处理不够灵活。近年来深度学习在机器翻译、图像描述任务中的优先表现显示神经网络能够挖掘数据潜在特征，降低传统特征工程复杂度。在借鉴机器翻译的经验下，2017年tony beltramelli等人首次将深度学习技术应用到图像界面自动代码生成任务，创新性的以图像界面截图为卷积神经网络输入，结合递归循环神经网络得到gui源码的图像界面生成代码模型。作者提出的pix2code取得了令人印象深刻的结果，但仍然存在较高的误识别问题。为降低模型误差率，雷慧调整了pix2code模型中的cnn网络结构以保留组件位置和颜色，使用多层卷积层，增加步长以替代池化层。韩易在传统的编解码模型中加入了目标检测机制，使用目标检测器mask-rcnn识别获取目标图像，再利用cnn和双向长短时记忆网络(bi-lstm)对原始图像、目标图像和文本数据建模。随后，zhu等人提出一种基于注意机制的分层代码生成方法。作者使用一个块级长短时记忆网络编码dsl结合图像高层特征计算注意力分布，得到带有权值的视觉索引信息指导令牌级长短时记忆网络解码生成dsl序列。然而该方法存在潜在的缺点，块级的长短时记忆网络(lstm)可能会误预测块的数量，这导致该块的子代令牌自动跳过。xiongwen pang等人提出了两个神经网络模型hgui2code和sgui2code。sgui2code使用on-lstm替换lstm，实现按照语法规则生成代码。hguicode将注意力计算区域从多个元素转变为单个元素，但单个元素对图像特征的关注度平均，不能很好区分同一类型组件特点。
3.上述基于注意力机制的解决方法，注意力计算对输入图片的特征仍是平等处理的，导致解码器生成dsl序列任务因丢失大部分全局信息聚焦的区域也非常分散，表现不佳。另外，视觉特征专注于高维特征图，很少挖掘层间特征的相关性，未充分利用整个网络中的局部特征信息。


技术实现要素：

4.为了克服现有的不足，本技术针对上述的两个问题进行了改进，提出一种基于双重注意力的图像界面代码生自动生成方法及装置，联合了计算机视觉先进方法残差神经网络resnet50提取图像特征，减少因网络深度加深产生的梯度消失问题。提出了双重注意力模块，能够很好的建立局部dsl与图像特征关联性，增强网络学习能力，解决输入特征被平等处理而导致网络表征能力不足的问题。
5.为了实现上述目的，本技术技术方案如下：
6.一种基于双重注意力的图像界面自动生成代码方法，包括：
7.对含有gui图像界面与对应dsl文件的数据集进行预处理，获得训练集，训练集中每个训练样本包括与gui图像界面对应的图像界面张量，以及与dsl文件对应的dsl向量；
8.构建并训练图像界面dsl序列预测模型，所述图像界面dsl序列预测模型包括注意力层、特征提取器、双重注意力模块、生成层和分类层，将所述dsl向量输入到注意力层提取出上下文向量，将所述图像界面张量输入到所述特征提取器提取出多尺度特征图，所述多尺度特征图与上下文向量输入到双重注意力模块，提取出双重注意力特征，所述双重注意力特征与上下文向量输入到生成层生成分类分数张量，所述分类分数张量经过分类器输出dsl序列；
9.采用训练好的图像界面dsl序列预测模型对输入的待处理图像界面进行预测，预测出对应的dsl序列，经编译器编译得到对应平台代码。
10.进一步的，所述特征提取器基于resnet50，去除了resnet50最后一个卷积层以及之后的平均池化层和全连接层，最后接一个1
×
1卷积层。
11.进一步的，所述多尺度特征图与上下文向量输入到双重注意力模块，提取出双重注意力特征，包括：
12.将多尺度特征图变换为空间特征图，然后经过卷积操作后与上下文向量经过softmax函数生成空间权重向量，将所述空间权重向量与空间特征图相乘得到空间注意力特征；
13.将多尺度特征图变换为通道特征图，然后经过卷积操作后与上下文向量经过softmax函数生成通道权重向量，将所述通道权重向量与通道特征图相乘得到通道注意力特征；
14.将所述空间注意力特征与通道注意力特征逐项求和得到双重注意力特征。
15.进一步的，所述训练图像界面dsl序列预测模型，所采用的损失函数为交叉熵损失函数。
16.进一步的，所述注意力层和生成层分别为单层长短期记忆网络。
17.本技术还提出了一种基于双重注意力的图像界面自动生成代码装置，包括处理器以及存储有若干计算机指令的存储器，所述计算机指令被处理器执行时实现所述基于双重注意力的图像界面自动生成代码方法的步骤。
18.本技术提出的一种基于双重注意力的图像界面自动生成代码方法及装置，使用特定领域编程语言(domain system language，简称dsl)描述gui，基于编码器-解码器框架，编码器使用计算机视觉先进方法残差神经网络resnet50提取图像特征，解码器由双层lstm组成，一层lstm为注意力层，生成上下文向量联合双重注意力模块，分别计算通道注意力和空间注意力，让网络对输入图片的特征多方面进行加权重处理。另一层lstm生成层结合注意力输出分类分数张量，模型输出的dsl序列最后经compiler编译特定平台源码。本技术提出的融合空间注意力机制和通道注意力双重注意力机制，能够在解码器学习dsl变量关系时，提供当前时间步对应gui组件空间位置，并按照计算的通道重要程度分配对关键图像特征图的有效关注，极大增强了网络学习能力、提高了图像界面生成代码的准确率。
附图说明
19.图1为本技术基于双重注意力的图像界面自动生成代码方法流程图；
20.图2为本技术图像界面dsl序列预测模型网络架构图；
21.图3为本技术双层lstm结构图；
22.图4为本技术双重注意力模块原理图。。
具体实施方式
23.为了使本技术的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本技术进行进一步详细说明。应当理解，此处描述的具体实施例仅用以解释本技术，并不用于限定本技术。
24.在一个实施例中，如图1所示，提供了一种基于双重注意力的图像界面自动生成代码方法，包括：
25.步骤s1、对含有gui图像界面与对应dsl文件的数据集进行预处理，获得训练集，训练集中每个训练样本包括与gui图像界面对应的图像界面张量，以及与dsl文件对应的dsl向量。
26.本技术数据集基于公开的综合数据集，该数据集包括web、andriod、ios三个平台，每个训练样本由高保真gui图像界面与对应使用dsl描述内容的dsl文件(domain system language)组成，其中dsl文件即采用dsl代码描述gui图像界面的dsl文件。将数据集划分训练集、验证集、测试集，划分比例为6：2：2。
27.对上述数据集进行预处理，获得训练样本集。其中，将图像界面(gui)裁剪为224
×
224分辨率大小，并标准化、均值化得到包含图像信息的图像界面张量i。对数据集中dsl文件进行单词分割处理，以单词名称作为键，升序且唯一整数值作为对应值的映射关系构建词汇表。最后，基于词汇表对每个dsl文件进行one-hot独热编码，得到包含dsl上下文信息的dsl向量x。
28.步骤s2、构建并训练图像界面dsl序列预测模型，所述图像界面dsl序列预测模型包括注意力层、特征提取器、双重注意力模块、生成层和分类层，将所述dsl向量输入到注意力层提取出上下文向量，将所述图像界面张量输入到所述特征提取器提取出多尺度特征图，所述多尺度特征图与上下文向量输入到双重注意力模块，提取出双重注意力特征，所述双重注意力特征与上下文向量输入到生成层生成分类分数张量，所述分类分数张量经过分类器输出dsl序列。
29.本技术图像界面dsl序列预测模型如图2所示，包括注意力层、特征提取器、双重注意力模块、生成层和分类层。
30.在训练时，训练样本包括图像界面张量i和dsl向量x，将所述dsl向量输入到注意力层提取出上下文向量，将所述图像界面张量输入到所述特征提取器提取出多尺度特征图，所述多尺度特征图与上下文向量输入到双重注意力模块，提取出双重注意力特征，所述双重注意力特征与上下文向量输入到生成层生成分类分数张量，所述分类分数张量经过分类器输出dsl序列。
31.本实施例使用resnet50作为特征提取器，出于本技术实际需要，舍去resnet50网络最后三层，而后接一个1
×
1卷积层，将resnet50得到原输出特征图通道数降为c/8，能够
让后续计算通道注意力时通道特征与空间特征保持平衡。resnet50网络由5个卷积层组成，本技术选择resnet50作为基本骨架，去除resnet50网络第5个卷积层以及之后的平均池化层以及全连接层。
32.输入图像界面张量i至修改后resnet50特征提取器，提取图像特征图得到多尺度特征图其中b是批量尺寸batch size，c是通道数channel size，h是隐藏层大小hidden size。
33.输入dsl向量x至注意力层提取上下文向量如图3所示，公式如下所示：
[0034][0035]
需要说明的是，注意力层具体是lstm网络，层数为1，输入尺寸大小为256，隐藏层大小256，丢弃率为10％。lstm是一种特殊rnn已经是比较成熟的技术，这里不再赘述。
[0036]
本实施例双重注意力模块如图4所示，所述多尺度特征图与上下文向量输入到双重注意力模块，提取出双重注意力特征，包括：
[0037]
将多尺度特征图变换为空间特征图，然后经过卷积操作后与上下文向量经过softmax函数生成空间权重向量，将所述空间权重向量与空间特征图相乘得到空间注意力特征；
[0038]
将多尺度特征图变换为通道特征图，然后经过卷积操作后与上下文向量经过softmax函数生成通道权重向量，将所述通道权重向量与通道特征图相乘得到通道注意力特征；
[0039]
将所述空间注意力特征与通道注意力特征逐项求和得到双重注意力特征。
[0040]
如图2模型总体架构所示，多尺度特征图f直接得到通道特征图fc，f经函数fa变换得到空间特征图fs。其中，fa函数将f上的每个点看成是长度为通道数c的特征向量，使用1
×
1的卷积压缩f得到fs。
[0041]
如图4双重注意力模块原理示意图所示，双重注意力模块包括通道注意力分支与空间注意力分支。通道注意力分支：fc作为keyc、fc作为valuec，作为query。空间注意力分支：fs作为keys、fs作为values，作为query。
[0042]
空间注意力分支由于图像界面中各个组件之间有着依赖性，而空间注意力能很好的处理多层次的依赖。首先，keys经1
×
1卷积后与query向量逐项相加得到特征在空间位置上的相似度，该相似度经过softmax层得到通道维度上带权特征图map
′
，map
′
与values相乘得到带有空间位置信息的特征图其中b是批量尺寸batch size，f是指多尺度特征图f个数，t是时间步长。如下公式所示：
[0043][0044]
通道注意力分支，对于特征提取网络中卷积操作只是在一个局部的空间进行操作，无法有效提取通道间的关系。因此本技术将一个通道的特征编码成一个向量，将每个通道赋予一个权重，信息丰富的通道赋予高权重增强信息表达，信息匮乏的通道赋予低权重。首先，keyc经1
×
1卷积后与query向量逐项相加得到通道与通道之间的相似度，该相似度经过softmax层得到通道维度上带权特征图map。最后，map与query逐项相乘输出带有通道信
息的特征图其中b是批量尺寸batch size，f是指多尺度特征图f个数，t是时间步长。如下公式所示：
[0045][0046]
双重注意力模块输出为两个分支输出逐项求和后的att
out
：
[0047]
att
out
＝c
out
+s
out
。
[0048]
本实施例生成层如图3所示，生成层也是采用的长短期记忆网络lstm，与注意力层构成双层lstm。所述双重注意力特征与上下文向量输入到生成层生成分类分数张量。
[0049]
生成层将与att
out
逐项相加作为生成层初始时间步的输入，初始细胞态置0。当前时间步的输出会作为下一个时间步的输入，这是一个递归的过程。每个序列以《start》开始，直到生成终止符《end》结束循环停止。如图3所示，生成层的输出为分类分数张量
[0050]
最后利用生成层的分类分数张量预测每一时间步生成的单词(dsl token)。根据条件概率公式计算时间步t生成的单词概率，取概率最大的单词作为当前时刻的输出。条件概率分布如下式：
[0051][0052]
其中，w
1:t-1
表示已经生成的单词(w1,w2,...,wt-1)，wd和b均为待训练参数。
[0053]
本技术在训练模型时，通过最小化交叉熵损失函数训练网络，交叉熵损失函数能够表示模型预测的单词构成的dsl序列和真实dsl序列之间的差异，差异越小交叉熵就越小。在本技术中，将每一个单词的预测过程看做是预测该单词在词汇表中的概率分布。
[0054]
所述交叉熵损失函数如下式：
[0055][0056]
其中，θ表示网络中待学习参数，表示真实标注的dsl描述中第t个单词，表示真实dsl标注的描述中的第1至t个单词，t表示真实标注的dsl描述的单词数量。表示生成层softmax函数输出的第t个单词的概率分布中，与真实标注的第t个单词得到的置信度。
[0057]
在计算出损失后，对模型参数进行优化，最后保存预训练模型命名dualguicode，保存模型通过训练最小化损失函数得到模型参数。
[0058]
步骤s3、采用训练好的图像界面dsl序列预测模型对输入的待处理图像界面进行预测，预测出对应的dsl序列，经编译器编译得到对应平台代码。
[0059]
本技术数据集基于pix2xode公开的综合数据集，该数据集包括web、andriod、ios三个子数据集。因此，使用ios、android、web平台子数据集基于训练好的模型dualguicode推理任意一张输入gui得到模型预测dsl序列，经编译器compiler编译dsl序列得到对应平台代码。
[0060]
本技术在公开数据集上进行广泛的实验来评估双重注意力，结果表明，在web数据集上，dualguicode的代码生成准确率比基准方法pix2code提高了4.82％，而至于ios和
android数据集比基准方法pix2code分别提高了20.77％和28.82％，实验证明本技术能够生成高质量的gui源码，达到工程要求。
[0061]
在一个实施例中，本技术还提供了一种基于双重注意力的图像界面自动生成代码装置，包括处理器以及存储有若干计算机指令的存储器，所述计算机指令被处理器执行时实现所述基于双重注意力的图像界面自动生成代码方法的步骤。
[0062]
关于基于双重注意力的图像界面自动生成代码装置的具体限定可以参见上文中对于基于双重注意力的图像界面自动生成代码方法的限定，在此不再赘述。上述基于双重注意力的图像界面自动生成代码装置可全部或部分通过软件、硬件及其组合来实现。可以硬件形式内嵌于或独立于计算机设备中的处理器中，也可以以软件形式存储于计算机设备中的存储器中，以便于处理器调用执行以上对应的操作。
[0063]
存储器和处理器之间直接或间接地电性连接，以实现数据的传输或交互。例如，这些元件互相之间可以通过一条或多条通讯总线或信号线实现电性连接。存储器中存储有可在处理器上运行的计算机程序，所述处理器通过运行存储在存储器内的计算机程序，从而实现本发明实施例中的网络拓扑布局方法。
[0064]
其中，所述存储器可以是，但不限于，随机存取存储器(random access memory，ram)，只读存储器(read only memory，rom)，可编程只读存储器(programmable read-only memory，prom)，可擦除只读存储器(erasable programmable read-only memory，eprom)，电可擦除只读存储器(electric erasable programmable read-only memory，eeprom)等。其中，存储器用于存储程序，所述处理器在接收到执行指令后，执行所述程序。
[0065]
所述处理器可能是一种集成电路芯片，具有数据的处理能力。上述的处理器可以是通用处理器，包括中央处理器(central processing unit，cpu)、网络处理器(network processor，np)等。可以实现或者执行本发明实施例中公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。
[0066]
以上所述实施例仅表达了本技术的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本技术构思的前提下，还可以做出若干变形和改进，这些都属于本技术的保护范围。因此，本技术专利的保护范围应以所附权利要求为准。