CN105812881A - User interface window processing method and system and television set - Google Patents

User interface window processing method and system and television set Download PDF

Info

Publication number
CN105812881A
CN105812881A CN201410843233.8A CN201410843233A CN105812881A CN 105812881 A CN105812881 A CN 105812881A CN 201410843233 A CN201410843233 A CN 201410843233A CN 105812881 A CN105812881 A CN 105812881A
Authority
CN
China
Prior art keywords
window
width
user interface
frame
height
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
Application number
CN201410843233.8A
Other languages
Chinese (zh)
Other versions
CN105812881B (en
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.)
TCL Corp
Original Assignee
TCL Corp
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 TCL Corp filed Critical TCL Corp
Priority to CN201410843233.8A priority Critical patent/CN105812881B/en
Publication of CN105812881A publication Critical patent/CN105812881A/en
Application granted granted Critical
Publication of CN105812881B publication Critical patent/CN105812881B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Landscapes

  • Controls And Circuits For Display Device (AREA)
  • Processing Or Creating Images (AREA)

Abstract

The invention is applicable to the television set field and provides a user interface window processing method. The user interface window processing method comprises steps of setting background images of windows of a user interface in a focus state and a non-focus state separately, wherein the frame effects of the background images of the windows in the focus state and the non-focus state are different; obtaining the frame widths of the background images of the windows; setting the rim distance of the windows as the widths of the frames; obtaining the practical sizes of the all the windows which are contained by the user interface; calculating the user interface size according to the practical sizes and the rim distance of the windows; arranging the windows on the user interface according to the size of the user interface and the practical sizes of the windows, determining the positions of the windows relative to the user interface; drawing a background image corresponding to the state of each window on the each window which is arranged on the user interface; and drawing the content corresponding to the window in the content area of each window. The user interface window processing method can effectively improves the refreshing rate and the UI performance.

Description

A kind of window treatments method of user interface, system and television set
Technical field
The invention belongs to field of television, particularly relate to a kind of window treatments method of user interface, system and television set.
Background technology
In the intelligent television field based on Android (Android), being different from mobile phone, the screen resolution of television set is more much bigger than mobile phone.And currently 4K screen has become as mainstream configuration.But due to significantly improving of physical picture element, when hardware performance is constant, can greatly drag down the refresh rate of UI (UserInterface, user interface).Therefore UI performance is promoted more and more important.The main interface application of TV is one of application the most complicated in intelligent television.Element and animation on main interface are relatively more, and the requirement of performance is also high.Fig. 1 show the mainstay at the main interface of current intelligent television, and main interface includes 7 view (window).Fig. 2 show the presentation mode after view obtains focus.Selected view performs display bezel, performs to amplify animation and display hatching effect, presents with prominent.
On Android, after View obtains focus, the general way that presents of View is to change the background picture of View, say, that when focus and non-focus state, and background is not use same to cut figure;But this way cannot realize the effect of Fig. 2, because the effect shaded area shown in Fig. 2 is very big, and View around can be covered.Want to reach this effect, it is common practice to as independent view, shade and frame are fitted in the upper strata of view, and generally the View major part shown in Fig. 2 is all combination View.It is known that view hierarchical structure is more many more complicated, the time that system renders needs is also more long.Therefore this method can reduce the refresh rate of View, namely reduces the performance of UI.And, owing to frame and View are not belonging to same carrier, when doing amplification animation, need to open two animation threads, one is that two animations cannot be accomplished to synchronize completely, that is frame and View cannot perfect fit in the process of animation, and effect is had a greatly reduced quality, and two is the consumption that two animation threads too increase system resource.
Summary of the invention
It is an object of the invention to provide a kind of window treatments method of user interface, system and television set, it is intended to the method solving prior art can reduce the refresh rate of View, the problem reducing UI performance.
First aspect, the invention provides a kind of window treatments method of user interface, and described method includes:
Being respectively provided with the window of the user interface background picture under focus condition and under non-focus state, window background picture under focus condition is different from the border effect of the background picture under non-focus state;
Obtain the border width of window background picture;
The Edge Distance of window is set to described border width;
Obtain the actual size of all windows that user interface comprises, and calculate the size of user interface according to the actual size of window and the Edge Distance of window;
Actual size layout window on a user interface according to the size of user interface and window, it is determined that the position of each window opposing user interfaces;
The state rendering context picture of corresponding each window on each window that user interface is laid out;
The content of window is plotted in the content area of each window.
Second aspect, the invention provides the Window Processing Systems of a kind of user interface, and described system includes:
First arranges module, is used for the window being respectively provided with user interface background picture under focus condition and under non-focus state, and window background picture under focus condition is different from the border effect of the background picture under non-focus state;
First acquisition module, for obtaining the border width of window background picture;
Second arranges module, for the Edge Distance of window is set to described border width;
Computing module, for obtaining the actual size of all windows that user interface comprises, and calculates the size of user interface according to the actual size of window and the Edge Distance of window;
Layout modules, is used for the size according to user interface and the actual size layout window on a user interface of window, it is determined that the position of each window opposing user interfaces;
First drafting module, the state rendering context picture of corresponding each window on each window laid out in user interface;
Second drafting module, for being plotted in the content area of each window by the content of window.
The third aspect, the invention provides the television set of a kind of Window Processing Systems including described user interface.
In the present invention, owing to window background picture under focus condition is different from the border effect of the background picture under non-focus state, namely frame and windows content region belong to a window carrier, therefore the problem being absent from imperfect laminating occurs when performing to amplify animation, present effect to be improved, and only with an animation thread, decrease system resources consumption.And decrease the hierarchical structure of window, thus optimizing UI performance, improving the refresh rate of UI, and then promoting Consumer's Experience.
Accompanying drawing explanation
Fig. 1 is the mainstay interface schematic diagram at the main interface of current intelligent television.
Fig. 2 is the presentation mode schematic diagram after view obtains focus.
Fig. 3 is the window treatments method flow diagram of the user interface that the embodiment of the present invention one provides.
Fig. 4 is window background picture schematic diagram under focus condition.
Fig. 5 is the user interface schematic diagram comprising multiple window.
Fig. 6 is the structural representation of the Window Processing Systems of the user interface 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 beneficial effect clearly understand, below in conjunction with drawings and Examples, the present invention is further elaborated.Should be appreciated that specific embodiment described herein is only in order to explain the present invention, is not intended to limit the present invention.
In order to technical solutions according to the invention are described, illustrate below by specific embodiment.
Embodiment one:
Referring to Fig. 3, the window treatments method of the user interface that the embodiment of the present invention one provides comprises the following steps:
S101, it is respectively provided with the window of the user interface background picture under focus condition and under non-focus state, window background picture under focus condition is different from the border effect of the background picture under non-focus state, in the present embodiment the background picture under focus condition be there is hatching effect frame cut figure, as shown in Figure 2;
In the embodiment of the present invention one, the dimensions of window background picture under non-focus state and the window background picture under focus condition is identical, but effect is different, for instance the non-displaypart (i.e. frame) that window background picture under non-focus state is in transparent picture or background picture is transparent.When window obtains focus and loses focus, automatically update background picture.Window background picture under focus condition and under non-focus state is the NinePatchDrawable picture (being commonly called as: put 9 figure) meeting Android specification.NinePatchDrawable supports lossless stretching, and therefore focus can be suitable on different size of window, and the background picture namely arranged is applicable to all windows of user interface.The actual size of each window includes content area and the periphery frame of centre, shown in such as, broken box in Fig. 2, and the background picture under non-focus state is identical with the actual size of the background picture of focus condition, simply under non-focus state, the frame portion of background picture is transparent, only shows content area.Described content area refers to the region showing image in window.
S102, obtain window background picture border width;
Refer to Fig. 4, the content area distance of the border width respectively window of window background picture under focus condition cuts the distance of figure (i.e. window background picture under focus condition) left hand edge, top edge, right hand edge, lower limb, represents with leftPadding, topPadding, rightPadding and bottomPadding respectively.
S103, the Edge Distance of window being set to described border width, described Edge Distance is the content area distance apart from the frame of described actual size;
In the embodiment of the present invention one, S103 is used for preserving the Edge Distance of window specifically, increase attribute at BlockView apoplexy due to endogenous wind.Available Rect data types to express (as: RectoutPadding).Increase simultaneously method for arrange this window Edge Distance (as: setOutPadding (Rect)).If the border width of all windows is all identical in user interface, then four Edge Distances of all windows are disposed as described border width;If the border width of each window is all different in user interface, then the border width of corresponding each window arranges described Edge Distance respectively.In the present embodiment, it is all example mutually with the border width of each window and illustrates.
The actual size of all windows that S104, acquisition user interface comprise, and the size of user interface is calculated according to the actual size of window and the Edge Distance of window;
In the embodiment of the present invention one, S104 specifically includes following steps:
The all windows comprised in traverse user interface, obtain the actual size of all windows, and actual size includes actual height and developed width;
Below equation is adopted to calculate the size of user interface, wherein WidthparentRepresent the width of user interface, HeightparentRepresent the height of user interface, WidthchildNRepresent the N number of window being arranged in same a line in user interface, the developed width of window N, HeightchildNRepresent the N number of window being arranged in same string in user interface, the actual height of window N, leftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively.Incorporated by reference to Fig. 4 and Fig. 5.2 windows being positioned at same string in user interface are window 6 and window 2 respectively, and 5 windows being positioned at same a line in user interface are window 1, window 2, window 3, window 4 and window 5 respectively.
Widthparent=(Widthchild1+Widthchild2+...+WidthchildN)-(leftPadding+rightPadding)×N
Heightparent=(Heightchild1+Heightchild2+...+HeightchildN)-(topPadding+bottomPadding)×N
S105, actual size layout window on a user interface according to the size of user interface and window, it is determined that the position of each window opposing user interfaces.
The part frame of the window after layout is superimposed in adjacent window apertures, but the content area between adjacent window apertures is adjacent and non-overlapping.
For layout window in real presently described user interface, it is necessary to confirm each window relative position in described user interface, in the embodiment of the present invention one, with adjacent window apertures for reference to the position determining each window opposing user interfaces:
leftN=rightN-1-leftPaddingN-rightPaddingN-1
topN=bottomN-1-topPaddingN-bottomPaddingN-1
rightN=leftN+widthN
bottomN=topN+heightN
Wherein, leftN、topN、rightN、bottomNRepresent the distance of the distance of left frame opposing user interfaces left frame of n-th window, the distance of upper side frame opposing user interfaces upper side frame, the distance of left frame opposing user interfaces left frame, boundary frame area opposing user interfaces boundary frame area respectively;rightN-1Represent the distance of left frame opposing user interfaces left frame of left side adjacent window apertures of n-th window, bottomN-1Represent the distance of the boundary frame area opposing user interfaces boundary frame area of the top adjacent window apertures of n-th window;widthNRepresent the developed width of window N, heightNRepresent the actual height of window N;leftPaddingN、topPaddingNRepresent left frame width and the upper side frame width of window N respectively;rightPaddingN-1、bottomPaddingN-1Represent the lower frame width (namely the content area distance of top adjacent window apertures cut the width of figure lower limb) of the top adjacent window apertures of the left frame width (namely the content area distance of left side adjacent window apertures cut the width of figure right hand edge) of the left side adjacent window apertures of n-th window, n-th window respectively.
Calculated the position of each window opposing user interfaces by above-mentioned formula after, the layout of each window can be realized, the effect of layout is as it is shown in figure 5, the part frame of window can be added in adjacent window apertures, but the content zone section of adjacent window apertures is only adjacent without superposition.
S106, on each window that user interface is laid out the state rendering context picture of corresponding each window.
Wherein, described S106 is particularly as follows: the window in user interface is in focus condition or non-focus state, for being in the window under non-focus state, and corresponding drafting this window background picture under non-focus state;For being in the window under focus condition, the background picture under focus condition wanted by corresponding this window of drawing.
In the embodiment of the present invention one, owing to having pre-set user interface each window background picture under focus condition with non-focus state in step S101, therefore, when drawing each window, the state (focus/non-focus) of direct corresponding window is chosen the background picture of correspondence and is carried out drawing.And due to exact layout to each window in step 105, the content area making each window of drafting place is adjacent not overlapping, only existing in the part frame of window under focus condition can be added to adjacent window apertures, and have the effect highlighting focus condition, concrete effect is as shown in Figure 2;If all windows are in non-focus state, then each window effect drawn out is as shown in Figure 1.
S107, the content of window is plotted in the content area of each window.
Described content includes the subwindow of picture, word or nesting, and these contents are all that superposition is drawn on background picture.This content area by the distance of its four frame and window actual four frames left, top, right, bottom} determine, wherein:
Left=leftPadding
Top=topPadding
Right=width-rightPadding
Bottom=height-bottomPadding
Wherein, left represents the left frame of content area and the distance of the actual left frame of window, top represents the upper side frame of content area and the distance of window actually frame, right represents the left frame of content area and the distance of the actual left frame of window, and bottom represents the lower frame of content area and the distance of the actual lower frame of window;LeftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively;Width represents the developed width of window, and height represents the actual height of window.
In the embodiment of the present invention one, owing to window background picture under focus condition is different from the border effect of the background picture under non-focus state, namely frame and windows content region belong to a window carrier, therefore the problem being absent from imperfect laminating occurs when performing to amplify animation, present effect to be improved, and only with an animation thread, decrease system resources consumption.And decrease the hierarchical structure of window, thus optimizing UI performance, improving the refresh rate of UI, and then promoting Consumer's Experience.
Embodiment two:
Fig. 6 illustrates the composition structure of the Window Processing Systems of the user interface that the embodiment of the present invention two provides, and for the ease of illustrating, illustrate only the part relevant to the embodiment of the present invention.
The Window Processing Systems of this user interface can be operate in the unit that the software unit of each smart machine (such as television set), hardware cell or software and hardware combine, it is also possible to is integrated in described smart machine as independent suspension member.
Refer to Fig. 6, the Window Processing Systems of user interface that the embodiment of the present invention two provides includes: first arranges module the 11, first acquisition module 12, second arrange module 13, computing module 14, layout modules the 15, second drafting module 16 and the second drafting module 17, wherein
First arranges module 11, for being respectively provided with the window of the user interface background picture under focus condition and under non-focus state, window background picture under focus condition is different from the border effect of the background picture under non-focus state, in the present embodiment window background picture under focus condition be there is hatching effect frame cut figure;
In the embodiment of the present invention two, the dimensions of window background picture under non-focus state and the window background picture under focus condition is identical, but effect is different, for instance the non-displaypart (i.e. frame) that window background picture under non-focus state is in transparent picture or background picture is transparent.When window obtains focus and loses focus, automatically update background picture.Window background picture under focus condition and under non-focus state is the NinePatchDrawable picture (being commonly called as: put 9 figure) meeting Android specification.NinePatchDrawable supports lossless stretching, and therefore focus can be suitable on different size of window, and the background picture namely arranged is applicable to all windows of user interface.The actual size of each window includes content area and the periphery frame of centre, shown in such as, broken box in Fig. 2, and the background picture under non-focus state is identical with the actual size of the background picture of focus condition, simply under non-focus state, the frame portion of background picture is transparent, only shows content area.Described content area refers to the region showing image in window.
First acquisition module 12, for obtaining the border width of window background picture;
Refer to Fig. 4, the content area distance of the border width respectively window of window background picture under focus condition cuts the distance of figure (i.e. window background picture under focus condition) left hand edge, top edge, right hand edge, lower limb, represents with leftPadding, topPadding, rightPadding and bottomPadding respectively.
Second arranges module 13, and for the Edge Distance of window is set to described border width, described Edge Distance is the content area distance apart from the frame of described actual size;
In the embodiment of the present invention two, specifically, increase attribute at BlockView apoplexy due to endogenous wind to be used for preserving the Edge Distance of window.Available Rect data types to express (as: RectoutPadding).Increase simultaneously method for arrange this window Edge Distance (as: setOutPadding (Rect)).If the border width of all windows is all identical in user interface, then four Edge Distances of all windows are disposed as described border width;If the border width of each window is all different in user interface, then the border width of corresponding each window arranges described Edge Distance respectively.In the present embodiment, it is all example mutually with the border width of each window and illustrates.
Computing module 14, for obtaining the actual size of all windows that user interface comprises, and calculates the size of user interface according to the actual size of window and the Edge Distance of window;
Layout modules 15, is used for the size according to user interface and the actual size layout window on a user interface of window, it is determined that the position of each window opposing user interfaces;
First drafting module 16, the state rendering context picture of corresponding each window on each window laid out in user interface;
Wherein, described first drafting module 16 specifically for: the window in user interface is in focus condition or non-focus state, for being in the window under non-focus state, corresponding draws this window background picture under non-focus state;For being in the window under focus condition, the background picture under focus condition wanted by corresponding this window of drawing.
In the embodiment of the present invention two, owing to first arranges module 11 and pre-set user interface each window background picture under focus condition and non-focus state, therefore, when drawing each window, the state (focus/non-focus) of direct corresponding window is chosen the background picture of correspondence and is carried out drawing.And due to the layout modules 15 exact layout to each window, the content area making each window of drafting place is adjacent not overlapping, only existing in the part frame of window under focus condition can be added to adjacent window apertures, and have the effect highlighting focus condition, concrete effect is as shown in Figure 2;If all windows are in non-focus state, then each window effect drawn out is as shown in Figure 1.
Second drafting module 17, for being plotted in the content area of each window by the content of window.
In the embodiment of the present invention two, described content area by the distance of its four frame and window actual four frames left, top, right, bottom} determine, wherein:
Left=leftPadding
Top=topPadding
Right=width-rightPadding
Bottom=height-bottomPadding
Wherein, left represents the left frame of content area and the distance of the actual left frame of window, top represents the upper side frame of content area and the distance of window actually frame, right represents the left frame of content area and the distance of the actual left frame of window, and bottom represents the lower frame of content area and the distance of the actual lower frame of window;LeftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively;Width represents the developed width of window, and height represents the actual height of window.
In the embodiment of the present invention two, described computing module 14 specifically includes:
Second acquisition module, for all windows comprised in traverse user interface, obtains the actual size of all windows, and actual size includes actual height and developed width;
Calculating sub module, for adopting below equation to calculate the size of user interface, wherein WidthparentRepresent the width of user interface, HeightparentRepresent the height of user interface, WidthchildNRepresent the N number of window being arranged in same a line in user interface, the developed width of window N, HeightchildNRepresent the N number of window being arranged in same string in user interface, the actual height of window N, leftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively
Widthparent=(Widthchild1+Widthchild2+...+WidthchildN)-(leftPadding+rightPadding)×N
Heightparent=(Heightchild1+Heightchild2+...+HeightchildN)-(topPadding+bottomPadding)×N。
In the embodiment of the present invention two, the position of each window opposing user interfaces is with adjacent window apertures for reference to determining:
leftN=rightN-1-leftPaddingN-rightPaddingN-1
topN=bottomN-1-topPaddingN-bottomPaddingN-1
rightN=leftN+widthN
bottomN=topN+heightN
Wherein, leftN、topN、rightN、bottomNRepresent the distance of the distance of left frame opposing user interfaces left frame of n-th window, the distance of upper side frame opposing user interfaces upper side frame, the distance of left frame opposing user interfaces left frame, boundary frame area opposing user interfaces boundary frame area respectively;rightN-1Represent the distance of left frame opposing user interfaces left frame of left side adjacent window apertures of n-th window, bottomN-1Represent the distance of the boundary frame area opposing user interfaces boundary frame area of the top adjacent window apertures of n-th window;widthNRepresent the developed width of window N, heightNThe actual height of window N;leftPaddingN、topPaddingNRepresent left frame width and the upper side frame width of window N respectively;rightPaddingN-1、bottomPaddingN-1Represent the lower frame width (namely the content area distance of top adjacent window apertures cut the width of figure lower limb) of the top adjacent window apertures of the left frame width (namely the content area distance of left side adjacent window apertures cut the width of figure right hand edge) of the left side adjacent window apertures of n-th window, n-th window respectively.
In the embodiment of the present invention two, owing to window background picture under focus condition is different from the border effect of the background picture under non-focus state, namely frame and windows content region belong to a window carrier, therefore the problem being absent from imperfect laminating occurs when performing to amplify animation, present effect to be improved, and only with an animation thread, decrease system resources consumption.And decrease the hierarchical structure of window, thus optimizing UI performance, improving the refresh rate of UI, and then promoting Consumer's Experience.
Those skilled in the art is it can be understood that arrive, for convenience of description and succinctly, only it is illustrated with the division of above-mentioned each functional unit, module, in practical application, as desired above-mentioned functions distribution can be completed by different functional units, module, it is divided into different functional units or module, to complete all or part of function described above by the internal structure of described system.Each functional unit in embodiment can be integrated in a processing unit, can also be that unit is individually physically present, can also two or more unit integrated in a unit, above-mentioned integrated unit both can adopt the form of hardware to realize, it would however also be possible to employ the form of SFU software functional unit realizes.It addition, the concrete title of each functional unit, module is also only to facilitate mutually distinguish, it is not limited to the protection domain of the application.The specific works process of unit, module in said system, it is possible to reference to the corresponding process in preceding method embodiment, do not repeat them here.
Those of ordinary skill in the art are it is to be appreciated that the unit of each example that describes in conjunction with the embodiments described herein and algorithm steps, it is possible to being implemented in combination in of electronic hardware or computer software and electronic hardware.These functions perform with hardware or software mode actually, depend on application-specific and the design constraint of technical scheme.Professional and technical personnel specifically can should be used for using different methods to realize described function to each, but this realization is it is not considered that beyond the scope of this invention.
In embodiment provided by the present invention, it should be understood that disclosed system and method, it is possible to realize by another way.Such as, system embodiment described above is merely schematic, such as, the division of described module or unit, being only a kind of logic function to divide, actual can have other dividing mode when realizing, for instance multiple unit or assembly can in conjunction with or be desirably integrated into another system, or some features can ignore, or do not perform.Another point, shown or discussed coupling each other or direct-coupling or communication connect the INDIRECT COUPLING that can be through some interfaces, device or unit or communication connects, it is possible to be electrical, machinery or other form.
The described unit illustrated as separating component can be or may not be physically separate, and the parts shown as unit can be or may not be physical location, namely may be located at a place, or can also be distributed on multiple NE.Some or all of unit therein can be selected according to the actual needs to realize the purpose of the present embodiment scheme.
It addition, each functional unit in each embodiment of the present invention can be integrated in a processing unit, it is also possible to be that unit is individually physically present, it is also possible to two or more unit are integrated in a unit.Above-mentioned integrated unit both can adopt the form of hardware to realize, it would however also be possible to employ the form of SFU software functional unit realizes.
If described integrated unit is using the form realization of SFU software functional unit and as independent production marketing or use, it is possible to be stored in a computer read/write memory medium.Based on such understanding, part or all or part of of this technical scheme that prior art is contributed by the technical scheme of the embodiment of the present invention substantially in other words can embody with the form of software product, this computer software product is stored in a storage medium, including some instructions with so that a computer equipment (can be personal computer, server, or the network equipment etc.) or processor (processor) perform all or part of step of method described in each embodiment of the embodiment of the present invention.And aforesaid storage medium includes: USB flash disk, portable hard drive, read only memory (ROM, Read-OnlyMemory), the various media that can store program code such as random access memory (RAM, RandomAccessMemory), magnetic disc or CD.
Embodiment described above only in order to technical scheme to be described, is not intended to limit;Although the present invention being described in detail with reference to previous embodiment, it will be understood by those within the art that: the technical scheme described in foregoing embodiments still can be modified by it, or wherein portion of techniques feature is carried out equivalent replacement;And these amendments or replacement, do not make the essence of appropriate technical solution depart from the spirit and scope of each embodiment technical scheme of the embodiment of the present invention.

Claims (10)

1. the window treatments method of a user interface, it is characterised in that described method includes:
Being respectively provided with the window of the user interface background picture under focus condition and under non-focus state, window background picture under focus condition is different from the border effect of the background picture under non-focus state;
Obtain the border width of window background picture;
The Edge Distance of window is set to described border width;
Obtain the actual size of all windows that user interface comprises, and calculate the size of user interface according to the actual size of window and the Edge Distance of window;
Actual size layout window on a user interface according to the size of user interface and window, it is determined that the position of each window opposing user interfaces;
The state rendering context picture of corresponding each window on each window that user interface is laid out;
The content of window is plotted in the content area of each window.
2. the method for claim 1, it is characterised in that on described each window laid out in user interface corresponding each window state rendering context picture particularly as follows:
Window in user interface is in focus condition or non-focus state, for being in the window under focus condition, corresponding drafting described window background picture under focus condition, for being in the window under non-focus state, corresponding drafting described window background picture under non-focus state.
3. the method for claim 1, it is characterised in that the content area distance of the border width respectively window of described window background picture under focus condition cuts the distance of figure left hand edge, top edge, right hand edge, lower limb.
4. the method for claim 1, it is characterised in that the border width of all windows of described user interface background picture under focus condition is identical;
The actual size of all windows that described acquisition user interface comprises, and calculate the size of user interface according to the Edge Distance of the actual size of window and window and specifically include:
The all windows comprised in traverse user interface, obtain the actual size of all windows, and actual size includes actual height and developed width;
Below equation is adopted to calculate the size of user interface, wherein WidthparentRepresent the width of user interface, HeightparentRepresent the height of user interface, WidthchildNRepresent the N number of window being arranged in same a line in user interface, the developed width of window N, HeightchildNRepresent the N number of window being arranged in same string in user interface, the actual height of window N, leftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively
Widthparent=(Widthchild1+Widthchild2+...+WidthchildN)-(leftPadding+rightPadding)×N
Heightparent=(Heightchild1+Heightchild2+...+HeightchildN)-(topPadding+bottomPadding)×N。
5. the method for claim 1, it is characterised in that the position of each window opposing user interfaces is with adjacent window apertures for reference to determining:
leftN=rightN-1-leftPaddingN-rightPaddingN-1
topN=bottomN-1-topPaddingN-bottomPaddingN-1
rightN=leftN+widthN
bottomN=topN+heightN
Wherein, leftN、topN、rightN、bottomNRepresent the distance of the distance of left frame opposing user interfaces left frame of n-th window, the distance of upper side frame opposing user interfaces upper side frame, the distance of left frame opposing user interfaces left frame, boundary frame area opposing user interfaces boundary frame area respectively;rightN-1Represent the distance of left frame opposing user interfaces left frame of left side adjacent window apertures of n-th window, bottomN-1Represent the distance of the boundary frame area opposing user interfaces boundary frame area of the top adjacent window apertures of n-th window;widthNRepresent the developed width of window N, heightNThe actual height of window N;leftPaddingN、topPaddingNRepresent left frame width and the upper side frame width of window N respectively;rightPaddingN-1、bottomPaddingN-1Represent the lower frame width of the top adjacent window apertures of the left frame width of left side adjacent window apertures of n-th window, n-th window respectively.
6. the method for claim 1, it is characterised in that described content area by the distance of its four frame and window actual four frames left, top, right, bottom} determine, wherein:
Left=leftPadding
Top=topPadding
Right=width-rightPadding
Bottom=height-bottomPadding
Wherein, left represents the left frame of content area and the distance of the actual left frame of window, top represents the upper side frame of content area and the distance of window actually frame, right represents the left frame of content area and the distance of the actual left frame of window, and bottom represents the lower frame of content area and the distance of the actual lower frame of window;LeftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively;Width represents the developed width of window, and height represents the actual height of window.
7. the Window Processing Systems of a user interface, it is characterised in that described system includes:
First arranges module, is used for the window being respectively provided with user interface background picture under focus condition and under non-focus state, and window background picture under focus condition is different from the border effect of the background picture under non-focus state;
First acquisition module, for obtaining the border width of window background picture;
Second arranges module, for the Edge Distance of window is set to described border width;
Computing module, for obtaining the actual size of all windows that user interface comprises, and calculates the size of user interface according to the actual size of window and the Edge Distance of window;
Layout modules, is used for the size according to user interface and the actual size layout window on a user interface of window, it is determined that the position of each window opposing user interfaces;
First drafting module, the state rendering context picture of corresponding each window on each window laid out in user interface;
Second drafting module, for being plotted in the content area of each window by the content of window.
8. system as claimed in claim 7, it is characterised in that the border width of all windows of described user interface background picture under focus condition is identical;
Described computing module specifically includes:
Second acquisition module, for all windows comprised in traverse user interface, obtains the actual size of all windows, and actual size includes actual height and developed width;
Calculating sub module, for adopting below equation to calculate the size of user interface, wherein WidthparentRepresent the width of user interface, HeightparentRepresent the height of user interface, WidthchildNRepresent the N number of window being arranged in same a line in user interface, the developed width of window N, HeightchildNRepresent the N number of window being arranged in same string in user interface, the actual height of window N, leftPadding, topPadding, rightPadding and bottomPadding represent the left frame width of window, upper side frame width, left frame width, lower frame width respectively
Widthparent=(Widthchild1+Widthchild2+...+WidthchildN)-(leftPadding+rightPadding)×N
Heightparent=(Heightchild1+Heightchild2+...+HeightchildN)-(topPadding+bottomPadding)×N。
9. system as claimed in claim 7, it is characterised in that the position of each window opposing user interfaces is with adjacent window apertures for reference to determining:
leftN=rightN-1-leftPaddingN-rightPaddingN-1
topN=bottomN-1-topPaddingN-bottomPaddingN-1
rightN=leftN+widthN
bottomN=topN+heightN
Wherein, leftN、topN、rightN、bottomNRepresent the distance of the distance of left frame opposing user interfaces left frame of n-th window, the distance of upper side frame opposing user interfaces upper side frame, the distance of left frame opposing user interfaces left frame, boundary frame area opposing user interfaces boundary frame area respectively;rightN-1Represent the distance of left frame opposing user interfaces left frame of left side adjacent window apertures of n-th window, bottomN-1Represent the distance of the boundary frame area opposing user interfaces boundary frame area of the top adjacent window apertures of n-th window;widthNRepresent the developed width of window N, heightNThe actual height of window N;leftPaddingN、topPaddingNRepresent left frame width and the upper side frame width of window N respectively;rightPaddingN-1、bottomPaddingN-1Represent the lower frame width of the top adjacent window apertures of the left frame width of left side adjacent window apertures of n-th window, n-th window respectively.
10. a television set, it is characterised in that described television set includes the Window Processing Systems of the user interface described in any one of claim 7 to 9.
CN201410843233.8A 2014-12-30 2014-12-30 A kind of window processing method, system and the television set of user interface Active CN105812881B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201410843233.8A CN105812881B (en) 2014-12-30 2014-12-30 A kind of window processing method, system and the television set of user interface

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201410843233.8A CN105812881B (en) 2014-12-30 2014-12-30 A kind of window processing method, system and the television set of user interface

Publications (2)

Publication Number Publication Date
CN105812881A true CN105812881A (en) 2016-07-27
CN105812881B CN105812881B (en) 2019-03-01

Family

ID=56419991

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201410843233.8A Active CN105812881B (en) 2014-12-30 2014-12-30 A kind of window processing method, system and the television set of user interface

Country Status (1)

Country Link
CN (1) CN105812881B (en)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107861788A (en) * 2017-11-23 2018-03-30 深圳市雷鸟信息科技有限公司 Picture layout method, terminal and computer-readable recording medium
CN109104627A (en) * 2017-06-21 2018-12-28 武汉斗鱼网络科技有限公司 Focus Background Generation Method, storage medium, equipment and the system of Android TV
CN111679474A (en) * 2020-06-15 2020-09-18 深圳市华星光电半导体显示技术有限公司 Pixel design method and device and electronic equipment
CN112631703A (en) * 2020-12-25 2021-04-09 北京百度网讯科技有限公司 Method, device and equipment for generating graphic frame and storage medium
CN113760140A (en) * 2021-08-31 2021-12-07 Oook(北京)教育科技有限责任公司 Content display method, device, medium and electronic equipment

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101577797A (en) * 2009-06-03 2009-11-11 中兴通讯股份有限公司 Page focus movement method and system
CN101882432A (en) * 2010-02-01 2010-11-10 深圳市同洲电子股份有限公司 Focus element display method, device and digital television receiving terminal
CN102065336A (en) * 2010-07-21 2011-05-18 深圳创维数字技术股份有限公司 Digital television receiver and method for determining multistage window shearing relation of digital television receiver
CN102830966A (en) * 2012-07-31 2012-12-19 北京奇虎科技有限公司 Information display system and method
CN103297854A (en) * 2012-08-24 2013-09-11 乐视致新电子科技(天津)有限公司 Method for controlling focuses of web pages
US8732757B2 (en) * 1996-12-19 2014-05-20 Gemstar Development Corporation System and method for targeted advertisement display responsive to user characteristics
CN103885755A (en) * 2012-12-19 2014-06-25 腾讯科技(深圳)有限公司 Method and device for implementing screen matching of owner-draw controls

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8732757B2 (en) * 1996-12-19 2014-05-20 Gemstar Development Corporation System and method for targeted advertisement display responsive to user characteristics
CN101577797A (en) * 2009-06-03 2009-11-11 中兴通讯股份有限公司 Page focus movement method and system
CN101882432A (en) * 2010-02-01 2010-11-10 深圳市同洲电子股份有限公司 Focus element display method, device and digital television receiving terminal
CN102065336A (en) * 2010-07-21 2011-05-18 深圳创维数字技术股份有限公司 Digital television receiver and method for determining multistage window shearing relation of digital television receiver
CN102830966A (en) * 2012-07-31 2012-12-19 北京奇虎科技有限公司 Information display system and method
CN103297854A (en) * 2012-08-24 2013-09-11 乐视致新电子科技(天津)有限公司 Method for controlling focuses of web pages
CN103885755A (en) * 2012-12-19 2014-06-25 腾讯科技(深圳)有限公司 Method and device for implementing screen matching of owner-draw controls

Cited By (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109104627A (en) * 2017-06-21 2018-12-28 武汉斗鱼网络科技有限公司 Focus Background Generation Method, storage medium, equipment and the system of Android TV
CN107861788A (en) * 2017-11-23 2018-03-30 深圳市雷鸟信息科技有限公司 Picture layout method, terminal and computer-readable recording medium
CN111679474A (en) * 2020-06-15 2020-09-18 深圳市华星光电半导体显示技术有限公司 Pixel design method and device and electronic equipment
US11880641B2 (en) 2020-06-15 2024-01-23 Shenzhen China Star Optoelectronics Semiconductor Display Technology Co., Ltd. Pixel design method, pixel design device, and electronic equipment
CN112631703A (en) * 2020-12-25 2021-04-09 北京百度网讯科技有限公司 Method, device and equipment for generating graphic frame and storage medium
CN112631703B (en) * 2020-12-25 2023-08-01 北京百度网讯科技有限公司 Method, device, equipment and storage medium for generating graphic frame
CN113760140A (en) * 2021-08-31 2021-12-07 Oook(北京)教育科技有限责任公司 Content display method, device, medium and electronic equipment
CN113760140B (en) * 2021-08-31 2023-12-08 Oook(北京)教育科技有限责任公司 Content display method, device, medium and electronic equipment

Also Published As

Publication number Publication date
CN105812881B (en) 2019-03-01

Similar Documents

Publication Publication Date Title
CN105812881A (en) User interface window processing method and system and television set
KR102208183B1 (en) Method and apparatus for realizing color tween animation
US10126912B2 (en) Method, apparatus, and devices for displaying browser navigation page
US9786256B2 (en) Method and device for generating graphical user interface (GUI) for displaying
CN103631867B (en) Webpage display method and browser
US20150074519A1 (en) Method and apparatus of controlling page element
CN105549806B (en) Mixed type client end interface implementation method and its system
CN105407323A (en) Screen splitting method and device of monitor video
US20190073091A1 (en) Dynamic display layout systems and methods
CN109495697A (en) Multi-screen extended method, system, storage medium and terminal based on video cutting
CN107621951B (en) View level optimization method and device
CN111859874A (en) Table generating method and system, video playing device and computer readable medium
CN109104628A (en) Focus prospect generation method, storage medium, equipment and the system of Android TV
CN110018812A (en) A kind of pattern drawing method and device
CN107239212A (en) Segmentation selection view rendering method, device and user terminal
CN105677674B (en) Dynamic display method and device for page filling content
CN104504107A (en) Search picture display method and device
CN103246500A (en) Desktop icon display method and device
CN102945123B (en) A kind of system resource condition presentation device and system resource condition methods of exhibiting
CN109271220A (en) Method, calculating equipment and the storage medium that the page returns are controlled by gesture operation
CN103246426A (en) Method and device for processing multiple icons
CN109104627A (en) Focus Background Generation Method, storage medium, equipment and the system of Android TV
CN105786158A (en) Drawing operation control method and device and game machine
CN112562055A (en) Front-end rendering method and system of knowledge graph, electronic device and storage medium
WO2019037636A1 (en) Layout method and device for view component

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant