CN102402435A - Menu realization method, menu realization device and display device - Google Patents

Menu realization method, menu realization device and display device Download PDF

Info

Publication number
CN102402435A
CN102402435A CN2011103669610A CN201110366961A CN102402435A CN 102402435 A CN102402435 A CN 102402435A CN 2011103669610 A CN2011103669610 A CN 2011103669610A CN 201110366961 A CN201110366961 A CN 201110366961A CN 102402435 A CN102402435 A CN 102402435A
Authority
CN
China
Prior art keywords
menu
control
item
menu item
template
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
CN2011103669610A
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.)
Hanwang Technology Co Ltd
Original Assignee
Hanwang 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 Hanwang Technology Co Ltd filed Critical Hanwang Technology Co Ltd
Priority to CN2011103669610A priority Critical patent/CN102402435A/en
Publication of CN102402435A publication Critical patent/CN102402435A/en
Pending legal-status Critical Current

Links

Images

Landscapes

  • User Interface Of Digital Computer (AREA)

Abstract

A menu realization method, menu realization device and display device, the menu realization method comprises the following steps: creating a menu control templates, determining a display frame of the menu control template ; setting a menu display strategy in the menu control template; generating menu controls according to the menu control templates; wherein the menu display strategy is adjusting the position, width and height of each menu item when the mouse enters into the menu item area, moves within the menu area or moves out from the menu area. The invention is characterized by binding the technology of fish eye to the menu, being capable of changing its size and location according to the movement of the mouse with preservation of the original basic present form, solving the problems of too rigid of the menu in the desktop software and poor user experience, adding a menu display effect, improving the menu magnificent extent, and enhancing the user experience of software.

Description

Menu realization method, menu implement device and display device
Technical field
The present invention relates to a kind of menu display method, menu Display Realization method and manu displaying device.
Background technology
A large amount of use actions menus in the present electronic installation, so the convenience of actions menu becomes the key factor that influences user experience.
The actions menu of prior art is shown in accompanying drawing 1, and a plurality of the main menu items are in line, and when mouse is chosen certain menu item, can eject drop-down submenu and corresponding Submenu Items.But it is general, more stiff that this menu display mode represents effect, and effect is single, and user experience is relatively poor.
Summary of the invention
The present invention proposes a kind of novel menu realization method and device and display device, and above-mentioned display mode is stiff to solve, the technical matters of poor user experience.
The present invention provides a kind of menu realization method, may further comprise the steps: create the menu control template, confirm the display frame of said menu control template; Setup menu display strategy in said menu control template; Generate menu control according to said menu control template; Wherein, said menu display strategy is: when mouse gets into the menu item zone, when moving and shifting out the menu item zone in the menu item zone, adjusts position, width and the height of each menu item in real time.
The present invention also provides a kind of menu implement device, comprising: menu control template establishment parts, be used to create the menu control template, and confirm the display frame of said menu control template; The menu display strategy is provided with parts, is used at said menu control template setup menu display strategy; Menu control generates parts, is used for generating menu control according to said menu control template; Wherein, said menu display strategy is: when mouse gets into the menu item zone, when moving and shifting out the menu item zone in the menu item zone, adjusts position, width and the height of each menu item in real time.
The present invention also provides a kind of display device of using above-mentioned menu realization method.
Adopt technical scheme of the present invention, not only can be so that the demonstration of menu is lively, and make the demonstration of submenu be consistent; Not can the time little when big; And through adopting independent forms, not refreshing of menu can influence refreshing of background; Thereby can add other special efficacy, for example: hatching effect, the menu effect etc. of being fade-in fade-out.
Description of drawings
Fig. 1 is the menu synoptic diagram of prior art;
Fig. 2 is the synoptic diagram of menu realization method of the present invention;
Fig. 3 is the synoptic diagram of menu when mouse does not get into that the present invention shows;
Fig. 4 is the synoptic diagram of menu when mouse gets into that the present invention shows;
Fig. 5 is the synoptic diagram of menu when mouse moves that the present invention shows;
Fig. 6 is the synoptic diagram of the menu that shows of the present invention at the submenu At time of eject;
Fig. 7 is the structural representation of menu implement device of the present invention.
Embodiment
In order to make the demonstration of menu lively, the present invention adopts a kind of mode of flake effect to come display menu.So-called flake effect is meant that along with mouse moves, menu item can be along with the position adjustment height and the width of mouse on a delegation or a row menu item, wherein, the height of that menu item of mouse position and width are maximum.Menu display method of the present invention comprises: show the menu that comprises a delegation or a row menu item; Wherein, when selecting arbitrary menu item, this menu item is exaggerated.
Menu realization method of the present invention is used the model customization technology, at first uses the menu control model customization to go out its basic control framework; Customized menus item container template then; In the container template, add the flake effect, make the flake effect can act on each of menu, and its submenu is customized separately; To avoid the flake effect also to act on submenu, make menu integral body seem regular inadequately; At last control is put into single forms, making it refresh mode does not influence refreshing of background, and can take into account shade, effect such as be fade-in fade-out; Its flow process is as shown in Figure 2; In step S201, create the menu control template, confirm the display frame of said menu control template; Next, in step S202, setup menu display strategy in said menu control template; Subsequently, in step S203, generate menu control according to said menu control template; Wherein, said menu display strategy is: when mouse gets into the menu item zone, when moving and shifting out the menu item zone in the menu item zone, adjusts position, width and the height of each menu item in real time, specify as follows.
At first, shown in step S201, create the menu control template, confirm the display frame of said menu control template.
At first, adopt the menu control among the WPF of Microsoft, it is represented layer carry out the customization of template level, comprise its layout, background, menu item ways of presentation are defined.About layout, can adopt the mode of landscape layout or vertical layout to come the arrangement of menu item is designed as required.About background, generally adopt the mode of transparent background, so that the flake effect is more outstanding.As required, also can adopt the background that has color.
Next, shown in step S202, setup menu display strategy in said menu control template.
About the menu item ways of presentation; Can be based on WPF (Windows Presentation Foundation) model customization mode; Design according to the art designing is set menu item, and setting content comprises menu item background tone, gradual manner, represents form (the right angle rectangle still is a round rectangle, square still circular), drop shadow effect and switching effect thereof etc.
At first inherit a StackPanel class among the WPF; Container template as menu item; The position of next each menu item of initialization in its MeasureOverride function, width and height, initialization mouse action MouseMove, MouseEnter and MouseLeave subsequently.In the time of on mouse places the menu item container, come the element in the container arranged again and make menu item action through calling the InvalidateArrange function.The major function of InvalidateArrange function is to trigger the ArrangeOverride function of heavy duty, when mouse gets into the menu item zone, when moving and shifting out the menu item zone in the menu item zone, adjusts position, width and the height of each menu item in real time.
When mouse gets into menu control, obtain its adjacent menu item earlier, afterwards to calculating weights according to the x value of the position of the menu item at mouse place and the magnification ratio that pre-sets; As the ratio (preset proportional value can be adjusted) of amplifying; Magnification ratio is the boundary with the intermediate value of control width, and progressively amplify with the entering of mouse on the median location left side; After mouse position was crossed intermediate value, the menu item control progressively dwindled.According to the integral width of container control, calculate the scaling that belongs to control left side menu item and right side menu item with mouse then, calculate the scaling of other menu items afterwards.For embodying the flake effect; Except that mouse place menu item ratio is directly set; The menu item control of its left and right sides all (is generally the ratio of x value and its menu item width than the little threshold value of mouse place menu item scaling; Concrete account form sees also formula hereinafter), but bigger than other menu items.Other do not participate in the menu item that amplifies, its wide high level is scaled, so that the integral width of menu is constant.
The formula of the scaling of flake effect is:
Preset ratio: Mag, initial value are preset value; Amplify weights: Ratio, initial value is 0; Menu item quantity: Count; The relative menu item of mouse position: x, y; Control width: ControlWidth; Ratio increase value: Extra, initial value are 0.
Amplify weights:
Ratio=x/ControlWidth
Control ratio increase value:
Extra+=(Mag-1)
Mouse place control scaling:
Scale=(Mag×Count)/(Count+Extra)
Mouse left side control scaling:
ScaleL=Count×(1+((Mag-1)×(1-Ratio)))/(Count+Extra)
Mouse right side control scaling:
ScaleR=Count×(1+((Mag-1)×Ratio))/(Count+Extra)
Do not participate in the scaling of flake effect control:
ScaleO=Count/(Count+Extra)
After having adjusted the menu item ratio, adjust the ratio of different menu items.Afterwards, ratio value is encapsulated in the transformation of scale matrix (affine transformation matrix), matrix is one 3 * 3 matrix, and its (1,1) and (2,2) element are changed to scaling, and other values are constant, reach the purpose of the zoom menu item with this.Carry out animation at last, realize the flake display effect.Fig. 3 to 5 is the display menu that has used the flake effect, wherein, the effect that Fig. 3 does not get into the menu item control for mouse, Fig. 4 is the effect that mouse gets into the menu item control, Fig. 5 is the effect that mouse moves between the menu item control.
Because the menu item control is a composite control, it comprises the child control of self, and promptly menu item control self inside can also comprise other menu item control.And, contain in the structure of menu item can be drop-down the submenu container.Because the scaling of each menu item control of flake effect adjustment so just makes when the flake effect is carried out convergent-divergent to the menu item control, also to each menu item with Submenu Items carried out convergent-divergent; The problem of being brought thus is; During click, the position of its place menu item is uncertain, and displaying ratio is also just uncertain; If do not add control; The submenu At time of eject can occur, zooming effect is also had an effect, and the display effect meeting basis of the so menu displaying ratio of mouse present position is at that time carried out convergent-divergent.Because the displaying ratio of different mouses diverse location of living in is uncertain, little problem when big in the time of can sub-menu list occurring.
For head it off, the submenu of said menu control template is related with an independent pop-up menu, and the click response events of revising said menu control is for showing pop-up menu.According to each menu item, customizing out its Submenu Items at first separately is a Popup menu (popup menu) control, rather than its Submenu Items is put into the previous menu item.In other words, when the customised container template, its submenu is customized separately, rather than submenu and its menu item are bound, like this, just can control the message response of submenu separately, and do not move control with its pairing menu item.
Customize the mouse action of submenu and its pairing menu item then respectively.When the click menu item, trigger a click action, the mouse present position is at first checked in this action; Judge the submenu that needs demonstration then; And judged whether that other submenus show, when other submenus that shown are arranged, it has been closed; Activate the pairing submenu of menu item then, represent the ejection submenu of customization.When the submenu initialization, can carry out assignment for its PopupAnimation attribute, thereby be submenu ejection process interpolation animation.Do not contain submenu owing in the menu item like this, thereby can not trigger the submenu in the menu item.
As shown in Figure 6, after submenu ejects, can the mouse focus be put on the submenu, can cancel the flake effect of menu item like this, make menu on whole structure, seem more regular.
Through processing with upper type, submenu little situation when big in the time of just can not occurring, and also the comparison that on the whole structure of menu, seems is dignified, elegant.
Subsequently, shown in step S203, generate menu control according to said menu control template.At last this control is put into independently forms,, especially under control background and the inconsistent situation of context of software, can avoid context of software to refresh the situation that refreshes mutual interference mutually with the control background in order to avoid influence refreshing of context of software.
Fig. 7 shows the synoptic diagram of the menu implement device of one embodiment of the invention.As shown in Figure 7; This menu implement device comprises that menu control template establishment parts 701, menu display strategy are provided with parts 702 and menu control generates parts 703; Wherein, Menu control template establishment parts 701 are used to create the menu control template, confirm the display frame of said menu control template, and the menu display strategy is provided with parts 702 and is used in said menu control template said menu display strategy being set; Menu control generates parts 703 and is used for generating menu control according to said menu control template.
In addition; Menu implement device of the present invention also comprises associated member and menu control placing component; Said associated member is used for the submenu of said menu control template related with an independent pop-up menu; And the click response events of revising said menu control is the demonstration pop-up menu; Said menu control placing component is used for after said menu control generation parts generate said menu control according to said menu control template, said menu control being put into independent forms, to adapt to the refresh mode at different background interfaces.
Menu display method of the present invention and device are not limited to windows operating system; Also can be applicable to the UI technology in Android UI, Direct UI and the QT solution, and can on single forms or flat computer, present menu with flake effect.Menu display effect of the present invention also is not limited to the flake effect, also can adopt method of the present invention that other display effects that are beneficial to user's operation are applied in the menu demonstration.
The present invention is attached to the flake effect on the menu technique, is keeping under its original condition that represents form basically, when mouse is on menu; Make menu to change its size and position along with mouse moving; It is too stiff to have solved the desktop software menu, and the problem that user experience is relatively poor has increased the expression effect of menu; Improve the gorgeous degree of menu, strengthened the user experience of software.
The present invention adopts independent forms to make refreshing of menu not influence refreshing of background, so that it can add other special efficacy, for example: hatching effect, the menu effect etc. of being fade-in fade-out.
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 accomplish through computer program; Described program can be stored in the computer read/write memory medium; This program can comprise the flow process like the embodiment of above-mentioned each side method when carrying out.Wherein, described storage medium can be disk, CD, ROM (read-only memory) or random access memory etc.
The above; Be merely embodiment of the present invention, but protection scope of the present invention is not limited thereto, any technician who is familiar with the present technique field is in the technical scope that the present invention discloses; Can expect easily changing or replacement, all should be encompassed within protection scope of the present invention.Therefore, protection scope of the present invention should be as the criterion with the protection domain of claim.

Claims (11)

1. a menu realization method is characterized in that, may further comprise the steps:
Create the menu control template, confirm the display frame of said menu control template;
Setup menu display strategy in said menu control template;
Generate menu control according to said menu control template;
Wherein, said menu display strategy is: when mouse gets into the menu item zone, when moving and shifting out the menu item zone in the menu item zone, adjusts position, width and the height of each menu item in real time.
2. menu realization method according to claim 1 is characterized in that, also comprises: the submenu of said menu control template is related with an independent pop-up menu, and the click response events of revising said menu control is for showing pop-up menu.
3. menu realization method according to claim 2 is characterized in that, said menu display strategy further comprises:
According to the position of mouse place menu item, by the focus menu item of preset scaling enlarged and displayed mouse position;
Mid point with said focus menu item is the center, according to the magnification ratio of the position of mouse two menu items adjacent with the moving direction adjustment left and right sides, and according to adjusted magnification ratio demonstration two menu items adjacent with the said focus menu item left and right sides;
Other menu items of dimensions scale downward according to the size of the length of said menu control, said focus menu item and two menu items adjacent with the said focus menu item left and right sides make the length of said menu control constant.
4. menu realization method according to claim 2 is characterized in that, generates said menu control based on the Windows Presentation Foundation template of Microsoft.
5. menu realization method according to claim 4 is characterized in that, after generating said menu control according to said menu control template, said menu control is put into independent forms, to adapt to the refresh mode at different background interfaces.
6. a menu implement device is characterized in that, comprising:
Menu control template establishment parts are used to create the menu control template, confirm the display frame of said menu control template;
The menu display strategy is provided with parts, is used at said menu control template setup menu display strategy;
Menu control generates parts, is used for generating menu control according to said menu control template;
Wherein, said menu display strategy is: when mouse gets into the menu item zone, when moving and shifting out the menu item zone in the menu item zone, adjusts position, width and the height of each menu item in real time.
7. menu implement device according to claim 6; It is characterized in that; Also comprise associated member, be used for the submenu of said menu control template relatedly that and the click response events of revising said menu control is for showing pop-up menu with an independent pop-up menu.
8. menu implement device according to claim 7 is characterized in that, said menu display strategy further comprises:
According to the position of mouse place menu item, by the focus menu item of preset scaling enlarged and displayed mouse position;
Mid point with said focus menu item is the center, according to the magnification ratio of the position of mouse two menu items adjacent with the moving direction adjustment left and right sides, and according to adjusted magnification ratio demonstration two menu items adjacent with the said focus menu item left and right sides;
Other menu items of dimensions scale downward according to the size of the length of said menu control, said focus menu item and two menu items adjacent with the said focus menu item left and right sides make the length of said menu control constant.
9. menu implement device according to claim 7 is characterized in that, generates said menu control based on the Windows Presentation Foundation template of Microsoft.
10. menu implement device according to claim 9; It is characterized in that; Also comprise the menu control placing component; Be used for after said menu control generation parts generate said menu control according to said menu control template, said menu control being put into independent forms, to adapt to the refresh mode at different background interfaces.
11. an application rights requires the display device of each described menu realization method among the 1-5.
CN2011103669610A 2011-10-25 2011-11-17 Menu realization method, menu realization device and display device Pending CN102402435A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN2011103669610A CN102402435A (en) 2011-10-25 2011-11-17 Menu realization method, menu realization device and display device

Applications Claiming Priority (3)

Application Number Priority Date Filing Date Title
CN201110334964.6 2011-10-25
CN201110334964 2011-10-25
CN2011103669610A CN102402435A (en) 2011-10-25 2011-11-17 Menu realization method, menu realization device and display device

Publications (1)

Publication Number Publication Date
CN102402435A true CN102402435A (en) 2012-04-04

Family

ID=45884669

Family Applications (1)

Application Number Title Priority Date Filing Date
CN2011103669610A Pending CN102402435A (en) 2011-10-25 2011-11-17 Menu realization method, menu realization device and display device

Country Status (1)

Country Link
CN (1) CN102402435A (en)

Cited By (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103092614A (en) * 2013-01-09 2013-05-08 上海斐讯数据通信技术有限公司 Menu background switching method
CN105975165A (en) * 2015-12-09 2016-09-28 惠州华阳通用电子有限公司 Display control method for fisheye menu
CN106033410A (en) * 2015-03-20 2016-10-19 广州金山移动科技有限公司 Object dimension adjusting method
CN106325864A (en) * 2016-08-23 2017-01-11 广州视源电子科技股份有限公司 Method and device for selecting and displaying menu items
CN107390980A (en) * 2016-05-16 2017-11-24 中兴通讯股份有限公司 menu display method and device
CN108710491A (en) * 2018-03-30 2018-10-26 四川九阵科技股份有限公司 A kind of software management system and method based on C/S frameworks
CN111949179A (en) * 2020-08-13 2020-11-17 青岛海信传媒网络技术有限公司 Control amplifying method and display device
CN112579927A (en) * 2019-09-30 2021-03-30 北京国双科技有限公司 Method and device for displaying navigation bar

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6208342B1 (en) * 1998-01-13 2001-03-27 Sony Corporation Graphical user interface for enabling selection of a selectable graphic image
CN1425151A (en) * 1999-12-20 2003-06-18 苹果电脑有限公司 User interface for providing consolidation and access

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6208342B1 (en) * 1998-01-13 2001-03-27 Sony Corporation Graphical user interface for enabling selection of a selectable graphic image
CN1425151A (en) * 1999-12-20 2003-06-18 苹果电脑有限公司 User interface for providing consolidation and access

Cited By (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103092614A (en) * 2013-01-09 2013-05-08 上海斐讯数据通信技术有限公司 Menu background switching method
CN103092614B (en) * 2013-01-09 2017-07-25 上海斐讯数据通信技术有限公司 A kind of menu background switching method
CN106033410A (en) * 2015-03-20 2016-10-19 广州金山移动科技有限公司 Object dimension adjusting method
CN106033410B (en) * 2015-03-20 2019-11-26 广州金山移动科技有限公司 A kind of object size method of adjustment
CN105975165A (en) * 2015-12-09 2016-09-28 惠州华阳通用电子有限公司 Display control method for fisheye menu
CN105975165B (en) * 2015-12-09 2020-04-03 惠州华阳通用电子有限公司 Display control method of fisheye menu
CN107390980A (en) * 2016-05-16 2017-11-24 中兴通讯股份有限公司 menu display method and device
CN106325864A (en) * 2016-08-23 2017-01-11 广州视源电子科技股份有限公司 Method and device for selecting and displaying menu items
CN108710491A (en) * 2018-03-30 2018-10-26 四川九阵科技股份有限公司 A kind of software management system and method based on C/S frameworks
CN108710491B (en) * 2018-03-30 2021-10-22 四川九阵科技股份有限公司 Software management system and method based on C/S architecture
CN112579927A (en) * 2019-09-30 2021-03-30 北京国双科技有限公司 Method and device for displaying navigation bar
CN111949179A (en) * 2020-08-13 2020-11-17 青岛海信传媒网络技术有限公司 Control amplifying method and display device

Similar Documents

Publication Publication Date Title
CN102402435A (en) Menu realization method, menu realization device and display device
JP6952877B2 (en) Systems, methods, and graphical user interfaces for interacting with augmented and virtual reality environments
CN101192129B (en) Table top background control method and device
US9710149B2 (en) Method and apparatus for displaying user interface capable of intuitively editing and browsing folder
US20170131874A1 (en) Software Design Tool For A User Interface And The Administration Of Proximity Responsive Information Displays In Augmented Reality Or Virtual Reality Environments
US20130014057A1 (en) Composite control for a graphical user interface
US20100235769A1 (en) Smooth layout animation of continuous and non-continuous properties
JP4925107B2 (en) How to generate an on-screen menu
US9569064B2 (en) System and method for a particle system based user interface
WO2010105084A1 (en) A graphical user interface for the representation of and interaction with one or more objects
US10289671B2 (en) Graphically displaying selected data sources within a grid
CN109766045A (en) Method and apparatus for the operating function in touching device
CN103399750A (en) Method and device for achieving user interface
CN103064592B (en) A kind of prolongable menu display method
MX2013001818A (en) Highlighting of objects on a display.
KR20120093218A (en) System and methods for a run time configurable user interface controller
KR100931926B1 (en) Mobile communication terminal with moving menu icon ui
EP3198411B1 (en) View management architecture
US20110209117A1 (en) Methods and systems related to creation of interactive multimdedia applications
TW201009685A (en) Program object properties defined by object space
US8645857B2 (en) Method for controlling information display
CN102541528B (en) Menu creating method and device
US20200285355A1 (en) Method and apparatus for customizing color of object on application
KR102057161B1 (en) System for realistic media presentation including auditory information
JP7045121B1 (en) Program, information processing device, image editing method, and image display method

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
C12 Rejection of a patent application after its publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20120404