CN113242471B - 基于Vue实现电视Launcher系统web端预览组件的方法 - Google Patents

基于Vue实现电视Launcher系统web端预览组件的方法 Download PDF

Info

Publication number
CN113242471B
CN113242471B CN202110571106.7A CN202110571106A CN113242471B CN 113242471 B CN113242471 B CN 113242471B CN 202110571106 A CN202110571106 A CN 202110571106A CN 113242471 B CN113242471 B CN 113242471B
Authority
CN
China
Prior art keywords
component
launcher
content
virtual
vue
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
Application number
CN202110571106.7A
Other languages
English (en)
Other versions
CN113242471A (zh
Inventor
黄睿葱
彭一亮
曾辉
邓文科
宋舰
龙杰
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Sichuan Hongmagic Cube Network Technology Co ltd
Original Assignee
Sichuan Hongmagic Cube Network Technology Co ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Sichuan Hongmagic Cube Network Technology Co ltd filed Critical Sichuan Hongmagic Cube Network Technology Co ltd
Priority to CN202110571106.7A priority Critical patent/CN113242471B/zh
Publication of CN113242471A publication Critical patent/CN113242471A/zh
Application granted granted Critical
Publication of CN113242471B publication Critical patent/CN113242471B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47—End-user applications
    • H04N21/478—Supplemental services, e.g. displaying phone caller identification, shopping application
    • H04N21/4782—Web browsing, e.g. WebTV
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/443—OS processes, e.g. booting an STB, implementing a Java virtual machine in an STB or power management in an STB

Landscapes

  • Engineering & Computer Science (AREA)
  • Multimedia (AREA)
  • Signal Processing (AREA)
  • Software Systems (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明公开了一种基于Vue实现电视Launcher系统web端预览组件的方法，包括设计组件库；新建后台服务；新建三层结构的虚拟Launcher，外部使用vue的v‑bind向虚拟Launcher传输数据；进入板块新增页面，从组件库中选取需要的组件添加至虚拟Launcher中，点击任一组件的编辑按钮进入组件内容的配置页面；组件内容的编辑页面中，进行内容的新增、删除和调换位置操作，点击保存按钮通过后台服务将组件内容保存到数据库中，虚拟Launcher通过后端接口读取数据，展示内容同步更新。能够在配置过程中在管理后台直接进行电视Launcher系统界面的预览。

Description

基于Vue实现电视Launcher系统web端预览组件的方法
技术领域
本发明涉及计算机软件技术领域，具体的说，是一种基于Vue实现电视Launcher系统web端预览组件的方法。
背景技术
电视Launcher系统作为终端厂商与用户交互的载体，一直以来是运营的重点。传统的Launcher配置流程主要包括：运营人员在管理后台选择组件、配置组件内容、审核、发布到指定的测试电视、发现问题或优化点、再次进行配置修改。存在的问题是：在发布到测试电视以前，显示效果对于运营人员来说是未知的。随着电视Launcher系统界面的多样化需求的提升，运营空间增大，界面复杂度提高，运营人员需要在配置过程中实时进行电视Launcher系统界面的预览，以便能够及时地调整配置内容。
发明内容
本发明的目的在于提供一种基于Vue实现电视Launcher系统web端预览组件的方法，用于解决现有技术中Launcher配置流程中不能在管理后台预览显示效果、不能及时调整配置内容的问题。
本发明通过下述技术方案解决上述问题：
一种基于Vue实现电视Launcher系统web端预览组件的方法，包括：
步骤S1：约定组件规格，按照组件类型分别设计不同的字段和组件样式，开发对应的组件，形成组件库；
步骤S2：新建后台服务，用于保存内容、组件和板块的数据及对应关系；
步骤S3：新建虚拟Launcher，虚拟Launcher为基于Vue模拟电视Launcher系统显示的web组件，虚拟Launcher为三层结构，分别为展示层、分发层和数据层，外部使用vue的v-bind向虚拟Launcher传输数据；
步骤S4：进入板块新增页面，从组件库中选取需要的组件添加至虚拟Launcher中，对组件进行增加、删除和调换位置操作，此时组件未配置内容，以框架形式进行展现，点击任一组件的编辑按钮进入组件内容的配置页面；
步骤S5：组件内容的编辑页面中，进行内容的新增、删除和调换位置操作，点击保存按钮通过后台服务将组件内容保存到数据库中，虚拟Launcher通过后端接口读取数据，展示内容同步更新；
步骤S6：将虚拟Launcher尺寸设置为电视机的通用尺寸，在页面中对虚拟Launcher进行等比例缩小，点击全屏预览按钮时，取消缩小比例。
本发明通过软件方式实现的电视系统的web端预览组件虚拟Launcher，运营人员可以在配置页面看到自己选择的组件的样式以及配置好内容后的展示情况，配置页面不再单单只是一些抽象的表单和列表，而是将这些数据组合成了可视化的一个虚拟Launcher来做展示，可以实现在运营人员在配置内容的同时，能够通过web端实时进行预览，避免必须先配置审核发布到终端，然后才能预览，发现问题再修改配置的复杂步骤，极大提高了运营效率。
本发明与现有技术相比，具有以下优点及有益效果：
本发明通过软件的方式设计一种基于Vue的web端组件，能够在配置过程中在管理后台直接进行电视Launcher系统界面的预览。
附图说明
图1为本发明中虚拟Launcher三层结构示意图。
具体实施方式
下面结合实施例对本发明作进一步地详细说明，但本发明的实施方式不限于此。
实施例1：
一种基于Vue实现电视Launcher系统web端预览组件的方法，这种基于Vue模拟电视Launcher系统显示的web组件简称为虚拟Launcher。Launcher配置中，最小的可配置单元定义为一个组件，组件由内容(即海报、视频等展示数据)构成，不同的组件以组件类型来做区分，多个组件组成一个板块，多个板块组成完整的Launcher。方法包括：
1、约定组件规格，根据组件类型的不同为组件设计字段和组件样式，开发对应的组件，形成组件库。
2、新建后台服务，用于保存内容、组件和板块的数据及对应关系。
3、新建虚拟Launcher组件，虚拟Launcher为三层结构，分别为展示层、分发层、数据层，如图1所示，外部向虚拟Launcher使用vue的v-bind进行数据传输。
4、进入板块新增页面，从组件库中选取需要的组件添加至虚拟Launcher中，组件可以任意地增加、删除、调换位置进行组合。此时组件未配置内容，以框架形式进行展现。点击任一组件的编辑按钮进入组件内容的配置页面。
5、组件内容的编辑页面中，对内容可以进行新增、删除、调换位置。点击保存按钮通过后台服务将组件内容保存到数据库中。虚拟Launcher通过后端接口读取数据，展示内容同步更新。
6、虚拟Launcher尺寸设置为电视机的通用尺寸1920*1080(单位：像素)，由于显示区域的大小限制，在页面中对虚拟Launcher进行等比例缩小。点击全屏预览按钮时，取消缩小比例，达到全屏展示功能。
采用本专利软件方式实现的电视系统的web端预览组件虚拟Launcher的方法，运营人员可以在配置页面看到自己选择的组件的样式以及配置好内容后的展示情况，配置页面不再单单只是一些抽象的表单和列表，而是将这些数据组合成了可视化的一个虚拟Launcher来做展示，可以实现在运营人员在配置内容的同时，能够通过web端实时进行预览，避免必须先配置审核发布到终端，然后才能预览，发现问题再修改配置的复杂步骤，极大提高了运营效率。
尽管这里参照本发明的解释性实施例对本发明进行了描述，上述实施例仅为本发明较佳的实施方式，本发明的实施方式并不受上述实施例的限制，应该理解，本领域技术人员可以设计出很多其他的修改和实施方式，这些修改和实施方式将落在本申请公开的原则范围和精神之内。

Claims (1)

1.一种基于Vue实现电视Launcher系统web端预览组件的方法，其特征在于，包括：
步骤S1：约定组件规格，按照组件类型分别设计不同的字段和组件样式，开发对应的组件，形成组件库；
步骤S2：新建后台服务，用于保存内容、组件和板块的数据及对应关系；
步骤S3：新建虚拟Launcher，虚拟Launcher为基于Vue模拟电视Launcher系统显示的web组件，虚拟Launcher为三层结构，分别为展示层、分发层和数据层，外部使用vue的v-bind向虚拟Launcher传输数据；
步骤S4：进入板块新增页面，从组件库中选取需要的组件添加至虚拟Launcher中，对组件进行增加、删除和调换位置操作，此时组件未配置内容，以框架形式进行展现，点击任一组件的编辑按钮进入组件内容的配置页面；
步骤S5：组件内容的编辑页面中，进行内容的新增、删除和调换位置操作，点击保存按钮通过后台服务将组件内容保存到数据库中，虚拟Launcher通过后端接口读取数据，展示内容同步更新；
步骤S6：将虚拟Launcher尺寸设置为电视机的通用尺寸，在页面中对虚拟Launcher进行等比例缩小，点击全屏预览按钮时，取消缩小比例。
CN202110571106.7A 2021-05-25 2021-05-25 基于Vue实现电视Launcher系统web端预览组件的方法 Active CN113242471B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110571106.7A CN113242471B (zh) 2021-05-25 2021-05-25 基于Vue实现电视Launcher系统web端预览组件的方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110571106.7A CN113242471B (zh) 2021-05-25 2021-05-25 基于Vue实现电视Launcher系统web端预览组件的方法

Publications (2)

Publication Number Publication Date
CN113242471A CN113242471A (zh) 2021-08-10
CN113242471B true CN113242471B (zh) 2022-07-12

Family

ID=77138601

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110571106.7A Active CN113242471B (zh) 2021-05-25 2021-05-25 基于Vue实现电视Launcher系统web端预览组件的方法

Country Status (1)

Country Link
CN (1) CN113242471B (zh)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106162302A (zh) * 2015-04-22 2016-11-23 Tcl集团股份有限公司 一种Launcher主界面的编排方法、装置及智能电视
CN110602539A (zh) * 2019-08-26 2019-12-20 贵州省广播电视信息网络股份有限公司 一种基于TV的Vue框架实现
CN110865863A (zh) * 2019-11-18 2020-03-06 北京小米移动软件有限公司 快应用的界面显示方法、装置及存储介质
CN111045655A (zh) * 2019-12-18 2020-04-21 广州市百果园信息技术有限公司 一种页面渲染的方法、装置、渲染服务器和存储介质
CN111835646A (zh) * 2020-07-13 2020-10-27 四川虹魔方网络科技有限公司 一种基于Vue的模块化路由管理方法及权限控制方法

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US11438658B2 (en) * 2016-12-31 2022-09-06 Turner Broadcasting System, Inc. Client-side dynamic presentation of programming content in an indexed disparate live media output stream

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106162302A (zh) * 2015-04-22 2016-11-23 Tcl集团股份有限公司 一种Launcher主界面的编排方法、装置及智能电视
CN110602539A (zh) * 2019-08-26 2019-12-20 贵州省广播电视信息网络股份有限公司 一种基于TV的Vue框架实现
CN110865863A (zh) * 2019-11-18 2020-03-06 北京小米移动软件有限公司 快应用的界面显示方法、装置及存储介质
CN111045655A (zh) * 2019-12-18 2020-04-21 广州市百果园信息技术有限公司 一种页面渲染的方法、装置、渲染服务器和存储介质
CN111835646A (zh) * 2020-07-13 2020-10-27 四川虹魔方网络科技有限公司 一种基于Vue的模块化路由管理方法及权限控制方法

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
基于Vue的自动化测试平台的设计与实现;李宗昊;《中国优秀硕士学位论文全文数据库 信息科技辑》;20210315(第3期);I138-136 *

Also Published As

Publication number Publication date
CN113242471A (zh) 2021-08-10

Similar Documents

Publication Publication Date Title
US7184801B2 (en) Mobile application builder
US7168041B1 (en) Method and apparatus for table and HDL based design entry
CN113268233B (zh) 一种页面生成方法、装置、计算机设备及存储介质
CN115712413B (zh) 低代码开发方法、装置、设备及存储介质
US9678632B2 (en) Data processing method and apparatus
CN112162687B (zh) 图片生成方法和装置、存储介质及电子设备
CN108490336A (zh) 板卡测试方法、系统、可读存储介质及计算机设备
CN107426588B (zh) 一种获取电视机配置信息方法、系统及存储装置
CN109117127A (zh) 程序代码生成方法、装置及计算机可读存储介质
CN112000911A (zh) 页面管理方法、装置、电子设备以及存储介质
CN113242471B (zh) 基于Vue实现电视Launcher系统web端预览组件的方法
CN109725973B (zh) 一种数据处理方法和数据处理装置
CN114047855B (zh) 一种表单编辑方法、装置及终端设备
CN111061532A (zh) 一种壁纸展示方法及终端设备
CN105487769A (zh) 一种媒体文件展示方法、装置及电子设备
JP2017102872A (ja) 開発装置、開発システム、およびプログラム
CN114168028A (zh) 一种智慧酒店电视系统ui定制装置
CN115203162A (zh) 一种所见即所得图数据构建方法
CN114692055A (zh) 表单处理方法、装置、存储介质与电子设备
CN108984176B (zh) 一种高自定义桌面开发系统
CN111104196A (zh) 一种壁纸展示方法及终端设备
CN112235628A (zh) 一种电视操作系统的多窗口打开方法、装置、设备和介质
CN108737890A (zh) 多进程频道数据切换方法、装置、电视机及存储介质
CN1752901B (zh) 利用同屏显示的移动通信终端文件夹搜索及数据管理方法
JP2012064156A (ja) 情報処理装置とその処理方法及びプログラム

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