重磅系列文章!UI2CODE智能生成代码——组件识别篇

  1. 云栖社区>
  2. 闲鱼技术>
  3. 博客>
  4. 正文

重磅系列文章!UI2CODE智能生成代码——组件识别篇

闲鱼技术 2019-05-14 14:29:49 浏览1222
展开阅读全文

作者:闲鱼技术-楚丰

1.背景

《UI2CODE——整体设计篇》中,我们介绍了UI2CODE工程的整体流程:

image.png

在组件识别这个环节,需要有一种处理布局信息的方法,来解析和计算控件间的布局关系(比如识别业务组件(BI组件)和查找重复布局),以此来提高最终代码的可用性。

在这篇文章,我们将介绍一种布局信息的结构化方法:“连线法”,以及一种布局间的计算和比较方法: “引导连线法”

首先来看我们需要解决的问题:

2.问题一:识别业务组件

目的:代码复用

业务组件是指某些特定的卡片,比如一个商品详情卡片,这些卡片会在不同页面出现,而这些卡片的代码一般是已经存在的。我们在拿到一张图片的时候,需要先识别出这些组件,这样这一区块就能复用已有的组件代码,而不会造成很多冗余的一次性代码。

article2.png

老解法:利用深度学习模型SSD做物体检测

如果把寻找业务组件这个问题看成从一张大

网友评论

登录后评论
0/500
评论
闲鱼技术
+ 关注
所属云栖号: 闲鱼技术