CN101369210B - Method and device for regulating user interface element - Google Patents
Method and device for regulating user interface element Download PDFInfo
- Publication number
- CN101369210B CN101369210B CN200810030330XA CN200810030330A CN101369210B CN 101369210 B CN101369210 B CN 101369210B CN 200810030330X A CN200810030330X A CN 200810030330XA CN 200810030330 A CN200810030330 A CN 200810030330A CN 101369210 B CN101369210 B CN 101369210B
- Authority
- CN
- China
- Prior art keywords
- user interface
- screen
- rotation
- coordinate system
- interface element
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Landscapes
- User Interface Of Digital Computer (AREA)
- Digital Computer Display Output (AREA)
- Controls And Circuits For Display Device (AREA)
Abstract
Embodiments of the invention disclose a device and an apparatus for adjusting user interface elements, and the method comprises: keeping coordinate values of coordinate systems based on graphical user interface systems before rotation of the user interface elements constant in the rotation process of a screen; and adjusting display angles of the user interface elements under the condition of ensuring the layout of the user interface elements constant according to the rotation direction and rotation angle of the screen. The apparatus disclosed in the embodiments of the invention includes a rotation detection module, a coordinate adjusting module and an angle adjusting module. The arrangement order of the user interface elements will not be ruined when the screen is rotated by adopting the embodiments of the invention, so as to keep good and consistent visual effects.
Description
Technical field
The present invention relates to GUI (Graphical User Interface, graphic user interface) technical field, relate in particular to a kind of method and device of in the screen rotary course, adjusting user interface element.
Background technology
Along with development of electronic technology, display screen is widely used in the terminal device, yet therefore the current majority display screen only can, after display screen is rotated, will be difficult to see clearly the picture in the user interface with single direction display frame.
For the user interface that solves screen only can be with the shortcoming of single direction display frame, the way that prior art is general is, at screen by vertically rotating to be laterally, perhaps by laterally rotating to be when vertical, by changing the coordinate of user interface element, adjust the display direction of user interface.
Referring to Fig. 1, be that the screen that prior art provides rotates the synoptic diagram of the user interface of front and back.
Before the screen rotation, screen is in vertically, and putting in order of element is two icons of every row in the user interface, altogether four lines.Concrete, the element that first row is arranged is that icon 1 and icon 2, the second row are icon 3 and icon 4, and the third line is icon 5 and icon 6, and fourth line is icon 7 and icon 8.
At screen by after vertically rotating to laterally, by changing the coordinate of element in the interface, the icon of the row of second when vertical adds to the back that screen is in first row when horizontal with screen, and will put in order changes four icons of every row into, so that the user interface when screen level is placed is fuller.As shown in Figure 1, after the screen rotation, putting in order of element becomes four icons of every row in the user interface, totally two go, wherein, the first capable unit of being arranged have icon 1, icon 2, icon 3 and icon 4, the second capable icon 5, icon 6, icon 7 and the icons 8 of being arranged with.
The inventor is in creation process of the present invention, the method of finding the adjustment user interface that above-mentioned prior art provides has following shortcoming: after screen rotates, the DISPLAY ORDER of having upset user interface element, make that the layout at the interface before and after the screen rotation is inconsistent, bring visually unified inadequately sensation to the user; The user need remember the position of icon again simultaneously, has increased user's memory burden.
Summary of the invention
The embodiment of the invention provides a kind of method and device of adjusting user interface element, and when screen rotated, putting in order of user interface element was not destroyed, and has kept good consistance visual effect.
The embodiment of the invention provides a kind of method of adjusting user interface element, and described method comprises:
In the screen rotary course, keep the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant;
According to the sense of rotation and the anglec of rotation of described screen, guaranteeing to adjust the angles of display of described user interface element under the constant condition of described user interface element layout;
According to the rotation done state of described screen, determine the coordinate system of described graph user interface system; The coordinate figure of described user interface element is adjusted into respective value under the described coordinate system.
Correspondingly, the embodiment of the invention also provides a kind of method of adjusting user interface element, and described method comprises:
Whether the anglec of rotation of judging screen reaches the critical angle that presets;
Reach critical angle if determine the anglec of rotation of described screen, guaranteeing under the constant condition of user interface element layout, upgrade the coordinate system of graph user interface system, the coordinate figure of described user interface element and angles of display are adjusted into respective value under the described coordinate system.
Correspondingly, the embodiment of the invention also provides a kind of device of adjusting user interface element, and described device comprises:
The rotation detection module is used to obtain the anglec of rotation of screen and the information of sense of rotation;
The coordinate adjusting module is used for the information obtained according to described rotation detection module, is guaranteeing under the constant condition of user interface element layout, determines the coordinate system of graph user interface system and the user interface element coordinate figure based on described coordinate system;
The angular setting module is used for the information obtained according to described rotation detection module, adjusts the angles of display of described user interface element.
Implement the embodiment of the invention, have following beneficial effect:
When screen rotates, the relative position of each user interface element in screen remains unchanged, and adjust the angles of display of described user interface element according to the angle and direction of screen rotation, make putting in order of user interface element not be destroyed, kept good consistance visual effect, the user does not need to remember again the entry position of each functional module in the user interface, thereby improves the quality of user interface and improve friendly interface.
Description of drawings
In order to be illustrated more clearly in the embodiment of the invention or technical scheme of the prior art, to do to introduce simply to the accompanying drawing of required use in embodiment or the description of the Prior Art below, apparently, accompanying drawing in describing below only is some embodiments of the present invention, for those of ordinary skills, under the prerequisite of not paying creative work, can also obtain other accompanying drawing according to these accompanying drawings.
Fig. 1 is that the screen that prior art provides rotates the synoptic diagram of the user interface of front and back;
Fig. 2 is the composition synoptic diagram of first embodiment of the device of the adjustment user interface element that provides of the embodiment of the invention;
Fig. 3 is the composition synoptic diagram of the coordinate adjusting module that provides of the embodiment of the invention;
Fig. 4 is the synoptic diagram of an embodiment of the coordinate system of the graph user interface system that provides of the embodiment of the invention;
Fig. 5 is the composition synoptic diagram of second embodiment of the device of the adjustment user interface element that provides of the embodiment of the invention;
Fig. 6 is the schematic flow sheet of first embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention;
Fig. 7 is the schematic flow sheet of second embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention;
Fig. 8 is the schematic flow sheet of the 3rd embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention;
Fig. 9 is that the second and the 3rd embodiment of method of the adjustment user interface element that provides of the embodiment of the invention is at the synoptic diagram of the user interface of screen original state;
Figure 10 is the synoptic diagram of second embodiment user interface in the screen rotary course of the method for the adjustment user interface element that provides of the embodiment of the invention;
Figure 11 is the synoptic diagram of second embodiment user interface when the screen rotation finishes of the method for the adjustment user interface element that provides of the embodiment of the invention;
Figure 12 is the synoptic diagram of the screen rotation of the 3rd embodiment of the method for the adjustment user interface element that provides of embodiment of the invention user interface when finishing;
Figure 13 is the schematic flow sheet of the 4th embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention;
Figure 14 is the synoptic diagram of the user interface of the screen rotation of the 4th embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention when not reaching critical angle;
Figure 15 is the synoptic diagram that the screen rotation of the 4th embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention reaches the user interface after the critical angle.
Embodiment
Below in conjunction with the accompanying drawing in the embodiment of the invention, the technical scheme in the embodiment of the invention is clearly and completely described, obviously, described embodiment only is the present invention's part embodiment, rather than whole embodiment.Based on the embodiment among the present invention, those of ordinary skills belong to the scope of protection of the invention not making the every other embodiment that is obtained under the creative work prerequisite.
Referring to Fig. 2, it is the composition synoptic diagram of the device of the adjustment user interface element that provides of the embodiment of the invention, described device can be implemented in the screen rotary course, keep the relative position of each user interface element in screen constant, and according to the sense of rotation and the anglec of rotation of described screen, adjust the angles of display of described user interface element, make putting in order of user interface element not be destroyed.As shown in Figure 2, the device of described adjustment user interface element comprises:
In embodiments of the present invention, in the rotary course that is implemented in screen, the relative position of each user interface element in screen remains unchanged, and for the user, each element does not rotate from visually it seems in the user interface, reach the quality of improving user interface and the purpose that improves friendly interface, present embodiment is adjusted the angles of display of user interface element in real time, concrete, described angular setting module 3 when screen rotation a angle, with the angles of display of described user interface element to the retrograde rotation a of screen sense of rotation angle.
Further, described coordinate adjusting module 2 keeps the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant in the screen rotary course; When screen rotation finishes, also according to the rotation done state of described screen, determine the coordinate system of graph user interface system, and the coordinate figure of user interface element is adjusted into respective value under the described coordinate system.As shown in Figure 3, described coordinate adjusting module 2 specifically comprises:
Coordinate system determining unit 21 is used at the screen rotary course, keeps the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation; At the rotation done state of screen when being horizontal, the coordinate system of described graph user interface system is updated to horizontal screen coordinate system; At the rotation done state of screen when being vertical, the coordinate system of described graph user interface system is updated to perpendicular screen coordinate system;
User interface element coordinate determining unit 22 is used at the screen rotary course, keeps the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant; When change takes place for the coordinate system of user interface system, the coordinate figure of described user interface element is adjusted into respective value under the new coordinate system.
Described user interface element is meant that current being presented at comprises icon, literal, menu, dialog box figures user interface (GUI on the user interface, Graphical User Interface) resource, the GUI resource pre-determines and preserves, wherein, the layout of each user interface element is described by position coordinates, size value and angles of display information.In embodiments of the present invention, the descriptor of user interface element comprises: with respect to horizontal ordinate x, ordinate y, length m, width n, the angles of display r of current coordinate system, by revising these descriptors, can reach the purpose of position, size and the angles of display of adjusting user interface element.
The graph user interface system that the embodiment of the invention provides supports horizontal screen coordinate system to switch and perpendicular screen coordinate system switches, referring to Fig. 4, it is the synoptic diagram of an embodiment of the coordinate system of the graph user interface system that provides of the embodiment of the invention, the width of user interface is w, highly be h, the coordinate system of graph user interface system support comprises:
(a) perpendicular screen coordinate system xoy: under the vertical laying state of screen, be true origin with the upper left corner of user interface, and along the horizontal and vertical x axle and the y axle done respectively at interface;
(b) horizontal screen coordinate system x ' o ' y ': under the horizontal laying state of screen, be true origin with the upper left corner of user interface, and along the horizontal and vertical x ' axle and the y ' axle done respectively at interface.
Graph user interface system is supported the switching of the coordinate system of both direction, make the user can adjust the display styles of user interface at different picture demands, for example, user interface is more suitable for arranging in the tabulation of option longitudinally, and horizontal user interface is suitable for the user according to traditional habit browsing page and broadcast video display etc.
Below for convenience of description, suppose before screen rotation that the coordinate of graph user interface system is perpendicular screen coordinate system xoy, under described coordinate system xoy, the descriptor of some user interface element original states be (x, y, m, n, r).Under original state, user interface element according to the good descriptor of actual disposition (x, y, m, n r) carries out layout, and shows on screen.
In the screen rotary course, rotation detection module 1 obtains the anglec of rotation and the sense of rotation information of screen, and real-time report handles for coordinate adjusting module 2 and angular setting module 3.
After described coordinate adjusting module 2 and angular setting module 3 receive the information that described rotation detection module 1 reports, the current coordinate system and rotation preceding consistent (promptly still being perpendicular screen coordinate system xoy) that keep graph user interface system, revise the descriptor of described user interface element according to the described screen anglec of rotation, and, on screen, refresh demonstration in real time based on described new descriptor coordinate, size and the angles of display of layout user interface element again.Concrete, following two kinds of embodiments are arranged:
First, under the situation of screen rotation a angle, user interface element based on self central point to the retrograde rotation a of screen sense of rotation angle (perhaps), for reaching the effect of interface element value preserving gravity place direction to the 360-a of rotation in the same way of screen sense of rotation degree, keep the relative position of user interface element in screen constant, amended user interface element descriptor (x ', y ', m ', n ', r ') as follows:
n′＝n；
r′＝r+a。
Second, equally under the situation of screen rotation a angle, user interface element can also be based on the upper left corner of self middle mind-set screen sense of rotation retrograde rotation a angle (perhaps, to the 360-a of rotation in the same way of screen sense of rotation degree), keep the coordinate figure of user interface element constant, new user interface element descriptor (x ', y ', m ', n ', r ') as follows:
x′＝x；y′＝y；m′＝m；n′＝n；r′＝r+a。
Further, when the screen rotation finishes, if the rotation done state of screen is that laterally then described coordinate system determining unit 21 is updated to horizontal screen coordinate system with the coordinate system of graph user interface system; If the rotation done state of screen is vertically, then described coordinate system determining unit 21 is updated to perpendicular screen coordinate system with the coordinate system of graph user interface system; Simultaneously, described user interface element coordinate determining unit 22 is adjusted into respective value under the new coordinate system with the centre coordinate value of described user interface element.
Referring to Fig. 5, it is the composition synoptic diagram of second embodiment of the device of the adjustment user interface element that provides of the embodiment of the invention, when described device reaches critical angle in the anglec of rotation of determining screen, guaranteeing under the constant condition of user interface element layout, upgrade the coordinate system of graph user interface system, the coordinate figure of described user interface element and angles of display are adjusted into respective value under the described coordinate system.
As shown in Figure 5, described device also comprises except comprising rotation detection module 1, coordinate adjusting module 2 and angular setting module 3:
Screen state determination module 4 is used for the rotation angle information obtained according to described rotation detection module, determines whether the anglec of rotation of screen reaches critical angle;
Critical angle configuration module 5 is used for the critical angle of configuration screen.In the middle of concrete enforcement, described critical angle can be configured as required, and for example, configurable 45 degree are as optimum critical angle.
In the screen rotary course, according to rotating the rotation angle information that detection module 1 is obtained, whether the anglec of rotation of judging screen reaches critical angle, if do not reach critical angle, the coordinate system that then keeps graph user interface system is consistent with the coordinate system before the screen rotation, and keeps the coordinate figure of described user interface element and angles of display constant; Reach critical angle if determine the anglec of rotation of described screen, then guaranteeing under the constant condition of described user interface element layout, upgrade the coordinate system of graph user interface system, the coordinate figure of user interface element and angles of display are adjusted into respective value under the new coordinate system.
Concrete, the coordinate system determining unit in the described coordinate adjusting module 2 before the anglec of rotation of screen reaches critical angle, keeps the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation; After the anglec of rotation of screen reached critical angle, if the coordinate system of graph user interface system is the perpendicular coordinate system that shields before the screen rotation, the coordinate system that then will reach after the critical angle was updated to horizontal screen coordinate system; If the coordinate system of graph user interface system be horizontal screen coordinate system before the screen rotation, then will reach coordinate system after the critical angle and be updated to erect and shield coordinate system;
User interface element coordinate determining unit in the described coordinate adjusting module 2 before the anglec of rotation of screen reaches critical angle, keeps the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant; When change takes place for the coordinate system of user interface system, the coordinate figure of described user interface element is adjusted into respective value under the new coordinate system;
Described angular setting module 3 is spent (perhaps, spending to the rotation in the same way 270 of screen sense of rotation) with the angles of display of user interface element to the retrograde rotation 90 of screen sense of rotation after the anglec of rotation of screen reaches critical angle.
The device of the adjustment user interface element that the embodiment of the invention provides, when screen rotates, the relative position of each user interface element in screen remains unchanged, and adjust the angles of display of described user interface element according to the angle and direction of screen rotation, make putting in order of user interface element not be destroyed, kept good consistance visual effect, thereby improved the quality of user interface and improve friendly interface.
Referring to Fig. 6, be the schematic flow sheet of first embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention.
At step S100, obtain the anglec of rotation and the sense of rotation information of screen;
At step S101, in the screen rotary course, keep the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant, comprising: keep the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation; Under described coordinate system, keep the coordinate figure of described user interface element constant.
At step S102,, guaranteeing to adjust the angles of display of described user interface element under the constant condition of described user interface element layout according to the sense of rotation and the anglec of rotation of screen;
Concrete, the layout of user interface element is determined by descriptor, revises the purpose that described descriptor can reach position, size and the angles of display of adjusting user interface element.Wherein, described user interface description information comprises: with respect to horizontal ordinate x, ordinate y, length m, width n and the angles of display r of current coordinate system.
Under original state, the current coordinate of graph user interface system is xoy, and the descriptor of some user interface elements under described coordinate system xoy is (x, y, m, n, r), user interface element carries out layout according to the described description that configures, and shows on screen.
In the screen rotary course, keep the current coordinate system constant (promptly still being coordinate system xoy) of graph user interface system.When detecting screen rotation a angle, for realizing that each element does not rotate from visually it seems in the user interface, improve the quality of user interface and improve friendly interface, user interface element is based on the retrograde rotation a angle (perhaps, to the 360-a of rotation in the same way of screen sense of rotation degree) of mind-set screen cloth sense of rotation in self, adjusted user interface element descriptor (x ', y ', m ', n ', r ') as follows:
n′＝n；
r′＝r+a。
At step S103, when the screen rotation finishes, determine the coordinate system of graph user interface system, and the centre coordinate value of user interface element is adjusted into respective value under the described coordinate system, specifically comprise: at the rotation done state of screen when being horizontal, the coordinate system of described graph user interface system is updated to horizontal screen coordinate system; At the rotation done state of screen when being vertical, the coordinate system of described graph user interface system is updated to perpendicular screen coordinate system.
The method of the adjustment user interface element that the embodiment of the invention provides, when screen rotates, the relative position of user interface element in screen remains unchanged, and adjust the angles of display of user interface element according to the angle and direction of screen rotation, make each element not rotate from visually it seems, and putting in order of user interface element is not destroyed, and kept good consistance visual effect, improves the quality and the friendly interface of user interface.
Referring to Fig. 7, be the schematic flow sheet of second embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention.
The switching of the coordinate system of graph user interface system support both direction as shown in Figure 4, and hardware can report the anglec of rotation of screen and the information of sense of rotation.Wherein, the height of user interface is h, and width is w.
In the embodiment of the invention, screen begins to be rotated counterclockwise from the original state of vertical placement, and after the anglec of rotation reached 90 degree, rotation finished, and screen is in horizontal laying state.In order to be described in the situation of change of user interface element in this process, the icon of only choosing below in the user interface 1 illustrates, and for other element in the user interface, handles according to identical method.
At step S200, screen is in the original state of vertical placement, and the current coordinate of graph user interface system is perpendicular screen coordinate system xoy; Under perpendicular screen coordinate system xoy, the descriptor of icon 1 original state in the user interface be (x, y, m, n, r), wherein, x, y are used to describe the centre coordinate of icon 1, represent horizontal ordinate, ordinate respectively; M, n are used to describe the size of icon 1, represent width, length respectively; R represents the angles of display of icon 1;
At step S201, hardware reports screen to be rotated counterclockwise 45 degree;
At step S202, graph user interface system keeps current coordinate system constant, the centre coordinate and the size of icon 1 remain unchanged, icon 1 is center 45 degree that turn clockwise with self the upper left corner, and refreshes demonstration on user interface, and promptly icon 1 current descriptor is adjusted into (x, y, m, n, r-45);
At step S203, hardware reports screen to be rotated counterclockwise 60 degree;
At step S204, graph user interface system keeps current coordinate system constant, the centre coordinate and the size of icon 1 remain unchanged, icon 1 is center 60 degree that turn clockwise with self the upper left corner, and refreshes demonstration on user interface, and promptly icon 1 current descriptor is adjusted into (x, y, m, n, r-60);
At step S205, hardware reports screen to be rotated counterclockwise 90 degree;
At step S206, graph user interface system keeps current coordinate system constant, the centre coordinate and the size of icon 1 remain unchanged, icon 1 is that the center dextrorotation turn 90 degrees with the upper left corner of self, and refreshes demonstration on user interface, and promptly icon 1 current descriptor is adjusted into (x, y, m, n, r-90);
At step S207, screen has been rotated counterclockwise by perpendicular screen and has been horizontal screen, and then the current coordinate system with graph user interface system switches to horizontal screen coordinate system x ' o ' y ', under new coordinate system x ' o ' y ', the centre coordinate of icon 1 is adjusted into (y, w-x).
Referring to Fig. 8, be the schematic flow sheet of the 3rd embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention.
The switching of the coordinate system of graph user interface system support both direction as shown in Figure 4, and hardware can report the anglec of rotation of screen and the information of sense of rotation.Wherein, the height of user interface is h, and width is w.
In the embodiment of the invention, screen begins to turn clockwise from the original state of vertical placement, and after the anglec of rotation reached 90 degree, rotation finished, and screen is in horizontal laying state.In order to be described in the situation of change of user interface element in this process, the icon of only choosing below in the user interface 1 illustrates, and for other element in the user interface, handles according to identical method.
At step S300, screen is in the original state of vertical placement, and the current coordinate of graph user interface system is perpendicular screen coordinate system xoy; Under perpendicular screen coordinate system xoy, the descriptor of icon 1 original state in the user interface be (x, y, m, n, r), wherein, x, y are used to describe the centre coordinate of icon 1, represent horizontal ordinate, ordinate respectively; M, n are used to describe the size of icon 1, represent width, length respectively; R represents the angles of display of icon 1;
At step S301, hardware report screen turn clockwise 45 the degree;
At step S302, graph user interface system keeps current coordinate system constant, the centre coordinate and the size of icon 1 remain unchanged, icon 1 is that the center is rotated counterclockwise 45 degree with the upper left corner of self, and refreshes demonstration on user interface, and promptly icon 1 current descriptor is adjusted into (x, y, m, n, r+45);
At step S303, hardware report screen turn clockwise 60 the degree;
At step S304, graph user interface system keeps current coordinate system constant, the centre coordinate and the size of icon 1 remain unchanged, icon 1 is that the center is rotated counterclockwise 60 degree with the upper left corner of self, and refreshes demonstration on user interface, and promptly icon 1 current descriptor is adjusted into (x, y, m, n, r+60);
At step S305, hardware reports the screen dextrorotation to turn 90 degrees;
At step S306, graph user interface system keeps current coordinate system constant, the centre coordinate and the size of icon 1 remain unchanged, icon 1 is that the center is rotated counterclockwise 90 degree with the upper left corner of self, and refreshes demonstration on user interface, and promptly icon 1 current descriptor is adjusted into (x, y, m, n, r+90);
At step S307, screen clockwise turns to horizontal screen by perpendicular screen, and the current coordinate system of graph user interface system is switched to horizontal screen coordinate system x ' o ' y ', under new coordinate system x ' o ' y ', the centre coordinate of icon 1 is adjusted into (h-y, x).
The second and the 3rd embodiment of the method for above-described adjustment user interface element, description about screen rotation 45 degree, 60 degree and 90 degree, only be wherein three states in the screen rotary course, only the situation of change of user interface element in the screen rotary course is described for example, do not limit the embodiment of the invention and only under described three states, just user interface element is adjusted with this.In the middle of concrete enforcement, when screen rotated, user interface element can synchronously rotate in the opposite direction.
Referring to Fig. 9, the second and the 3rd embodiment of method that is the adjustment user interface element that provides of the embodiment of the invention is at the synoptic diagram of the user interface of screen original state.
The second and the 3rd embodiment of the method for the adjustment user interface element that the embodiment of the invention provides, the original state of screen is in vertically, and putting in order of element is two icons of every row in the user interface, altogether four lines.Concrete, the element that first row is arranged is that icon 1 and icon 2, the second row are icon 3 and icon 4, and the third line is icon 5 and icon 6, and fourth line is icon 7 and icon 8.
As shown in Figure 9, the current coordinate of graph user interface system is perpendicular screen coordinate system xoy, under perpendicular screen coordinate system xoy, the centre coordinate of icon 1 and angles of display be (x, y, r).
Referring to Figure 10, be the synoptic diagram of second embodiment user interface in the screen rotary course of the method for the adjustment user interface element that provides of the embodiment of the invention.
In rotary course, it is a degree that hardware reports the anglec of rotation of screen, and the current coordinate system of graph user interface system remains unchanged, and still is perpendicular screen coordinate system xoy, the coordinate figure of each element in the interface remains unchanged, angles of display is to the retrograde rotation a of screen sense of rotation degree (perhaps, to the 360-a of rotation in the same way of screen sense of rotation degree), for example, the centre coordinate and the angles of display of icon 1 are adjusted into (x, y r+a), and refreshes demonstration in user interface.
As can be seen from Figure 10, adopt the embodiment of the invention, in the screen rotary course, can guarantee the centre coordinate invariant position of each element in the user interface, and for the user, each element does not rotate from visually it seems, thereby improves the quality and the friendly interface of user interface.
Referring to Figure 11, be the synoptic diagram of second embodiment user interface when the screen rotation finishes of the method for the adjustment user interface element that provides of the embodiment of the invention.
Screen is by the original state of vertical placement, be rotated counterclockwise 90 the degree become horizontal rotation status after, the screen rotation finishes, the coordinate system of graph user interface system switches to horizontal screen coordinate system x ' o ' y ' by perpendicular screen coordinate system xoy, and the coordinate of each element in the screen interface is adjusted into respective value under the horizontal screen coordinate system x ' o ' y '.
As shown in figure 11, the center point coordinate of icon 1 and the angles of display original state under perpendicular screen coordinate system is (x, y, r), after screen was rotated counterclockwise 90 degree, the coordinate system of graph user interface system switched to horizontal screen coordinate system x ' o ' y ', under new coordinate system x ' o ' y ', the center point coordinate and the angles of display of icon 1 be adjusted into (y, w-x, r-90).
At screen from vertically, be rotated counterclockwise 90 spend after, putting in order of element becomes four icons of every row in the user interface, totally two go, wherein, the first capable unit of being arranged have icon 2, icon 4, icon 6 and icon 8, the second capable icon 1, icon 3, icon 5 and the icons 7 of being arranged with; This shows that after screen rotation, it is destroyed that the putting in order of user interface element do not have, and makes the layout of user interface keep good consistance before and after the screen rotation.
Referring to Figure 12, be the synoptic diagram of the screen rotation of the 3rd embodiment of the method for the adjustment user interface element that provides of embodiment of the invention user interface when finishing.
Screen is by the original state of vertical placement, after dextrorotation turn 90 degrees and becomes horizontal rotation status, the coordinate system of graph user interface system changes to horizontal screen coordinate system x ' o ' y ' by perpendicular screen coordinate system xoy, and the coordinate of each element in the screen interface is adjusted into respective value under the horizontal screen coordinate system x ' o ' y '.
As shown in figure 12, the center point coordinate of icon 1 and the angles of display original state under perpendicular screen coordinate system be (x, y, r); After the screen dextrorotation turn 90 degrees, the coordinate system of graph user interface system switched to horizontal screen coordinate system x ' o ' y ', under new coordinate system x ' o ' y ', the center point coordinate and the angles of display of icon 1 be adjusted into (h-y, x, r+90).
From vertical, after dextrorotation turn 90 degrees, putting in order of element became four icons of every row in the user interface at screen, totally two go, wherein, the first capable unit of being arranged have icon 7, icon 5, icon 3 and icon 1, the second capable icon 8, icon 6, icon 4 and the icon 2 of being arranged with; This shows that after screen rotation, it is destroyed that the putting in order of user interface element do not have, and makes the layout of user interface keep good consistance before and after the screen rotation.
Above-mentioned laterally is that example describes the method and apparatus of adjusting user interface element with screen by vertically rotating to be only, and the embodiment of the invention is equally applicable to screen by laterally rotating to be situation longitudinally.
The method of the adjustment user interface element that the embodiment of the invention provides, when screen rotates, the relative position of user interface element in screen remains unchanged, and adjust the display direction of user interface element according to the angle and direction of screen rotation, make each element not rotate, thereby improve the quality and the friendly interface of user interface from visually it seems; And putting in order of user interface element is not destroyed, and kept good consistance visual effect, and the user does not need to remember again the entry position of each functional module in the user interface.
Referring to Figure 13, be the schematic flow sheet of the 4th embodiment of the method for the adjustment user interface element that provides of the embodiment of the invention.
At step S400, obtain the anglec of rotation and the sense of rotation information of screen;
At step S401, judge whether the anglec of rotation of described screen reaches the critical angle that presets, if, execution in step S402 then, otherwise, S403 carried out; Wherein, described critical angle can be configured according to the actual needs, for example, can be configured to 45 degree as optimum critical angle;
At step S402, upgrade the coordinate system of graph user interface system, the coordinate figure of user interface element and angles of display are adjusted into respective value under the coordinate system after the switching, comprising:
If the coordinate system of graph user interface system is the perpendicular coordinate system that shields before the screen rotation, the coordinate system that then will reach after the critical angle is updated to horizontal screen coordinate system;
If the coordinate system of graph user interface system be horizontal screen coordinate system before the screen rotation, then will reach coordinate system after the critical angle and be updated to erect and shield coordinate system;
Behind the coordinate system that upgrades graph user interface system, the angles of display of user interface element is spent to the retrograde rotation 90 of screen sense of rotation.
At step S403, keep the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation; Under described coordinate system, keep the coordinate figure of described user interface element and angles of display constant.
Concrete, the layout of user interface element by descriptor (x, y, m, n r) determines that wherein, wherein, x, y are used to describe the centre coordinate of icon 1, represent horizontal ordinate, ordinate respectively; M, n are used to describe the size of icon 1, represent width, length respectively; R represents the angles of display of icon 1.
As shown in figure 14, be that the screen that the embodiment of the invention provides rotates the synoptic diagram of the user interface when not reaching critical angle, the switching of the coordinate system of graph user interface system support both direction as shown in Figure 4, the height of user interface is h, width is w.In order to describe the situation of change of user interface element in the screen rotary course, the icon of only choosing below in the user interface 1 illustrates, and for other element in the user interface, handles according to identical method.
Before the screen rotation, the current coordinate of graph user interface system is perpendicular screen coordinate system xoy; Under perpendicular screen coordinate system xoy, the descriptor of icon 1 original state in the user interface be (x, y, m, n, r);
In the screen rotary course, when anglec of rotation a less than critical angle θ, then graph user interface system keeps current coordinate system constant (promptly still being perpendicular screen coordinate system xoy), the centre coordinate of icon 1, size and angles of display remain unchanged, be that icon 1 current descriptor still is (x, y, m, n, r);
As the anglec of rotation a of screen during, upgrade the coordinate system of graph user interface system, and the coordinate figure of user interface element and angles of display are adjusted into respective value under the coordinate system after the switching more than or equal to critical angle θ.
As shown in figure 15, be the synoptic diagram that screen rotation that the embodiment of the invention provides reaches the user interface after the critical angle, the coordinate system of graph user interface system is updated to horizontal screen coordinate system x ' o ' y ' by perpendicular screen coordinate system xoy.Under horizontal screen coordinate system x ' o ' y ', the center point coordinate of icon 1 and angles of display by original (x, y, m, n r) is adjusted into (y, w-x, r ± 90).
The method and the device of the adjustment user interface element that the embodiment of the invention provides, when screen rotates, the relative position of each user interface element in screen remains unchanged, and adjust the angles of display of described user interface element according to the angle and direction of screen rotation, make putting in order of described user interface element not be destroyed, kept good consistance visual effect, the user does not need to remember again the entry position of each functional module in the user interface, thereby improves the quality of user interface and improve friendly interface.
One of ordinary skill in the art will appreciate that all or part of flow process that realizes in the foregoing description method, be to instruct relevant hardware to finish by computer program, described program can be stored in the computer read/write memory medium, this program can comprise the flow process as the embodiment of above-mentioned each side method when carrying out.Wherein, described storage medium can be magnetic disc, CD, read-only storage memory body (Read-Only Memory, ROM) or at random store memory body (Random Access Memory, RAM) etc.
The above is a preferred implementation of the present invention; should be pointed out that for those skilled in the art, under the prerequisite that does not break away from the principle of the invention; can also make some improvements and modifications, these improvements and modifications also are considered as protection scope of the present invention.
Claims (14)
1. a method of adjusting user interface element is characterized in that, comprising:
In the screen rotary course, keep the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant;
According to the sense of rotation and the anglec of rotation of described screen, guaranteeing to adjust the angles of display of described user interface element under the constant condition of described user interface element layout;
According to the rotation done state of described screen, determine the coordinate system of described graph user interface system; The coordinate figure of described user interface element is adjusted into respective value under the described coordinate system.
2. the method for adjustment user interface element as claimed in claim 1 is characterized in that, and is described in the screen rotary course, and the coordinate figure based on the graph user interface system coordinate system before the rotation of maintenance user interface element is constant specifically to be comprised:
Keep the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation;
Under described coordinate system, keep the coordinate figure of described user interface element constant.
3. the method for adjustment user interface element as claimed in claim 1, it is characterized in that, the described sense of rotation and the anglec of rotation according to screen are guaranteeing that the angles of display of adjusting described user interface element specifically comprises under the constant condition of described user interface element layout:
When screen rotation a angle, with the angles of display of described user interface element to the retrograde rotation a of screen sense of rotation angle.
4. the method for adjustment user interface element as claimed in claim 1 is characterized in that, described rotation done state according to described screen determines that the coordinate system of described graph user interface system specifically comprises:
At the rotation done state of screen when being horizontal, the coordinate system of described graph user interface system is updated to horizontal screen coordinate system;
At the rotation done state of screen when being vertical, the coordinate system of described graph user interface system is updated to perpendicular screen coordinate system.
5. a method of adjusting user interface element is characterized in that, comprising:
Whether the anglec of rotation of judging screen reaches the critical angle that presets;
Reach critical angle if determine the anglec of rotation of described screen, guaranteeing under the constant condition of user interface element layout, upgrade the coordinate system of graph user interface system, the coordinate figure of described user interface element and angles of display are adjusted into respective value under the described coordinate system.
6. the method for adjustment user interface element as claimed in claim 5 is characterized in that, if the anglec of rotation of described screen does not reach critical angle, then:
Keep the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation;
Under described coordinate system, keep the coordinate figure of described user interface element and angles of display constant.
7. as the method for claim 5 or 6 described adjustment user interface elements, it is characterized in that, described if the anglec of rotation of definite described screen reaches critical angle, guaranteeing that the coordinate system that upgrades graph user interface system specifically comprises under the constant condition of user interface element layout:
If the coordinate system of graph user interface system is the perpendicular coordinate system that shields before the screen rotation, the coordinate system that then will reach after the critical angle is updated to horizontal screen coordinate system;
If the coordinate system of graph user interface system be horizontal screen coordinate system before the screen rotation, then will reach coordinate system after the critical angle and be updated to erect and shield coordinate system.
8. the method for adjustment user interface element as claimed in claim 7 is characterized in that, behind the coordinate system that upgrades graph user interface system, the angles of display of user interface element is spent to the retrograde rotation 90 of screen sense of rotation.
9. a device of adjusting user interface element is characterized in that, comprising:
The rotation detection module is used to obtain the anglec of rotation of screen and the information of sense of rotation;
The coordinate adjusting module is used for the information obtained according to described rotation detection module, is guaranteeing under the constant condition of user interface element layout, determines the coordinate system of graph user interface system and the user interface element coordinate figure based on described coordinate system;
The angular setting module is used for the information obtained according to described rotation detection module, adjusts the angles of display of described user interface element.
10. the device of adjustment user interface element as claimed in claim 9 is characterized in that, described coordinate adjusting module specifically comprises:
Coordinate system determining unit is used at the screen rotary course, keeps the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation; At the rotation done state of screen when being horizontal, the coordinate system of described graph user interface system is updated to horizontal screen coordinate system; At the rotation done state of screen when being vertical, the coordinate system of described graph user interface system is updated to perpendicular screen coordinate system;
User interface element coordinate determining unit is used at the screen rotary course, keeps the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant; When change takes place for the coordinate system of user interface system, the coordinate figure of described user interface element is adjusted into respective value under the new coordinate system.
11. the device as claim 9 or 10 described adjustment user interface elements is characterized in that, described angular setting module when screen rotation a angle, with the angles of display of described user interface element to the retrograde rotation a of screen sense of rotation angle.
12. the device of adjustment user interface element as claimed in claim 11 is characterized in that, described device also comprises:
The screen state determination module is used for the rotation angle information obtained according to described rotation detection module, determines whether the anglec of rotation of screen reaches critical angle;
The critical angle configuration module is used for the critical angle of configuration screen.
13. the device of adjustment user interface element as claimed in claim 12 is characterized in that, described coordinate adjusting module specifically comprises:
Coordinate system determining unit is used for before the anglec of rotation of screen reaches critical angle, keeps the coordinate system of graph user interface system consistent with the coordinate system before the screen rotation; After the anglec of rotation of screen reached critical angle, if the coordinate system of graph user interface system is the perpendicular coordinate system that shields before the screen rotation, the coordinate system that then will reach after the critical angle was updated to horizontal screen coordinate system; If the coordinate system of graph user interface system be horizontal screen coordinate system before the screen rotation, then will reach coordinate system after the critical angle and be updated to erect and shield coordinate system;
User interface element coordinate determining unit is used for before the anglec of rotation of screen reaches critical angle, keeps the coordinate figure based on the graph user interface system coordinate system before the rotation of user interface element constant; When change takes place for the coordinate system of user interface system, the coordinate figure of described user interface element is adjusted into respective value under the new coordinate system.
14. device as claim 12 or 13 described adjustment user interface elements, it is characterized in that, described angular setting module is spent the angles of display of user interface element after the anglec of rotation of screen reaches critical angle to the retrograde rotation 90 of screen sense of rotation.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN200810030330XA CN101369210B (en) | 2008-08-22 | 2008-08-22 | Method and device for regulating user interface element |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN200810030330XA CN101369210B (en) | 2008-08-22 | 2008-08-22 | Method and device for regulating user interface element |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN101369210A CN101369210A (en) | 2009-02-18 |
| CN101369210B true CN101369210B (en) | 2011-03-16 |
Family
ID=40413050
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN200810030330XA Active CN101369210B (en) | 2008-08-22 | 2008-08-22 | Method and device for regulating user interface element |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN101369210B (en) |
Families Citing this family (38)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101834938A (en) * | 2010-03-25 | 2010-09-15 | 中兴通讯股份有限公司 | Device and method for realizing horizontal/vertical screen switching of mobile terminal |
| CN102375581B (en) * | 2010-08-11 | 2016-06-08 | 深圳富泰宏精密工业有限公司 | Touch type electronic device and the method improving its touch accuracy |
| CN101901080B (en) * | 2010-08-20 | 2017-03-22 | 中兴通讯股份有限公司 | Method for identifying handwritten input information and terminal |
| CN102760027B (en) * | 2011-04-27 | 2016-08-17 | 联想(北京)有限公司 | A kind of display processing method, device and electronic equipment |
| JP5799628B2 (en) * | 2011-07-15 | 2015-10-28 | ソニー株式会社 | Information processing apparatus, information processing method, and program |
| US20130127870A1 (en) * | 2011-11-23 | 2013-05-23 | International Business Machines Corporation | Focus-change invariance in a graphical display |
| CN103383619A (en) * | 2012-05-02 | 2013-11-06 | 北京网秦天下科技有限公司 | Method and device for displaying object in mobile equipment |
| CN103577057A (en) * | 2012-07-30 | 2014-02-12 | 中兴通讯股份有限公司 | Method and device for transversely arranging list parts on terminal |
| CN103677550B (en) * | 2012-09-11 | 2018-03-27 | 联想(北京)有限公司 | A kind of information processing method and electronic equipment |
| CN103809928B (en) * | 2012-11-14 | 2018-03-23 | 腾讯科技（深圳）有限公司 | A kind of display methods, the device and system of trend graph of merchandising |
| CN103970397B (en) * | 2013-01-30 | 2018-06-15 | 腾讯科技（深圳）有限公司 | Rotation screen method for showing interface and device |
| CN103150361B (en) * | 2013-02-27 | 2017-02-08 | 优视科技有限公司 | Web page display method and device |
| CN103218060A (en) * | 2013-04-09 | 2013-07-24 | 广东欧珀移动通信有限公司 | Method and device for displaying icons in mobile terminal |
| CN103399694A (en) * | 2013-07-25 | 2013-11-20 | 深圳市金立通信设备有限公司 | Screen display controlling method and mobile terminal |
| CN103488403B (en) * | 2013-08-30 | 2018-02-02 | 小米科技有限责任公司 | interface layout switching method, device and mobile terminal |
| CN104423827A (en) * | 2013-09-09 | 2015-03-18 | 联想(北京)有限公司 | Information processing method and electronic equipment |
| CN104750290A (en) * | 2013-12-31 | 2015-07-01 | 富泰华工业（深圳）有限公司 | Handwriting recognition system and handwriting recognition method of electronic device |
| CN104750395B (en) * | 2013-12-31 | 2018-05-22 | 富泰华工业（深圳）有限公司 | User interface adjusts system and its method of adjustment |
| CN103823620B (en) * | 2014-03-04 | 2017-01-25 | 飞天诚信科技股份有限公司 | Screen adaption method and device |
| CN103927186B (en) * | 2014-04-30 | 2017-11-03 | 广州视源电子科技股份有限公司 | Function key control method based on Android system |
| CN104035662A (en) * | 2014-05-15 | 2014-09-10 | 小米科技有限责任公司 | Interface display method, device and terminal |
| CN103984563B (en) * | 2014-06-09 | 2017-07-11 | 中科创达软件股份有限公司 | A kind of application icon display methods and device |
| CN106033408B (en) * | 2015-03-20 | 2019-11-26 | 广州金山移动科技有限公司 | A kind of object swing method of adjustment and device |
| CN105630278B (en) * | 2015-06-19 | 2019-04-12 | 宇龙计算机通信科技(深圳)有限公司 | The control method and system of application program, mobile terminal |
| CN106775280A (en) * | 2015-11-25 | 2017-05-31 | 北大方正集团有限公司 | Show the method and apparatus of the page |
| CN105700708B (en) * | 2016-01-18 | 2019-04-23 | 深圳市金立通信设备有限公司 | A kind of method of adjustment and terminal of terminal interface |
| CN105955583B (en) * | 2016-05-19 | 2021-03-23 | Tcl科技集团股份有限公司 | Icon arrangement method and system and display terminal |
| CN106155474A (en) * | 2016-06-15 | 2016-11-23 | 广州神马移动信息科技有限公司 | The method and device of display view control dynamic effect |
| CN106445500B (en) * | 2016-08-29 | 2020-04-24 | 北京元心科技有限公司 | Method, system and terminal equipment for providing user interface |
| CN109634695B (en) * | 2017-10-09 | 2022-02-08 | 武汉斗鱼网络科技有限公司 | Method and device for automatically adapting horizontal and vertical screens of software on SDK interface |
| CN111448534B (en) * | 2017-12-27 | 2022-03-29 | 深圳市柔宇科技股份有限公司 | Terminal device, graphical user interface thereof and control method of graphical user interface |
| CN110316088B (en) * | 2018-03-30 | 2023-01-10 | 比亚迪股份有限公司 | Display device and vehicle |
| CN110316090B (en) * | 2018-03-30 | 2022-12-09 | 比亚迪股份有限公司 | Drive device and vehicle with drive device |
| CN108898548B (en) * | 2018-06-27 | 2022-09-02 | 维沃移动通信有限公司 | Display method of panorama and mobile terminal |
| CN109189299B (en) * | 2018-08-02 | 2020-11-03 | 珠海格力电器股份有限公司 | Screen display method and device, terminal and readable storage medium |
| WO2020061783A1 (en) * | 2018-09-25 | 2020-04-02 | 深圳市柔宇科技有限公司 | Bendable electronic device and interface adaptation method thereof |
| CN112533049B (en) * | 2020-11-26 | 2022-12-27 | 深圳创维－Rgb电子有限公司 | Picture following screen rotation processing method and device, intelligent terminal and medium |
| CN113050858B (en) * | 2021-03-31 | 2022-10-25 | 联想(北京)有限公司 | Information processing method and electronic equipment |
-
2008
- 2008-08-22 CN CN200810030330XA patent/CN101369210B/en active Active
Also Published As
| Publication number | Publication date |
|---|---|
| CN101369210A (en) | 2009-02-18 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN101369210B (en) | Method and device for regulating user interface element | |
| CN103412725B (en) | A kind of touch operation method and device | |
| US5434964A (en) | Movement and redimensioning of computer display windows | |
| JP5606500B2 (en) | Parameter setting method and system | |
| CN103207750B (en) | The method of icon convergent-divergent and device | |
| CN103399694A (en) | Screen display controlling method and mobile terminal | |
| CN102760027B (en) | A kind of display processing method, device and electronic equipment | |
| CN110427236B (en) | Rendering method and device | |
| CN106648581B (en) | Page display method and device | |
| US10956024B2 (en) | Multi-application viewing | |
| CN103324436A (en) | Task processing method and device | |
| WO2016045547A1 (en) | Information display method and device, and mobile device | |
| CN103970421A (en) | Method for adjusting on-screen-display patterns of mobile terminal | |
| WO2022242515A1 (en) | Interface display method and apparatus | |
| CN105404490A (en) | Information processing method and electronic device | |
| CN104461436A (en) | Displaying method of multiple terminals based on different resolution ratios | |
| CN104142776A (en) | Icon processing method and device | |
| US10585510B2 (en) | Apparatus, systems, and methods for transferring objects between multiple display units | |
| CN103824540B (en) | A kind of display methods and electronic equipment | |
| CN102663989B (en) | A kind of method for caching and processing showing for mobile terminal and device | |
| CN110471611B (en) | Keyboard starting method and device, terminal equipment and storage medium | |
| CN104777999B (en) | Touch location display methods and touch location display system | |
| WO2024088317A1 (en) | Application interface display method and apparatus, electronic device, and storage medium | |
| CN107239247B (en) | Electronic equipment and content display method, device and storage medium thereof | |
| CN105389010A (en) | Information processing method and electronic device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| C14 | Grant of patent or utility model | ||
| GR01 | Patent grant | ||
| CP01 | Change in the name or title of a patent holder | ||
| CP01 | Change in the name or title of a patent holder |
Address after: 518129 Building 2, B District, Bantian HUAWEI base, Longgang District, Shenzhen, Guangdong. Patentee after: Huawei terminal (Shenzhen) Co.,Ltd. Address before: 518129 Building 2, B District, Bantian HUAWEI base, Longgang District, Shenzhen, Guangdong. Patentee before: HUAWEI DEVICE Co.,Ltd. |
|
| TR01 | Transfer of patent right | ||
| TR01 | Transfer of patent right |
Effective date of registration: 20181218 Address after: 523808 Southern Factory Building (Phase I) Project B2 Production Plant-5, New Town Avenue, Songshan Lake High-tech Industrial Development Zone, Dongguan City, Guangdong Province Patentee after: HUAWEI DEVICE Co.,Ltd. Address before: 518129 Building 2, B District, Bantian HUAWEI base, Longgang District, Shenzhen, Guangdong. Patentee before: Huawei terminal (Shenzhen) Co.,Ltd. |