CN102902535A - Picture self-adaption method, system and terminal equipment - Google Patents

Picture self-adaption method, system and terminal equipment Download PDF

Info

Publication number
CN102902535A
CN102902535A CN2012103455103A CN201210345510A CN102902535A CN 102902535 A CN102902535 A CN 102902535A CN 2012103455103 A CN2012103455103 A CN 2012103455103A CN 201210345510 A CN201210345510 A CN 201210345510A CN 102902535 A CN102902535 A CN 102902535A
Authority
CN
China
Prior art keywords
picture
assembly
component
wide height
parameter
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.)
Pending
Application number
CN2012103455103A
Other languages
Chinese (zh)
Inventor
宋振华
李荣根
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
World (Shanghai) Technology Development Co., Ltd.
Original Assignee
Shenzhen Temobi Science and Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Shenzhen Temobi Science and Technology Co Ltd filed Critical Shenzhen Temobi Science and Technology Co Ltd
Priority to CN2012103455103A priority Critical patent/CN102902535A/en
Publication of CN102902535A publication Critical patent/CN102902535A/en
Pending legal-status Critical Current

Links

Images

Landscapes

  • Processing Or Creating Images (AREA)

Abstract

The invention discloses a picture self-adaption method, a system and the terminal equipment. According to the picture self-adaption method, the system and the terminal equipment, component drawing information of components and picture drawing information of pictures are obtained by analyzing user interface (UI) data packets, and the pictures are drawn according to the component drawing information and the picture drawing information. Picture cutting workloads in resolution adaptation is reduced, a same set of UI resources can adapt to mobile terminals of different resolution ratios simultaneously, an interface adaption process is simplified, the picture adaption efficiency is improved, and picture self-adaption is achieved. According to the picture self-adaption method, the system and the terminal equipment, specific contents of the component drawing information and the picture drawing information are further defined, computation processes of percentage parameters, pixel value parameters, coordinates and width heights are described in details simultaneously, the pictures are guaranteed to achieve different display effects automatically, display positions and display areas of the pictures on a screen are consistent, and the feasibility of the picture self-adaption is improved.

Description

A kind of picture adaptive approach, system and terminal device
Technical field
The present invention relates to the adaptive field of terminal, relate in particular to a kind of picture adaptive approach, system and terminal device.
Background technology
Portable terminal is numerous in the market, and the operating system of portable terminal and screen resolution are multifarious especially.The operating system of main flow has at present: Symbian S40, symbian S602 Nd, symbian S603 Rd, symbian^3, symbian anna, windows mobile 5.x-7, iPhone 0S 3.x-5.x, OMS, android 1.5-4.x, Blackberry 0S etc.; The main resolution of present intelligent type has: 240X320,320X240,320X480,320X640,480X800; 480X854,640X960,960*540,1024X720,1024X800 etc.;
High in order to solve mobile application and development threshold, the problem that adaptive workload is large has the people to propose the mobile middleware technology.The bottom difference that mobile middleware has shielded operating system has realized the cross operating system fast Development, and the developer only need to develop the professional interface of a cover can be at different operating systems.But mobile terminal screen size disunity still needs to make different interfaces according to the screen of different sizes, needs to reset through hi-fi effect figure, slicing treatment, and coding, it is adaptive that the steps such as test could increase a resolution newly.
The interface of application program generally all can relate to the demonstration of picture, and on the equipment of different resolution, Image Display is the effect that reaches unified, and the picture size that needs is also with inconsistent.The terminal that how many kinds of resolution is arranged just needs the how many kinds of picture to cut figure, has caused to cut that the figure workload is large, the adaptive loaded down with trivial details technical matters in interface.
Summary of the invention
The purpose of the embodiment of the invention is to propose a kind of picture adaptive approach, is intended to solve cut in the adaptive work of picture of multiresolution that the figure workload is large, the adaptive loaded down with trivial details technical matters in interface.
The embodiment of the invention is achieved in that the adaptive method of a kind of picture, and described method comprises step:
Obtain the UI packet;
The assembly of resolving described UI packet securing component is drawn the picture drafting information of information and picture;
Draw described picture according to described assembly drafting information and picture drafting information.
Another object of the present invention is to propose the adaptive system of a kind of picture, and described system comprises the first acquisition module, parsing module, the second acquisition module and drafting module;
Described the first acquisition module links to each other with described parsing module, is used for obtaining the UI packet;
Described parsing module links to each other with the second acquisition module with described the first acquisition module, is used for resolving described UI packet;
Described the second acquisition module links to each other with drafting module with described parsing module, and the assembly that is used for securing component is drawn the picture drafting information of information and picture;
Described drafting module links to each other with described the second acquisition module, is used for drawing described picture according to described assembly drafting information and picture drafting information.
Invent another purpose and be to propose the adaptive terminal device of a kind of picture, described terminal device comprises described picture adaptive system.
The present invention draws information by the picture that the assembly of resolving UI packet securing component is drawn information and picture, and draws described picture according to described assembly drafting information and picture drafting information.The present invention has reduced in the multiresolution picture is adaptive and has cut the figure workload, and same set of UI resource is adaptive different resolution portable terminal simultaneously, has simplified the interface adaptation procedure, has improved the picture Adaption efficiency, has realized the picture self-adaptation.The present invention is further clear and definite, and assembly drafting information and picture are drawn the content of information, describe simultaneously the computation process of number percent parameter, pixel value parameter, each coordinate and wide height in detail, guaranteed the automatically various display effect of realization of picture, ensure the consistance of picture display position and viewing area on screen, improved the adaptive feasibility of picture.
Description of drawings
Fig. 1 is the first preferred embodiment process flow diagram of a kind of picture adaptive approach of the present invention;
Fig. 2 is the second preferred embodiment process flow diagram of a kind of picture adaptive approach of the present invention;
Fig. 3 is the wide high-level schematic of assembly com1 of the present invention on the 320x480 screen;
Fig. 4 is the design sketch of picture of the present invention after the 320x480 screen is drawn;
Fig. 5 is the design sketchs of two pictures of the present invention after the 320x480 screen is drawn;
Fig. 6 is the design sketchs of four pictures of the present invention after the 320x480 screen is drawn;
Fig. 7 is the first preferred embodiment structural representation of a kind of picture adaptive system of the present invention;
Fig. 8 is the second preferred embodiment structural representation of a kind of picture adaptive system of the present invention;
Fig. 9 is the 3rd preferred embodiment structural representation of a kind of picture adaptive system of the present invention.
Embodiment
In order to make purpose of the present invention, technical scheme and advantage clearer, below in conjunction with drawings and Examples, the present invention is further elaborated, for convenience of explanation, only show the part relevant with the embodiment of the invention.Should be appreciated that the specific embodiment that this place is described, only be used for explaining the present invention, not in order to limit the present invention.
The present invention draws information by the picture that the assembly of resolving UI packet securing component is drawn information and picture, and draws described picture according to described assembly drafting information and picture drafting information.The present invention has reduced in the multiresolution picture is adaptive and has cut the figure workload, and same set of UI resource is adaptive different resolution portable terminal simultaneously, has simplified the interface adaptation procedure, has improved the picture Adaption efficiency, has realized the picture self-adaptation.The present invention is further clear and definite, and assembly drafting information and picture are drawn the content of information, describe simultaneously the computation process of number percent parameter, pixel value parameter, each coordinate and wide height in detail, guaranteed the automatically various display effect of realization of picture, ensure the consistance of picture display position and viewing area on screen, improved the adaptive feasibility of picture.
Embodiment one
Fig. 1 is the first preferred embodiment process flow diagram of a kind of picture adaptive approach of the present invention.Described method comprises step:
S101 obtains the UI packet;
Before this, the picture of at first drawing information and picture by server end according to the assembly of UI design requirement definitions component is drawn information, and draws information and picture drafting information creating UI packet according to described assembly;
Then obtain described UI packet by middleware;
Described assembly drafting information comprises component parameter and the component property of assembly; Described picture drafting information comprises picture anchor point and the image parameters of picture;
Described UI packet encapsulation component parameter and the component property of middleware required component, also encapsulated simultaneously picture anchor point and the image parameters of picture, the UI packet after the encapsulation offers middleware by server end;
Described assembly (Component) is the most basic display unit of middleware UI layer, but display text, picture, animation, webpage, video etc.;
Each assembly has a unique component Name as the display unit at ui interface, and described component Name is used for distinguishing each assembly;
S102, the assembly of resolving described UI packet securing component is drawn the picture drafting information of information and picture;
Namely resolve component parameter and the component property of described UI packet securing component; Also obtain simultaneously picture anchor point and the image parameters of picture;
Described component parameter comprises the coordinate (x coordinate, y coordinate) of assembly and the wide height of assembly (width, highly), described component parameter can be the pixel value component parameter, it also can be the number percent component parameter, represent x coordinate, y coordinate, width and height with x, y, width, height respectively, the coordinate that wherein represents with the number percent component parameter is called the relative coordinate of assembly, with number percent the component parameter width that represents and the relative wide height that highly is called assembly;
The number percent component parameter is that to choose arbitrary resolution screen according to UI design requirement and assembly layout be the number percent component parameter that object of reference estimates, and is specially:
Choose estimation coordinate and the wide height of estimation that arbitrary resolution screen is object of reference estimation assembly according to UI design requirement and assembly layout;
Obtain the relative coordinate and relative wide height of described assembly according to the estimation coordinate of described assembly and the wide height of estimation;
Relative coordinate in the described number percent component parameter refers to described assembly with respect to the coordinate position in parent component or the screen upper left corner, is that wide height with parent component or screen is as calculating basis; Relative coordinate without the assembly of parent component is calculated take the wide height of screen as calculating basis;
Namely, when described assembly had parent component, the relative coordinate of described assembly was the number percent that the wide height of described assembly accounts for the wide height of parent component; When described assembly during without parent component, the relative coordinate of described assembly is the number percent that the wide height of described assembly accounts for the wide height of screen;
Namely, when described assembly had parent component, the relative coordinate of described assembly was the number percent that the difference of the absolute coordinates in the absolute coordinates in the described assembly upper left corner and the parent component upper left corner accounts for the wide height of parent component; When described assembly during without parent component, the relative coordinate of described assembly is the number percent that the absolute coordinates in the described assembly upper left corner accounts for the wide height of screen;
The relative coordinate that the assembly of parent component is arranged is the coordinate-system of relative parent component, and this coordinate-system is take the upper left corner of parent component as true origin, and x increases left, and y increases downwards;
Relatively wide height in the described number percent component parameter refers to that the absolute wide height of described assembly is with respect to the number percent of parent component or the absolute wide height of screen;
Described component property comprises parent component title and sub-component sequence; Described parent component title has recorded the parent component of described assembly; Described parent component refers to include the assembly of sub-component; Described sub-component sequential recording all sub-components of described assembly; Described sub-component refers to the assembly that comprised by parent component can iteration comprise again next stage sub-component; Each assembly can also can have one group of sub-component sequence as the parent component of other assemblies, and the parent component of assembly can only have one, and the sub-component sequence can have a plurality of; For example represent the parent component title of assembly and the sub-component sequence of assembly with parent and subList respectively;
Described assembly can be several assemblies, sets up nest relation by the parent component title in the described component property and sub-component sequence between each assembly, and described nest relation comprises relation of inclusion or involved relation;
Described picture anchor point refers to described picture with respect to the position of assembly under the described picture, comprises occupying left LEFT, occupying right RIGHT, TOP on the horizontal center HCENTER, residence, occupy lower BOTTOM and vertical center VCENTER;
Described image parameters also can be pixel value image parameters or number percent picture parameter;
Described pixel value image parameters comprises absolute coordinates and the absolute wide height of picture;
The absolute coordinates of described picture equals the absolute coordinates of assembly under the wide height of assembly under the described picture of relative coordinate * of described picture+described picture;
The absolute wide height of described picture equals the wide height of the affiliated assembly of the described picture of relatively wide height * of described picture;
Described number percent picture parameter is that to choose arbitrary resolution screen according to UI design requirement and figure chip layout be the number percent picture parameter that object of reference estimates, and is specially:
Choose estimation coordinate and the wide height of estimation that arbitrary resolution screen is object of reference estimation picture according to UI design requirement and figure chip layout;
Obtain the relative coordinate and relative wide height of described picture according to the estimation coordinate of described picture and the wide height of estimation;
Described number percent picture parameter comprises the relative coordinate and relative wide height of picture;
The difference that the estimation coordinate that the relative coordinate of described picture equals described picture deducts the estimation coordinate of assembly under the described picture is again divided by the wide height of estimation of assembly under the described picture;
The wide height of estimation that the relatively wide height of described picture equals described picture is divided by the wide height of estimation of assembly under the described picture;
S103 draws described picture according to described assembly drafting information and picture drafting information;
Draw described picture according to described component parameter, component property, picture anchor point and image parameters, with described Image Display on terminal device.
Embodiment two
Fig. 2 is the second preferred embodiment process flow diagram of a kind of picture adaptive approach of the present invention.Described method comprises step:
S201, number percent component parameter and component property according to UI design requirement definitions component, define simultaneously picture anchor point and the number percent picture parameter of picture, then create the UI packet according to described number percent component parameter, component property, picture anchor point and number percent picture parameter;
Server end is determined interface layout according to product UI design requirement, the nest relation of component type, number percent component parameter and the inter-module of definition middleware required component;
Server end also according to product UI design requirement, is determined the figure chip layout, picture anchor point and the number percent picture parameter of the required picture of definition middleware;
At last, server end is packaged into the UI Packet Generation to middleware with the nest relation of described component type, number percent component parameter and inter-module and picture anchor point and the number percent picture parameter of picture;
For ease of understanding, 320x480 illustrates with screen, and design requirement is as follows: show a pictures, fill full whole screen, picture name is sample1.jpg, picture size 320x480, as shown in Figure 4;
Find out that very simply the drafting effect that design requirement need to reach is exactly to show a picture that fully supports whole screen; According to this design requirement, design component com1, assembly com1 without sub-component, only have the drafting of picture sample1.jpg without parent component, and picture is drawn and fully supported screen, and the wide height of picture drawing area is identical with the wide height of com1 assembly;
According to above analysis, the drafting reference position of com1 draws the estimation coordinate (0,0) of com1 assembly in the screen upper left corner, the com1 assembly fully supports whole screen, so the wide height of the estimation of com1 assembly is (320,480), picture is drawn reference position also in the screen upper left corner and full frame drafting, so the estimation coordinate that picture is drawn also is (0,0), estimates that wide height also is (320,480).
Further, be the relative coordinate and relative wide height of assembly with the estimation coordinate of assembly with the wide height conversion of estimation, namely be converted to the number percent component parameter, be specially:
The com1 assembly is screen assembly without parent component, and the number percent component parameter converts all take the wide height of screen as reference point, and the relative coordinate of com1 and relative wide height are all with respect to screen;
The estimation coordinate (0 of com1 assembly, 0) deducts screen upper left corner coordinate (0,0), gets (0,0), the conversion relative coordinate is (0/ screen width, 0/ screen height)=(0/320,0/480)=(0,0), so the relative coordinate of com1 assembly is (0,0) still;
The wide height of estimation that the relatively wide height of screen assembly com1 is screen assembly is divided by the ratio value of the wide height of screen, so wide height (320 of the estimation of com1,480) divided by the wide height (320 of screen, 480)=>(320/320,480/480)=>relative coordinate (100%, 100%), namely the relatively wide height of com1 is (100%, 100%);
At this moment, there has been the relative coordinate of assembly just can guarantee that with relative wide height the com1 assembly all fully supports whole screen when any screen is drawn;
The relative coordinate of picture sample1 and relative wide height are that the relative position of the assembly under described picture and the described picture estimates;
The relative coordinate of picture sample1 for its draw origin coordinates deduct under the ratio of wide height of the difference of origin coordinates of assembly com1 and affiliated assembly com1, calculate by this definition: the estimation coordinate (0 of sample1,0) deducts the estimation coordinate (0 of com1 assembly, 0) gets (0,0), divided by the wide height of the estimation of com1 assembly (0/320,0/480)=>relative coordinate of picture is (0,0);
The wide height of estimation that the relatively wide height of picture is described picture is divided by the ratio of the wide height of estimation of assembly under the described picture, and namely the relatively wide height of sample1 is (320/320,480/480)=(100%, 100%);
Respectively with posX1=0, posY1=0, paraW1=100%, the relative coordinate of paraH1=100% recordable picture sample1 and relative wide height can be determined the picture anchor point anchor1=LEFT|TOP of described picture sample1 simultaneously;
S202 obtains the UI packet;
Here being middleware is carrying out picture when adaptive, no matter middleware need to carry out adaptive to the screen of which kind of resolution, at this moment all need to obtain number percent component parameter, component property, number percent picture parameter and picture anchor point in the UI packet, and can carry out according to described number percent component parameter, number percent picture parameter and picture anchor point the picture self-adaptation of various resolution screen;
S203 resolves picture anchor point and number percent picture parameter that described UI packet obtains number percent component parameter, component property and the described picture of described assembly;
For ease of understanding, illustrate, for example resolve described UI packet and get access to following information;
Get access to the assembly of com1, his father's component Name parent is empty, and sub-component sequence subList also is empty, and needs the picture sample1.jpg of demonstration;
Get access to the number percent component parameter of com1, wherein x, y, width, height are respectively 0,0,100%, 100%;
The relative coordinate of picture sample1.jpg is respectively posX1=0 with relative wide height, posY1=0, paraW1=100%, paraH1=100%, picture anchor point anchor1=LEFT|TOP, picture size 320x480;
S204 is converted to pixel value component parameter and pixel value image parameters with described number percent component parameter and described number percent picture parameter;
Described pixel value component parameter comprises absolute coordinates and the absolute wide height of described assembly;
When the absolute coordinates of described assembly referred to draw described assembly, described assembly was with respect to the coordinate position in the screen upper left corner;
Described assembly also claims origin coordinates with respect to the coordinate position in the screen upper left corner;
The absolute wide height that the relative coordinate that absolute coordinates in the described pixel value component parameter equals described assembly multiply by described assembly parent component adds the absolute coordinates of parent component again;
The relatively wide height that absolute wide height in the described pixel value component parameter equals described assembly multiply by the absolute wide height of described assembly parent component;
Wherein, the absolute coordinates of the screen assembly relative coordinate that equals screen assembly multiply by the wide height of screen; The relatively wide height that the absolute wide height of screen assembly equals screen assembly multiply by the wide height of screen;
Illustrate: the absolute coordinates of com1 is (0,0), overlaps with screen upper left corner coordinate (0,0);
The absolute width of com1=100%* screen width=screen width, the absolute altitude of com1=100%* screen height=screen height, namely the absolute wide height of com1 is (320,480), is illustrated in figure 3 as the wide high-level schematic of com1 on the 320x480 screen;
The absolute coordinates of picture sample1.jpg is (0,0), and the picture anchor point is the upper left corner, so (0,0) is the upper left corner graphical pointv of sample1.jpg;
The absolute width of picture sample1.jpg=relative width 100%*320 (the absolute width of com1)=320, the absolute altitude of picture sample1.jpg=relative height 100%*480 (absolute altitude of com1)=480, the target drawing area that gets picture sample1.jpg is (320,480); The size of picture sample1.jpg is 320x480, is equal to drawing area (320,480), processes so the drawing process of picture sample1.jpg need not convergent-divergent;
S205 draws described picture according to described pixel value component parameter, component property, pixel value image parameters and picture anchor point according to nested order from front to back;
Described nested order is from front to back drawn described picture and is referred to draw according to the sequencing that picture adds in the assembly, and the picture that adds to first in the assembly is drawn first, draws behind the picture of rear interpolation;
In this example, only have an assembly and a picture, get final product so directly draw described picture, be illustrated in figure 4 as the design sketch of picture sample1.jpg after the 320x480 screen is drawn;
In order more to describe present embodiment in detail, again illustrate the drawing process when a plurality of assemblies and a plurality of picture are arranged:
320x480 illustrates with screen, in this example, resolving described UI packet, to get access to assembly be com1 and com2, and get access to picture sample1.jpg and sample2.jpg, com1 and com2 set up by each self-corresponding parent component title parent and sub-component sequence subList and comprise to each other and involved nest relation, and wherein com1 comprises com2;
The number percent component parameter x, y, width, the height that obtain com1 are respectively 0,0,100%, 100%, the parent component title parent of com1 is empty, sub-component sequence subList is com2, needs rendered images sample1.jpg, picture size 320x480, as shown in Figure 4, the number percent picture parameter of picture is posX1=0, posY1=0, paraW1=100%, paraH1=100%, picture anchor point anchor1=LEFT|TOP;
The number percent component parameter x, y, width, the height that get access to com2 are respectively 0,0,100%, 50%; The parent component title parent of com2 is com1, needs rendered images sample2.jpg, and picture size is 240x240, the number percent picture parameter of picture is posX2=50%, posY2=50%, paraW2=100%, picture anchor point anchor2=HCENTER|VCENTER;
Further, the number percent component parameter is converted to the pixel value component parameter, number percent picture parameter is converted to the pixel value image parameters:
The absolute coordinates of com1 overlaps with screen upper left corner coordinate, is (0,0); The absolute width of com1=100%* screen width=screen width, the absolute altitude of com1=100%* screen height=screen height, calculate the absolute wide height of com1 for (320,480);
The absolute coordinates of com2 is (0,0), the absolute wide height of com2 be (the absolute width of 100%*com1, the absolute altitude of 50%*com1)=>(100%*320,50%*480)=(320,240);
The relative coordinate posX1=0 of picture sample1.jpg, posY1=0 adds the origin coordinates (0,0) of assembly com1, the absolute coordinates that gets sample1 is (0,0), and the drafting anchor point is the upper left corner, so (0,0) is the upper left corner graphical pointv of picture sample1.jpg; The absolute width of picture sample1.jpg=relative width 100%*320 (the absolute width of com1)=320, absolute altitude=relative height 100%*480 (absolute altitude of com1)=480, the picture drawing area is (320,480);
The relative coordinate posX2=50%*320 of picture sample2.jpg (width of com2)=160, posY2=50%*240 (height of com2)=120, the origin coordinates (0 of cumulative upper com2 assembly, 0), get the absolute coordinates (160,120) of sampl e2, and the picture anchor point is that horizontal vertical is placed in the middle, graphical pointv centered by (so 160,120); The absolute width of picture sample2.jpg=relative width 100%*320 (the absolute width of com2)=320; Only set relative width paraW2 in this example, do not set relative height paraH2, this situation adopts uniform zoom strategy, keeps the wide high ratio of picture, namely behind the convergent-divergent behind picture width and the convergent-divergent ratio of picture height must equal picture original width and picture original height ratio;
It is 320 that the absolute width of picture has been calculated, and the original wide height of picture all is 240, and wide height equates that absolute altitude also is 320 after definite uniform zoom easily, so picture sample2.jpg target drawing area is (320,320); But the absolute altitude of com2 assembly is 240, less than the height (320) of picture drawing area, with (320,320) for after drawing area draws, but the drafting of the partial content of sample2.jpg will exceed the viewing area of com2; For picture is complete is presented in the assembly com2, correcting the target drawing area is assembly viewing area (320,240), use " with regard to little principle ": in uniform zoom, get target width and former figure width ratio, object height and former figure height ratio minimum value as pantograph ratio;
The width maximum zoom ratio of picture is: the width of viewing area (320)/picture original width (240)=1.333; Height maximum zoom ratio is: the height of viewing area (240)/picture original height (240)=1.0; Get minimum value 1.0, use 1.0 pantograph ratio drafting sample2.jpg, guarantee that picture is complete is presented at the com2 component internal; Design sketch after picture sample1.jpg and sample2.jpg draw as shown in Figure 5.
Illustrate with 4 assemblies, for example use 4 assembly com1, com2, com3 and com4.
Wherein, com1 assembly relative coordinate is (0,0), relatively wide height is (100%, 100%), without parent component, the picture that needs to show is sample1.jpg, wherein picture number percent parameter is respectively posX1=0, posY1=0, paraW1=100%, paraH1=100%, the picture anchor point is anchor1=LEFT|TOP, picture size 320x480;
The parent component of com2 assembly is com1, relative coordinate is (0,0), relatively wide height is (100%, 50%), the picture that needs to show is sample2.jpg, wherein picture number percent parameter is respectively posX2=50%, posY2=50%, paraW2=100%, picture anchor point anchor2=HCENTER|VCENTER, picture size is 240x240;
The parent component of com3 assembly is com1, relative coordinate (0,50%), relatively wide height is (50%, 25%), the picture that needs to show is sample2.jpg, and wherein picture number percent parameter is respectively posX3=50%, posY3=50%, paraH3=100%, paraW3=100%, picture anchor point anchor3=HCENTER|VCENTER, picture size is 240x240;
The parent component of com4 assembly is com1, relative coordinate (50%, 75%), relatively wide height is (50%, 25%), and the picture that needs to show is sample3.jpg, wherein picture number percent parameter is respectively posX4=100%, posY4=100%, picture anchor point anchor4=RIGHT|BOTTOM, picture size is 40x90;
Take screen resolution 320x480 as example, the absolute wide height that can calculate com1, com2, com3 and com4 is respectively: (320,480), (320,240), (160,120), (160,120), absolute coordinates is respectively: (0,0), (0,0), (0,240), (160,360);
The number percent picture parameter conversion of sample1.jpg among the com1 is pixel value image parameters: posX1=0, posY1=0, add the origin coordinates (0 of assembly com1,0) the drafting origin coordinates that, gets sample1 is (0,0), the drafting anchor point is the upper left corner, upper left angle point that draw for sample1 (so 0,0);
ParaW1=100%*320 (width of com1)=320, paraH1=100%*480 (height of com1)=480, the target drawing area is (320,480).The size of picture sample1.jpg is 320x480, is equal to drawing area (320,480), processes so the drafting of sampl e1.jpg need not convergent-divergent, and the design sketch after the drafting as shown in Figure 6;
The number percent picture parameter conversion of sample2.jpg among the com2 is pixel value image parameters: posX2=50%*320 (width of com2)=160, posY2=50%*240 (height of com2)=120, the origin coordinates (0 of cumulative upper com2 assembly, 0), getting the drafting origin coordinates (160,120) of sample2.jpg, is that horizontal vertical is placed in the middle and draw anchor point, so (160,120) are for drawing central point;
ParaW2=100%*320 (width of com2)=320 has only set paraW2, does not set paraH2, so sample2.jpg uses uniform zoom, to have calculated be 320 to width behind the image zooming, is to keep the wide high ratio of picture, must have:
Height=picture width/picture height behind width/convergent-divergent behind the convergent-divergent;
Can calculate behind the sample2.jpg convergent-divergent highly also is 320, and the target drawing area is (320,320); But the com2 component height is 240, and less than the height (320) of picture drawing area, but the drafting of the partial content of sample2.jpg will go out the com2 viewing area.In order to guarantee the complete component internal that is presented at of picture energy, correcting drawing area is (320,240), according to " with regard to little principle ": in uniform zoom, get target width and former figure width ratio, object height and former figure height ratio minimum value as pantograph ratio.Can be regarded as to such an extent that the best pantograph ratio of sample2.jpg is 1.0.
Namely require sample2.jpg actual displayed zone can not surpass the viewing area 320x240 of com2 assembly, so the width drawn of sample2.jpg can not surpass 320, amplify if that is to say sample2.jpg, the breadth extreme after then amplifying can not surpass 320, so
Picture sample2.jpg width maximum zoom ratio is: but the width of maximum viewing area (320)/picture original width (240)=1.333;
In like manner can get:
Picture sample2.jpg height maximum zoom ratio is: but the height of maximum viewing area (240)/picture original height (240)=1.0;
Get minimum value 1.0, the effect behind the convergent-divergent as shown in Figure 6;
The number percent picture parameter conversion of sample2.jpg among the com3 is pixel value image parameters: posX3=50%*160 (width of com3)=80, posY3=50%*120 (height of com3)=60, the origin coordinates (0 of cumulative upper com3 assembly, 240), get the drafting origin coordinates (80,300) of sample2.jpg among the com3, anchor point is that horizontal vertical is placed in the middle, namely (80,300) are that sampl e2.jpg draws central point among the com3.
ParaW3=100%*160 (width of com3)=160, paraH3=100%*120 (height of com3)=120 gets target drawing area (160,120); The big or small 240x240 of known picture, exceed the drawing area size, so must do convergent-divergent to picture processes, wide high convergent-divergent score is not: 160/240=0.666,120/240=0.5, wide pantograph ratio 0.666 is greater than height pantograph ratio 0.5, sample2.jpg can be stretched horizontally among the effect com3 so finally draw, and draws effect as shown in Figure 6;
Among the com4 the number percent picture parameter conversion of sample3.jpg be pixel value image parameters: posX4=100%*160 (width of com4)=160, posY4=100%*120 (height of com4)=120, cumulative com4 assembly origin coordinates (160,360), get sample3.jpg and draw origin coordinates (320,480), anchor point is the lower right corner; ParaW4 and paraH4 do not have setting, and this situation adopts the picture original size to draw strategy, and namely the original size 40x90 according to sample3.jpg draws;
Design sketch after four pictures are drawn as shown in Figure 6, wherein the dotted line around each picture is the drafting design sketch of assembly under the described picture.
The present invention draws information by the picture that the assembly of resolving UI packet securing component is drawn information and picture, and draws described picture according to described assembly drafting information and picture drafting information.The present invention has reduced in the multiresolution picture is adaptive and has cut the figure workload, and same set of UI resource is adaptive different resolution portable terminal simultaneously, has simplified the interface adaptation procedure, has improved the picture Adaption efficiency, has realized the picture self-adaptation.The present invention is further clear and definite, and assembly drafting information and picture are drawn the content of information, describe simultaneously the computation process of number percent parameter, pixel value parameter, each coordinate and wide height in detail, guarantee the automatically various display effect of realization of picture, ensure the consistance in the position of picture on screen and zone, improved the adaptive feasibility of picture.
Embodiment three
Fig. 7 is the first preferred embodiment structural representation of a kind of picture adaptive system of the present invention.Described system comprises the first acquisition module, parsing module, the second acquisition module and drafting module;
Described the first acquisition module links to each other with described parsing module, is used for obtaining the UI packet;
Before this, the picture of at first drawing information and picture by server end according to the assembly of UI design requirement definitions component is drawn information, and draws information and picture drafting information creating UI packet according to described assembly;
Then obtain described UI packet by middleware;
Described assembly drafting information comprises component parameter and the component property of assembly; Described picture drafting information comprises picture anchor point and the image parameters of picture;
Described UI packet encapsulation component parameter and the component property of middleware required component, also encapsulated simultaneously picture anchor point and the image parameters of picture, the UI packet after the encapsulation offers middleware by server end;
Described assembly (component) is the most basic display unit of middleware UI layer, but display text, picture, animation, webpage, video etc.;
Each assembly has a unique component Name as the display unit at ui interface, and described component Name is used for distinguishing each assembly;
Described parsing module links to each other with the second acquisition module with described the first acquisition module, is used for resolving described UI packet;
Described the second acquisition module links to each other with drafting module with described parsing module, and the assembly that is used for securing component is drawn the picture drafting information of information and picture;
Namely resolve component parameter and the component property of described UI packet securing component; Also obtain simultaneously picture anchor point and the image parameters of picture;
Described component parameter comprises the coordinate (x coordinate, y coordinate) of assembly and the wide height of assembly (width, highly), described component parameter can be the pixel value component parameter, it also can be the number percent component parameter, represent x coordinate, y coordinate, width and height with x, y, width, height respectively, the coordinate that wherein represents with the number percent component parameter is called the relative coordinate of assembly, with number percent the component parameter width that represents and the relative wide height that highly is called assembly;
The number percent component parameter is that to choose arbitrary resolution screen according to UI design requirement and assembly layout be the number percent component parameter that object of reference estimates, and is specially:
Choose estimation coordinate and the wide height of estimation that arbitrary resolution screen is object of reference estimation assembly according to UI design requirement and assembly layout;
Obtain the relative coordinate and relative wide height of described assembly according to the estimation coordinate of described assembly and the wide height of estimation;
Relative coordinate in the described number percent component parameter refers to described assembly with respect to the coordinate position in parent component or the screen upper left corner, is that wide height with parent component or screen is as calculating basis; Relative coordinate without the assembly of parent component is calculated take the wide height of screen as calculating basis;
Namely, when described assembly had parent component, the relative coordinate of described assembly was the number percent that the wide height of described assembly accounts for the wide height of parent component; When described assembly during without parent component, the relative coordinate of described assembly is the number percent that the wide height of described assembly accounts for the wide height of screen;
Namely, when described assembly had parent component, the relative coordinate of described assembly was the number percent that the difference of the absolute coordinates in the absolute coordinates in the described assembly upper left corner and the parent component upper left corner accounts for the wide height of parent component; When described assembly during without parent component, the relative coordinate of described assembly is the number percent that the absolute coordinates in the described assembly upper left corner accounts for the wide height of screen;
The assembly relative coordinate that parent component is arranged is in the coordinate-system of relative parent component, and take the upper left corner of parent component as true origin, x increases left, and y increases downwards;
Relatively wide height in the described number percent component parameter refers to that the absolute wide height of described assembly is with respect to the number percent of parent component or the absolute wide height of screen;
Described component property comprises parent component title and sub-component sequence; Described parent component title has recorded the parent component of described assembly; Described parent component refers to include the assembly of sub-component; Described sub-component sequential recording all sub-components of described assembly; Described sub-component refers to the assembly that comprised by parent component can iteration comprise again next stage sub-component; Each assembly can also can have one group of sub-component sequence as the parent component of other assemblies, and the parent component of assembly can only have one, and the sub-component sequence can have a plurality of; For example represent the parent component title of assembly and the sub-component sequence of assembly with parent and subList respectively;
Described assembly can be several assemblies, sets up nest relation by the parent component title in the described component property and sub-component sequence between each assembly, and described nest relation comprises relation of inclusion or involved relation;
Described picture anchor point refers to described picture with respect to the position of assembly under the described picture, comprises occupying left LEFT, occupying right RIGHT, TOP on the horizontal center HCENTER, residence, occupy lower BOTTOM and vertical center VCENTER;
Described image parameters also can be pixel value image parameters or number percent picture parameter;
Described pixel value image parameters comprises absolute coordinates and the absolute wide height of picture;
The absolute coordinates of described picture equals the absolute coordinates of assembly under the wide height of assembly under the described picture of relative coordinate * of described picture+described picture;
The absolute wide height of described picture equals the wide height of the affiliated assembly of the described picture of relatively wide height * of described picture;
Described number percent picture parameter is that to choose arbitrary resolution screen according to UI design requirement and figure chip layout be the number percent picture parameter that object of reference estimates, and is specially:
Choose estimation coordinate and the wide height of estimation that arbitrary resolution screen is object of reference estimation picture according to UI design requirement and figure chip layout;
Obtain the relative coordinate and relative wide height of described picture according to the estimation coordinate of described picture and the wide height of estimation;
Described number percent picture parameter comprises the relative coordinate and relative wide height of picture;
The difference that the estimation coordinate that the relative coordinate of described picture equals described picture deducts the estimation coordinate of assembly under the described picture is again divided by the wide height of estimation of assembly under the described picture;
The wide height of estimation that the relatively wide height of described picture equals described picture is divided by the wide height of estimation of assembly under the described picture;
Described drafting module links to each other with described the second acquisition module, is used for drawing described picture according to described assembly drafting information and picture drafting information.
The further optimization of such scheme is that described system also comprises definition module and creation module, is illustrated in figure 8 as the second preferred embodiment structural representation of a kind of picture adaptive system of the present invention;
Described definition module links to each other with described creation module, is used for drawing according to the assembly of UI design requirement definitions component the picture drafting information of information and picture;
Described creation module links to each other with the first acquisition module with described definition module, is used for drawing information and picture drafting information creating UI packet according to described assembly.
Server end is determined interface layout according to product UI design requirement, the nest relation of component type, number percent component parameter and the inter-module of definition middleware required component;
Server end also according to product UI design requirement, is determined the figure chip layout, picture anchor point and the number percent picture parameter of the required picture of definition middleware;
At last, server end is packaged into the UI Packet Generation to middleware with the nest relation of described component type, number percent component parameter and inter-module and picture anchor point and the number percent picture parameter of picture;
The further optimization of such scheme is that described system also comprises modular converter, is illustrated in figure 9 as the 3rd preferred embodiment structural representation of a kind of picture adaptive system of the present invention;
Described definition module also is used for number percent component parameter and the component property according to UI design requirement definitions component, defines simultaneously picture anchor point and the number percent picture parameter of picture;
Described creation module also is used for creating the UI packet according to described number percent component parameter, component property, picture anchor point and number percent picture parameter;
For ease of understanding, 320x480 illustrates with screen, and design requirement wherein is: show a pictures, fill full whole screen, picture name is sample1.jpg, picture size 320x480, as shown in Figure 4;
Find out that very simply the drafting effect that design requirement need to reach is exactly to show a picture that fully supports whole screen; According to this design requirement, design component com1, assembly com1 without sub-component, only have the drafting of picture sample1.jpg without parent component, and picture is drawn and fully supported screen, and the wide height of picture drawing area is identical with the wide height of com1 assembly;
According to above analysis, the drafting reference position of com1 draws the estimation coordinate (0,0) of com1 assembly in the screen upper left corner, the com1 assembly fully supports whole screen, so the wide height of the estimation of com1 assembly is (320,480), picture is drawn reference position also in the screen upper left corner and full frame drafting, so the estimation coordinate that picture is drawn also is (0,0), estimates that wide height also is (320,480).
Further, be the relative coordinate and relative wide height of assembly with the estimation coordinate of assembly with the wide height conversion of estimation, namely be converted to the number percent component parameter, be specially:
The com1 assembly is screen assembly without parent component, and the number percent component parameter converts all take the wide height of screen as reference point, and the relative coordinate of com1 and relative wide height are all with respect to screen;
The estimation coordinate (0 of com1 assembly, 0) deducts screen upper left corner coordinate (0,0), gets (0,0), the conversion relative coordinate is (0/ screen width, 0/ screen height)=(0/320,0/480)=(0,0), so the relative coordinate of com1 assembly is (0,0) still;
The wide height of estimation that the relatively wide height of screen assembly com1 is screen assembly is divided by the ratio value of the wide height of screen, so wide height (320 of the estimation of com1,480) divided by the wide height (320 of screen, 480)=>(320/320,480/480)=>relative coordinate (100%, 100%), namely the relatively wide height of com1 is (100%, 100%);
At this moment, there has been the relative coordinate of assembly just can guarantee that with relative wide height the com1 assembly all fully supports whole screen when any screen is drawn;
The relative coordinate of picture sample1 and relative wide height are that the relative position of the assembly under described picture and the described picture estimates;
The relative coordinate of picture sample1 for its draw origin coordinates deduct under the ratio of wide height of the difference of origin coordinates of assembly com1 and affiliated assembly com1, calculate by this definition: the estimation coordinate (0 of sample1,0) deducts the estimation coordinate (0 of com1 assembly, 0) gets (0,0), divided by the wide height of the estimation of com1 assembly (0/320,0/480)=>relative coordinate of picture is (0,0);
The wide height of estimation that the relatively wide height of picture is described picture is divided by the ratio of the wide height of estimation of assembly under the described picture, and namely the relatively wide height of sample1 is (320/320,480/480)=(100%, 100%);
Respectively with posX1=0, posY1=0, paraW1=100%, the relative coordinate of paraH1=100% recordable picture sample1 and relative wide height can be determined the picture anchor point anchor1=LEFT|TOP of described picture sample1 simultaneously;
Described the second acquisition module links to each other with described parsing module, modular converter and drafting module, also is used for obtaining described number percent component parameter, component property, picture anchor point and number percent picture parameter;
Here being middleware is carrying out picture when adaptive, no matter middleware need to carry out adaptive to the screen of which kind of resolution, at this moment all need to obtain number percent component parameter, component property, number percent picture parameter and picture anchor point in the UI packet, and can carry out according to described number percent component parameter, number percent picture parameter and picture anchor point the picture self-adaptation of various resolution screen;
For ease of understanding, illustrate, for example parsing module is resolved described UI packet, and it is com1 that the second acquisition module gets access to assembly;
Obtain the component property of com1, wherein the parent component title parent of com1 is empty, and sub-component sequence subList is empty, and the picture that com1 need to show is sample1.jpg;
Get access to the number percent component parameter of com1, wherein x, y, width, height are respectively 0,0,100%, 100%;
The relative coordinate of picture sample1.jpg is respectively posX1=0 with relative wide height, posY1=0, paraW1=100%, paraH1=100%, picture anchor point anchor1=LEFT|TOP, picture size 320x480;
Described modular converter links to each other with drafting module with described the second acquisition module, is used for described number percent component parameter is converted to the pixel value component parameter; Also be used for described number percent picture parameter is converted to the pixel value image parameters;
Described pixel value component parameter comprises absolute coordinates and the absolute wide height of described assembly;
When the absolute coordinates of described assembly referred to draw described assembly, described assembly was with respect to the coordinate position in the screen upper left corner;
Described assembly also claims origin coordinates with respect to the coordinate position in the screen upper left corner;
The absolute wide height that the relative coordinate that absolute coordinates in the described pixel value component parameter equals described assembly multiply by described assembly parent component adds the absolute coordinates of parent component again;
The relatively wide height that absolute wide height in the described pixel value component parameter equals described assembly multiply by the absolute wide height of described assembly parent component;
Wherein, the absolute coordinates of the screen assembly relative coordinate that equals screen assembly multiply by the wide height of screen; The relatively wide height that the absolute wide height of screen assembly equals screen assembly multiply by the wide height of screen;
Illustrate: the absolute coordinates of com1 and screen upper left corner coordinate (0,0) overlap;
The absolute width of com1=100%* screen width=screen width, the absolute altitude of com1=100%* screen height=screen height, namely the absolute wide height of com1 is (320,480), is illustrated in figure 3 as the wide high-level schematic of com1 on the 320x480 screen;
The absolute coordinates of picture sample1.jpg is (0,0), and the picture anchor point is the upper left corner, so (0,0) is the upper left corner graphical pointv of sample1.jpg;
The absolute width of picture sample1.jpg=relative width 100%*320 (the absolute width of com1)=320, the absolute altitude of picture sample1.jpg=relative height 100%*480 (absolute altitude of com1)=480, the target drawing area that gets picture sample1.jpg is (320,480); The size of picture sample1.jpg is 320x480, is equal to drawing area (320,480), processes so the drawing process of picture sample1.jpg need not convergent-divergent;
Described drafting module links to each other with modular converter with described the second acquisition module, also is used for drawing described picture according to described pixel value component parameter, component property, picture anchor point and pixel value image parameters.
In this example, only have an assembly and a picture, get final product so directly draw described picture, be illustrated in figure 4 as the design sketch of picture sample1.jpg after the 320x480 screen is drawn;
To describe content identical for the drawing process of two pictures, three pictures or four pictures and embodiment one or two in the present embodiment, for saving length, repeats no more herein.
The described picture adaptive system of present embodiment comprises the first acquisition module, parsing module, the second acquisition module and drafting module, and wherein said the first acquisition module is used for obtaining the UI packet; Described parsing module is used for resolving described UI packet; The assembly of described the second acquisition module securing component is drawn the picture of information and picture and is drawn information; Described drafting module is used for drawing described picture according to described assembly drafting information and picture drafting information.Present embodiment has reduced in multiresolution is adaptive cuts the figure workload, and same set of UI resource is adaptive different resolution portable terminal simultaneously, has simplified the interface adaptation procedure, has improved the picture Adaption efficiency, has realized the picture self-adaptation.Present embodiment has further increased definition module, creation module and modular converter, and wherein definition module is used for number percent component parameter and the component property according to UI design requirement definitions component, defines simultaneously picture anchor point and the number percent picture parameter of picture; Described creation module is used for creating the UI packet according to described number percent component parameter, component property, picture anchor point and number percent picture parameter; Described modular converter is used for described number percent component parameter is converted to the pixel value component parameter; Also be used for described number percent picture parameter is converted to the pixel value image parameters.Thereby further clear and definite assembly is drawn the content that information and picture are drawn information, describe simultaneously the computation process of number percent parameter, pixel value parameter, each coordinate and wide height in detail, guarantee the automatically various display effect of realization of picture, ensure the consistance of picture display position and viewing area on screen, improved the adaptive feasibility of picture.
Picture adaptive system provided by the invention need can be applied on the adaptive terminal device of picture, such as PC, PDA, mobile phone, server etc.
Those having ordinary skill in the art will appreciate that, all or part of step in realization above-described embodiment method can be finished by the programmed instruction related hardware, described program can be stored in the computer read/write memory medium, and described storage medium can be ROM, RAM, disk, CD etc.
The above only is preferred embodiment of the present invention, not in order to limiting the present invention, all any modifications of doing within the spirit and principles in the present invention, is equal to and replaces and improvement etc., all should be included within protection scope of the present invention.

Claims (12)

1. adaptive method of picture is characterized in that described method comprises step:
Obtain the UI packet;
The assembly of resolving described UI packet securing component is drawn the picture drafting information of information and picture;
Draw described picture according to described assembly drafting information and picture drafting information.
2. picture adaptive approach according to claim 1 is characterized in that, described step " is obtained the UI packet " and also comprised before step:
Draw the picture of information and picture according to the assembly of UI design requirement definitions component and draw information, and draw information and picture drafting information creating UI packet according to described assembly.
3. picture adaptive approach according to claim 1 is characterized in that, described assembly drafting information comprises component parameter and the component property of assembly;
Described picture drafting information comprises picture anchor point and the image parameters of picture.
4. picture adaptive approach according to claim 3 is characterized in that, described component parameter is the number percent component parameter, and described image parameters is number percent picture parameter;
Described step " is resolved the assembly drafting information of described UI packet securing component and the picture of picture and is drawn information " and also comprises afterwards step:
Described number percent component parameter is converted to the pixel value component parameter;
Described number percent picture parameter is converted to the pixel value image parameters.
Described step " is drawn described picture according to described assembly drafting information and picture drafting information " and is specially:
Draw described picture according to described pixel value component parameter, component property, picture anchor point and pixel value image parameters.
5. picture adaptive approach according to claim 4 is characterized in that, described pixel value component parameter comprises absolute coordinates and the absolute wide height of assembly;
The absolute wide height that the relative coordinate that the absolute coordinates of described assembly equals described assembly multiply by described assembly parent component adds the absolute coordinates of parent component again;
The relatively wide height that the absolute wide height of described assembly equals described assembly multiply by the absolute wide height of described assembly parent component.
Described pixel value image parameters comprises absolute coordinates and the absolute wide height of picture;
The relative coordinate that the absolute coordinates of described picture equals described picture multiply by the absolute coordinates that the wide height of assembly under the described picture adds assembly under the described picture again;
The relatively wide height that the absolute wide height of described picture equals described picture multiply by the wide height of assembly under the described picture;
Described picture anchor point refers to that described picture is with respect to the position of assembly under the described picture.
6. picture adaptive approach according to claim 5, it is characterized in that described number percent component parameter or number percent picture parameter are that to choose arbitrary resolution screen according to UI design requirement, assembly layout or figure chip layout be number percent component parameter or the number percent picture parameter that object of reference estimates.
7. picture adaptive approach according to claim 6 is characterized in that, described number percent component parameter comprises the relative coordinate and relative wide height of assembly; Described number percent picture parameter comprises the relative coordinate and relative wide height of picture;
Choosing arbitrary resolution screen according to UI design requirement, assembly layout and figure chip layout is number percent component parameter and the number percent picture parameter that object of reference estimates, and is specially:
Choose estimation coordinate and the wide height of estimation that arbitrary resolution screen is object of reference estimation assembly according to UI design requirement and assembly layout;
Choose estimation coordinate and the wide height of estimation that arbitrary resolution screen is object of reference estimation picture according to UI design requirement and figure chip layout;
Obtain the relative coordinate and relative wide height of described assembly according to the estimation coordinate of described assembly and the wide height of estimation;
Obtain the relative coordinate and relative wide height of described picture according to the estimation coordinate of described picture and the wide height of estimation.
8. picture adaptive approach according to claim 7 is characterized in that, the estimation coordinate that the relative coordinate of described assembly equals described assembly deducts the difference of estimation coordinate of parent component again divided by the wide height of the estimation of parent component;
The wide height of estimation that the relatively wide height of described assembly equals described assembly is divided by the wide height of the estimation of parent component;
The difference that the estimation coordinate that the relative coordinate of described picture equals described picture deducts the estimation coordinate of assembly under the described picture is again divided by the wide height of estimation of assembly under the described picture;
The wide height of estimation that the relatively wide height of described picture equals described picture is divided by the wide height of estimation of assembly under the described picture.
9. a picture adaptive system is characterized in that, described system comprises the first acquisition module, parsing module, the second acquisition module and drafting module;
Described the first acquisition module links to each other with described parsing module, is used for obtaining the UI packet;
Described parsing module links to each other with the second acquisition module with described the first acquisition module, is used for resolving described UI packet;
Described the second acquisition module links to each other with drafting module with described parsing module, and the assembly that is used for securing component is drawn the picture drafting information of information and picture;
Described drafting module links to each other with described the second acquisition module, is used for drawing described picture according to described assembly drafting information and picture drafting information.
10. described picture adaptive system according to claim 9 is characterized in that described system also comprises definition module and creation module;
Described definition module links to each other with described creation module, is used for drawing according to the assembly of UI design requirement definitions component the picture drafting information of information and picture;
Described creation module links to each other with the first acquisition module with described definition module, is used for drawing information and picture drafting information creating UI packet according to described assembly.
11. described picture adaptive system is characterized in that according to claim 10, described system also comprises modular converter;
Described definition module also is used for number percent component parameter and the component property according to UI design requirement definitions component, defines simultaneously picture anchor point and the number percent picture parameter of picture;
Described creation module also is used for creating the UI packet according to described number percent component parameter, component property, picture anchor point and number percent picture parameter;
Described the second acquisition module links to each other with described parsing module, modular converter and drafting module, also is used for obtaining described number percent component parameter, component property, picture anchor point and number percent picture parameter;
Described modular converter links to each other with drafting module with described the second acquisition module, is used for described number percent component parameter is converted to the pixel value component parameter; Also be used for described number percent picture parameter is converted to the pixel value image parameters;
Described drafting module links to each other with modular converter with described the second acquisition module, also is used for drawing described picture according to described pixel value component parameter, component property, picture anchor point and pixel value image parameters.
12. the adaptive terminal device of picture is characterized in that, described terminal device comprises such as any picture adaptive system of claim 9 to 11.
CN2012103455103A 2012-09-18 2012-09-18 Picture self-adaption method, system and terminal equipment Pending CN102902535A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN2012103455103A CN102902535A (en) 2012-09-18 2012-09-18 Picture self-adaption method, system and terminal equipment

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN2012103455103A CN102902535A (en) 2012-09-18 2012-09-18 Picture self-adaption method, system and terminal equipment

Publications (1)

Publication Number Publication Date
CN102902535A true CN102902535A (en) 2013-01-30

Family

ID=47574782

Family Applications (1)

Application Number Title Priority Date Filing Date
CN2012103455103A Pending CN102902535A (en) 2012-09-18 2012-09-18 Picture self-adaption method, system and terminal equipment

Country Status (1)

Country Link
CN (1) CN102902535A (en)

Cited By (17)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2015078366A1 (en) * 2013-11-29 2015-06-04 Tencent Technology (Shenzhen) Company Limited Method and apparatus for displaying an image, and electronic device
CN105320488A (en) * 2015-11-16 2016-02-10 联想(北京)有限公司 Control method, display method and electronic device
CN105511725A (en) * 2015-12-09 2016-04-20 网易(杭州)网络有限公司 Method and device for displaying controls in interface
CN105761204A (en) * 2016-02-23 2016-07-13 惠州Tcl移动通信有限公司 Method and system for stretching discontinuous gradient image based on intelligent terminal
CN106020632A (en) * 2016-05-25 2016-10-12 青岛海信电器股份有限公司 Self-adaptive display method and self-adaptive display device for pages
CN106502659A (en) * 2016-10-14 2017-03-15 武汉斗鱼网络科技有限公司 A kind of layout method of mobile device webpage single-page and system
CN106547540A (en) * 2016-10-12 2017-03-29 惠州市德赛西威汽车电子股份有限公司 A kind of method for drafting of text button
CN107256137A (en) * 2017-06-15 2017-10-17 深圳天珑无线科技有限公司 image processing method and device
CN107577490A (en) * 2017-08-03 2018-01-12 武汉斗鱼网络科技有限公司 View autoplacement method and device in a kind of iOS
CN106648510B (en) * 2016-12-16 2018-06-12 竞技世界(北京)网络技术有限公司 The display methods and device of a kind of display resolution
CN108363572A (en) * 2018-01-03 2018-08-03 网易(杭州)网络有限公司 A kind of method of UI autoplacements
CN108416024A (en) * 2018-03-08 2018-08-17 网易乐得科技有限公司 Data processing method and device, medium and computing device
CN109189390A (en) * 2018-08-20 2019-01-11 福建天泉教育科技有限公司 Automatically generate method, the storage medium of topology file
CN110069256A (en) * 2019-04-23 2019-07-30 北京三快在线科技有限公司 Draw method, apparatus, terminal and the storage medium of component
CN110764766A (en) * 2019-10-15 2020-02-07 成都四方伟业软件股份有限公司 Aperture effect implementation method and device
CN110764764A (en) * 2019-09-16 2020-02-07 平安科技(深圳)有限公司 Webpage-side image fixing and stretching method and device, computer equipment and storage medium
CN112507257A (en) * 2020-12-07 2021-03-16 北京达佳互联信息技术有限公司 Webpage display method, device, equipment and storage medium

Citations (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101051270A (en) * 2007-05-11 2007-10-10 华为技术有限公司 Interface layout changing method and interface display controller
US20090094555A1 (en) * 2007-10-05 2009-04-09 Nokia Corporation Adaptive user interface elements on display devices
CN101695157A (en) * 2009-09-29 2010-04-14 深圳市融创天下科技发展有限公司 Self-adapting method of display of mobile terminal screen in network application and system thereof
CN101800793A (en) * 2010-01-08 2010-08-11 上海宝点信息技术有限公司 Automatic adaptation method of graphic and text information display position on mobile device
CN101853158A (en) * 2010-05-11 2010-10-06 中兴通讯股份有限公司 Method and device for adjusting Widget window
CN102023849A (en) * 2009-09-22 2011-04-20 北京搜狗科技发展有限公司 Processing method and device for multi-platform multi-resolution application program interface
CN102117219A (en) * 2011-03-09 2011-07-06 深圳市融创天下科技发展有限公司 Method for generating clients, system and terminal equipment
CN102193786A (en) * 2010-03-11 2011-09-21 中国工商银行股份有限公司 Device and method for constructing self-adaptive graphic user interface (GUI)
CN102222354A (en) * 2010-04-19 2011-10-19 腾讯科技(深圳)有限公司 Method and system for automatically drawing graphical interface
CN102270109A (en) * 2011-08-23 2011-12-07 上海网达软件有限公司 Self-converting method and system for user interfaces with different resolutions
CN102662616A (en) * 2012-03-28 2012-09-12 北京邮电大学 Screen graphics self-adaption method and system used for mobile terminal

Patent Citations (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101051270A (en) * 2007-05-11 2007-10-10 华为技术有限公司 Interface layout changing method and interface display controller
US20090094555A1 (en) * 2007-10-05 2009-04-09 Nokia Corporation Adaptive user interface elements on display devices
CN102023849A (en) * 2009-09-22 2011-04-20 北京搜狗科技发展有限公司 Processing method and device for multi-platform multi-resolution application program interface
CN101695157A (en) * 2009-09-29 2010-04-14 深圳市融创天下科技发展有限公司 Self-adapting method of display of mobile terminal screen in network application and system thereof
CN101800793A (en) * 2010-01-08 2010-08-11 上海宝点信息技术有限公司 Automatic adaptation method of graphic and text information display position on mobile device
CN102193786A (en) * 2010-03-11 2011-09-21 中国工商银行股份有限公司 Device and method for constructing self-adaptive graphic user interface (GUI)
CN102222354A (en) * 2010-04-19 2011-10-19 腾讯科技(深圳)有限公司 Method and system for automatically drawing graphical interface
CN101853158A (en) * 2010-05-11 2010-10-06 中兴通讯股份有限公司 Method and device for adjusting Widget window
CN102117219A (en) * 2011-03-09 2011-07-06 深圳市融创天下科技发展有限公司 Method for generating clients, system and terminal equipment
CN102270109A (en) * 2011-08-23 2011-12-07 上海网达软件有限公司 Self-converting method and system for user interfaces with different resolutions
CN102662616A (en) * 2012-03-28 2012-09-12 北京邮电大学 Screen graphics self-adaption method and system used for mobile terminal

Cited By (24)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2015078366A1 (en) * 2013-11-29 2015-06-04 Tencent Technology (Shenzhen) Company Limited Method and apparatus for displaying an image, and electronic device
CN105320488B (en) * 2015-11-16 2019-04-26 联想(北京)有限公司 A kind of control method, display methods and electronic equipment
CN105320488A (en) * 2015-11-16 2016-02-10 联想(北京)有限公司 Control method, display method and electronic device
CN105511725A (en) * 2015-12-09 2016-04-20 网易(杭州)网络有限公司 Method and device for displaying controls in interface
CN105761204A (en) * 2016-02-23 2016-07-13 惠州Tcl移动通信有限公司 Method and system for stretching discontinuous gradient image based on intelligent terminal
CN106020632A (en) * 2016-05-25 2016-10-12 青岛海信电器股份有限公司 Self-adaptive display method and self-adaptive display device for pages
CN106547540A (en) * 2016-10-12 2017-03-29 惠州市德赛西威汽车电子股份有限公司 A kind of method for drafting of text button
CN106502659A (en) * 2016-10-14 2017-03-15 武汉斗鱼网络科技有限公司 A kind of layout method of mobile device webpage single-page and system
CN106502659B (en) * 2016-10-14 2019-05-17 武汉斗鱼网络科技有限公司 A kind of layout method and system of mobile device webpage single-page
CN106648510B (en) * 2016-12-16 2018-06-12 竞技世界(北京)网络技术有限公司 The display methods and device of a kind of display resolution
CN107256137B (en) * 2017-06-15 2021-02-19 深圳天珑无线科技有限公司 Picture processing method and device
CN107256137A (en) * 2017-06-15 2017-10-17 深圳天珑无线科技有限公司 image processing method and device
CN107577490A (en) * 2017-08-03 2018-01-12 武汉斗鱼网络科技有限公司 View autoplacement method and device in a kind of iOS
CN108363572B (en) * 2018-01-03 2021-06-04 网易(杭州)网络有限公司 Method for automatically arranging UI (user interface)
CN108363572A (en) * 2018-01-03 2018-08-03 网易(杭州)网络有限公司 A kind of method of UI autoplacements
CN108416024A (en) * 2018-03-08 2018-08-17 网易乐得科技有限公司 Data processing method and device, medium and computing device
CN109189390A (en) * 2018-08-20 2019-01-11 福建天泉教育科技有限公司 Automatically generate method, the storage medium of topology file
CN109189390B (en) * 2018-08-20 2021-09-07 福建天泉教育科技有限公司 Method for automatically generating layout file and storage medium
CN110069256A (en) * 2019-04-23 2019-07-30 北京三快在线科技有限公司 Draw method, apparatus, terminal and the storage medium of component
CN110764764A (en) * 2019-09-16 2020-02-07 平安科技(深圳)有限公司 Webpage-side image fixing and stretching method and device, computer equipment and storage medium
CN110764764B (en) * 2019-09-16 2024-03-01 平安科技(深圳)有限公司 Webpage end image fixed stretching method and device, computer equipment and storage medium
CN110764766A (en) * 2019-10-15 2020-02-07 成都四方伟业软件股份有限公司 Aperture effect implementation method and device
CN112507257A (en) * 2020-12-07 2021-03-16 北京达佳互联信息技术有限公司 Webpage display method, device, equipment and storage medium
CN112507257B (en) * 2020-12-07 2024-03-26 北京达佳互联信息技术有限公司 Webpage display method, device, equipment and storage medium

Similar Documents

Publication Publication Date Title
CN102902535A (en) Picture self-adaption method, system and terminal equipment
CN102890632A (en) Screen adaptation method, system and terminal device
EP3220249B1 (en) Method, device and terminal for implementing regional screen capture
CN106095437B (en) The implementation method and device of the user interface layout type of RTL from right to left
CN106303740B (en) Desktop navigation system of smart television and implementation method of system
CN103870861B (en) A kind of method and apparatus generating Quick Response Code
EP2840511A1 (en) System and method for dynamically converting webpage, and computer-readable recording medium
CN103544253A (en) Implementation method and system for displaying images in waterfall flow manner
CN105898520A (en) Video frame interception method and device
CN104239071A (en) Cross-platform mobile application development framework system based on general-purpose module and transfer service
CN103605506B (en) The display packing of a kind of graphical user interface resource and terminal
US20210191684A1 (en) Control method, control device, control system, electronic whiteboard, and mobile terminal
CN111240669B (en) Interface generation method and device, electronic equipment and computer storage medium
US20230117213A1 (en) Page display method and electronic device
CN104820589A (en) Method and device for dynamically adapting webpage
CN103957240A (en) Weather system capable of shooting pictures in real time and conducting sharing and implementation method of weather system capable of shooting pictures in real time and conducting sharing
CN104517307A (en) Method and device for animation producing
CN111459501A (en) SVG-based Web configuration picture storage and display system, method and medium
CN105701165A (en) Browser mode switching method and switching device
CN105956133B (en) Method and device for displaying file on intelligent terminal
CN111190519A (en) File and control processing method, device, equipment and storage medium thereof
CN103279902A (en) Electronic menu display method
CN107122104B (en) Data display method and device
CN105468573A (en) Configurable diagram application system
CN108958731A (en) A kind of Application Program Interface generation method, device, equipment and storage medium

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C53 Correction of patent of invention or patent application
CB02 Change of applicant information

Address after: 19, building 18, Changhong technology building, 518057 South twelve Road, South tech Zone, Nanshan District hi tech Zone, Guangdong, Shenzhen

Applicant after: SHENZHEN TEMOBI TECHNOLOGY CO., LTD.

Address before: 19, building 18, Changhong technology building, 518057 South twelve Road, South tech Zone, Nanshan District hi tech Zone, Guangdong, Shenzhen

Applicant before: Shenzhen Temobi Science & Tech Development Co.,Ltd.

COR Change of bibliographic data

Free format text: CORRECT: APPLICANT; FROM: SHENZHEN TEMOBI SCIENCE + TECHNOLOGY CO., LTD. TO: SHENZHEN RONGCHANG TIANXIA TECHNOLOGY CO., LTD.

C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
ASS Succession or assignment of patent right

Owner name: RONGCHUANG TIANXIA (SHANGHAI) TECHNOLOGY DEVELOPME

Free format text: FORMER OWNER: SHENZHEN RONGCHANG TIANXIA TECHNOLOGY CO., LTD.

Effective date: 20150702

C41 Transfer of patent application or patent right or utility model
TA01 Transfer of patent application right

Effective date of registration: 20150702

Address after: 200433 Shanghai City, Yangpu District Wei Road No. 6 room 502-8

Applicant after: World (Shanghai) Technology Development Co., Ltd.

Address before: 19, building 18, Changhong technology building, 518057 South twelve Road, South tech Zone, Nanshan District hi tech Zone, Guangdong, Shenzhen

Applicant before: SHENZHEN TEMOBI TECHNOLOGY CO., LTD.

WD01 Invention patent application deemed withdrawn after publication
WD01 Invention patent application deemed withdrawn after publication

Application publication date: 20130130