CN106162302A - Method of combination, device and the intelligent television at the main interface of a kind of Launcher - Google Patents
Method of combination, device and the intelligent television at the main interface of a kind of Launcher Download PDFInfo
- Publication number
- CN106162302A CN106162302A CN201510194244.2A CN201510194244A CN106162302A CN 106162302 A CN106162302 A CN 106162302A CN 201510194244 A CN201510194244 A CN 201510194244A CN 106162302 A CN106162302 A CN 106162302A
- Authority
- CN
- China
- Prior art keywords
- block
- mouse
- launcher
- tab
- main interface
- 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.)
- Granted
Links
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/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/431—Generation of visual interfaces for content selection or interaction; Content or additional data rendering
- H04N21/4312—Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations
-
- 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/80—Generation or processing of content or additional data by content creator independently of the distribution process; Content per se
- H04N21/81—Monomedia components thereof
- H04N21/8146—Monomedia components thereof involving graphical data, e.g. 3D object, 2D graphics
-
- 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/80—Generation or processing of content or additional data by content creator independently of the distribution process; Content per se
- H04N21/81—Monomedia components thereof
- H04N21/8166—Monomedia components thereof involving executable data, e.g. software
- H04N21/8186—Monomedia components thereof involving executable data, e.g. software specially adapted to be executed by a peripheral of the client device, e.g. by a reprogrammable remote control
Landscapes
- Engineering & Computer Science (AREA)
- Multimedia (AREA)
- Signal Processing (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Computer Graphics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The present invention is applicable to intelligent television technical field, provide the method for combination at the main interface of a kind of Launcher, device and intelligent television, described method includes: obtains Tab information, and according to described Tab information, the editing area at main for Launcher interface is divided into multiple Tab；Tab page is created for each Tab；Tab page created adds Block, delete Block, by mouse drag and mobile by the way of adjust the size of Block or adjust the position of Block；The content of editor Block；Preserve the main interface information of Launcher created and issue.The present invention, can make operation personnel use the mode pulling and moving to carry out the size and location of layout Block, be greatly improved Consumer's Experience, improves operation personnel's layout intelligent television Launcher work efficiency.
Description
Technical field
The invention belongs to intelligent television technical field, particularly relate to the layout side at the main interface of a kind of Launcher
Method, device and intelligent television.
Background technology
The main interface of Launcher of traditional intelligent television just sets when being typically to dispatch from the factory, it is impossible to dynamically become
Change.Some intelligent television can dynamically change the content at the main interface of Launcher, but cannot change Launcher
The layout at main interface, if the layout at the main interface of Launcher to be changed is only by Android android system
The upgrading of version completes the change at the main interface of Launcher.
Along with " Intelligent hardware interconnection networking ", the operation of intelligent television the Internet has been a kind of trend.Traditional
The renewal speed at the main interface of Launcher of intelligent television cannot meet the demand of user.Launcher master
Interface operation personnel to adjust the main interface of Launcher at any time according to the change in market.
The arranging system great majority at the main interface of Launcher based on WEB that currently there are still are joined
The mode of putting, this arranged mode typically requires Intelligent television terminal and coordinates display just can see the effect of layout
Really, the most directly perceived, it is impossible to accomplish What You See Is What You Get.
Summary of the invention
Embodiments provide the method for combination at the main interface of a kind of Launcher, system, it is intended to solve existing
The method of combination at the main interface of Launcher having technology to provide, needs Intelligent television terminal to coordinate display just can see
To the effect of layout, the most directly perceived, it is impossible to the problem accomplishing What You See Is What You Get.
On the one hand, it is provided that the method for combination at the main interface of a kind of Launcher, described method includes:
Obtain Tab information, and according to described Tab information, the editing area at main for Launcher interface is divided into multiple
Tab；
Tab page is created for each Tab；
Tab page created adds Block, deletion Block, adjusts by the way of mouse drag and movement
The size of Block or the position of adjustment Block；
The content of editor Block；
Preserve the main interface information of Launcher created and issue.
Further, the main interface information of Launcher of described establishment is JS object, creates described preservation
The main interface information of Launcher before, also include:
JS object is changed into the data of data exchange json form.
Further, after the described main interface information of Launcher preserving establishment issue, described method
Also include:
Obtain the data of the data exchange json form of the main interface information of Launcher of described establishment；
The data of the json form of the described main interface information of the Launcher created are changed into JS object；
Described JS object is edited.
Further, described described JS object is edited particularly as follows: editor at the main interface of Launcher
District adds Tab page, deletes Tab page or editor Tab page, and described editor Tab page includes: add on Tab page
Add Block, deletion Block, by the way of mouse drag and movement, adjust the size of Block or adjust Block
Position.
Further, described on Tab page created by mouse drag and mobile by the way of adjusting Block
Size, including:
Binding mouse event；
When mouse event is mousedown, the original position of record mouse；
When mouse event is mousemove, obtains the new position of mouse in real time and update described Block's
The value of width and height attribute；
When mouse event is mouseup, reset on the right of described Block and the position of following Block.
Further, described on Tab page created by mouse drag and mobile by the way of adjust Block
Position, including:
Binding mouse event；
When mouse event is mousedown, the original position of record mouse；
When mouse event is mousemove, obtains the new position of mouse in real time and update described Block's
The value of left and top attribute；
When mouse event is mouseup, reset on the right of described Block and the position of following Block.
Further, described deletion Block on Tab page created, including:
By the label set and the click event binding of mouse；
The click event of mouse is monitored by the label of described setting；
When listen to user by the label that sets described in click after, delete the label place of described setting
Block.
On the other hand, it is provided that the layout device at the main interface of a kind of Launcher, described device includes:
Tab division unit, is used for obtaining Tab information, and according to described Tab information by main for Launcher interface
Editing area is divided into multiple Tab；
Tab page of creating unit, for creating Tab page for each Tab；
Block operating unit, for adding Block, deleting Block, pass through mouse on Tab page created
The mode pulling and moving adjusts the size of Block or adjusts the position of Block；
Block edit cell, for editing the content of Block；
Release unit, for preserving the main interface information of Launcher of establishment and issuing.
Further, the main interface information of Launcher of described establishment is JS object, and described device also includes:
First converting unit, for changing into the data of data exchange json form by JS object.
Further, described device also includes:
Data capture unit, for obtaining the data exchange json of the main interface information of Launcher of described establishment
The data of form；
Second converting unit, for the data by the json form of the described main interface information of the Launcher created
Change into JS object；
JS object editing unit, for editing described JS object.
Further, the described JS object editing unit editing area at the main interface of Launcher adds Tab page, deletes
Except Tab page or editor Tab page, described editor Tab page includes: on Tab page add Block, delete Block,
Adjust the size of Block by mouse drag or adjust the position of Block by the way of mobile.
Further, described Block operating unit includes:
First event binding module, is used for binding mouse event；
Primary importance logging modle, for when mouse event is mousedown, records the start bit of mouse
Put；
First attribute setup module, for when mouse event is mousemove, obtains the new of mouse in real time
Position also updates the value of width and height attribute of described Block；
Primary importance resets module, for when mouse event is mouseup, resets on the right of described Block
Position with following Block.
Further, described Block operating unit also includes:
Second event binding module, is used for binding mouse event；
Second position logging modle, for when mouse event is mousedown, records the start bit of mouse
Put；
Second attribute setup module, for when mouse event is mousemove, obtains the new of mouse in real time
Position also updates the value of width and height attribute of described Block；
The second position resets module, for when mouse event is mouseup, resets on the right of described Block
Position with following Block.
Further, described Block operating unit also includes:
3rd event binding module, for the label that will set and the click event binding of mouse；
Monitor module, for being monitored the click event of mouse by the label of described setting；
Removing module, for when listen to user by the label that sets described in click after, delete described in
The Block at the label place set.
Another aspect, it is provided that a kind of intelligent television, described intelligent television includes Launcher master as above
The layout device at interface.
In the embodiment of the present invention, operation personnel can be made to use the mode pulling and moving to carry out the big of layout Block
Little and position, this graphical visual method of combination is greatly improved Consumer's Experience, improves operation people
Member's layout intelligent television Launcher work efficiency, and accessed whenever and wherever possible by browser based on the Internet
Arranging system carries out the layout of intelligent television Launcher, What You See Is What You Get, it addition, also improve Intelligent electric
Renewal speed depending on the main interface of terminal Launcher: can be timely behind the main interface of the complete Launcher of WEB terminal layout
Issue, Intelligent television terminal start immediate updating.The volume at the main interface of Launcher provided compared to existing technology
Discharge method, needs Intelligent television terminal to coordinate display just can see the effect of layout, the most directly perceived, it is impossible to do
Problem to What You See Is What You Get.
Accompanying drawing explanation
Fig. 1 is the flowchart of the method for combination at the main interface of Launcher that the embodiment of the present invention one provides；
Fig. 2 is the interface schematic diagram of the method for combination at the main interface of Launcher that the embodiment of the present invention one provides；
Fig. 3 is the actual effect signal of the method for combination at the main interface of Launcher that the embodiment of the present invention one provides
Figure；
Fig. 4, Fig. 5 and Fig. 6 are the layout side at the main interface of Launcher that the embodiment of the present invention one provides respectively
When method adjusts the position of Block, adjust schematic diagram during Block and other Block overlap of position；
Fig. 7 is the structured flowchart of the layout device at the main interface of Launcher that the embodiment of the present invention two provides.
Detailed description of the invention
In order to make the purpose of the present invention, technical scheme and advantage clearer, below in conjunction with accompanying drawing and reality
Execute example, the present invention is further elaborated.Only should be appreciated that specific embodiment described herein
Only in order to explain the present invention, it is not intended to limit the present invention.
In embodiments of the present invention, Tab information is obtained and according to described Tab information by main for Launcher interface
Editing area be divided into after multiple Tab and create Tab page for each Tab, then add on Tab page created
Block, deletion Block, the size adjusting Block by the way of mouse drag and movement or adjustment Block
Position, then edit the content of Block, finally preserve the main interface information of Launcher of establishment and issue,
Operation personnel can be made to use the mode pulling and moving to carry out the size and location of layout Block.
Below in conjunction with specific embodiment, the realization of the present invention is described in detail:
Embodiment one
Fig. 1 shows the realization stream of the method for combination at the main interface of Launcher that the embodiment of the present invention one provides
Journey, this method uses JavaScript language and supports browser-cross layout based on JQuery framework, describing in detail such as
Under:
In step S101, obtain Tab information, and according to described Tab information by main for Launcher interface
Editing area is divided into multiple Tab.
In embodiments of the present invention, Tab information includes Tab title, order and at least one Tab attribute letter
Breath.As in figure 2 it is shown, Tab information shows in Tab list, Tab information include Tab title, order,
Attribute 1, attribute 2 and attribute 3.
Concrete, Tab attribute information can include identifying id, pattern, terminal can be edited, terminal can show,
Layout is fixed, content is fixed, as shown in Figure 3.
After getting Tab information, the establishment button in Fig. 2 can be clicked on, trigger and create the main interface of Launcher
Event, start to create the main interface of Launcher.
After clicking on the interpolation Tab button in Fig. 2, the arranging system at the main interface of Launcher obtains Tab automatically
Information, and according to described Tab information, the editing area at main for Launcher interface is divided into multiple Tab.
Concrete, after clicking on the interpolation Tab button in Fig. 2, trigger and eject the event adding Tab window,
User is adding the correlation attribute information of typing Tab in Tab window and is preserving.Tab list shown in Fig. 2
The Tab information that a line is newly added can be increased.The most also one Tab list of display, in this Tab list
Display Tab information.Wherein, with click order upwardly or downwardly can change Launcher master
In interface, each Tab's puts in order.
According to the Tab information shown in Fig. 3 top half, the arranging system at the main interface of Launcher is by Launcher
Main interface editing zoning is divided into 7 Tab, is respectively recommendation, video display, TV, prefecture, educates, plays
And application.Corresponding one Tab page of each Tab, each Tab page is a painting canvas, such as the lower half of Fig. 3
Shown in point, can be added as needed on, delete and edit painting canvas.
In step s 102, Tab page is created for each Tab.
In embodiments of the present invention, a selected Tab, create Tab page for this Tab, each Tab page is
One painting canvas, the Block number in Tab page of acquiescence establishment is 0.
Using first piece of element div in html tag as painting canvas, the height and width of painting canvas are fixed when initializing
Justice.Painting canvas is divided into several cells, and the height and width of cell define when painting canvas initializes.Will
Second piece of element div in html tag is as the block Block in painting canvas, and painting canvas is made up of Block, Block
Gap size define when painting canvas initializes, the Block in painting canvas is rectangle, occupies one or more list
Unit's lattice.
When creating painting canvas for each Tab, it is necessary first to create canvas object and the underlying attribute of painting canvas is set:
Widget_tag:Block tag element
The spacing distance of widget_margins:Block
The height and width of widget_base_dimensions cell
Background:#BBB defines the background color of painting canvas
Backgroud:#DDD defines the background color of Block
Cursor:pointer defines mouse pointer and moves to become above tag element hand-type, by CSS literary composition
Pattern in part is loaded in painting canvas.
Secondly, need building method function Canvas () to obtain painting canvas html label object assignment, add
When carrying the page, the html of painting canvas is exported in browser, create Block array object and be used for depositing interpolation
Block object, create style tags object deposit painting canvas styled objects.Initialize init () will draw above
The attribute assignment of cloth is to attribute corresponding to canvas object.
In step s 103, Tab page created adds Block, deletion Block, dragged by mouse
The mode dragged and move adjusts the size of Block or adjusts the position of Block.
In embodiments of the present invention, 1*1,2*1,1*2 and the 2*2 shown in Fig. 2 is 4 interpolations arranged
The button of Block.1*1 represents that the Block height of interpolation occupies 1 cell and wide occupies 1 cell
(Block1 and Block2 as in Fig. 2), 2*1 represents that the Block height of interpolation occupies 2 cells also
And wide occupying 1 cell (Block3 as in Fig. 2), 1*2 represents that the Block height of interpolation occupies 1
Cell and wide occupy 2 cells (Block6 and Block7 as in Fig. 2), 2*2 represents interpolation
Block height occupy 1 cell and wide 2 cells (Block4 as in Fig. 2) that occupy, add
The button of Block can also be extended according to user's request.
If Block has existed in painting canvas, then parameter (col, row, x_size, y_size) is set, and calls and add
Add Block method to be added in painting canvas by Block；If the Block in painting canvas does not exists, need to click on
Add Block button to be added.
The process adding Block is as follows:
Create Block object and the coordinate calculating Block be set:
Col:Block occupies a few column unit lattice
Row:Block occupies a few row cell
The x-axis coordinate in the x_size:Block upper left corner
The y-axis coordinate in the y_size:Block upper left corner
If clicking on button to add Block, calculate Block's according to the specification of the button added
(col, row, x_size, y_size) parameter, acquiescence order of addition is from left to right.
Such as: specification is that the parameter of 1*2 is calculated as follows:
The x-axis coordinate y_size=0 of col=2 row=1 x_size=painting canvas
Coordinate and the height and width of Block in the lower right corner of Block can be calculated by above 4 parameters
The coordinate in the lower right corner of Block (x, y)
The height of the wide y=y_size+row* cell of x=x_size+col* cell
The height and width (height, width) of Block
The width of the high width=col* cell of height=row* cell
The html fragment of assembling Block:
Label<div class=" block_content ">is used for depositing the content that Block edits
Label<i>is used for monitoring the click event of mouse, and user deletes this after clicking on this label
The Block at label place
The attribute being arranged above with is changed into attribute and adds in middle BlockHtml, simultaneously to canvas object
Interpolation Block object in Block array:
In the div at painting canvas place, add the html fragment of Block and call fadeIn () method by interpolation
Block shows in the way of fading in.
Deleting Block is to be removed by div corresponding for Block, the click event of the label of setting with mouse is tied up
After Ding, monitored the click event of mouse by the label of described setting, pass through click when listening to user
After the label of described setting, deleting the Block at the label place of described setting, the process deleting Block is as follows:
Label<i>above is bound click event, and this label of click, by the Block at this label place
Corresponding html fragment is deleted from painting canvas, calls fadeOut () method by the Block of deletion with the side faded out
Formula shows.
When mouse moves to the lower right corner of Block, mouse shape becomes four-headed arrow, can after clicking on mouse
To adjust the size of Block, the height and width of Block can only be adjusted to the integral multiple of cell height and width.Adjust
After size, painting canvas recalculates below this Block and the coordinate of all of Block in the right side, and changes them
Xy axial coordinate.The process of the size adjusting Block by the way of mouse drag and movement is as follows:
First it is mousedown, mousemove, mouseup of div tag binding mouse corresponding for Block
Event；
When mousedown, the initial position message x-axis coordinate y-axis coordinate of record mouse；
When mousemove, constantly obtain the new position of mouse, calculate mouse side-play amount in real time, according to
Mouse side-play amount, the wide height of cell, deviation post algorithm calculate width and height of Block pattern in real time
The value of attribute also updates；
When mouseup, terminate to be sized, and reset on the right of described Block with following Block's
Position.If the Block adjusted becomes big, then by the right of the Block of adjustment and following Block is to moving down
Dynamic, if the Block adjusted diminishes, then will move up with following Block on the right of the Block of adjustment.
Such as: adjusting Block1 in Fig. 2 (1*1) to Block1 (2*2), Block2 moves down 1 list
Unit's lattice, Block3 moves down 1 cell.
Deviation post algorithm:
A), lateral distance
(if mouse transversal displacement % cell width) >=0.5* cell width
The transversal displacement of Block=(mouse transversal displacement % cell wide+1) * cell width
The width property value of Block pattern=Block initial pattern width property value ± Block's is the most inclined
Shifting amount
(if mouse transversal displacement % cell width) < 0.5* cell width
The transversal displacement of Block=(mouse transversal displacement % cell width) * cell width
The width property value of Block pattern=Block initial pattern width property value ± Block's is the most inclined
Shifting amount
B), distance is vertically moved
(if mouse vertical misalignment amount % cell were high) >=0.5* cell height
The vertical misalignment amount of Block=(mouse vertical misalignment amount/cell wide+1) * cell is high
The heigth property value of Block pattern=Block initial pattern heigth property value ± Block's is the most inclined
Shifting amount
If (mouse vertical misalignment amount % cell is high) < 0.5* cell is high
The transversal displacement of Block=(mouse vertical misalignment amount/cell is high) * cell is high
The heigth property value of Block pattern=Block initial pattern heigth property value ± Block's is the most inclined
Shifting amount
When mouse moves to region corresponding for Block, mouse shape becomes hand-type, permissible after clicking on mouse
Adjusting the position of Block, Block can only the integral multiple of height and width of mobile unit lattice.By mouse drag and
The mode of movement adjusts the position of Block, and detailed process is as follows:
First be corresponding for the Block div tag binding mousedown of mouse, mousemove,
Mouseup event；
When mousedown, the initial position message x-axis coordinate y-axis coordinate of record mouse；
When mousemove, constantly obtain the new position of mouse, calculate mouse side-play amount in real time, according to
Side-play amount and deviation post algorithm, the value of left and the top attribute in real-time update Block pattern；
When mouseup, reset on the right of described Block and the position of following Block.
Preferably, when mouseup, can use judge whether overlapping algorithm check this Block whether with
Other Block are overlapping, if overlapping, the most mobile invalid.
Judge whether the coordinate in the upper left corner of overlapping algorithm: Block for (x1, y1), the coordinate in the lower right corner is
(x2,y2)
If the coordinate in the upper left corner of the coordinate in the coordinate in the upper left corner of Block a and the lower right corner and Block b and
Following relation is met, then it represents that Block a and Block b is overlapping between the coordinate in the lower right corner.
Relation 1:(b.x1 >=a.x1&&b.x1≤a.x2) | | (b.y1 >=a.y1&&b.y1≤a.y2), as
Shown in Fig. 4；
Relation 2:(b.x2 >=a.x1&&b.x2≤a.x2) | | b.y2 >=a.y1&&b.y2≤a.y2), as
Shown in Fig. 5；
Relation 3:(a.x1 >=b.x1&&a.x2≤b.x2) | | (a.y1 >=b.y1&&a.y2≤b.y2), as
Shown in Fig. 6.
In step S104, the content of editor Block.
In embodiments of the present invention, to the label binding double click event of Block, double mouse click ejects in selecting
The window held, selects content, after preserving, the html fragment of generation is inserted into < div above
In class=" block_content " > label.
In step S105, preserve the main interface information of Launcher created and issue.
In embodiments of the present invention, when preserving the main interface information of Launcher created, JS object is converted
Preserve to backstage after becoming the data of data exchange json form.
Preferably, in embodiments of the present invention, it is also possible to the main interface of Launcher created is edited,
When editing, first obtain the data of the data exchange json form of the main interface information of Launcher of establishment,
Again the data of the json form of the described main interface information of the Launcher created are changed into JS object, the most right
Described JS object is edited.
Concrete, the editor carrying out described JS object specifically includes: at the editing area at the main interface of Launcher
Adding Tab page, delete Tab page or editor Tab page, described editor Tab page includes: add on Tab page
Block, deletion Block, the size adjusting Block or the position of adjustment Block.
Preferably, in embodiments of the present invention, can be according to the line number at the place of Block or columns to painting canvas
In Block rearrange, provide the user the arrangement mode of following several Block:
Sort_by_row_asc () arranges Block according to the row ascending order at Block place；
Sort_by_row_desc () is according to the row descending Block at Block place；
Sort_by_col_asc () arranges Block according to the row ascending order at Block place；
Sort_by_col_desc () is according to the row descending Block at Block place.
The present embodiment, can make fortune by intelligent television Launcher based on WEB main interface method of combination
Battalion personnel use the size and location carrying out layout Block by the way of mouse drag and movement, this figure
Change visual method of combination and be greatly improved Consumer's Experience, improve operation personnel's layout intelligent television
Launcher work efficiency, and carry out intelligence based on the Internet by browser access arrangement system whenever and wherever possible
The layout of energy TV Launcher, What You See Is What You Get, it addition, also improve Intelligent television terminal Launcher
The renewal speed at main interface.The complete Launcher of WEB terminal layout can issue behind main interface in time, Intelligent electric
Depending on starting up of terminal immediate updating, even allow the user can only the main interface of Launcher of TV from edlin, it is provided that
The most intelligent more personalized interface arranges function.The layout at the main interface of Launcher provided compared to existing technology
Method, needs Intelligent television terminal to coordinate display just can see the effect of layout, the most directly perceived, it is impossible to accomplish
The problem of What You See Is What You Get.
It addition, the Launcher main interface method of combination that the embodiment of the present invention provides, use JavaScript language
Speech also supports browser-cross layout based on JQuery framework, owing to front end JavaScript code amount is little, browses
Device loading velocity is fast so that editing operation is smooth so that layout efficiency is greatly improved.
One of ordinary skill in the art will appreciate that all or part of step realizing in the various embodiments described above method
The program that can be by completes to instruct relevant hardware, and corresponding program can be stored in a computer can
Reading in storage medium, described storage medium, such as ROM/RAM, disk or CD etc..
Embodiment two
Fig. 7 shows the concrete structure of the layout device at the main interface of Launcher that the embodiment of the present invention two provides
Block diagram, for convenience of description, illustrate only the part relevant to the embodiment of the present invention.The main boundary of this Launcher
The layout device in face can be software unit, hardware cell or the software and hardware combining being built in intelligent television
Unit, the layout device 7 at the main interface of this Launcher includes: Tab division unit 71, Tab page of establishment
Unit 72, Block operating unit 73, Block edit cell 74 and release unit 75.
Wherein, Tab division unit 71, it is used for obtaining Tab information, and according to described Tab information by Launcher
The editing area at main interface is divided into multiple Tab；
Tab page of creating unit 72, for creating Tab page for each Tab；
Block operating unit 73, for adding Block, deleting Block, pass through Mus on Tab page created
The mode that mark pulls and moves adjusts the size of Block or adjusts the position of Block；
Block edit cell 74, for editing the content of Block；
Release unit 75, for preserving the main interface information of Launcher of establishment and issuing.
Further, the main interface information of Launcher of described establishment is JS object, and described device 7 also wraps
Include:
First converting unit, for changing into the data of data exchange json form by JS object.
Further, described device 7 also includes:
Data capture unit, for obtaining the data exchange json of the main interface information of Launcher of described establishment
The data of form；
Second converting unit, for the data by the json form of the described main interface information of the Launcher created
Change into JS object；
JS object editing unit, for editing described JS object.
Further, the described JS object editing unit editing area at the main interface of Launcher adds Tab page, deletes
Except Tab page or editor Tab page, described editor Tab page includes: on Tab page add Block, delete Block,
Adjust the size of Block by mouse drag or adjust the position of Block by the way of mobile.
Further, described Block operating unit 73 includes:
First event binding module, is used for binding mouse event；
Primary importance logging modle, for when mouse event is mousedown, records the start bit of mouse
Put；
First attribute setup module, for when mouse event is mousemove, obtains the new of mouse in real time
Position also updates the value of width and height attribute of described Block；
Primary importance resets module, for when mouse event is mouseup, resets on the right of described Block
Position with following Block.
Further, described Block operating unit 73 also includes:
Second event binding module, is used for binding mouse event；
Second position logging modle, for when mouse event is mousedown, records the start bit of mouse
Put；
Second attribute setup module, for when mouse event is mousemove, obtains the new of mouse in real time
Position also updates the value of width and height attribute of described Block；
The second position resets module, for when mouse event is mouseup, reset on the right of described Block and
The position of following Block.
Further, described Block operating unit 73 also includes:
3rd event binding module, for the label that will set and the click event binding of mouse；
Monitor module, for being monitored the click event of mouse by the label of described setting；
Removing module, for when listen to user by the label that sets described in click after, delete described in
The Block at the label place set.
The layout device at the main interface of Launcher that the embodiment of the present invention provides can be applied in the side of aforementioned correspondence
In method embodiment one, details see the description of above-described embodiment one, do not repeat them here.
It should be noted that in said apparatus embodiment, included unit is according to function logic
Carry out dividing, but be not limited to above-mentioned division, as long as being capable of corresponding function；Separately
Outward, the specific name of each functional unit also only to facilitate mutually distinguish, is not limited to the present invention's
Protection domain.
The foregoing is only presently preferred embodiments of the present invention, not in order to limit the present invention, all at this
Any amendment, equivalent and the improvement etc. made within bright spirit and principle, should be included in the present invention
Protection domain within.
Claims (15)
1. the method for combination at the main interface of Launcher, it is characterised in that described method includes:
Obtain Tab information, and according to described Tab information, the editing area at main for Launcher interface is divided into multiple
Tab；
Tab page is created for each Tab；
Tab page created adds Block, deletion Block, adjusts by the way of mouse drag and movement
The size of Block or the position of adjustment Block；
The content of editor Block；
Preserve the main interface information of Launcher created and issue.
2. the method for claim 1, it is characterised in that the Launcher main interface letter of described establishment
Breath is JS object, before the described main interface information of Launcher preserving and creating, also includes:
JS object is changed into the data of data exchange json form.
3. method as claimed in claim 2, it is characterised in that at the described Launcher preserving and creating
After main interface information issue, described method also includes:
Obtain the data of the data exchange json form of the main interface information of Launcher of described establishment；
The data of the json form of the described main interface information of the Launcher created are changed into JS object；
Described JS object is edited.
4. method as claimed in claim 3, it is characterised in that described carry out described JS object edits tool
Body is: the editing area at the main interface of Launcher adds Tab page, deletes Tab page or editor Tab page, described
Edit Tab page to include: on Tab page, add Block, delete Block, side by mouse drag and movement
Formula adjusts the size of Block or adjusts the position of Block.
5. the method for claim 1, it is characterised in that described create Tab page on passing through
The mode of mouse drag and movement adjusts the size of Block, including:
Binding mouse event；
When mouse event is mousedown, the original position of record mouse；
When mouse event is mousemove, obtains the new position of mouse in real time and update described Block's
The value of width and height attribute；
When mouse event is mouseup, reset on the right of described Block and the position of following Block.
6. the method for claim 1, it is characterised in that described create Tab page on pass through Mus
The mode that mark pulls and moves adjusts the position of Block, including:
Binding mouse event；
When mouse event is mousedown, the original position of record mouse；
When mouse event is mousemove, obtains the new position of mouse in real time and update described Block's
The value of left and top attribute；
When mouse event is mouseup, reset on the right of described Block and the position of following Block.
7. the method for claim 1, it is characterised in that described deletion on Tab page created
Block, including:
By the label set and the click event binding of mouse；
The click event of mouse is monitored by the label of described setting；
When listen to user by the label that sets described in click after, delete the label place of described setting
Block.
8. the layout device at the main interface of Launcher, it is characterised in that described device includes:
Tab division unit, is used for obtaining Tab information, and according to described Tab information by main for Launcher interface
Editing area is divided into multiple Tab；
Tab page of creating unit, for creating Tab page for each Tab；
Block operating unit, for adding Block, deleting Block, pass through mouse on Tab page created
The mode pulling and moving adjusts the size of Block or adjusts the position of Block；
Block edit cell, for editing the content of Block；
Release unit, for preserving the main interface information of Launcher of establishment and issuing.
9. device as claimed in claim 8, it is characterised in that the Launcher main interface letter of described establishment
Breath is JS object, and described device also includes:
First converting unit, for changing into the data of data exchange json form by JS object.
10. device as claimed in claim 9, it is characterised in that described device also includes:
Data capture unit, for obtaining the data exchange json of the main interface information of Launcher of described establishment
The data of form；
Second converting unit, for the data by the json form of the described main interface information of the Launcher created
Change into JS object；
JS object editing unit, for editing described JS object.
11. devices as claimed in claim 10, it is characterised in that described JS object editing unit exists
The editing area at the main interface of Launcher adds Tab page, deletes Tab page or editor Tab page, described editor Tab
Page includes: adds Block, deletion Block on Tab page, adjust by the way of mouse drag and movement
The size of Block or the position of adjustment Block.
12. devices as claimed in claim 8, it is characterised in that described Block operating unit includes:
First event binding module, is used for binding mouse event；
Primary importance logging modle, for when mouse event is mousedown, records the start bit of mouse
Put；
First attribute setup module, for when mouse event is mousemove, obtains the new of mouse in real time
Position also updates the value of width and height attribute of described Block；
Primary importance resets module, for when mouse event is mouseup, resets on the right of described Block
Position with following Block.
13. devices as claimed in claim 8, it is characterised in that described Block operating unit also includes:
Second event binding module, is used for binding mouse event；
Second position logging modle, for when mouse event is mousedown, records the start bit of mouse
Put；
Second attribute setup module, for when mouse event is mousemove, obtains the new of mouse in real time
Position also updates the value of width and height attribute of described Block；
The second position resets module, for when mouse event is mouseup, resets on the right of described Block
Position with following Block.
14. devices as claimed in claim 8, it is characterised in that described Block operating unit also includes:
3rd event binding module, for the label that will set and the click event binding of mouse；
Monitor module, for being monitored the click event of mouse by the label of described setting；
Removing module, for when listen to user by the label that sets described in click after, delete described in
The Block at the label place set.
15. 1 kinds of intelligent televisions, it is characterised in that described intelligent television includes such as claim 8 to 14
The layout device at the main interface of Launcher described in any one.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201510194244.2A CN106162302B (en) | 2015-04-22 | 2015-04-22 | Layout method and device for Launcher main interface and smart television |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201510194244.2A CN106162302B (en) | 2015-04-22 | 2015-04-22 | Layout method and device for Launcher main interface and smart television |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN106162302A true CN106162302A (en) | 2016-11-23 |
| CN106162302B CN106162302B (en) | 2020-08-18 |
Family
ID=57346533
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201510194244.2A Active CN106162302B (en) | 2015-04-22 | 2015-04-22 | Layout method and device for Launcher main interface and smart television |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN106162302B (en) |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107483449A (en) * | 2017-08-24 | 2017-12-15 | 四川长虹电器股份有限公司 | A kind of generally applicable television terminal management systems and management method |
| CN109656669A (en) * | 2018-12-26 | 2019-04-19 | 深圳创维数字技术有限公司 | Launcher method for running, device, equipment and computer readable storage medium |
| CN109783097A (en) * | 2018-12-29 | 2019-05-21 | 南京控维通信科技有限公司 | Draw the implementation method of web frequency diagram plug-in unit |
| CN110704146A (en) * | 2019-08-30 | 2020-01-17 | 华为技术有限公司 | Focus management method applied to electronic equipment and electronic equipment |
| CN113242471A (en) * | 2021-05-25 | 2021-08-10 | 四川虹魔方网络科技有限公司 | Vue-based method for realizing preview component of television Launcher system web end |
| CN114816202A (en) * | 2022-05-09 | 2022-07-29 | 广州市易工品科技有限公司 | Method, device, equipment and medium for chart cross-boundary interaction in tab component |
Citations (21)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101083750A (en) * | 2006-05-31 | 2007-12-05 | 北京汉辰科技有限公司 | Service application of personal television and its realizing method |
| CN101140516A (en) * | 2007-10-22 | 2008-03-12 | 金蝶软件（中国）有限公司 | Method and system for dynamic laying-out interface element |
| CN101196818A (en) * | 2006-12-08 | 2008-06-11 | 上海全景数字技术有限公司 | Fast graphical developing system |
| CN101207450A (en) * | 2007-12-14 | 2008-06-25 | 北大方正集团有限公司 | Method, system for making special subject pattern plate as well as client end and network side server |
| CN101504669A (en) * | 2009-03-06 | 2009-08-12 | 阿里巴巴集团控股有限公司 | Web application template issuing method, apparatus and system |
| CN101615121A (en) * | 2009-07-22 | 2009-12-30 | 福州星网视易信息***有限公司 | The style editor of BS platform information delivery system |
| CN101702126A (en) * | 2009-12-04 | 2010-05-05 | 金蝶软件（中国）有限公司 | Graphical interface editing method and device thereof |
| CN102375664A (en) * | 2010-08-20 | 2012-03-14 | ***通信集团公司 | Icon moving method and device |
| CN102541426A (en) * | 2010-12-31 | 2012-07-04 | 联想(北京)有限公司 | Electronic equipment and object processing method thereof |
| CN102654833A (en) * | 2012-02-01 | 2012-09-05 | 中兴通讯（香港）有限公司 | Mobile phone application development method and system |
| CN102819401A (en) * | 2012-06-08 | 2012-12-12 | 中标软件有限公司 | Android operating system and desktop icon arrangement method thereof |
| CN103116452A (en) * | 2013-01-31 | 2013-05-22 | 华为终端有限公司 | Creating method and device and terminal equipment of tabletop component |
| CN103246500A (en) * | 2012-02-06 | 2013-08-14 | 腾讯科技（深圳）有限公司 | Desktop icon display method and device |
| CN103399750A (en) * | 2013-08-07 | 2013-11-20 | 北京奇虎科技有限公司 | Method and device for achieving user interface |
| CN103577197A (en) * | 2013-11-18 | 2014-02-12 | 深圳市远行科技有限公司 | Method for achieving android application program dynamic form |
| CN103605640A (en) * | 2013-12-03 | 2014-02-26 | 中国联合网络通信集团有限公司 | Form adaption method and device |
| CN103618955A (en) * | 2013-11-08 | 2014-03-05 | 天津三星电子有限公司 | Method and system for achieving television interface configuration |
| US20140223341A1 (en) * | 2013-02-05 | 2014-08-07 | Hon Hai Precision Industry Co., Ltd. | Method and electronic device for controlling dynamic map-type graphic interface |
| CN104020924A (en) * | 2014-05-21 | 2014-09-03 | 小米科技有限责任公司 | Label establishing method and device and terminal |
| CN104063134A (en) * | 2014-07-03 | 2014-09-24 | 上海斐讯数据通信技术有限公司 | Method for managing Android Launcher desktop |
| CN104090979A (en) * | 2014-07-23 | 2014-10-08 | 上海天脉聚源文化传媒有限公司 | Method and device for editing webpage |
-
2015
- 2015-04-22 CN CN201510194244.2A patent/CN106162302B/en active Active
Patent Citations (21)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101083750A (en) * | 2006-05-31 | 2007-12-05 | 北京汉辰科技有限公司 | Service application of personal television and its realizing method |
| CN101196818A (en) * | 2006-12-08 | 2008-06-11 | 上海全景数字技术有限公司 | Fast graphical developing system |
| CN101140516A (en) * | 2007-10-22 | 2008-03-12 | 金蝶软件（中国）有限公司 | Method and system for dynamic laying-out interface element |
| CN101207450A (en) * | 2007-12-14 | 2008-06-25 | 北大方正集团有限公司 | Method, system for making special subject pattern plate as well as client end and network side server |
| CN101504669A (en) * | 2009-03-06 | 2009-08-12 | 阿里巴巴集团控股有限公司 | Web application template issuing method, apparatus and system |
| CN101615121A (en) * | 2009-07-22 | 2009-12-30 | 福州星网视易信息***有限公司 | The style editor of BS platform information delivery system |
| CN101702126A (en) * | 2009-12-04 | 2010-05-05 | 金蝶软件（中国）有限公司 | Graphical interface editing method and device thereof |
| CN102375664A (en) * | 2010-08-20 | 2012-03-14 | ***通信集团公司 | Icon moving method and device |
| CN102541426A (en) * | 2010-12-31 | 2012-07-04 | 联想(北京)有限公司 | Electronic equipment and object processing method thereof |
| CN102654833A (en) * | 2012-02-01 | 2012-09-05 | 中兴通讯（香港）有限公司 | Mobile phone application development method and system |
| CN103246500A (en) * | 2012-02-06 | 2013-08-14 | 腾讯科技（深圳）有限公司 | Desktop icon display method and device |
| CN102819401A (en) * | 2012-06-08 | 2012-12-12 | 中标软件有限公司 | Android operating system and desktop icon arrangement method thereof |
| CN103116452A (en) * | 2013-01-31 | 2013-05-22 | 华为终端有限公司 | Creating method and device and terminal equipment of tabletop component |
| US20140223341A1 (en) * | 2013-02-05 | 2014-08-07 | Hon Hai Precision Industry Co., Ltd. | Method and electronic device for controlling dynamic map-type graphic interface |
| CN103399750A (en) * | 2013-08-07 | 2013-11-20 | 北京奇虎科技有限公司 | Method and device for achieving user interface |
| CN103618955A (en) * | 2013-11-08 | 2014-03-05 | 天津三星电子有限公司 | Method and system for achieving television interface configuration |
| CN103577197A (en) * | 2013-11-18 | 2014-02-12 | 深圳市远行科技有限公司 | Method for achieving android application program dynamic form |
| CN103605640A (en) * | 2013-12-03 | 2014-02-26 | 中国联合网络通信集团有限公司 | Form adaption method and device |
| CN104020924A (en) * | 2014-05-21 | 2014-09-03 | 小米科技有限责任公司 | Label establishing method and device and terminal |
| CN104063134A (en) * | 2014-07-03 | 2014-09-24 | 上海斐讯数据通信技术有限公司 | Method for managing Android Launcher desktop |
| CN104090979A (en) * | 2014-07-23 | 2014-10-08 | 上海天脉聚源文化传媒有限公司 | Method and device for editing webpage |
Cited By (10)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107483449A (en) * | 2017-08-24 | 2017-12-15 | 四川长虹电器股份有限公司 | A kind of generally applicable television terminal management systems and management method |
| CN109656669A (en) * | 2018-12-26 | 2019-04-19 | 深圳创维数字技术有限公司 | Launcher method for running, device, equipment and computer readable storage medium |
| CN109656669B (en) * | 2018-12-26 | 2021-11-16 | 深圳小湃科技有限公司 | Launcher operation method, Launcher operation device, Launcher operation equipment and computer readable storage medium |
| CN109783097A (en) * | 2018-12-29 | 2019-05-21 | 南京控维通信科技有限公司 | Draw the implementation method of web frequency diagram plug-in unit |
| CN109783097B (en) * | 2018-12-29 | 2020-10-23 | 南京控维通信科技有限公司 | Implementation method for drawing web frequency graph plug-in |
| CN110704146A (en) * | 2019-08-30 | 2020-01-17 | 华为技术有限公司 | Focus management method applied to electronic equipment and electronic equipment |
| CN113242471A (en) * | 2021-05-25 | 2021-08-10 | 四川虹魔方网络科技有限公司 | Vue-based method for realizing preview component of television Launcher system web end |
| CN113242471B (en) * | 2021-05-25 | 2022-07-12 | 四川虹魔方网络科技有限公司 | Vue-based method for realizing preview component of television Launcher system web end |
| CN114816202A (en) * | 2022-05-09 | 2022-07-29 | 广州市易工品科技有限公司 | Method, device, equipment and medium for chart cross-boundary interaction in tab component |
| CN114816202B (en) * | 2022-05-09 | 2024-06-11 | 广州市易工品科技有限公司 | Method, device, equipment and medium for chart cross-boundary interaction in tab component |
Also Published As
| Publication number | Publication date |
|---|---|
| CN106162302B (en) | 2020-08-18 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106162302A (en) | Method of combination, device and the intelligent television at the main interface of a kind of Launcher | |
| CN104090979B (en) | A kind of page authoring method and device | |
| CN102663002B (en) | Method and system for structured-document rendering | |
| US8438495B1 (en) | Methods and systems for creating wireframes and managing containers | |
| US9507520B2 (en) | Touch-based reorganization of page element | |
| US8751945B1 (en) | Environment for responsive graphical designs | |
| CN102663056B (en) | Method and device for displaying picture elements | |
| CN104007967B (en) | A kind of user interface creating method and device based on extensible markup language | |
| CN103425485A (en) | Interface edition and operation system and method for ordinary users | |
| CN110928459B (en) | Writing operation method, device, equipment and storage medium of intelligent interactive tablet | |
| CN106155644B (en) | Webpage focal point control implementation method suitable for smart television browser | |
| WO2022048316A1 (en) | Method and apparatus for designing front-end page, storage medium, and device | |
| CN101587438A (en) | Graphic process template method for drafting under the ARP framework | |
| CN103279455B (en) | The pattern treatment process of electrical form and device | |
| CN104636120A (en) | Multi-window display method and device of browser | |
| CN105630507A (en) | Method and device for drawing WebView control interface | |
| CN109614601A (en) | Form processing method, device, equipment and readable medium based on web | |
| CN103870558A (en) | Page rendering method and mask layer creating method | |
| CN110941373B (en) | Interaction method and device for intelligent interaction panel, terminal equipment and storage medium | |
| CN105511794A (en) | Plotting system supporting multi-point touch gesture operation and method of system | |
| CN102298574A (en) | Method and device for generating self-defined report | |
| CN109725902A (en) | A kind of H5 page animation method and system of complex interaction logic | |
| CN107515748A (en) | Report Server Management interface creating method and file sharing method | |
| CN111694493B (en) | Webpage screenshot method, computer equipment and readable storage medium | |
| CN104239606B (en) | The UML modeling methods and device of touch screen are supported under Web environment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| CB02 | Change of applicant information | ||
| CB02 | Change of applicant information |
Address after: 516006 TCL technology building, No.17, Huifeng Third Road, Zhongkai high tech Zone, Huizhou City, Guangdong Province Applicant after: TCL Technology Group Co.,Ltd. Address before: 516006 Guangdong province Huizhou Zhongkai hi tech Development Zone No. nineteen District Applicant before: TCL RESEARCH AMERICA Inc. |
|
| GR01 | Patent grant | ||
| GR01 | Patent grant |