CN108108417A - Exchange method, system, equipment and the storage medium of cross-platform self adaptive control - Google Patents

Exchange method, system, equipment and the storage medium of cross-platform self adaptive control Download PDF

Info

Publication number
CN108108417A
CN108108417A CN201711340458.1A CN201711340458A CN108108417A CN 108108417 A CN108108417 A CN 108108417A CN 201711340458 A CN201711340458 A CN 201711340458A CN 108108417 A CN108108417 A CN 108108417A
Authority
CN
China
Prior art keywords
menu
order
display
menu bar
menu item
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201711340458.1A
Other languages
Chinese (zh)
Other versions
CN108108417B (en
Inventor
刘龙龙
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Ctrip Travel Information Service Shanghai Co Ltd
Original Assignee
Ctrip Travel Information Service Shanghai 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 Ctrip Travel Information Service Shanghai Co Ltd filed Critical Ctrip Travel Information Service Shanghai Co Ltd
Priority to CN201711340458.1A priority Critical patent/CN108108417B/en
Publication of CN108108417A publication Critical patent/CN108108417A/en
Application granted granted Critical
Publication of CN108108417B publication Critical patent/CN108108417B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The present invention provides a kind of exchange method, system, equipment and the storage mediums of cross-platform self adaptive control, for having the display terminal of the display page, include the following steps:The display page is preset as the first Show Styles and the second Show Styles, the display page includes menu bar and viewing area, and menu bar is preset as can be according to the storage pattern and expansion pattern that the first trigger signal switches;Obtain the display screen size of display terminal, when display screen is more than or equal to presetting dimension threshold, show the first Show Styles of page presentation, expansion pattern is presented in menu bar, when display screen is less than presetting dimension threshold, show the second Show Styles of page presentation, storage pattern is presented in menu bar, and can switch to expansion pattern according to the first trigger signal.It shows that the page is preset as the first Show Styles and the second Show Styles and can be compatible with from mobile section to the various sizes of desktop end display and change in the present invention, reduces webpage research and development maintenance cost.

Description

Exchange method, system, equipment and the storage medium of cross-platform self adaptive control
Technical field
The present invention relates to web page display, specifically, be related to a kind of exchange method of cross-platform self adaptive control, system, Equipment and storage medium.
Background technology
It is on the increase with the displaying content and page level of website data report page, while to be compatible with different screen ruler Operation in very little tablet device.As the requirement that user experiences for system interaction is also higher and higher, bring therewith across flat Platform operating experience consistency problem is also further apparent.
In order to promote user's operation experience, present website is generally all using response type design or independent for tablet device Design pattern.But response type design pattern cannot control multilevel menu project folded flex, and subpage frame redirects highlighted problem It is unable to control;Individually designed tablet webpage research and development maintenance cost is high, and can not ensure experience uniformity.Therefore a kind of webpage is needed The technical solution of displaying can be compatible with from tablet to the change in size of the display screen of desktop end display, while will also be to two The menu folding of grade subpage frame optimizes displaying.
The content of the invention
For the problems of the prior art, it is an object of the invention to provide a kind of interaction sides of cross-platform self adaptive control Method, system, equipment and storage medium.
According to an aspect of the present invention, a kind of exchange method of cross-platform self adaptive control is provided, for having one to show Show the display terminal of the page, including:Following steps:
S1:The display page is preset as the first Show Styles and the second Show Styles, the display page includes dish Single column and viewing area, the menu bar be preset as can according to the first trigger signal switch storage pattern and expansion pattern, when During display first Show Styles of page presentation, storage pattern is presented in the menu bar, when the display page presentation second During Show Styles, expansion pattern is presented in the menu bar;
S2:The display screen size of display terminal is obtained, when the display screen is more than or equal to presetting dimension threshold When, expansion pattern is presented in display first Show Styles of page presentation, the menu bar, is preset when the display screen is less than During fixed dimension threshold, storage pattern is presented in display second Show Styles of page presentation, the menu bar, and being capable of basis First trigger signal switches to expansion pattern, and the menu bar is more than the menu bar in storage in the width of expansion pattern The width of pattern, the display terminal have a transverse screen display state and a vertical screen display state, when the detection display terminal First trigger signal is generated when being converted by the vertical screen display state to the transverse screen display state;
S3:When the menu bar shows expansion pattern, triggered according to the second trigger signal and arranged successively on the menu bar Multiple first order menu items of row, at least one first order menu item include multiple Level-2 menu items being arranged in order Mesh, when the second trigger signal triggering one has the first order menu item of Level-2 menu project, the first order menu item It is unfolded successively away from the first order menu item direction on mesh edge.
Preferably, when the display terminal is in transverse screen display state or vertical screen display state, the display terminal has One first direction of motion and one second direction of motion, first direction of motion and second direction of motion are away from each other, described Menu bar is compared with the viewing area close to first direction of motion, and the viewing area is compared with the menu bar close to described Second direction of motion;
When the motion sensor of the display terminal captures the display terminal with the first acceleration, at the first time direction Second direction of motion movement, then the display terminal with the second acceleration, the second time towards the first movement side It is less than default acceleration rate threshold to movement and difference between first acceleration and second acceleration, described first Difference between time and second time generates first trigger signal when being less than default time threshold, makes menu bar Expansion pattern is switched to by storage pattern.
Preferably, when the display screen is less than presetting dimension threshold, first trigger signal passes through as follows Step generates:
Using the center of the display page as origin, length direction is X-axis, and width establishes coordinate system for Y-axis, described Menu bar is shown in the negative axis region of the X-axis, and multiple first order menu items are arranged in order along Y-axis;
The head portrait for gathering user by the camera of the display terminal within the presetting time generates multiple the One target image aligns at the center of each first object image with the origin of the coordinate system, length direction and the X Axial parallel, width is parallel with the Y-axis;
The eye areas of each first object image of identification determines the first coordinate range of the eye areas, when First coordinate range of the eye areas of multiple first object images is presented with time sequencing from morning to night to the X-axis Negative sense it is mobile and when displacement distance is more than presetting first threshold, generate first trigger signal.
Preferably, when the display screen is less than presetting dimension threshold, second trigger signal passes through as follows Step generates:
Acquisition user's sight concentrates in the menu bar first when being arranged in primary first order menu item Benchmark image, the center of first benchmark image are alignd with the origin of the coordinate system, and length direction is put down with the X axis Row, width is parallel with the Y-axis, identifies the eye areas of each first benchmark image, determines first base Second coordinate range of the eye areas of quasi- image, by the Y-coordinate scope of second coordinate range and described primary the The Y-coordinate scope of 3rd coordinate range of level-one menu item is corresponding;
The when acquisition user's sight concentrates in the menu bar first order menu item for being arranged in last Two benchmark images, the center of second benchmark image are alignd with the origin of the coordinate system, and length direction is put down with the X axis Row, width is parallel with the Y-axis, identifies the eye areas of each second benchmark image, determines second base The 4-coordinate scope of the eye areas of quasi- image, by the Y-coordinate scope of the 4-coordinate scope with it is described last The Y-coordinate scope of the Five Axis scope of first order menu item is corresponding;
According to the number between the primary first order menu item and last the first order menu item Amount divides equally Y-coordinate scope between the 3rd coordinate range and the Five Axis scope, and then according to primary first The generation of the Y-coordinate scope of grade menu item and last the first order menu item and each first order menu item one One corresponding Y-coordinate scope;
When head portrait the second target image of generation of the camera acquisition user by the display terminal, by described in The center of second target image is alignd with the origin of the coordinate system, and length direction is parallel with the X axis, width and institute It is parallel to state Y-axis;
It identifies the eye areas of second target image, determines the Y-coordinate of the eye areas of second target image The Y-coordinate scope of the eye areas of second target image and each one-to-one Y of first order menu item is obtained in scope The overlapping interval of coordinate range selects the first order menu item of overlapping interval maximum, generates the of overlapping interval maximum Second trigger signal of level-one menu item.
Preferably, when the menu bar is in expansion pattern, the menu bar shows the first order menu item destination name Claim and identify;When the menu bar is in storage pattern, the menu bar only shows the first order menu item purpose mark.
Preferably, the first order menu item and the Level-2 menu project have the first displaying color;When described When first order menu item and the Level-2 menu project are triggered, the first order menu item and the Level-2 menu Project is configured as the second displaying color.
Preferably, when the first order menu item includes multiple Level-2 menu projects being arranged in order, the first order Menu item is provided with the first attribute mark and the second attribute mark;
When the first order menu item is not triggered, the first order menu item shows the first attribute mark Note;
When opening multiple Level-2 menu projects of the first order menu item, the first order menu item displaying The second attribute mark.
The present invention also provides a kind of interactive system of cross-platform self adaptive control, it is used to implement described cross-platform adaptive The exchange method of control, including:
Show Styles presetting module:For the display page to be preset as the first Show Styles and the second Show Styles, The display page includes menu bar and viewing area, and the menu bar is preset as the storage that can switch according to the first trigger signal Pattern and expansion pattern, when display first Show Styles of page presentation, storage pattern is presented in the menu bar, when described When showing the second Show Styles of page presentation, expansion pattern is presented in the menu bar;
First trigger signal execution module:Obtain display terminal display screen size, when the display screen be more than etc. When presetting dimension threshold, display first Show Styles of page presentation, the menu bar is presented expansion pattern, works as institute When stating display screen less than presetting dimension threshold, display second Show Styles of page presentation, the menu bar is presented Pattern is stored, and expansion pattern can be switched to according to first trigger signal, the menu bar is in the width that pattern is unfolded More than the menu bar in the width of storage pattern, when the display screen is less than presetting dimension threshold, the display Terminal has a transverse screen display state and a vertical screen display state, is turned when detecting the display terminal by the vertical screen display state First trigger signal is generated when shifting to the transverse screen display state;
Second trigger signal execution module:When the menu bar shows expansion pattern, triggered according to the second trigger signal The multiple first order menu items being arranged in order on the menu bar, at least one first order menu item include it is multiple successively The Level-2 menu project of arrangement, when the second trigger signal triggering one has the first order menu item of Level-2 menu project When, the first order menu item edge is unfolded successively away from the first order menu item direction.
The present invention also provides a kind of interactive device of cross-platform self adaptive control, including:
Processor;
Memory, wherein being stored with the executable instruction of the processor;
Wherein, the processor is configured to perform the cross-platform self adaptive control via the executable instruction is performed Exchange method the step of.
The present invention also provides a kind of computer readable storage mediums, and for storing program, described program is performed realization The step of exchange method of the cross-platform self adaptive control.
Compared with prior art, the present invention has following advantage:
The invention enables desktop end browser or application software have display the page the first Show Styles in small ruler Under very little screen, such as during the mobile equipment browse page of tablet and mobile phone, make the display page presentation of browser or application software the Two Show Styles, i.e. side menu can automatically switch to the Menu pattern of narrower width and show switching menu pattern by Button enters subpage frame browsing when user triggers Level-2 menu by trigger signal, then multiple under this first order classification menu Second level submenu will be by Automatic-expanding, and positioning current submenu makes the submenu highlight displaying, so as to user either Be not in that all or none method does not show the feelings for highlighting second level submenu to menu displaying in desktop end or tablet end actions menu Condition;Show that the page is preset as the first Show Styles and the second Show Styles and can be compatible with and be shown from mobile section to desktop end in the present invention Show the various sizes variation of device, reduce webpage research and development maintenance cost.
Description of the drawings
Upon reading the detailed description of non-limiting embodiments with reference to the following drawings, other feature of the invention, Objects and advantages will become more apparent upon.
Fig. 1 is the step flow chart of the exchange method of mid-span platform adaptive control of the present invention;
Fig. 2 is the schematic diagram for showing the first Show Styles of page presentation in the present invention in embodiment;
Fig. 3 is the schematic diagram for showing the second Show Styles of page presentation in the present invention in embodiment;
Fig. 4 is the schematic diagram for showing the first Show Styles of page presentation in the present invention in variant embodiment;
Fig. 5 is the schematic diagram for showing the second Show Styles of page presentation in the present invention in variant embodiment;
Fig. 6 is the module diagram of the interactive system of mid-span platform adaptive control of the present invention;
Fig. 7 is the structure diagram of the interactive device of mid-span platform adaptive control of the present invention;And
Fig. 8 is the structure diagram of this present invention Computer readable storage medium storing program for executing.
Specific embodiment
Example embodiment is described more fully with reference to the drawings.However, example embodiment can be with a variety of shapes Formula is implemented, and is not understood as limited to embodiment set forth herein.On the contrary, these embodiments are provided so that the present invention will Fully and completely, and by the design of example embodiment comprehensively it is communicated to those skilled in the art.It is identical attached in figure Icon note represents same or similar structure, thus will omit repetition thereof.
Fig. 1 is the step flow chart of the exchange method of mid-span platform adaptive control of the present invention, as shown in Figure 1, of the invention The exchange method of the cross-platform self adaptive control provided, for having the display terminal of a display page, including:Following steps:
S1:The display page is preset as the first Show Styles and the second Show Styles, the display page includes menu bar and shows Show area, menu bar is preset as can be according to the storage pattern and expansion pattern that the first trigger signal switches, when display page presentation During the first Show Styles, storage pattern is presented in menu bar, and when showing the second Show Styles of page presentation, expansion is presented in menu bar Pattern.
When menu bar is in expansion pattern, title, mark and the publicity icon of menu bar displaying first order menu item Deng;When menu bar is in storage pattern, menu bar only shows first order menu item purpose mark.In the present embodiment, menu bar is in Pattern is now stored, the width of menu bar is 40 pixels.Expansion pattern is presented in menu bar, and the width of menu bar is 200 pixels.Becoming In shape example, the width ratio that the width and menu bar presentation expansion pattern of storage pattern is presented in menu bar can be 1:4 or 1:3 grades are appointed Meaning width.
S2:The display screen size of display terminal is obtained, when display screen is more than or equal to presetting dimension threshold, is shown Show the first Show Styles of page presentation, expansion pattern is presented in menu bar, when display screen is less than presetting dimension threshold, shows Show the second Show Styles of page presentation, storage pattern is presented in menu bar, and can switch to expansion sample according to the first trigger signal Formula, menu bar are more than width of the menu bar in storage pattern in the width of expansion pattern, and there is display terminal a transverse screen to show shape State and a vertical screen display state, when detecting display terminal and converted by vertical screen display state to transverse screen display state generation first touch It signals.
In the present embodiment, presetting dimension threshold is 1280 pixels.Display terminal is tablet computer and smart mobile phone etc. Mobile equipment, in order to keep the display page always with best angle towards user, the display effect of vertical screen display state is often not Such as the display effect of transverse screen display state, menu bar is stored and will improve display effect when vertical screen is shown, when transverse screen is shown When, menu bar is unfolded again, in order to which user is operated.
S3:It is multiple according to being arranged in order on the second trigger signal triggering menu bar when menu bar shows expansion pattern First order menu item, at least a first order menu item include multiple Level-2 menu projects being arranged in order, when second touch When triggering one of signaling has the first order menu item of Level-2 menu project, first order menu item is along away from first order dish It is unfolded successively in individual event mesh direction.
In the present embodiment, first order menu item and Level-2 menu project have the first displaying color;Work as the first order When menu item and Level-2 menu project are triggered, first order menu item and Level-2 menu project are configured as the second exhibition Show color, that is, be highlighted, the first order menu item being triggered and Level-2 menu project to be marked.In this implementation In example, the first displaying color is grey, and the second displaying color is blueness, and but not limited to this.Under a displaying visual angle, Duo Ge Level-one menu item is located at the left end of the display page, extends successively along the width for showing the page.
When first order menu item includes multiple Level-2 menu projects being arranged in order, which is set There are the first attribute mark and the second attribute mark;
When first order menu item is not triggered, first order menu item shows the first attribute mark, the first attribute Mark is specially arrow directed downwardly;When opening multiple Level-2 menu projects of first order menu item, first order menu item Mesh shows the second attribute mark, and the first attribute mark is specially arrow upward.
When display terminal is in transverse screen display state or vertical screen display state, display terminal have one first direction of motion and One second direction of motion, first direction of motion and second direction of motion are away from each other, and menu bar is compared with viewing area close to the first fortune Dynamic direction, viewing area is compared with menu bar close to second direction of motion;
First direction of motion and second direction of motion are the direction extended along mobile phone width or length direction.Work as display terminal During to second direction of motion, menu bar is moved towards viewing area, and when display terminal is to first direction of motion, viewing area is towards dish Single column movement.
Fig. 2 is the schematic diagram for showing the first Show Styles of page presentation in the present invention in embodiment, and menu bar is receipts at this time Receive state.It is moved when the motion sensor of display terminal captures display terminal with the first acceleration, at the first time towards second Direction move, then display terminal with the second acceleration, the second time towards first direction of motion move and the first acceleration with Difference between second acceleration is less than default acceleration rate threshold, and the difference between the second time is less than default at the first time Time threshold when generate the first trigger signal, menu bar is made to switch to expansion pattern by storage pattern, sheet as illustrated in FIG. 3 The schematic diagram of the second Show Styles of page presentation is shown in invention in embodiment.In the present embodiment, time threshold 0.5S.Add Threshold speed is 0.1m/s2
Fig. 4 is the schematic diagram for showing the first Show Styles of page presentation in the present invention in variant embodiment, and Fig. 5 is the present invention The schematic diagram of the second Show Styles of page presentation is shown in middle variant embodiment.As shown in Figure 4, Figure 5, the first triggering letter is shown Number trigger process.When display screen is less than presetting dimension threshold, the first trigger signal generates as follows:
To show the center of the page as origin, length direction is X-axis, and width establishes coordinate system for Y-axis, and menu bar is shown Show that, in the negative axis region of X-axis, multiple first order menu items are arranged in order along Y-axis;Display terminal is shown with transverse screen state at this time.
The head portrait for gathering user by the camera of display terminal within the presetting time generates multiple first mesh Logo image aligns at the center of each first object image with the origin of coordinate system, and length direction is parallel with X axis, width side To parallel with Y-axis;
It identifies the eye areas of each first object image, the first coordinate range of eye areas is determined, when multiple first First coordinate range of the eye areas of target image is presented mobile and mobile to the negative sense of X-axis with time sequencing from morning to night When distance is more than presetting first threshold, the first trigger signal is generated.
When user wants triggering positioned at the menu bar in the negative axis region of X-axis, sight all can slowly be turned to the negative of X-axis Axis region simultaneously moves along the x-axis, at this time by camera gather user head portrait, and by above-mentioned graphical analysis go out user to During the tendency of the negative axis region movement of X-axis, triggering menu bar switches to expansion pattern by storage pattern.
When display screen is less than presetting dimension threshold, the second trigger signal generates as follows:
Acquisition user's sight concentrates in menu bar the first benchmark when being arranged in primary first order menu item Image, the center of the first benchmark image are alignd with the origin of coordinate system, and length direction is parallel with X axis, width and Y-axis It is parallel, it identifies the eye areas of each first benchmark image, determines the second coordinate range of the eye areas of the first benchmark image, By the Y-coordinate scope of the second coordinate range and the Y-coordinate scope phase of the 3rd coordinate range of primary first order menu item It is corresponding;
Acquisition user's sight concentrates in menu bar the second base during the first order menu item for being arranged in last Quasi- image, the center of the second benchmark image are alignd with the origin of coordinate system, and length direction is parallel with X axis, width and Y-axis To parallel, the eye areas of each second benchmark image is identified, determine the 4-coordinate model of the eye areas of the second benchmark image It encloses, by the Y-coordinate model of the Y-coordinate scope of 4-coordinate scope and the Five Axis scope of last first order menu item It encloses corresponding;
According to the quantity between primary first order menu item and last first order menu item by the 3rd Y-coordinate scope is divided equally between coordinate range and Five Axis scope, and then according to primary first order menu item and finally The generation of Y-coordinate scope and the one-to-one Y-coordinate scope of each first order menu item of the first order menu item of one;
When head portrait the second target image of generation of the camera acquisition user by display terminal, by the second target image Center align with the origin of coordinate system, length direction is parallel with X axis, and width is parallel with Y-axis;
It identifies the eye areas of the second target image, determines the Y-coordinate scope of the eye areas of the second target image, be obtained The weight of the Y-coordinate scope of the eye areas of second target image and the one-to-one Y-coordinate scope of each first order menu item Interval overlapping, selects the first order menu item of overlapping interval maximum, and the of the first order menu item of generation overlapping interval maximum Two trigger signals.
That is, in the present embodiment, by the eyes of the Y-coordinate scope of each first order menu item and user along Y The scope of axis movement corresponds, so that when menu bar is unfolded, by capturing move side of the eyes used along Y-axis To each first order menu item of triggering.
Fig. 6 is the module diagram of the interactive system of mid-span platform adaptive control of the present invention, as shown in fig. 6, of the invention A kind of interactive system of cross-platform self adaptive control is also provided, is used to implement the friendship of cross-platform self adaptive control as shown in Figure 1 Mutual method, including:
Show Styles presetting module:For that will show that the page is preset as the first Show Styles and the second Show Styles, show The page includes menu bar and viewing area, and menu bar is preset as can be according to the storage pattern and expansion sample that the first trigger signal switches Formula, when showing the first Show Styles of page presentation, storage pattern is presented in menu bar, when display the second Show Styles of page presentation When, expansion pattern is presented in menu bar;
First trigger signal execution module:The display screen size of display terminal is obtained, when display screen is more than or equal in advance During the dimension threshold of setting, the first Show Styles of page presentation is shown, expansion pattern is presented in menu bar, when display screen is less than in advance During the dimension threshold of setting, the second Show Styles of page presentation is shown, storage pattern is presented in menu bar, and can be touched according to first Signalling switches to expansion pattern, and menu bar is more than width of the menu bar in storage pattern in the width of expansion pattern, is showing When screen is less than presetting dimension threshold, display terminal has a transverse screen display state and a vertical screen display state, works as detection Display terminal generates the first trigger signal when being converted by vertical screen display state to transverse screen display state;
Second trigger signal execution module:When menu bar shows expansion pattern, menu is triggered according to the second trigger signal The multiple first order menu items being arranged in order on column, at least a first order menu item include multiple second level being arranged in order Menu item, when the second trigger signal triggering one has the first order menu item of Level-2 menu project, first order menu It is unfolded successively away from first order menu item direction on project edge.
The embodiment of the present invention also provides a kind of interactive device of cross-platform self adaptive control, including processor.Memory, In be stored with the executable instruction of processor.Wherein, processor is configured to be performed via execution executable instruction cross-platform The step of exchange method of self adaptive control.
As above, which enables default first Show Styles of the display page and the second Show Styles to be compatible with from shifting The various sizes of dynamic section to desktop end display change, and reduce webpage research and development maintenance cost.
Person of ordinary skill in the field it is understood that various aspects of the invention can be implemented as system, method or Program product.Therefore, various aspects of the invention can be implemented as following form, i.e.,:It is complete hardware embodiment, complete The embodiment combined in terms of full Software Implementation (including firmware, microcode etc.) or hardware and software, can unite here Referred to as " circuit ", " module " or " platform ".
Fig. 7 is the structure diagram of the interactive device of the cross-platform self adaptive control of the present invention.It is described referring to Fig. 7 The electronic equipment 600 of this embodiment according to the present invention.The electronic equipment 600 that Fig. 7 is shown is only an example, should not Any restrictions are brought to the function and use scope of the embodiment of the present invention.
As shown in fig. 7, electronic equipment 600 is showed in the form of universal computing device.The component of electronic equipment 600 can wrap It includes but is not limited to:At least one processing unit 610, at least one storage unit 620, connection different platform component are (including storage Unit 620 and processing unit 610) bus 630, display unit 640 etc..
Wherein, storage unit has program stored therein code, and the program code unit 610 that can be processed performs so that processing is single Member 610 performs the exemplary implementations various according to the present invention described in the above-mentioned electronic prescription circulation processing method part of this specification The step of mode.For example, the step of processing unit 610 can perform as shown in fig. 1.
Storage unit 620 can include the readable medium of volatile memory cell form, such as Random Access Storage Unit (RAM) 6201 and/or cache memory unit 6202, it can further include read-only memory unit (ROM) 6203.
Storage unit 620 can also include program/utility with one group of (at least one) program module 6205 6204, such program module 6205 includes but not limited to:Operating system, one or more application program, other program moulds Block and program data may include the realization of network environment in each or certain combination in these examples.
Bus 630 can be the one or more represented in a few class bus structures, including storage unit bus or storage Cell controller, peripheral bus, graphics acceleration port, processing unit use the arbitrary bus structures in a variety of bus structures Local bus.
Electronic equipment 600 can also be with one or more external equipments 700 (such as keyboard, sensing equipment, bluetooth equipment Deng) communication, the equipment interacted with the electronic equipment 600 communication can be also enabled a user to one or more and/or with causing Any equipment that the electronic equipment 600 can communicate with one or more of the other computing device (such as router, modulation /demodulation Device etc.) communication.This communication can be carried out by input/output (I/O) interface 650.Also, electronic equipment 600 can be with By network adapter 660 and one or more network (such as LAN (LAN), wide area network (WAN) and/or public network, Such as internet) communication.Network adapter 660 can be communicated by bus 630 with other modules of electronic equipment 600.It should Understand, although not shown in the drawings, can combine electronic equipment 600 use other hardware and/or software module, including but it is unlimited In:Microcode, device driver, redundant processing unit, external disk drive array, RAID system, tape drive and number According to backup storage platform etc..
The embodiment of the present invention also provides a kind of computer readable storage medium, and for storing program, program is performed reality The step of exchange method of existing cross-platform self adaptive control.In some possible embodiments, various aspects of the invention are also A kind of form of program product is can be implemented as, including program code, when program product is run on the terminal device, program Code circulates described in processing method part according to the present invention for terminal device to be made to perform the above-mentioned electronic prescription of this specification The step of various illustrative embodiments.
As it appears from the above, the program of the computer readable storage medium of the embodiment is upon execution so that the display page is preset The first Show Styles and the second Show Styles can be compatible with from mobile section to the various sizes of desktop end display change, reduce Webpage research and development maintenance cost.
Fig. 8 is the structure diagram of the computer readable storage medium of the present invention.Refering to what is shown in Fig. 8, it describes according to this The program product 800 for being used to implement the above method of the embodiment of invention, may be employed the read-only storage of portable compact disc Device (CD-ROM) and including program code, and can be run on terminal device, such as PC.However, the journey of the present invention Sequence product is without being limited thereto, and in this document, readable storage medium storing program for executing can be any tangible medium for including or storing program, the journey Sequence can be commanded the either device use or in connection of execution system, device.
Any combination of one or more readable mediums may be employed in program product.Readable medium can be that readable signal is situated between Matter or readable storage medium storing program for executing.Readable storage medium storing program for executing for example can be but be not limited to electricity, magnetic, optical, electromagnetic, infrared ray or partly lead System, device or the device of body or arbitrary above combination.More specific example (the non exhaustive row of readable storage medium storing program for executing Table) include:Electrical connection, portable disc, hard disk, random access memory (RAM), read-only storage with one or more conducting wires Device (ROM), erasable programmable read only memory (EPROM or flash memory), optical fiber, portable compact disc read only memory (CD- ROM), light storage device, magnetic memory device or above-mentioned any appropriate combination.
Computer readable storage medium can include in a base band or as carrier wave a part propagation data-signal, In carry readable program code.Diversified forms may be employed in the data-signal of this propagation, include but not limited to electromagnetic signal, Optical signal or above-mentioned any appropriate combination.Readable storage medium storing program for executing can also be any readable Jie beyond readable storage medium storing program for executing Matter, which can send, propagate either transmit to be used by instruction execution system, device or device or and its The program of combined use.The program code included on readable storage medium storing program for executing can use any appropriate medium to transmit, including but not It is limited to wireless, wired, optical cable, RF etc. or above-mentioned any appropriate combination.
It can write to perform the program that operates of the present invention with any combination of one or more programming languages Code, programming language include object oriented program language-Java, C++ etc., further include conventional process Formula programming language-such as " C " language or similar programming language.Program code can be calculated fully in user It performs in equipment, partly perform on a user device, the software package independent as one performs, partly in user calculating equipment Upper part performs or is performed completely in remote computing device or server on a remote computing.It is being related to long-range meter In the situation for calculating equipment, remote computing device can be by the network of any kind, including LAN (LAN) or wide area network (WAN), be connected to user calculating equipment or, it may be connected to external computing device (such as utilizes ISP To pass through Internet connection).
The invention enables desktop end browser or application software have display the page the first Show Styles in small ruler Under very little screen, such as during the mobile equipment browse page of tablet and mobile phone, make the display page presentation of browser or application software the Two Show Styles, i.e. side menu can automatically switch to the Menu pattern of narrower width and show switching menu pattern by Button enters subpage frame browsing when user triggers Level-2 menu by trigger signal, then multiple under this first order classification menu Second level submenu will be by Automatic-expanding, and positioning current submenu makes the submenu highlight displaying, so as to user either Be not in that all or none method does not show the feelings for highlighting second level submenu to menu displaying in desktop end or tablet end actions menu Condition;Show that the page is preset as the first Show Styles and the second Show Styles and can be compatible with and be shown from mobile section to desktop end in the present invention Show the various sizes variation of device, reduce webpage research and development maintenance cost.
The above content is a further detailed description of the present invention in conjunction with specific preferred embodiments, it is impossible to assert The specific implementation of the present invention is confined to these explanations.For those of ordinary skill in the art to which the present invention belongs, exist On the premise of not departing from present inventive concept, several simple deduction or replace can also be made, should all be considered as belonging to the present invention's Protection domain.

Claims (10)

1. a kind of exchange method of cross-platform self adaptive control, which is characterized in that for having the display terminal of a display page, Including:Following steps:
S1:The display page is preset as the first Show Styles and the second Show Styles, the display page includes menu bar And viewing area, the menu bar is preset as can be according to the storage pattern and expansion pattern that the first trigger signal switches, when described When showing the first Show Styles of page presentation, storage pattern is presented in the menu bar, when the display page presentation second is shown During pattern, expansion pattern is presented in the menu bar;
S2:The display screen size of display terminal is obtained, when the display screen is more than or equal to presetting dimension threshold, institute Display the first Show Styles of page presentation is stated, expansion pattern is presented in the menu bar, when the display screen is less than presetting During dimension threshold, storage pattern is presented in display second Show Styles of page presentation, the menu bar, and can be according to described First trigger signal switches to expansion pattern, and the menu bar is more than the menu bar in storage pattern in the width of expansion pattern Width, the display terminal has a transverse screen display state and a vertical screen display state, when detecting the display terminal by institute It states when vertical screen display state is converted to the transverse screen display state and generates first trigger signal;
S3:When the menu bar shows expansion pattern, trigger what is be arranged in order on the menu bar according to the second trigger signal Multiple first order menu items, at least one first order menu item include multiple Level-2 menu projects being arranged in order, When the second trigger signal triggering one has the first order menu item of Level-2 menu project, the first order menu item edge It is unfolded successively away from the first order menu item direction.
2. the exchange method of cross-platform self adaptive control according to claim 1, it is characterised in that:When the display terminal In transverse screen display state or vertical screen display state, the display terminal has one first direction of motion and one second movement side To first direction of motion and second direction of motion are away from each other, and the menu bar is compared with the viewing area close to institute First direction of motion is stated, the viewing area is compared with the menu bar close to second direction of motion;
When the motion sensor of the display terminal captures the display terminal with the first acceleration, at the first time described in Second direction of motion moves, and then the display terminal is transported with the second acceleration, the second time towards first direction of motion Dynamic and between first acceleration and second acceleration difference is less than default acceleration rate threshold, the first time Difference between second time generates first trigger signal when being less than default time threshold, makes menu bar by receiving Pattern of receiving switches to expansion pattern.
3. the exchange method of cross-platform self adaptive control according to claim 1, it is characterised in that:When the display screen During less than presetting dimension threshold, first trigger signal generates as follows:
Using the center of the display page as origin, length direction is X-axis, and width establishes coordinate system, the menu for Y-axis Column is shown in the negative axis region of the X-axis, and multiple first order menu items are arranged in order along Y-axis;
The head portrait for gathering user by the camera of the display terminal within the presetting time generates multiple first mesh Logo image aligns at the center of each first object image with the origin of the coordinate system, length direction and the X axis Parallel, width is parallel with the Y-axis;
The eye areas of each first object image of identification determines the first coordinate range of the eye areas, when multiple First coordinate range of the eye areas of the first object image is presented with time sequencing from morning to night to the negative of the X-axis When being more than presetting first threshold to mobile and displacement distance, first trigger signal is generated.
4. the exchange method of cross-platform self adaptive control according to claim 3, it is characterised in that:When the display screen During less than presetting dimension threshold, second trigger signal generates as follows:
Acquisition user's sight concentrates in the menu bar the first benchmark when being arranged in primary first order menu item Image, the center of first benchmark image are alignd with the origin of the coordinate system, and length direction is parallel with the X axis, wide Degree direction is parallel with the Y-axis, identifies the eye areas of each first benchmark image, determines first benchmark image Eye areas the second coordinate range, by the Y-coordinate scope of second coordinate range and the primary first order dish The Y-coordinate scope of the 3rd coordinate range of individual event purpose is corresponding;
Acquisition user's sight concentrates in the menu bar the second base during the first order menu item for being arranged in last Quasi- image, the center of second benchmark image are alignd with the origin of the coordinate system, and length direction is parallel with the X axis, Width is parallel with the Y-axis, identifies the eye areas of each second benchmark image, determines second reference map The 4-coordinate scope of the eye areas of picture, by the Y-coordinate scope of the 4-coordinate scope and last first The Y-coordinate scope of the Five Axis scope of grade menu item is corresponding;
It will according to the quantity between the primary first order menu item and last the first order menu item Y-coordinate scope is divided equally between 3rd coordinate range and the Five Axis scope, and then according to primary first order dish The Y-coordinate scope of individual event mesh and last the first order menu item generates a pair of with each first order menu item one The Y-coordinate scope answered;
When head portrait the second target image of generation of the camera acquisition user by the display terminal, by described second The center of target image is alignd with the origin of the coordinate system, and length direction is parallel with the X axis, width and the Y It is axial parallel;
It identifies the eye areas of second target image, determines the Y-coordinate scope of the eye areas of second target image, The Y-coordinate scope of the eye areas of second target image and each one-to-one Y-coordinate of first order menu item is obtained The overlapping interval of scope selects the first order menu item of overlapping interval maximum, generates the first order of the overlapping interval maximum Second trigger signal of menu item.
5. the exchange method of cross-platform self adaptive control according to claim 1, it is characterised in that:When the menu bar is in When pattern is unfolded, the menu bar shows the title and mark of the first order menu item;When the menu bar is in storage sample Formula, the menu bar only show the first order menu item purpose mark.
6. the exchange method of cross-platform self adaptive control according to claim 1, it is characterised in that:The first order menu Project and the Level-2 menu project have the first displaying color;When the first order menu item and the Level-2 menu When project is triggered, the first order menu item and the Level-2 menu project are configured as the second displaying color.
7. the exchange method of cross-platform self adaptive control according to claim 1, it is characterised in that:When the first order dish Individual event mesh includes multiple Level-2 menu projects being arranged in order, which is provided with the first attribute mark and the Two attributes mark;
When the first order menu item is not triggered, the first order menu item shows the first attribute mark;
When opening multiple Level-2 menu projects of the first order menu item, described in the first order menu item displaying Second attribute marks.
8. a kind of interactive system of cross-platform self adaptive control, is used to implement cross-platform any one of claim 1 to 7 The exchange method of self adaptive control, which is characterized in that including:
Show Styles presetting module:It is described for the display page to be preset as the first Show Styles and the second Show Styles Show that the page includes menu bar and viewing area, the menu bar is preset as the storage pattern that can switch according to the first trigger signal With expansion pattern, when display first Show Styles of page presentation, storage pattern is presented in the menu bar, when the display During the second Show Styles of page presentation, expansion pattern is presented in the menu bar;
First trigger signal execution module:The display screen size of display terminal is obtained, when the display screen is more than or equal in advance During the dimension threshold of setting, expansion pattern is presented in display first Show Styles of page presentation, the menu bar, when described aobvious When display screen curtain is less than presetting dimension threshold, storage is presented in display second Show Styles of page presentation, the menu bar Pattern, and expansion pattern can be switched to according to first trigger signal, the menu bar is more than in the width of expansion pattern The menu bar is in the width for storing pattern, when the display screen is less than presetting dimension threshold, the display terminal With a transverse screen display state and a vertical screen display state, when detect the display terminal by the vertical screen display state convert to First trigger signal is generated during the transverse screen display state;
Second trigger signal execution module:When the menu bar shows expansion pattern, according to the triggering of the second trigger signal The multiple first order menu items being arranged in order on menu bar, at least one first order menu item include multiple be arranged in order Level-2 menu project, when the second trigger signal triggering one have Level-2 menu project the first order menu item when, institute First order menu item edge is stated away from the first order menu item direction to be successively unfolded.
9. a kind of interactive device of cross-platform self adaptive control, which is characterized in that including:
Processor;
Memory, wherein being stored with the executable instruction of the processor;
Wherein, the processor is configured to by performing the executable instruction come any one institute in perform claim requirement 1 to 7 The step of stating the exchange method of cross-platform self adaptive control.
10. a kind of computer readable storage medium, for storing program, which is characterized in that described program is performed realization power Profit is required in 1 to 7 described in any one the step of the exchange method of cross-platform self adaptive control.
CN201711340458.1A 2017-12-14 2017-12-14 Cross-platform adaptive control interaction method, system, equipment and storage medium Active CN108108417B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201711340458.1A CN108108417B (en) 2017-12-14 2017-12-14 Cross-platform adaptive control interaction method, system, equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201711340458.1A CN108108417B (en) 2017-12-14 2017-12-14 Cross-platform adaptive control interaction method, system, equipment and storage medium

Publications (2)

Publication Number Publication Date
CN108108417A true CN108108417A (en) 2018-06-01
CN108108417B CN108108417B (en) 2020-07-28

Family

ID=62216914

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201711340458.1A Active CN108108417B (en) 2017-12-14 2017-12-14 Cross-platform adaptive control interaction method, system, equipment and storage medium

Country Status (1)

Country Link
CN (1) CN108108417B (en)

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109144645A (en) * 2018-08-20 2019-01-04 海南大学 Region definition, displaying and the recognition methods of customized interaction area
CN110083205A (en) * 2019-04-23 2019-08-02 努比亚技术有限公司 Page switching method, wearable device and computer readable storage medium
CN112579927A (en) * 2019-09-30 2021-03-30 北京国双科技有限公司 Method and device for displaying navigation bar

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20080072177A1 (en) * 2006-03-10 2008-03-20 International Business Machines Corporation Cascade menu lock
CN103577051A (en) * 2013-10-12 2014-02-12 优视科技有限公司 Method and device for controlling menu
CN106020628A (en) * 2016-06-12 2016-10-12 浙江慧脑信息科技有限公司 Tab bar and menu bar display status control method
CN107168609A (en) * 2017-06-06 2017-09-15 广东欧珀移动通信有限公司 status bar display method, device and terminal

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20080072177A1 (en) * 2006-03-10 2008-03-20 International Business Machines Corporation Cascade menu lock
CN103577051A (en) * 2013-10-12 2014-02-12 优视科技有限公司 Method and device for controlling menu
CN106020628A (en) * 2016-06-12 2016-10-12 浙江慧脑信息科技有限公司 Tab bar and menu bar display status control method
CN107168609A (en) * 2017-06-06 2017-09-15 广东欧珀移动通信有限公司 status bar display method, device and terminal

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109144645A (en) * 2018-08-20 2019-01-04 海南大学 Region definition, displaying and the recognition methods of customized interaction area
CN109144645B (en) * 2018-08-20 2020-01-10 海南大学 Region definition, display and identification method of user-defined interaction region
CN110083205A (en) * 2019-04-23 2019-08-02 努比亚技术有限公司 Page switching method, wearable device and computer readable storage medium
CN112579927A (en) * 2019-09-30 2021-03-30 北京国双科技有限公司 Method and device for displaying navigation bar

Also Published As

Publication number Publication date
CN108108417B (en) 2020-07-28

Similar Documents

Publication Publication Date Title
EP3350679B1 (en) Electronic device and method for processing gesture thereof
EP2837992B1 (en) User interface interaction method and apparatus applied in touchscreen device, and touchscreen device
KR102330829B1 (en) Method and apparatus for providing augmented reality function in electornic device
US9519369B2 (en) Touch screen selection
KR20170041219A (en) Hover-based interaction with rendered content
CN111062778A (en) Product browsing method, device, equipment and storage medium
EP2814000A1 (en) Image processing apparatus, image processing method, and program
US20130176202A1 (en) Menu selection using tangible interaction with mobile devices
US20170293352A1 (en) Multiple display modes on a mobile device
GB2540032A (en) Data browse apparatus, data browse method, program, and storage medium
CN109587031A (en) Data processing method
CN104166553A (en) Display method and electronic device
CN108108417A (en) Exchange method, system, equipment and the storage medium of cross-platform self adaptive control
CN106980379B (en) Display method and terminal
CN106406708A (en) A display method and a mobile terminal
CN109857289A (en) Display control method and terminal device
CN103176972A (en) Processing method of browser displaying sub-page and browser
CN107340955B (en) Method and device for acquiring position information of view after position change on screen
US10042445B1 (en) Adaptive display of user interface elements based on proximity sensing
KR20160085173A (en) A mehtod for simultaneously displaying one or more items and an electronic device therefor
CN113641638A (en) Application management method and device, electronic equipment and storage medium
JP6099788B1 (en) Product data registration terminal, product data registration method, and product data registration program
US20140189486A1 (en) Non-Transitory Computer Readable Medium Storing Document Sharing Program, Terminal Device and Document Sharing Method
CN106155462A (en) A kind of interface alternation method and device
CN110737417B (en) Demonstration equipment and display control method and device of marking line of demonstration equipment

Legal Events

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