基于web前端编辑的电视交互界面动态调整方法、装置与流程-j9九游会真人

基于web前端编辑的电视交互界面动态调整方法、装置
技术领域
1.本发明涉及智能设备技术领域，尤其涉及的是一种基于web前端编辑的电视交互界面动态调整方法、装置、智能设备及存储介质。


背景技术：

2.随着科技的发展和人们生活水平的不断提高，各种智能设备如智能电视的使用越来越普及。
3.在现有技术的android电视的主动服务环节中，若需要弹出内容提示或询问用户，其弹窗内容，界面样式及位置常常固定，且无法动态调整。一旦要进行修改，就必须更改代码并发布新版本的应用，效率低下。
4.因此，现有技术还有待改进和发展。


技术实现要素：

5.本发明要解决的技术问题在于，针对现有技术的上述缺陷，提供一种基于web前端编辑的电视交互界面动态调整方法、装置、智能设备及存储介质，旨在解决现有技术的android电视的主动服务环节中，其弹窗内容，界面样式及位置常常固定，且无法动态调整；一旦要进行修改，就必须更改代码并发布新版本的应用，效率低下的问题。
6.本发明解决问题所采用的技术方案如下：
7.一种基于web前端编辑的电视交互界面动态调整方法，其中，包括：
8.通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件；
9.接收控件编辑指令，控制对添加的控件进行内容和布局的编辑；
10.对编辑后的控件，在预览界面预览显示效果；
11.将预览后的控件的内容和布局下发至终端设备，进行动态界面展示。
12.所述的基于web前端编辑的电视交互界面动态调整方法，其中，所述通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件的步骤之前包括：
13.预先在web前端页面提供一个编辑界面，用于在该编辑界面上进行交互操作，选择或输入相应的指令来添加控件。
14.所述的基于web前端编辑的电视交互界面动态调整方法，其中，所述通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件的步骤包括：
15.通过web前端编辑界面的交互元素、获取选择或输入相应的指令内容；
16.根据获取的选择或输入相应的指令内容，控制web前端页面执行相应的逻辑添加控件。
17.所述的基于web前端编辑的电视交互界面动态调整方法，其中，所述接收控件编辑指令，控制对添加的控件进行内容和布局的编辑的步骤包括：
18.通过web前端编辑界面获取选择或输入编辑指令，并对选择或输入编辑指令进行解析；
19.根据解析的选择或输入编辑指令，控制对控件的内容修改、样式调整、位置移动操作，以实现对已添加的控件进行动态编辑。
20.所述的基于web前端编辑的电视交互界面动态调整方法，其中，所述对编辑后的控件，在预览界面预览显示效果的步骤包括：
21.对编辑后的控件，切换到预览界面，显示编辑后的按钮的最终效果，包括修改后的文本内容、颜色和大小。
22.所述的基于web前端编辑的电视交互界面动态调整方法，其中，所述将预览后的控件的内容和布局下发至终端设备，进行动态界面展示的步骤包括：
23.当在web前端编辑页面中完成对控件的编辑和预览后，将编辑后的控件的内容和布局下发到终端设备；
24.终端设备接收到编辑后的控件的内容和布局信息，并展示出动态的界面。
25.所述的基于web前端编辑的电视交互界面动态调整方法，其中，所述将预览后的控件的内容和布局下发至终端设备，进行动态界面展示的步骤包括：
26.在主动服务进行的时，根据web前端编辑的电视交互界面的内容和布局，动态弹出内容提示或者询问。
27.一种基于web前端编辑的电视交互界面动态调整装置，其中，所述装置包括：
28.控件添加控制模块，用于通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件；
29.编辑模块，用于接收控件编辑指令，控制对添加的控件进行内容和布局的编辑；
30.预览模块，用于对编辑后的控件，在预览界面预览显示效果；
31.下发展示模块，用于将预览后的控件的内容和布局下发至终端设备，进行动态界面展示。
32.一种智能设备，其中，包括有存储器，以及一个或者一个以上的程序，其中一个或者一个以上程序存储于存储器中，且经配置以由一个或者一个以上处理器执行所述一个或者一个以上程序包含用于执行任意一项所述的方法。
33.一种非临时性计算机可读存储介质，其中，当所述存储介质中的指令由电子设备的处理器执行时，使得电子设备能够执行任意一项所述的方法。
34.本发明的有益效果：本发明提供了一种基于web前端编辑的电视交互界面动态调整方法、装置。本发明提供了一种新的基于web前端编辑的电视交互界面动态调整方法。本技术的核心功能在于：实现了运营人员能在一个与电视屏幕分辨率相同的web前端页面编辑内容，并下发给电视，电视通过接收的内容、布局等数据动态生成并展示给用户。本技术不仅提高了用户体验，而且避免了频繁的应用更新，大大提升了运营效率，有着极高的实用价值。
附图说明
35.为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明中记载的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
36.图1是本发明实施例提供的基于web前端编辑的电视交互界面动态调整方法的流程示意图。
37.图2是本发明具体应用实施例提供的基于web前端编辑的电视交互界面动态调整方法的流程示意图。
38.图3是本发明实施例提供的基于web前端编辑的电视交互界面动态调整装置的原理框图。
39.图4是本发明实施例提供的智能设备的内部结构原理框图。
具体实施方式
40.为使本发明的目的、技术方案及优点更加清楚、明确，以下参照附图并举实施例对本发明进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。
41.需要说明，若本发明实施例中有涉及方向性指示(诸如上、下、左、右、前、后
……
)，则该方向性指示仅用于解释在某一特定姿态(如附图所示)下各部件之间的相对位置关系、运动情况等，如果该特定姿态发生改变时，则该方向性指示也相应地随之改变。
42.针对现有技术的android电视的主动服务环节中，其弹窗内容，界面样式及位置常常固定，且无法动态调整；一旦要进行修改，就必须更改代码并发布新版本的应用，效率低下的问题。
43.本发明提供一种基于web前端编辑的电视交互界面动态调整方法，本技术提供了一种新的基于web前端编辑的电视交互界面动态调整方法。本技术的核心功能在于，使得运营人员能在一个与电视屏幕分辨率相同的web前端页面编辑内容，并下发给电视，电视通过接收的内容、布局等数据动态生成并展示给用户。
44.示例性方法
45.如图1所示，本发明实施例1的一种基于web前端编辑的电视交互界面动态调整方法，包括以下步骤：
46.步骤s10、通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件；
47.可选地，本技术实施例中，主要应用场景以android电视的主动服务环节为例进行说明：本技术中的web前端是指使用html/css/js以及更多的框架技术,编写网站页面、app应用、小程序、web vr&ar等应用,通过内容设计、交互动画、数据操作构建项目与用户的交互界面。
48.本技术中通过web前端编辑页面获取控件添加指令，是指在web前端页面中提供了一个编辑界面，用户(例如运营人员)可以在该界面上进行交互操作，选择或输入相应的指令来添加控件。
49.在这个过程中，可以通过界面上的各种交互元素(比如下拉菜单、文本框、按钮等)选择或输入相应的指令内容。例如，用户可以选择一个下拉菜单中的选项，该选项对应着一个控件添加指令，或者用户可以在一个文本框中输入一个指令。
50.当完成了指令的选择或输入后，web前端页面会将这些指令内容进行收集和组织，通常以数据结构(比如json格式)的形式进行存储。
51.接下来，根据控件添加指令，即根据用户选择或输入的指令内容，web前端页面会执行相应的逻辑来添加控件。这个逻辑可以是前端页面中的javascript代码，通过解析指令内容，动态生成并添加相应的控件元素到页面中。
52.例如，如果用户选择了一个指令来添加一个文本输入框，前端页面的javascript代码会根据指令内容动态生成一个文本输入框的html元素，并将其插入到页面的特定位置。这样，用户就可以在编辑页面中看到添加的控件，并进行相应的操作。
53.通过web前端编辑页面获取控件添加指令，并根据指令添加控件，可以实现动态、灵活地在前端页面上添加控件，满足用户的定制需求。这种方式常用于可视化编辑工具、表单设计器等场景。
54.步骤s20、接收控件编辑指令，控制对添加的控件进行内容和布局的编辑。
55.可选地，本技术中的内容包括基本控件文本，按钮，弹窗，图片，视频等元素，布局包括每个控件的坐标位置，大小等属性。本步骤可以实现动态界面设计。运营人员可以自由编辑并预览，无需更新应用，即可直接将新的界面内容下发到用户的电视上。
56.可选地，本步骤的接收控件编辑指令，控制对添加的控件进行内容和布局的编辑：是指在一个编辑界面中，接收用户输入的编辑指令，然后根据这些指令对已添加的控件进行内容和布局的修改。
57.具体来说，当在web前端编辑页面中选择或输入编辑指令后，这些指令会被前端页面接收并进行解析。解析后的指令可以包括对控件的内容修改、样式调整、位置移动等操作。通过执行这些指令，可以实现对已添加的控件进行动态编辑。
58.例如，假设在web前端编辑页面的编辑界面中添加了一个文本输入框控件，并希望对该控件进行编辑。用户可以选择编辑指令，比如修改文本框的默认值、更改文本框的样式、调整文本框的位置等。这些指令会被前端页面接收并解析，然后根据解析结果，执行相应的操作来修改已添加的文本输入框控件。
59.本技术，通过接收控件编辑指令，用户可以在编辑界面上动态地对已添加的控件进行编辑。这种灵活性使得用户可以根据实际需求，自由地调整控件的内容和布局，以满足个性化的设计要求。
60.步骤s30、对编辑后的控件，在预览界面预览显示效果；
61.本步骤中"对编辑后的控件，在预览界面预览显示效果"是指在一个编辑界面中，对已添加的控件进行编辑后，可以在预览界面中实时查看控件的显示效果。
62.具体来说，本技术中当在web前端编辑页面的编辑界面中完成对控件的编辑操作后，可以切换到预览界面，在预览界面会显示编辑后的控件的最终效果。预览界面通常会模拟真实的展示环境，以便用户能够更好地了解控件在实际使用中的显示效果。
63.例如，假设用户在编辑界面中对一个按钮控件进行编辑，比如修改按钮的文本内容、调整按钮的颜色和大小。用户完成编辑后，可以切换到预览界面，该界面会显示编辑后的按钮的最终效果，包括修改后的文本内容、颜色和大小。
64.本步骤的好处在于：通过预览界面显示编辑后的控件效果，可以实时地看到所做的修改对最终显示效果的影响。这种实时反馈使用户能够快速了解和调整控件的外观，提高工作效率。并且在预览界面提供了一个真实的展示环境，可以更好地感知控件在实际使用中的显示效果。这样，用户可以更准确地评估控件的外观和布局，从而做出更好的设计决
策。
65.本技术中的预览界面可以用于验证编辑后的控件的交互效果。用户可以模拟实际操作，测试控件的响应和行为。这有助于用户发现和解决潜在的问题，确保控件在实际使用中的良好交互体验。
66.可见，本步骤通过在预览界面预览显示编辑后的控件效果，用户可以获得实时反馈、更好的用户体验和交互验证，从而提高设计效果和用户满意度。预览界面的存在使得用户能够更好地了解和评估控件的外观和行为，从而做出更好的设计决策。
67.步骤s40、将预览后的控件的内容和布局下发至终端设备，进行动态界面展示。
68.本步骤中，可以将编辑好的内容和布局数据，经由服务器下发至用户电视。电视接收到数据后，根据数据动态构建交互界面，并实时展示给用户。
69.本步骤中的将预览后的控件的内容和布局下发至终端设备，进行动态界面展示是指将在预览界面中编辑和预览的控件的最终内容和布局传输到实际的终端设备上，并在设备上展示出动态的界面效果。
70.具体来说，当在web前端编辑页面中完成对控件的编辑和预览后，可以选择将编辑后的控件的内容和布局下发到终端设备上，比如智能电视上。终端设备例如智能电视会接收到这些内容和布局信息，并根据它们展示出动态的界面效果。
71.例如，使用一个应用程序编辑界面，在编辑界面中添加了一个按钮控件，并在预览界面中调整了按钮的颜色和大小。当完成编辑和预览后，可以将编辑后的按钮的内容和布局下发到智能电视上。智能电视会接收到这些信息，并根据它们在智能电视屏幕上展示出编辑后的按钮，包括调整后的颜色和大小。
72.这样做的好处在于，通过将预览后的控件内容和布局下发至终端设备，可以实时地在智能设备上看到编辑后的控件的最终效果。这种实时展示使能够更好地了解和评估控件的外观和布局，并及时调整和优化设计。
73.将预览后的控件内容和布局下发至终端设备，可以确保控件在实际设备上的展示效果与预览界面中的一致。这有助于运营人员更准确地评估控件的外观和布局，从而做出更好的设计决策。
74.而动态界面展示可以提供更好的用户体验。用户可以在实际设备上亲身体验和测试控件的交互效果，从而更好地了解和评估控件的实际使用情况，提高用户满意度。
75.可见，通过将预览后的控件内容和布局下发至终端设备进行动态界面展示，用户可以获得实时展示、设备适配和更好的用户体验。这种方式使用户能够更准确地评估和优化控件的外观和布局，从而提高设计效果和用户满意度。
76.可选地，在本技术另外的实施例中，可以在主动服务进行的时候，根据前端编辑的内容和布局，动态弹出内容提示用户或者询问用户。这不仅大大提升了用户体验，也极大地提升了运营效率。
77.具体地，在主动服务进行的时候，根据前端编辑的内容和布局，动态弹出内容提示用户或者询问用户是指在进行主动服务时，根据在web前端编辑的内容和布局，系统会根据这些信息主动向用户提供相关的提示或者询问用户的意见或选择。
78.具体来说，当在web前端编辑界面中输入或选择了一些内容，并进行主动服务时，系统可以根据这些编辑的内容和布局，提供相应的提示或者询问用户的意见。
79.例如，在一个智能助手应用中编辑了一个提醒事件，包括事件的名称、时间和地点。当打开应用并启动主动服务时，系统可以根据这些编辑的内容和布局，动态弹出一个提示框，提醒用户确认是否要设置这个提醒事件。可以选择确认或取消。
80.这样，通过根据前端编辑的内容和布局动态弹出内容提示用户或者询问用户，系统可以提供及时的提醒和引导，帮助完成任务。这有助于用户更好地理解和使用系统的功能，提高用户体验。
81.根据编辑内容和布局，系统可以根据用户的个性化需求提供定制化的提示或询问。这种个性化交互可以让用户感到被关注和重视，提高用户满意度。
82.而通过动态弹出内容提示用户或者询问用户，系统可以帮助用户避免错误和冲突。系统可以根据用户的编辑内容和布局提供相关的提示，提醒用户注意可能存在的问题或冲突，并询问用户的意见或选择，以确保用户的操作正确和一致。
83.可见，在主动服务进行的时候，根据前端编辑的内容和布局动态弹出内容提示用户或者询问用户，可以提供提醒和引导、个性化交互和减少错误和冲突的好处。这种方式可以帮助用户更好地完成任务，提高用户体验和满意度。
84.以下通过一具体应用实施例对本发明的一种基于web前端编辑的电视交互界面动态调整方法做进一步详细说明：
85.如图2所示，本具体应用实施例所述基于web前端编辑的电视交互界面动态调整，包括以下步骤：
86.步骤s101、开始；并进入步骤s102；
87.步骤s102、在web前端编辑页面添加控件；
88.步骤s103、编辑控件内容和布局；
89.步骤s104、预览界面确认效果；
90.步骤s105、下发内容和布局数据至电视；
91.步骤s106、电视生成动态界面并展示；
92.步骤s107、主动服务进行；
93.步骤s108、结束。
94.例如本技术具体实施例中，以弹出一个询问用户是否需要更新应用的弹窗为例，以下是实操步骤：
95.1).运营人员在web前端编辑页面中添加一个弹窗控件，填写控件文本为“是否更新应用？”。
96.2).在弹窗控件下方添加两个按钮，分别为“是”和“否”。
97.3).设置弹窗的大小和在屏幕中的位置。
98.4).在预览界面确认弹窗效果，然后将编辑好的内容和布局数据通过服务器下发到电视。
99.5).电视接收到数据后，动态生成弹窗并展示给用户。
100.6).用户根据自己的需要选择“是”或“否”，通过电视反馈给服务器。
101.由上可见，本技术不仅提高了用户体验，而且避免了频繁的应用更新，大大提升了运营效率，有着极高的实用价值。
102.示例性设备
103.如图3中所示，本发明实施例提供一种基于web前端编辑的电视交互界面动态调整装置，该装置包括：
104.控件添加控制模块210，用于通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件；
105.编辑模块220，用于接收控件编辑指令，控制对添加的控件进行内容和布局的编辑；
106.预览模块230，用于对编辑后的控件，在预览界面预览显示效果；
107.下发展示模块240，用于将预览后的控件的内容和布局下发至终端设备，进行动态界面展示，具体如上所述。
108.基于上述实施例，本发明还提供了一种智能设备，其原理框图可以如图4所示。该智能设备可以为智能电视包括通过系统总线连接的处理器、存储器、网络接口、显示屏。其中，该智能设备的处理器用于提供计算和控制能力。该智能设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统和计算机程序。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该智能设备的网络接口用于与外部的终端通过网络连接通信。该计算机程序被处理器执行时以实现一种基于web前端编辑的电视交互界面动态调整方法。该智能设备的显示屏可以是液晶显示屏或者电子墨水显示屏。
109.本领域技术人员可以理解，图4中示出的原理框图，仅仅是与本发明方案相关的部分结构的框图，并不构成对本发明方案所应用于其上的智能设备的限定，具体的智能设备可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。
110.在一个实施例中，提供了一种智能设备，包括有存储器，以及一个或者一个以上的程序，其中一个或者一个以上程序存储于存储器中，且经配置以由一个或者一个以上处理器执行所述一个或者一个以上程序包含用于进行以下操作的指令：
111.通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件；
112.接收控件编辑指令，控制对添加的控件进行内容和布局的编辑；
113.对编辑后的控件，在预览界面预览显示效果；
114.将预览后的控件的内容和布局下发至终端设备，进行动态界面展示，具体如上所述。
115.其中，所述通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件的步骤之前包括：
116.预先在web前端页面提供一个编辑界面，用于在该编辑界面上进行交互操作，选择或输入相应的指令来添加控件。
117.其中，所述通过web前端编辑页面获取控件添加指令，并根据控件添加指令添加控件的步骤包括：
118.通过web前端编辑界面的交互元素、获取选择或输入相应的指令内容；
119.根据获取的选择或输入相应的指令内容，控制web前端页面执行相应的逻辑添加控件。
120.其中，所述接收控件编辑指令，控制对添加的控件进行内容和布局的编辑的步骤包括：
121.通过web前端编辑界面获取选择或输入编辑指令，并对选择或输入编辑指令进行解析；
122.根据解析的选择或输入编辑指令，控制对控件的内容修改、样式调整、位置移动操作，以实现对已添加的控件进行动态编辑。
123.其中，所述对编辑后的控件，在预览界面预览显示效果的步骤包括：
124.对编辑后的控件，切换到预览界面，显示编辑后的按钮的最终效果，包括修改后的文本内容、颜色和大小。
125.其中，所述将预览后的控件的内容和布局下发至终端设备，进行动态界面展示的步骤包括：
126.当在web前端编辑页面中完成对控件的编辑和预览后，将编辑后的控件的内容和布局下发到终端设备；
127.终端设备接收到编辑后的控件的内容和布局信息，并展示出动态的界面。
128.其中，所述将预览后的控件的内容和布局下发至终端设备，进行动态界面展示的步骤包括：
129.在主动服务进行的时，根据web前端编辑的电视交互界面的内容和布局，动态弹出内容提示或者询问，具体如上所述。
130.本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一非易失性计算机可读取存储介质中，该计算机程序在执行时，可包括如上述各方法的实施例的流程。其中，本发明所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何引用，均可包括非易失性和/或易失性存储器。非易失性存储器可包括只读存储器(rom)、可编程rom(prom)、电可编程rom(eprom)、电可擦除可编程rom(eeprom)或闪存。易失性存储器可包括随机存取存储器(ram)或者外部高速缓冲存储器。作为说明而非局限，ram以多种形式可得，诸如静态ram(sram)、动态ram(dram)、同步dram(sdram)、双数据率sdram(ddrsdram)、增强型sdram(esdram)、同步链路(synchlink)dram(sldram)、存储器总线(rambus)直接ram(rdram)、直接存储器总线动态ram(drdram)、以及存储器总线动态ram(rdram)等。
131.综上所述，本发明公开了一种基于web前端编辑的电视交互界面动态调整方法、装置、智能设备及存储介质，本发明提供了一种新的基于web前端编辑的电视交互界面动态调整方法。本技术的核心功能在于：实现了运营人员能在一个与电视屏幕分辨率相同的web前端页面编辑内容，并下发给电视，电视通过接收的内容、布局等数据动态生成并展示给用户。本技术不仅提高了用户体验，而且避免了频繁的应用更新，大大提升了运营效率，有着极高的实用价值。
132.应当理解的是，本发明的应用不限于上述的举例，对本领域普通技术人员来说，可以根据上述说明加以改进或变换，所有这些改进和变换都应属于本发明所附权利要求的保护范围。