CN115291864B - 一种基于图神经网络的零碎图层检测方法及装置 - Google Patents
一种基于图神经网络的零碎图层检测方法及装置 Download PDFInfo
- Publication number
- CN115291864B CN115291864B CN202210766142.3A CN202210766142A CN115291864B CN 115291864 B CN115291864 B CN 115291864B CN 202210766142 A CN202210766142 A CN 202210766142A CN 115291864 B CN115291864 B CN 115291864B
- Authority
- CN
- China
- Prior art keywords
- layer
- layers
- fragmented
- feature vector
- neural network
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 37
- 238000013528 artificial neural network Methods 0.000 title claims abstract description 16
- 238000013461 design Methods 0.000 claims abstract description 46
- 239000013598 vector Substances 0.000 claims abstract description 37
- 238000001514 detection method Methods 0.000 claims abstract description 11
- 230000004927 fusion Effects 0.000 claims abstract description 10
- 238000003062 neural network model Methods 0.000 claims abstract description 9
- 238000013145 classification model Methods 0.000 claims abstract description 5
- 239000011159 matrix material Substances 0.000 claims description 32
- 230000000007 visual effect Effects 0.000 claims description 20
- 238000004590 computer program Methods 0.000 claims description 5
- 238000000605 extraction Methods 0.000 claims description 5
- 230000004913 activation Effects 0.000 claims description 4
- 238000004458 analytical method Methods 0.000 claims description 3
- 238000012545 processing Methods 0.000 abstract description 2
- 239000010410 layer Substances 0.000 description 181
- 238000011176 pooling Methods 0.000 description 6
- 238000011161 development Methods 0.000 description 5
- 238000013527 convolutional neural network Methods 0.000 description 4
- 238000012938 design process Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 3
- 238000012935 Averaging Methods 0.000 description 2
- 238000010801 machine learning Methods 0.000 description 2
- 238000012423 maintenance Methods 0.000 description 2
- 238000013507 mapping Methods 0.000 description 2
- 238000011160 research Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000004364 calculation method Methods 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 230000001419 dependent effect Effects 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 238000010587 phase diagram Methods 0.000 description 1
- 238000003672 processing method Methods 0.000 description 1
- 238000012216 screening Methods 0.000 description 1
- 239000002356 single layer Substances 0.000 description 1
- 238000012549 training Methods 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/901—Indexing; Data structures therefor; Storage structures
- G06F16/9024—Graphs; Linked lists
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/901—Indexing; Data structures therefor; Storage structures
- G06F16/9027—Trees
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V10/00—Arrangements for image or video recognition or understanding
- G06V10/20—Image preprocessing
- G06V10/25—Determination of region of interest [ROI] or a volume of interest [VOI]
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V10/00—Arrangements for image or video recognition or understanding
- G06V10/40—Extraction of image or video features
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V10/00—Arrangements for image or video recognition or understanding
- G06V10/70—Arrangements for image or video recognition or understanding using pattern recognition or machine learning
- G06V10/762—Arrangements for image or video recognition or understanding using pattern recognition or machine learning using clustering, e.g. of similar faces in social networks
- G06V10/7635—Arrangements for image or video recognition or understanding using pattern recognition or machine learning using clustering, e.g. of similar faces in social networks based on graphs, e.g. graph cuts or spectral clustering
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V10/00—Arrangements for image or video recognition or understanding
- G06V10/70—Arrangements for image or video recognition or understanding using pattern recognition or machine learning
- G06V10/764—Arrangements for image or video recognition or understanding using pattern recognition or machine learning using classification, e.g. of video objects
- G06V10/765—Arrangements for image or video recognition or understanding using pattern recognition or machine learning using classification, e.g. of video objects using rules for classification or partitioning the feature space
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V10/00—Arrangements for image or video recognition or understanding
- G06V10/70—Arrangements for image or video recognition or understanding using pattern recognition or machine learning
- G06V10/77—Processing image or video features in feature spaces; using data integration or data reduction, e.g. principal component analysis [PCA] or independent component analysis [ICA] or self-organising maps [SOM]; Blind source separation
- G06V10/80—Fusion, i.e. combining data from various sources at the sensor level, preprocessing level, feature extraction level or classification level
- G06V10/806—Fusion, i.e. combining data from various sources at the sensor level, preprocessing level, feature extraction level or classification level of extracted features
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
- G06V10/00—Arrangements for image or video recognition or understanding
- G06V10/70—Arrangements for image or video recognition or understanding using pattern recognition or machine learning
- G06V10/82—Arrangements for image or video recognition or understanding using pattern recognition or machine learning using neural networks
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Software Systems (AREA)
- Databases & Information Systems (AREA)
- Multimedia (AREA)
- Computer Vision & Pattern Recognition (AREA)
- Evolutionary Computation (AREA)
- Computing Systems (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- General Engineering & Computer Science (AREA)
- General Health & Medical Sciences (AREA)
- Medical Informatics (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- Spectroscopy & Molecular Physics (AREA)
- Image Analysis (AREA)
Abstract
本发明公开了一种基于图神经网络的零碎图层检测方法，包括：步骤1、根据UI设计稿的图层信息，生成树状无向图和图层的初始特征向量；步骤2、将树状无向图与初始特征向量，输入至预构建的图神经网络模型中，获得图层的融合特征向量；步骤3、将融合特征向量与对应的图层，输入至多层感知机分类模型中，经过二分类处理，输出图层分类结果；步骤4、对分类获得的零碎图层集合进行聚类，并对聚类结果进行编组与合并，获得高质量的UI设计稿。本发明还公开了一种基于上述方法的零碎图层检测装置。本发明提供的方法通过将原UI设计稿中的零碎图层进行分类与聚类，从而获得高质量的UI设计稿。
Description
技术领域
本申请涉及UI设计领域，尤其涉及一种基于图神经网络的零碎图层检测方法及装置。
背景技术
用户图形界面(GUI)为软件应用和用户建立了沟通的桥梁。优秀的GUI设计使得软件应用更高效、更方便使用，对推广软件和吸引客户有着重要影响。然而软件的GUI开发需要大量的前端开发人员，而且复杂多变的UI布局和重复的UI视图开发极大降低了开发率，增加了开发成本。为了辅助前端开发人员进行前端开发，一些前人的研究工作使用机器学习的技术从UI图片智能生成前端代码，然而由机器学习模型基于UI图片生成的前端代码可用性和维护性较差，往往无法达到工业级标准。
现阶段有人提出了设计稿元信息与UI设计稿图片相结合的方法，保证生成代码的复用性。然而在实际UI设计过程，设计师只考虑UI的美观性，往往为了达到美观的视觉效果而忽略了设计规范，这会影响利用设计稿元信息生成前端代码的质量，但是要求设计师严格按照规范进行设计，则大大增加了设计师的工作成本。
近年来，如何让机器智能生成代码受到了学术界和工业界的广泛关注。相关的研究工作，比如sketch2json和pix2code，将UI图片作为输入自动生成前端代码，然而其质量与可用性通常无法符合工业使用标准。
如果设计稿中存在大量琐碎的图层，将直接导致最终生成代码不可复用。传统的图层合并方法是一种人工辅助与启发式规则结合的方法，这类方法过度依赖于设计师与开发者的主观判断，同时一个设计稿中往往存在着大量的零碎图层，对所有图层进行筛选与判断极大增加了设计稿检查的时间成本。
专利文献CN111914197A公开了一种图层数据处理方法、装置及存储介质，其中方法包括：从显示区域的多个初始图层中确定图层对；图层对包括所述多个初始图层中的任意两个初始图层；将图层对组合设置信度大于目标置信度的图层对确定为目标图层对，并将目标图层对中的两个初始图层进行组合，得到组合图层；将组合图层和剩余图层确定为初始图层，直至显示区域中不存在置信度大于目标置信度的图层对时，输出与组合图层相关联的组合图像；剩余图层为多个初始图层中除组合图层外的初始图层。该方法提出了一种提高图层组合效率和准确度的方法，但是文中并没有给出如何解决UI设计稿中零碎图层分类的方法。
学术文献Owl Eyes:Spotting UI Display Issues via Visual Understanding[C]//2020.该文献中的模型将检测任务分为有问题的图片及定位图片中的有问题区域。首先，它通过一个卷积神经网络进行二分类，找出存在显示问题的图片；其次，通过应用热力图分析方法，定位出图片中出现显示问题的区域。该模型能够检测出如文字重叠、图片无法显示等问题。该方案的输入为纯视觉信息，忽略了UI布局中非常重要的结构化信息，而在实际的设计场景中，设计师通常会参照一些布局结构进行设计。
发明内容
为了解决上述问题，本发明提供了一种基于图神经网络的零碎图层检测方法，通过该方法可以将原UI设计稿中的零碎图层进行整理编组与合并，从而获得高质量的UI设计稿。
一种基于图神经网络的零碎图层检测方法，包括：
步骤1、根据UI设计稿的图层信息，生成用于体现图层包含关系的树状无向图和图层的初始特征向量；
步骤2、将步骤1获得的树状无向图与初始特征向量，输入至预构建的图神经网络模型中，获得图层的融合特征向量；
步骤3、将步骤2获得的融合特征向量与对应的图层，输入至多层感知机分类模型中，经过二分类处理，输出图层分类结果，所述图层分类结果包括零碎图层集合和非零碎图层集合；
步骤4、对步骤3分类获得的零碎图层集合进行聚类，并对聚类结果进行编组与合并，获得高质量的UI设计稿。
本发明通过图神经网络模型将原UI设计稿中的图层信息与树状无向图进行融合，获得带有图层包含关系的融合特征向量，并根据融合特征向量对图层进行分类，获得零碎图层集合，最终对零碎图层集合进行聚类，完成各零碎图层之间的编组与合并，增强了各零碎图层之间的关联关系，从而获得高质量的UI设计稿。
具体的，所述编组包括建立Sketch文件包与修改Sketch文件包名称。
优选的，所述UI设计稿在获取图层信息之前，进行UI设计稿的预处理，包括缩放和裁剪，保证获取的各图层特征向量统一，方便后续的数据处理。
具体的，所述预处理的具体过程：首先将画板的宽和高调整为750的倍数，然后将画板切割成尺寸为750*750的切片。
具体的，所述步骤1中的图层信息包括图层的类型，尺寸以及位置信息。
优选的，所述步骤1中的树状无向图是根据预处理后的图层进行构建：一个尺寸为750*750的虚拟根节点会被创建，随后将图层一个个添加进这棵树中，每一次添加时判断图层与当前深度的每一个节点的包含关系，如果它被包含在某个节点中，它会继续和那个节点的子节点进行比较，直到它不被某个节点的子节点包含，它将成为那个节点的子节点。
优选的，所述步骤1中的初始特征向量是由图层信息构建的特征矩阵与视觉特征矩阵拼接而成，所述视觉特征矩阵是通过卷积网络与全连接层对UI设计稿图层进行特征提取获得，从而增加可识别分类的特征信息。
优选的，一种视觉特征矩阵的提取策略，首先将UI图片经过卷积网络提取特征图，然后根据每一个图层的位置与尺寸信息，在特征图对应位置取出对应大小的图层特征表达，然后利用RoI池化方法得到该图层固定大小的特征矩阵，最后利用一个全连接层得到该图层的视觉特征向量，其中，RoI池化的过程是将尺寸为H×W的特征矩阵划分为h×w个网格，然后每一个网格经过最大池化即取出最大值，得到固定h×w大小的特征矩阵，可以获得信息更加丰富的视觉特征矩阵。
优选的，一种视觉特征矩阵的提取策略，根据图层的尺寸和位置，通过CNN主干网络从UI图片中取出对应大小的图层图像，然后调整图层尺寸到固定大小，再经过全连接层得到特定维度的特征向量，可以提高视觉特征矩阵的获取速度，且方便后续特征矩阵的初始化。
优选的，所述图神经网络模型是在VGG16模型和GAT模型组合的基础上，引入了多头注意力机制进行构建，其中采用VGG16模型和GAT模型进行构建可以减少参数量和训练时间，从而降低系统的运算压力，同时通过引入多头注意力机制可以提高组合模型的学习能力与稳定性。
具体的，所述多头注意力机制的具体表达式如下：
式中，表示向量连接，/>表示初始特征向量的参数矩阵，i表示目标节点，j表示与目标节点相邻的节点，αij表示注意力系数，σ表示sigmoid激活函数，K表示多头注意力的数量，/>表示i的邻居节点集，/>表示节点j的特征向量，/>表示节点i的特征向量，通常下在模型的最后一层使用一个平均函数，当然先对K个注意力头部进行平均运算，再进行非线性激活，而在中间层通常使用简单的连接将K个注意力头部结果结合在一起。
具体的，所述步骤4的聚类是基于两个零碎图层之间的相似度距离与包含关系进行分析，将相似度距离大于阈值或/和存在包含关系的两个零碎图层合并到同一个编组中。
具体的，所述步骤4的具体过程：
步骤4.1、对零碎图层集合中所有零碎图层进行初始化，获得对应N*N的邻接矩阵；
步骤4.2、通过欧氏距离公式计算目标图层与相邻图层之间邻接矩阵的相似度，进行判断：
当相似度大于阈值时，将相邻图层合并到目标图层所在编组中；
当相似度小于阈值时，则不执行合并；
步骤4.3、将已合并的图层从未合并的图层集合中除去，更换目标图层重复步骤4.2，直至剩余零碎图之间的相似度均小于阈值；
步骤4.4、基于步骤4.3剩余零碎图层的包含关系进行聚类，根据树状无向图中的图层包含关系进行判断，若相邻图层位于目标图层的树状子节点中，则将相邻图层合并到目标图层所在编组中；
步骤4.5、将已合并的图层从未合并的图层集合中除去，更换目标图层重复步骤4.4，直至所有零碎图层被合并到相应的编组中，结束操作。
具体的，目标图层与相邻图层之间的距离计算：
(xi-xj)2+(yi-yj)2+(wi-wj)2+(hi-hj)2+∝HRCHY(i，j)
式中，x,y表示图层的中心点的2D坐标，w和h是图层的宽与高，HRCHY(i，j)表示图层i和图层j在设计稿中是否在同一个编组下，是则为1，否则为0。
具体的，所述包含关系判断的表达式如下：
若图层j与图层i同时满足上述不等式，则说明图层i包含图层j。
本发明还提供了一种零碎图层检测装置，包括计算机存储器、计算机处理器以及存储在所述计算机存储器中并可在所述计算机处理器上执行的计算机程序，所述计算机存储器中采用上述的基于图神经网络的零碎图层检测方法；所述计算机处理器执行所述计算机程序时实现以下步骤：输入待检测的UI设计稿，通过零碎图层检测方法对UI设计稿的图层进行分类与聚类，输出高质量的UI设计稿。
具体的，所述高质量的UI设计稿为UI设计稿对应的前端代码符合工业级标准，便于后续日常维护与更新，且通过所述前端代码生成的UI界面不会出现图文重叠的问题。
与现有技术相比，本发明的有益效果：
(1)为UI设计稿构建用于体现图层包含关系的树状无相图，从而增加了分类时可识别的特征信息。
(2)将树状无向图与图层的初始特征向量，通过图神经网络模型进行融合更新，获得带有包含关系的特征向量。
(3)对分类获得的零碎图层进行相似度距离与包含关系的判断，从而保证所有零碎图层都能进入相应的编组中。
(4)通过对UI设计稿的图层进行重新分类与聚类，使得对应的前端代码符合工业级标准，提高了UI设计稿的质量。
附图说明
图1为本发明提供的一种基于图神经网络的零碎图层检测方法的流程示意图；
图2为本实施例中提供的树状无向图的构建流程图；
图3为本实施例中提供的一种视觉特征矩阵的获取方法流程图；
图4为本实施例中提供的另一种视觉特征矩阵的获取方法流程图；
图5为本实施例中提供的一种零碎图层的聚类方法流程图；
图6为本实施例中提供的零碎图层检测装置的使用流程图。
具体实施方式
在实际UI设计过程中，设计师通常会使用零碎图层组成UI组件，他们通常只考虑UI设计过程中的美观性，往往为了较好的视觉效果通常会忽略设计规范，从而使得生成的前端代码质量不高，日常维护困难。
如图1所示，一种基于图神经网络的零碎图层检测方法，包括：
步骤1、导出Sketch软件中UI设计稿的画板，将每个画板进行缩放处理(高宽调整为750的倍数)，然后将画板切割成尺寸为750*750的图层；
如图2所示，构建树状无向图：构建750*750的虚拟根节点后，将处理后的图层一个个添加进这棵树中，每一次添加时判断图层与当前深度的每一个节点的包含关系，如果它被包含在某个节点中，它会继续和那个节点的子节点进行比较，直到它不被某个节点的子节点包含，它将成为那个节点的子节点；
生成图层的初始特征向量：根据每个图层的类型、尺寸、位置和视觉特征的多模态信息，对于图层的尺寸和位置信息，我们使用一个参数矩阵Wx将其编码成特征向量，而关于视觉特征则通过卷积网络与全连接层对UI设计稿图层进行特征提取获得，将两个特征进行拼接，通过one-hot向量表达图层的类型，并使用一个参数矩阵Wt将其嵌入到潜空间中。
如图3所示，一种视觉特征矩阵的获取方法流程图，首先图片吗刚刚CNN主干网络将UI图片经过卷积网络提取特征图，然后根据每一个图层的位置与尺寸信息，在特征图对应位置取出对应大小的图层特征表达，然后利用RoI池化方法得到该图层固定大小的特征矩阵，最后利用一个全连接层得到该图层的视觉特征向量。RoI池化的过程是将尺寸为H×W的特征矩阵划分为h×w个网格，然后每一个网格经过最大池化即取出最大值，得到固定h×w大小的特征矩阵，在我们方案中h和w取定为5。
如图4所示，一种视觉特征矩阵的获取方法流程图，根据图层的尺寸和位置，通过CNN主干网络直接从UI图片中取出对应大小的图层图像，然后调整图层尺寸到固定大小，再经过全连接层得到特定维度的特征向量；
步骤2、将步骤1获得的树状无向图与初始特征向量，输入至预构建的图神经网络模型中，获得图层的融合特征向量；
该图神经网络模型由VGG16模型和GAT模型组合构建，同时引入多头注意力机制：将参数矩阵的所有节点特征线性映射到嵌入空间，然后通过映射a:RF′×RF′→R来计算注意系数然后通过映射a:RF′×RF′→R来计算注意系数：
这个系数衡量着节点j对于i的重要性，其中a使用一个单层前馈神经网络，它的参数是
将树状无向图的特征融入到注意力机制中进行掩盖注意力，即只有与节点i相邻的节点会参与权重的计算，其他节点权重设为0。
将和节点i相邻节点的注意力系数进行softmax标准化，可以算得每一个相邻节点参与节点i状态更新的权重系数，这样节点i的状态更新公式可以表达成：
常下在模型的最后一层使用一个平均函数，当然先对K个注意力头部进行平均运算，再进行非线性激活，而在中间层通常使用简单的连接将K个注意力头部结果结合在一起。
步骤3、将步骤2获得的融合特征向量与对应的图层，输入至多层感知机分类模型中，经过二分类处理，输出图层分类结果，所述图层分类结果包括零碎图层集合和非零碎图层集合；
该多层感知机分类模型以GNN模型的MLP分类器为基础进行构建。
步骤4、如图5所示，对步骤3分类获得的零碎图层集合进行聚类，对聚类结果进行编组与合并，获得高质量的UI设计稿：
步骤4.1、对零碎图层集合中所有零碎图层进行初始化，获得对应N*N的邻接矩阵；
步骤4.2、通过欧氏距离公式计算目标图层与相邻图层之间邻接矩阵的相似度，进行判断：
(xi-xj)2+(yi-yj)2+(wi-wj)2+(hi-hj)2+∝HRCHY(i，j)
式中，x,y表示图层的中心点的2D坐标，w和h是图层的宽与高，HRCHY(i，j)表示图层i和图层j在设计稿中是否在同一个编组下，是则为1，否则为0；
当相似度大于阈值时，将相邻图层合并到目标图层所在编组中；
当相似度小于阈值时，则不执行合并；
步骤4.3、将已合并的图层从未合并的图层集合中除去，更换目标图层重复步骤4.2，直至剩余零碎图之间的相似度均小于阈值；
步骤4.4、基于步骤4.3剩余零碎图层的包含关系进行聚类，根据树状无向图中的图层包含关系进行判断:
若图层j与图层i同时满足上述不等式，则说明图层i包含图层j，并将相邻图层合并到目标图层所在编组中。
本实施例还提供了一种零碎图层检测装置，包括计算机存储器、计算机处理器以及存储在该计算机存储器中并可在该计算机处理器上执行的计算机程序，该计算机存储器中采用上述的基于图神经网络的零碎图层检测方法。
如图6所示，计算机处理器执行该计算机程序时实现以下步骤：输入待检测的UI设计稿，通过零碎图层检测方法对UI设计稿的图层进行分类与聚类，使得UI设计稿对应的前端代码符合工业级标准，便于后续日常的维护与更新；在Sketch软件中，则体现为相同语义的关联图层合并在一个编组底下，且生成的UI界面不会出现图文重叠的问题。
Claims (5)
1.一种基于图神经网络的零碎图层检测方法，其特征在于，包括：
步骤1、根据UI设计稿的图层信息，生成用于体现图层包含关系的树状无向图和图层的初始特征向量；
步骤2、将步骤1获得的树状无向图与初始特征向量，输入至预构建的图神经网络模型中，获得图层的融合特征向量，所述图神经网络模型是在VGG16模型和GAT模型基础上，引入了多头注意力机制进行构建，所述多头注意力机制的具体表达式如下：
式中，表示向量连接，/>表示初始特征向量的参数矩阵，i表示目标节点，j表示与目标节点相邻的节点，αij表示注意力系数，σ表示sigmoid激活函数，K表示多头注意力的数量，/>表示i的邻居节点集，/>表示节点j的特征向量，/>表示节点i的特征向量；
步骤3、将步骤2获得的融合特征向量与对应的图层，输入至多层感知机分类模型中，经过二分类处理，输出图层分类结果，所述图层分类结果包括零碎图层集合和非零碎图层集合；
步骤4、对步骤3分类获得的零碎图层集合进行聚类，所述聚类是基于两个零碎图层之间的相似度距离与包含关系进行分析，将相似度距离大于阈值或/和存在包含关系的两个零碎图层合并到同一个编组中，并对聚类结果进行编组与合并，获得高质量的UI设计稿，其具体过程：
步骤4.1、对零碎图层集合中所有零碎图层进行初始化，获得对应N*N的邻接矩阵；
步骤4.2、通过欧氏距离公式计算目标图层与相邻图层之间邻接矩阵的相似度，进行判断：
当相似度大于阈值时，将相邻图层合并到目标图层所在编组中；
当相似度小于阈值时，则不执行合并；
步骤4.3、将已合并的图层从未合并的图层集合中除去，更换目标图层重复步骤4.2，直至剩余零碎图之间的相似度均小于阈值；
步骤4.4、基于步骤4.3剩余零碎图层的包含关系进行聚类，根据树状无向图中的图层包含关系进行判断，若相邻图层位于目标图层的树状子节点中，则将相邻图层合并到目标图层所在编组中；
步骤4.5、将已合并的图层从未合并的图层集合中除去，更换目标图层重复步骤4.4，直至所有零碎图层被合并到相应的编组中，结束操作。
2.根据权利要求1所述的基于图神经网络的零碎图层检测方法，其特征在于，所述UI设计稿在获取图层信息之前，进行UI设计稿的预处理，包括缩放和裁剪。
3.根据权利要求1所述的基于图神经网络的零碎图层检测方法，其特征在于，所述步骤1中的图层信息包括图层的类型，尺寸以及位置信息。
4.根据权利要求1所述的基于图神经网络的零碎图层检测方法，其特征在于，所述步骤1中的初始特征向量是由图层信息构建的特征矩阵与视觉特征矩阵拼接而成，所述视觉特征矩阵是通过卷积网络与全连接层对UI设计稿图层进行特征提取获得。
5.一种零碎图层检测装置，包括计算机存储器、计算机处理器以及存储在所述计算机存储器中并可在所述计算机处理器上执行的计算机程序，其特征在于，所述计算机存储器中采用权利要求1-4任一项所述的基于图神经网络的零碎图层检测方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202210766142.3A CN115291864B (zh) | 2022-06-30 | 2022-06-30 | 一种基于图神经网络的零碎图层检测方法及装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202210766142.3A CN115291864B (zh) | 2022-06-30 | 2022-06-30 | 一种基于图神经网络的零碎图层检测方法及装置 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN115291864A CN115291864A (zh) | 2022-11-04 |
| CN115291864B true CN115291864B (zh) | 2024-03-29 |
Family
ID=83821931
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202210766142.3A Active CN115291864B (zh) | 2022-06-30 | 2022-06-30 | 一种基于图神经网络的零碎图层检测方法及装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN115291864B (zh) |
Families Citing this family (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117032875B (zh) * | 2023-10-09 | 2024-02-13 | 浙江大学 | 一种基于多模态图神经网络的关联零碎图层合并方法及装置 |
| CN117372572A (zh) * | 2023-10-09 | 2024-01-09 | 爬山虎科技股份有限公司 | 一种土壤图件自动化处理方法及系统 |
Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111177394A (zh) * | 2020-01-03 | 2020-05-19 | 浙江大学 | 基于句法注意力神经网络的知识图谱关系数据分类方法 |
| CN112541132A (zh) * | 2020-12-23 | 2021-03-23 | 北京交通大学 | 基于多视图知识表示的跨领域推荐方法 |
| CN113192086A (zh) * | 2021-05-11 | 2021-07-30 | 中国自然资源航空物探遥感中心 | 地质灾害隐患变形强度分布图的生成方法和存储介质 |
| CN113313173A (zh) * | 2021-06-01 | 2021-08-27 | 中山大学 | 基于图表示和改进Transformer的人体解析方法 |
| CN113902757A (zh) * | 2021-10-09 | 2022-01-07 | 天津大学 | 基于自注意力机制和卷积神经网络混合模型的血管分割方法 |
| WO2022073408A1 (en) * | 2020-10-08 | 2022-04-14 | Huawei Technologies Co., Ltd. | Multi-bandwidth separated feature extraction convolution layer for convolutional neural networks |
| CN114398479A (zh) * | 2021-11-13 | 2022-04-26 | 重庆邮电大学 | 基于时序交互图神经网络的文本分类方法、装置及介质 |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US10565433B2 (en) * | 2017-03-30 | 2020-02-18 | George Mason University | Age invariant face recognition using convolutional neural networks and set distances |
-
2022
- 2022-06-30 CN CN202210766142.3A patent/CN115291864B/zh active Active
Patent Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111177394A (zh) * | 2020-01-03 | 2020-05-19 | 浙江大学 | 基于句法注意力神经网络的知识图谱关系数据分类方法 |
| WO2022073408A1 (en) * | 2020-10-08 | 2022-04-14 | Huawei Technologies Co., Ltd. | Multi-bandwidth separated feature extraction convolution layer for convolutional neural networks |
| CN112541132A (zh) * | 2020-12-23 | 2021-03-23 | 北京交通大学 | 基于多视图知识表示的跨领域推荐方法 |
| CN113192086A (zh) * | 2021-05-11 | 2021-07-30 | 中国自然资源航空物探遥感中心 | 地质灾害隐患变形强度分布图的生成方法和存储介质 |
| CN113313173A (zh) * | 2021-06-01 | 2021-08-27 | 中山大学 | 基于图表示和改进Transformer的人体解析方法 |
| CN113902757A (zh) * | 2021-10-09 | 2022-01-07 | 天津大学 | 基于自注意力机制和卷积神经网络混合模型的血管分割方法 |
| CN114398479A (zh) * | 2021-11-13 | 2022-04-26 | 重庆邮电大学 | 基于时序交互图神经网络的文本分类方法、装置及介质 |
Non-Patent Citations (2)
| Title |
|---|
| SA-Net: Shuffle Attention for Deep Convolutional Neural Networks;Q. -L. Zhang 等;《ICASSP 2021 - 2021 IEEE International Conference on Acoustics, Speech and Signal Processing (ICASSP)》;20210513;2235-2239 * |
| 基于图注意力卷积神经网络的文档级关系抽取;吴婷 等;《中文信息学报》;20211125;第35卷(第10期);73-80 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN115291864A (zh) | 2022-11-04 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN115291864B (zh) | 一种基于图神经网络的零碎图层检测方法及装置 | |
| CN109859190B (zh) | 一种基于深度学习的目标区域检测方法 | |
| Qin et al. | Saliency detection via cellular automata | |
| JP5916886B2 (ja) | 画像特徴の類似性に基づく画像索引作成 | |
| CN111144242B (zh) | 一种三维目标检测方法、装置及终端 | |
| US9129191B2 (en) | Semantic object selection | |
| CN107683469A (zh) | 一种基于深度学习的产品分类方法及装置 | |
| CN108898145A (zh) | 一种结合深度学习的图像显著目标检测方法 | |
| KR102161052B1 (ko) | 영상에서 객체를 분리하는 방법 및 장치. | |
| US11915362B2 (en) | UV mapping on 3D objects with the use of artificial intelligence | |
| CN110569782A (zh) | 一种基于深度学习目标检测方法 | |
| Yang et al. | Ranking 3D feature correspondences via consistency voting | |
| CN110930297A (zh) | 人脸图像的风格迁移方法、装置、电子设备及存储介质 | |
| CN113902913A (zh) | 图片语义分割方法及装置 | |
| CN110046574A (zh) | 基于深度学习的安全帽佩戴识别方法及设备 | |
| KR102325347B1 (ko) | 머신러닝 기반 결함 분류 장치 및 방법 | |
| CN104008177B (zh) | 面向图像语义标注的规则库结构优化与生成方法及系统 | |
| CN113705579A (zh) | 一种视觉显著性驱动的图像自动标注方法 | |
| CN110363156A (zh) | 一种姿态无关的面部动作单元识别方法 | |
| JP2015036939A (ja) | 特徴抽出プログラム及び情報処理装置 | |
| Pei et al. | Salient instance segmentation via subitizing and clustering | |
| Li et al. | [Retracted] Deep‐Learning‐Based 3D Reconstruction: A Review and Applications | |
| CN117853611A (zh) | 经由深度感知对象移动来修改数字图像 | |
| CN110059742A (zh) | 基于深度学习的安全护具穿戴识别方法及设备 | |
| Hu et al. | A Dataset and Benchmark for 3D Scene Plausibility Assessment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |