CN111552457A - 基于语句识别的前端开发页面构建方法、装置及存储介质 - Google Patents

Abstract

本发明提出一种基于语句识别的前端开发页面构建方法，该方法包括：根据基础组件建立组件库，并根据组件库建立预设模板界面；根据预设模板创建相应的调整术语，并根据调整术语建立调整术语集；构建语句识别模型，并根据调整术语集对语句识别模型进行模型训练；获取待识别语句，并根据语句识别模型对待识别语句进行识别，若待识别语句通过语句识别模型，则根据语句识别模型输出的目标调整术语对预设模板界面进行调整；获取调整后的预设模板界面的层级关系、组件类型以及组件基础属性，并根据层级关系以及组件类型建立用户所需的前端开发页面。本发明提供技术方案能够根据客户需求自动生成所需前端页面，并能够对该页面进行自动调整。

Description

基于语句识别的前端开发页面构建方法、装置及存储介质

技术领域

本发明涉及页面开发技术领域，尤其涉及一种基于语句识别的前端开发页面构建方法、系统、装置及存储介质。

背景技术

二十一世纪以来，互联网行业发展十分迅速，各种前端、后端、移动的开发技术不断发展，特别是前端开发技术，在近十年以来开始变得前所未有的火热，各种新鲜的框架的不断出现，前端、后端的关系也不再像互联网刚发展时那样，耦合程度高，难以区分界限；实际上，随着前后端的分离，前端结构的发展与普及，目前前端与后端的职责已经越来越清晰，其中，前端主要负责页面的绘制、展示与交互，而后端则主要负责业务处理与数据持久化。

对于前端Web开发而言，简单的说，就是前端只需要负责：一、页面元素的绘制；二、控制页面元素与用户的交互；三、通过接口向后端请求数据进行展示或者提交数据。而在这三者中，页面元素的绘制需要由开发人员通过编辑一行一行代码实现的。虽然这种方式相对简单，但却需要耗费编程人员大量的时间，这样一来，就导致了时间、人力成本相对较高。

针对这一问题，现有的解决方案是使用开发框架对前端页面进行半自动的元素导入，目前前端开发的主流开发框架，均是以“组件化”为基础，即“页面由若干组件构成、组件由基础组件或者基础组件构成的其他组件构成”，页面可以被视作组件的容器，负责组合组件形成功能完整的界面，组件具有独立性，可以被相同功能和接口的另一组件替换而不会整体影响功能。

然而，虽然这种半自动的元素导入方法在一定程度上提高了工作效率，有效地节省编程人员的时间，但是，在对每一次建立页面和以及调整页面的过程中，依然需要编程人员进行相应的代码编程才能实现组件的替换以及更改，不能完全实现前端页面的自动化构建。

因此，基于以上几个问题，亟需一种能够根据客户需求自动生成所需前端页面，并能够对该页面进行自动调整的方法。

发明内容

本发明提供一种基于语句识别的前端开发页面构建方法、系统、电子装置以及计算机存储介质，其主要目的在于解决现有的前端页面构建方法工作效率低、人力成本相对较高的问题。

为实现上述目的，本发明提供一种基于语句识别的前端开发页面构建方法，该方法包括如下步骤：

根据基础组件建立组件库，并根据所述组件库采用Flex布局建立预设模板界面；

根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立调整术语集；

构建语句识别模型，并根据所述调整术语集对所述语句识别模型进行模型训练；

根据所述语句识别模型对待识别语句进行识别，若所述待识别语句通过所述语句识别模型的识别，则根据所述语句识别模型输出的目标调整术语对所述预设模板界面进行调整；

获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据所述层级关系、所述组件类型以及各组件基础属性建立前端开发页面。

另外，本发明还提供一种基于语句识别的前端开发页面构建系统，所述前端开发页面构建系统包括：

预设模板界面构建单元，用于根据基础组件建立组件库，并根据所述组件库采用Flex布局建立预设模板界面；

调整术语集建立单元，用于根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立调整术语集；

模型构建及训练单元，用于构建语句识别模型，并根据所述调整术语集对所述语句识别模型进行模型训练；

模型应用单元，用于根据所述语句识别模型对待识别语句进行识别，若所述待识别语句通过所述语句识别模型的识别，则根据所述语句识别模型输出的目标调整术语对所述预设模板界面进行调整；

前端开发页面创建单元，用于获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据所述层级关系、所述组件类型以及各组件基础属性建立前端开发页面。

另外，为实现上述目的，本发明还提供一种电子装置，该电子装置包括：存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的基于语句识别的前端开发页面构建程序，所述基于语句识别的前端开发页面构建程序被所述处理器执行时实现如下步骤：

根据基础组件建立组件库，并根据所述组件库采用Flex布局建立预设模板界面；

根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立调整术语集；

构建语句识别模型，并根据所述调整术语集对所述语句识别模型进行模型训练；

根据所述语句识别模型对待识别语句进行识别，若所述待识别语句通过所述语句识别模型的识别，则根据所述语句识别模型输出的目标调整术语对所述预设模板界面进行调整；

获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据所述层级关系、所述组件类型以及各组件基础属性建立前端开发页面。

另外，为实现上述目的，本发明还提供一种计算机可读存储介质，所述计算机可读存储介质中存储有基于语句识别的前端开发页面构建程序，所述基于语句识别的前端开发页面构建程序被处理器执行时，实现如上述基于语句识别的前端开发页面构建方法的步骤。

本发明提出的基于语句识别的前端开发页面构建方法、系统、电子装置及计算机可读存储介质先通过Flex布局建立预设模板界面；再根据预设模板界面的内部组件属性调整规则的调整术语；然后根据调整术语建立语句识别模型；最后通过语句识别模型实现前端开发页面构建的自动化。语句识别精度高，显著提高前端页面构建的工作效率。

附图说明

图1为根据本发明实施例的基于语句识别的前端开发页面构建方法的较佳实施例流程图；

图2为根据本发明实施例的电子装置的较佳实施例结构示意图；

图3为根据本发明实施例的基于语句识别的前端开发页面构建程序的内部逻辑示意图。

本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

在下面的描述中，出于说明的目的，为了提供对一个或多个实施例的全面理解，阐述了许多具体细节。然而，很明显，也可以在没有这些具体细节的情况下实现这些实施例。

以下将结合附图对本申请的具体实施例进行详细描述。

实施例1

为了说明本发明提供的基于语句识别的前端开发页面构建方法，图1示出了根据本发明提供的基于语句识别的前端开发页面构建方法的流程。

如图1所示，本发明提供的基于语句识别的前端开发页面构建方法，包括：

S110：根据基础组件建立组件库，并根据组件库采用Flex布局建立预设模板界面。

其中，基础组件为常用的能够实现基础功能的组件，例如，按钮、图片、输入框、卡片、文字链接等等。

此外，为提高预设界面的创建效率，该组件库还可以包括一些常用的组合组件，该组合组件均是由基础组件常规组合而成，例如，用于用户登录的组合组件，该组合组件可以包括：用户名输入框、密码输入框、登陆按钮、注册按钮等等；再例如，用于用户进行搜索的组合组件，该组合组件可以包括：搜索输入框、搜索按钮等等。

另外，为便于后期组件库使用，还可以对基础组件和组合组件进行标注，例如图片，可以标注为C1；卡片，可以标注为C2；用户登录的组合组件，可以标注为A1；然后根据标注将基础组件和组合组件保存至预设第一数据库以形成组件库，通过标注的方式便于后期迅速的从组件库中获取到相应的组件。

需要说明的是，Flex布局是一种目前主流的页面布局方式，亦称Flex Box布局或者“弹性布局”，是目前的主流的一种布局方式，采用Flex布局的元素，称为Flex容器(flexcontainer)，简称"容器"。它的所有子元素自动成为容器成员，称为Flex项目(flex item)，简称"项目"。Flex布局针对容器和项目预先定义了有限个数的属性，通过给容器和项目指定不同的属性可以达到对页面进行布局的目的。与传统的布局方案相比，它能很好的完成一些特殊的布局要求，例如，垂直居中、水平居中的布局要求，传统布局方案则很难达到这些要求。

具体地，为便于理解采用Flex布局建立预设模板界面的过程，下面对Flex布局进行详细地介绍。在Flex布局中，容器默认存在两根轴：水平的主轴(main axis)和垂直的交叉轴(cross axis)。主轴的开始位置(与边框的交叉点)叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end，项目默认沿主轴排列。单个项目占据的主轴空间叫做main size，占据的交叉轴空间叫做cross size。

在在Flex布局中，容器存在6个属性，flex-direction属性决定主轴的方向(即项目的排列方向)，row(默认值)：主轴为水平方向，起点在左端，row-reverse：主轴为水平方向，起点在右端，column：主轴为垂直方向，起点在上沿，column-reverse：主轴为垂直方向，起点在下沿。

flex-wrap属性，默认情况下，项目都排在一条线(又称"轴线")上。flex-wrap属性定义，如果一条轴线排不下，如何换行。它可能取三个值，(1)nowrap(默认)：不换行。(2)wrap：换行，第一行在上方。(3)wrap-reverse：换行，第一行在下方。

flex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认值为row nowrap。

justify-content属性，justify-content属性定义了项目在主轴上的对齐方式。它可能取5个值，具体对齐方式与轴的方向有关。下面假设主轴为从左到右。flex-start(默认值)：左对齐，flex-end：右对齐，center：居中，space-between：两端对齐，项目之间的间隔都相等。space-around：每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍。

align-items属性，align-items属性定义项目在交叉轴上如何对齐。它可能取5个值，具体的对齐方式与交叉轴的方向有关，下面假设交叉轴从上到下。flex-start：交叉轴的起点对齐。flex-end：交叉轴的终点对齐。center：交叉轴的中点对齐。baseline:项目的第一行文字的基线对齐。stretch(默认值)：如果项目未设置高度或设为auto，将占满整个容器的高度。

align-content属性，属性定义了多根轴线的对齐方式。如果项目只有一根轴线，该属性不起作用。该属性可能取6个值。flex-start：与交叉轴的起点对齐。flex-end：与交叉轴的终点对齐。center：与交叉轴的中点对齐。space-between：与交叉轴两端对齐，轴线之间的间隔平均分布。space-around：每根轴线两侧的间隔都相等。所以，轴线之间的间隔比轴线与边框的间隔大一倍。stretch(默认值)：轴线占满整个交叉轴。

此外，关于项目(即基础组件)也具有6个属性，即，order，flex-grow，flex-shrink，flex-basis，flex，align-self，每个属性也对应的默认值。

通过上述对于Flex布局中容器属性以及项目属性的介绍可知，根据组件库采用Flex布局建立预设模板界面的过程包括：首先根据标注自组件库中获取所需的基础组件以及组合组件；然后将获取的组件依次输入至预设的flex布局内，其中，各组件的属性均为默认值；最后，根据需求更改相应组件的属性，即可初步建立预设模板界面。此外，后期只需根据需求改变相应容器以及项目的属性即可实现对预设模板界面的调整。

S120：根据预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据调整术语建立调整术语集。

其中，预设模板界面的内部组件属性调整规则为实际应用中对各组件进行位置调整、内部关系调整、布局属性调整以及基础属性设置的规则，可以根据这些调整规则建立相应的调整术语；例如：

描述组件包含关系的调整术语“往A中添加B”，其中A为预设界面内可作为容器的基础组件，B为组件库中任意的基础组件。通过执行该术语可以将B添加为容器A的最后一个项目。

描述组件相邻关系的调整术语“将C移动到D前边/后边。其中，C、D为预设界面中任意已经为相邻关系的组件，通过执行该术语可以改变C、D两个组件的前后顺序。

描述更改组件Flex布局属性的调整术语“AA组件的XX属性设置为YY值”，如：E的flex-direction设置为column(其中，A为预设界面中的容器组件，flex-direction为Flex容器的一个属性，column为flex-direction属性的一个可选值)。

描述组件基础属性设定的调整术语“BB组件的xx基础属性设置为yy值”,该调整术语用于针对颜色、长宽、内边距、外边距等基础属性进行设定，例如：E的宽度设置为20px(其中，E为预设界面内的任意组件，宽度为组件的基础属性，px为前端通用的长度单位)。

在根据预设模板界面的内部组件属性调整规则建立所有的调整术语之后，将所有的调整术语保存到预设的第二数据库内以建立调整术语集。

具体地，预设模板界面的内部组件属性调整规则包括位置调整规则、内部关系调整规则、布局属性调整规则以及基础属性调整规则，可以根据预设模板界面的内部组件属性调整规则创建相应的位置调整术语、内部关系调整术语、布局属性调整术语以及基础属性调整术语，然后根据各调整术语的类型将所有的调整术语保存至预设第二数据库内相应的位置调整组、内部关系调整组、布局属性调整组以及基础属性设置组内，以形成调整术语集。需要说明的是，通过对调整术语集分组的方式不仅能够便于后期对调整术语集管理，还能够便于后期的调整术语的采集。

S130：构建语句识别模型，并根据调整术语集对语句识别模型进行训练。

此外，为提高识别模型的训练精度，还可以预设相应该的附加调整术语集，自调整术语集以及预设的附加术语集内分别获取相应数量的术语以组成训练术语集；并通过训练术语集对语句识别模型进行训练，直至语句识别模型达到预设精度。

具体地，附加术语集包括与调整术语集相对应的相关术语集，以及与调整术语集无关的噪声术语集。其中，相关术语集内的相关术语根据具体的调整术语设定的。例如，若调整术语集为“AA组件的XX属性设置为YY值”，则相关术语可以为“将AA组件的XX属性更改为YY值”或者“把YY值作为XX属性值对AA组件进行属性调整”等等，该相关术语只要与该调整术语的实际表达意义相同即可。需要说明的，为保证语句识别模型的精度，调整术语集内的每一个调整术语都需要设置相应的至少5个相关术语。

此外，噪声术语集内的噪声术语为与调整术语完全无关的术语，可以由工作人员预先自由设定，例如，人们交流时的问候术语，如“最近身体可好”、“今天天气真好”等等，再例如，对一些其他设备的调整术语，如“把空调的温度设置为35度”，需要说明的，该噪声术语集内的噪声术语的数量至少设为2000。通过噪声术语集的设定能够有效的防止后期语句识别模型出现过度拟合现象，从而影响语句识别模型的识别精度。

需要说明的是，为保证语句识别模型达到想要的精度，需要大量的调整术语集以及附加术语集，其中，调整术语集的数量至少为1000个，附加术语集的数量至少为10000个。

具体地，为提高语句识别模型最终的识别精度，还可以在调整术语集内的各个调整组(位置调整组、内部关系调整组、布局属性调整组以及基础属性设置组)中采集等数量的调整术语，作为第一术语组，然后分别自相关术语集和噪声术语集内采集一定数量的附加术语组成第二术语组，最后将第一术语组和第二术语组进行组合以形成训练术语集对该语句识别模型进行训练。

在本申请的一个具体的实施方式中，可以选用点互信息模型(PMI)来建立上述语句识别模型，点互信息模型PMI是用来衡量两个变量之间的相关性的一种机器学习模型。

首先，利用PMI模型构建一个语句识别模型，然后自调整术语集和附加术语内获取相应的术语作为训练术语集，取调整术语集内的调整术语作为验证术语，对语句识别模型进行训练，具体地，可以利用下列算式对模型进行验证，计算输入的训练术语与验证术语的PMI值(归一化)，若大于阈值(如0.75)，则认为输入的训练术语与目标术语一致，反之则不一致；最后对所有训练术语与目标术语一致的情况进行实际检验，若所有训练术语中与目标术语完全正确对应的比例大于80％，则认定该语句识别模型达到预设精度，从而得到一个高精度的语句识别模型。

其中，X为训练术语集、x为某一个训练术语，Y为验证术语集(用调整术语集代替)、y为某一验证术语(用某一调整术语代替)。

需要说明的是，点互信息模型(PMI)是用来衡量两个事物之间的相关性的模型(例如，两个词语或者两个句子)。为更好地说明语句识别模型的构建过程，下面详细介绍当点互信息模型(PMI)是用来衡量两个词语的相似度时，构造该语句识别模型的原理如下：

语句识别模型，主要为识别四类(位置调整、内部关系调整、布局属性调整以及基础属性设置)关系调整/设置的模型，对于此四类调整，均设定了固定的术语，也就是“往A中添加B”、“将C移动到D前边/后边”、“AA组件的XX属性设置为YY值”、“BB组件的xx基础属性设置为yy值”，显然，布局属性调整以及基础属性设置的类型是一致的，因此，调整术语可分为三类：“往A中添加B”、“将C移动到D前边/后边”、“AA组件的XX属性设置为YY值”三种属于模型。

对于“往A中添加B”这类调整术语，关键词主要为“添加”；对于将C移动到D前边/后边”，这类调整术语关键词主要为“移动”“后边”；对于“AA组件的XX属性设置为YY值”这类调整术语，关键词主要为“属性”、“设置”；而上述调整数据中的“A”、“B”、“C”、“D”，也是关键词，对应的为组件名字，是有限的；“前边”“后边”，也是关键词，它也是有限的；“XX属性”为组件的布局属性或者基础属性，也是关键词，也是有限的；“YY值”也是关键词，若在布局属性调整的情况下，为有限的，在基础属性的情况下为一个输入值，可能为合法的输入值，也可能不合法，但是由于其不是被设置的主体，若不合法则设置失败，使用原值则可。

由于这些值基本为有限的，所以其组合也为有限的，因此，可以构建一个语句识别模型用以识别输入的语句是否与上述这些调整术语相关。

具体的构建过程为：

将上述4类调整关系对应的3类语句的所有关键词穷举出来，得到关键词库；针对关键词库中的每个词，采集大量的词语，其中一部分训练，一部分用作验证，并利用PMI模型构建一个文字识别模型，利用上述算式，计算输入词语与目标词语的PMI值(归一化)，若大于阈值(如0.75)，则认为输入词语与目标词语一致，反之则不一致，得到每个词语的识别模型。

此外，为了提高模型的精度，还可以将调整术语集和噪声术语集内的术语进行分词，将分词后的词语添加进验证数据集中，提高验证数据集中术语的总量，防止在模型训练过程中出现过拟合现象。

S140：获取待识别语句，并根据语句识别模型对待识别语句进行识别，若待识别语句通过语句识别模型，则根据语句识别模型输出的目标调整术语对预设模板界面进行调整。

需要说明的是，每个调整术语均对应相应的flex布局中的属性调整代码，当得到目标调整术语后即可根据对应的属性调整代码对预设界面进行属性调整。

具体地，待识别语句为用户根据自身需求输入的对预设界面进行相应调整的语句，将该待识别语句输入至语句识别模型后，该语句识别模型会对该待识别语句进行语句识别，若该待识别语句通过语句识别，则表示该语句识别模型找到与该待识别语句相匹配的调整术语，此时，即可通过该调整术语对该预设界面进行调整。若该待识别语句未通过语句识别，则表示该语句识别模型找到与该待识别语句相匹配的调整术语，此时，提醒用户重新输入与原待识别语句不同的新的待识别语句，并再次通过语句识别模型对其进行语句识别。

需要说明的是，在该语句识别模型会对该待识别语句进行语句识别的过程中，该语句识别模型会给出与该待识别语句最相似的调整术语并给出相应的相似度，若该相似度达到预设的指定阈值(该指定阈值根据模型训练的实际情况而定，最优值一般取80％)，则判定该待识别语句通过语句识别；若该相似度未达到预设的指定阈值，则判定该待识别语句未通过语句识别。

更为具体地，为便于获取待识别语句，可以预先设定一个语音采集模块，通过语音采集模块直接采集用户发出的调整语音，并根据该调整语音生成相应的待识别语句，以供后续语句识别模型的识别。此外，需要说明的是，语音采集模块涉及的是语音识别方面的技术，已为现有技术，本发明的创新之处并不在于此，因此不再赘述。

S150：获取调整后的预设界面的层级关系、组件类型以及组件基础属性，并根据层级关系、组件类型以及各组件的基础属性建立用户所需的前端开发页面。

其中，组件类型指的是组件的种类，比如，按钮、图片、输入框、卡片等；层级关系指的是组件之间存在的关系，比如卡片a内包含一个按钮组件b和一个图片组件c，则a、b之间为包含关系，a、c之间为包含关系，b、c之间为并列关系。(层级关系描述了各个组件的包含、并列关系，结合flex布局，可以准确描述组件的位置关系，进而确定组件的位置)；组件基础属性与上述S120步骤提到的相同，在此不再赘述。

层级关系、组件类型以及组件基础属性即可完全对表达出该预设界面的具体结构。

需要强调的是，整个方案提供的预设模板界面，指的是用户在操作过程中看见的操作界面；然而，本发明的最终目的是构建一个前端的开发页面，进而可以在不同的地方使用该页面。因此，在获取该预设界面的层级关系、组件类型以及组件基础属性之后，可以对这些参数进行解析，生成相应的开发代码，最后根据该开发代码构建所需的开发界面。

此外，需要说明的是，对获取该预设模板界面的层级关系、组件类型以及组件基础属性进行解析的过程是通过计算机程序直接实现的，已为现有技术，并且本发明的创新之处并不在此，因此对于该部分内容不再赘述。

应理解，上述实施例中各步骤的序号的大小并不意味着执行顺序的先后，各过程的执行顺序应以其功能和内在逻辑确定，而不应对本申请实施例的实施过程构成任何限定。

实施例2

与上述方法相对应，本申请还提供一种基于语句识别的前端开发页面构建系统，该系统包括：

预设模板界面构建单元，用于根据基础组件建立组件库，并根据组件库采用Flex布局建立预设模板界面；

调整术语集建立单元，用于根据预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据调整术语建立调整术语集；

模型构建及训练单元，用于构建语句识别模型，并根据调整术语集对语句识别模型进行模型训练；

模型应用单元，用于根据语句识别模型对待识别语句进行识别，若待识别语句通过语句识别模型的识别，则根据语句识别模型输出的目标调整术语对预设模板界面进行调整；

前端开发页面创建单元，用于获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据层级关系、组件类型以及各组件基础属性建立前端开发页面。

实施例3

本发明还提供一种电子装置70。参照图2所示，该图为本发明提供的电子装置70的较佳实施例结构示意图。

在本实施例中，电子装置70可以是服务器、智能手机、平板电脑、便携计算机、桌上型计算机等具有运算功能的终端设备。

该电子装置70包括：处理器71以及存储器72。

存储器72包括至少一种类型的可读存储介质。至少一种类型的可读存储介质可为如闪存、硬盘、多媒体卡、卡型存储器等的非易失性存储介质。在一些实施例中，可读存储介质可以是该电子装置70的内部存储单元，例如该电子装置70的硬盘。在另一些实施例中，可读存储介质也可以是电子装置1的外部存储器，例如电子装置70上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(Flash Card)等。

在本实施例中，存储器72的可读存储介质通常用于存储安装于电子装置70的基于语句识别的前端开发页面构建程序73。存储器72还可以用于暂时地存储已经输出或者将要输出的数据。

处理器72在一些实施例中可以是一中央处理器(Central Processing Unit,CPU)，微处理器或其他数据处理芯片，用于运行存储器72中存储的程序代码或处理数据，例如基于语句识别的前端开发页面构建程序73等。

在一些实施例中，电子装置70为智能手机、平板电脑、便携计算机等的终端设备。在其他实施例中，电子装置70可以为服务器。

图2仅示出了具有组件71-73的电子装置70，但是应理解的是，并不要求实施所有示出的组件，可以替代的实施更多或者更少的组件。

可选地，该电子装置70还可以包括用户接口，用户接口可以包括输入单元比如键盘(Keyboard)、语音输入装置比如麦克风(microphone)等具有语音识别功能的设备、语音输出装置比如音响、耳机等，可选地用户接口还可以包括标准的有线接口、无线接口。

可选地，该电子装置70还可以包括显示器，显示器也可以称为显示屏或显示单元。在一些实施例中可以是LED显示器、液晶显示器、触控式液晶显示器以及有机发光二极管(Organic Light-Emitting Diode，OLED)触摸器等。显示器用于显示在电子装置70中处理的信息以及用于显示可视化的用户界面。

可选地，该电子装置70还可以包括触摸传感器。触摸传感器所提供的供用户进行触摸操作的区域称为触控区域。此外，这里的触摸传感器可以为电阻式触摸传感器、电容式触摸传感器等。而且，触摸传感器不仅包括接触式的触摸传感器，也可包括接近式的触摸传感器等。此外，触摸传感器可以为单个传感器，也可以为例如阵列布置的多个传感器。

此外，该电子装置70的显示器的面积可以与触摸传感器的面积相同，也可以不同。可选地，将显示器与触摸传感器层叠设置，以形成触摸显示屏。该装置基于触摸显示屏侦测用户触发的触控操作。

可选地，该电子装置70还可以包括射频(Radio Frequency，RF)电路，传感器、音频电路等等，在此不再赘述。

在图2所示的装置实施例中，作为一种计算机存储介质的存储器72中可以包括操作系统以及基于语句识别的前端开发页面构建程序73；处理器71执行存储器72中存储基于语句识别的前端开发页面构建程序73时实现如下步骤：

根据基础组件建立组件库，并根据组件库采用Flex布局建立预设模板界面；

根据预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据调整术语建立调整术语集；

构建语句识别模型，并根据调整术语集对语句识别模型进行模型训练；

根据语句识别模型对待识别语句进行识别，若待识别语句通过语句识别模型的识别，则根据语句识别模型输出的目标调整术语对预设模板界面进行调整；

获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据层级关系、组件类型以及各组件基础属性建立前端开发页面。

在该实施例中，图3为根据本发明实施例的基于语句识别的前端开发页面构建程序的内部逻辑示意图，如图3所示，基于语句识别的前端开发页面构建程序73还可以被分割为一个或者多个模块，一个或者多个模块被存储于存储器72中，并由处理器71执行，以完成本发明。本发明所称的模块是指能够完成特定功能的一系列计算机程序指令段。参照图3所示，为图2中基于语句识别的前端开发页面构建程序73较佳实施例的程序模块图。基于语句识别的前端开发页面构建程序73可以被分割为：预设模板界面构件模块74、调整术语集建立模块75、模型构建训练及应用模块76以及前端开发页面创建模块77。模块74-77所实现的功能或操作步骤均与上文类似，此处不再详述，示例性地，例如，其中：

预设模板界面构件模块74，用于根据基础组件建立组件库，并根据组件库采用Flex布局建立预设模板界面。

调整术语集建立模块75，用于根据预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据调整术语建立调整术语集。

模型构建训练及应用模块76，用于构建语句识别模型，并根据调整术语集对语句识别模型进行模型训练；然后根据语句识别模型对待识别语句进行识别，若待识别语句通过语句识别模型的识别，则根据语句识别模型输出的目标调整术语对预设模板界面进行调整。

前端开发页面创建模块77，用于获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据层级关系、组件类型以及各组件基础属性建立前端开发页面。

实施例4

本发明还提供一种计算机可读存储介质，计算机可读存储介质中存储有基于语句识别的前端开发页面构建程序73，基于语句识别的前端开发页面构建程序73被处理器执行时实现如下操作：

根据基础组件建立组件库，并根据组件库采用Flex布局建立预设模板界面；

根据预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据调整术语建立调整术语集；

构建语句识别模型，并根据调整术语集对语句识别模型进行模型训练；

根据语句识别模型对待识别语句进行识别，若待识别语句通过语句识别模型的识别，则根据语句识别模型输出的目标调整术语对预设模板界面进行调整；

获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据层级关系、组件类型以及各组件基础属性建立前端开发页面。

本发明提供的计算机可读存储介质的具体实施方式与上述基于语句识别的前端开发页面构建方法、电子装置的具体实施方式大致相同，在此不再赘述。

需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、装置、物品或者方法不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、装置、物品或者方法所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、装置、物品或者方法中还存在另外的相同要素。

上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在如上的一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，或者网络设备等)执行本发明各个实施例的方法。

以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (10)

1.一种基于语句识别的前端开发页面构建方法，应用于电子装置，其特征在于，所述方法包括：

根据基础组件建立组件库，并根据所述组件库采用Flex布局建立预设模板界面；

根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立调整术语集；

构建语句识别模型，并根据所述调整术语集对所述语句识别模型进行模型训练；

根据所述语句识别模型对待识别语句进行识别，若所述待识别语句通过所述语句识别模型的识别，则根据所述语句识别模型输出的目标调整术语对所述预设模板界面进行调整；

获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据所述层级关系、所述组件类型以及各组件基础属性建立前端开发页面。

2.根据权利要求1所述的基于语句识别的前端开发页面构建方法，其特征在于，所述根据所述基础组件建立所述组件库，并根据所述组件库采用Flex布局建立所述预设模板界面的过程包括：

对所述基础组件进行组合，以获取组合组件；

对各基础组件以及各组合组件进行标注，然后根据所述标注将所述基础组件和所述组合组件保存至预设第一数据库以形成所述组件库；

根据所述标注自所述组件库中获取所需的基础组件以及组合组件，并根据所述基础组件以及所述组合组件，采用所述Flex布局建立所述预设模板界面。

3.根据权利要求2所述的基于语句识别的前端开发页面构建方法，其特征在于，所述预设模板界面的内部组件属性调整规则包括位置调整规则、内部关系调整规则、布局属性调整规则以及基础属性调整规则；其中，

根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立所述调整术语集的过程包括：

根据所述预设模板界面的内部组件属性调整规则创建相应的位置调整术语、内部关系调整术语、布局属性调整术语以及基础属性调整术语；

根据各调整术语的类型将所有的调整术语保存至预设第二数据库内相应的位置调整组、内部关系调整组、布局属性调整组以及基础属性设置组内，以形成所述调整术语集。

4.根据权利要求3所述的基于语句识别的前端开发页面构建方法，其特征在于，

选用点互信息模型构建所述语句识别模型。

5.根据权利要求4所述的基于语句识别的前端开发页面构建方法，其特征在于，根据所述调整术语集对所述语句识别模型进行模型训练的过程包括：

自所述调整术语集以及预设的附加术语集内分别获取相应数量的术语以组成训练术语集；

通过所述训练术语集对所述语句识别模型进行训练，直至所述语句识别模型达到预设精度。

6.根据权利要求5所述的基于语句识别的前端开发页面构建方法，其特征在于，所述附加术语集包括与所述调整术语集相对应的相关术语集以及与所述调整术语集无关的噪声术语集；并且，自所述调整术语集以及预设的附加术语集内分别获取相应数量的术语以组成训练术语集的过程包括：

自所述调整术语集内的位置调整组、内部关系调整组、布局属性调整组以及基础属性设置组内采集等量的调整术语组成第一术语组；

分别自所述相关术语集和所述噪声术语集内采集一定数量的附加术语组成第二术语组；

将所述第一术语组和所述第二术语组进行组合以形成所述训练术语集。

7.根据权利要求1至6中任意一项所述的基于语句识别的前端开发页面构建方法，其特征在于，所述待识别语句的获取过程包括：

通过预设的语音采集模块采集用户输入语音；

根据所述用户输入语音生成相应的待识别语句。

8.一种基于语句识别的前端开发页面构建系统，其特征在于，所述前端开发页面构建系统包括：

预设模板界面构建单元，用于根据基础组件建立组件库，并根据所述组件库采用Flex布局建立预设模板界面；

调整术语集建立单元，用于根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立调整术语集；

模型构建及训练单元，用于构建语句识别模型，并根据所述调整术语集对所述语句识别模型进行模型训练；

模型应用单元，用于根据所述语句识别模型对待识别语句进行识别，若所述待识别语句通过所述语句识别模型的识别，则根据所述语句识别模型输出的目标调整术语对所述预设模板界面进行调整；

前端开发页面创建单元，用于获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据所述层级关系、所述组件类型以及各组件基础属性建立前端开发页面。

9.一种电子装置，其特征在于，所述电子装置包括：存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的基于语句识别的前端开发页面构建程序，所述基于语句识别的前端开发页面构建程序被所述处理器执行时实现如下步骤：

根据基础组件建立组件库，并根据所述组件库采用Flex布局建立预设模板界面；

根据所述预设模板界面的内部组件属性调整规则创建相应的调整术语，并根据所述调整术语建立调整术语集；

构建语句识别模型，并根据所述调整术语集对所述语句识别模型进行模型训练；

根据所述语句识别模型对待识别语句进行识别，若所述待识别语句通过所述语句识别模型的识别，则根据所述语句识别模型输出的目标调整术语对所述预设模板界面进行调整；

获取调整后的预设模板界面的层级关系、组件类型以及各组件基础属性，并根据所述层级关系、所述组件类型以及各组件基础属性建立前端开发页面。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质中存储有基于语句识别的前端开发页面构建程序，所述基于语句识别的前端开发页面构建程序被处理器执行时，实现如权利要求1至7中任一项所述的基于语句识别的前端开发页面构建方法的步骤。

Images