CN105718265B - A kind of the block form nested software design and programmed method of tape label - Google Patents
A kind of the block form nested software design and programmed method of tape label Download PDFInfo
- Publication number
- CN105718265B CN105718265B CN201610039394.0A CN201610039394A CN105718265B CN 105718265 B CN105718265 B CN 105718265B CN 201610039394 A CN201610039394 A CN 201610039394A CN 105718265 B CN105718265 B CN 105718265B
- Authority
- CN
- China
- Prior art keywords
- label
- container
- content
- bar
- next layer
- 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
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/20—Software design
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The invention discloses the block form nested software design and programmed method of a kind of tape label, including setting label block, content block, label stick, labeling key and with its one-to-one container；Whether it is to be clicked container corresponding to labeling key etc. the reaction such as to make display container or whether refresh container contents by monitoring event, the container that currently shows of judgement, realizes and be switched fast and retain the functions such as interface content or refreshing interface content between multiple solutions；Each container can be nested next layer label area and content regions, label area can be located at the upper surface of content regions, below or side.This software design and programmed method have many advantages, such as clear logic, it is easy to use, can show multilayer interface, code brief introduction.
Description
Technical field
The present invention relates to the block form nested software designs and programmed method of a kind of tape label, belong to software systems user
Interface field, according to its feature, we are named as " multi-tag is nested side by side to be laid out ", this software design and programming mode
Suitable for the program displays at multiple multilayer module interfaces, design and programming particularly suitable for html web page user interface.
Background technique
There are various software interfaces designs and its programmed method in current software system, has and interface is jumped by link
, also with good grounds key updates the child window link page, or uses software test data generation current window according to user instructions
Content.Constantly to refresh screen page when user toggles the page by the design that link jumps interface, and update son
Window link then refreshes the child window page back and forth, they are suitable for the scene application disposably checked, such as check news or know
Know；And be not suitable for Path selection interface and funcall interface that frequent switching uses, such as address list catalogue, plan, stream
The user interfaces such as journey examination & approval, online payment.Traditional design method occupies system operations resource, cannot be easily in multiple applications
Changing interface simultaneously keeps status, and user experience is bad.
Summary of the invention
Easily it cannot switch and keep in multiple application interfaces to solve existing software interface design and programmed method
It the problems such as status, frequent refresh page content occupies system operations resource, user experience is bad, can be with the present invention provides one kind
It is convenient rapidly to switch between multiple multilayer interfaces again, retain interface content and facilitates the block form of the tape label of refreshing nested
Type software design and programmed method.
The technical measures implementing above-mentioned purpose of the present invention and using are as described below:
A kind of the block form nested software design and programmed method of tape label, include the following steps:
1) label block, content regions are set in user interface program, and label bar is set in label block;
2) several labeling keys are added in label bar, if while addition and labeling key are one-to-one in content regions
Dry container, container default are in hidden state；
3) monitoring event is set, after labeling key is clicked, the corresponding container contents of the labeling key is judged or link is
No presence then sets the link of container or loads the content of its default if it does not exist；The container currently shown is then judged if it exists
It whether is to be clicked container corresponding to labeling key；
If 4) container currently shown is not to be clicked container corresponding to labeling key, it is corresponding to be clicked labeling key
Container become display state, other containers become hidden state；The center of the labeling key being clicked toward label block is mobile
Unless the edge of label bar arrived the edge of label block；
5) if the container currently shown is to be clicked the how corresponding container of labeling key, container is reloaded in default
Hold.
6) setting program default interface clicks the corresponding labeling key of container where default interface with code simulation,
Trigger above-mentioned steps 3) arrive step 5).
Further, several labeling keys in uniline or it is single-row be arranged in label bar, the width of label bar and high more
Content is added to change automatically to accommodate full content, label bar is set in label area, and label bar is hidden beyond the part of label area,
Label bar can be dragged to show the part being hidden in label area.
Further, the label area can be set at the top or lower part or side of content regions according to the demand of user
Side；User can setting screen it is vertical when label area be located at the top or lower part of content regions, variation is label automatically when screen level
Area is located at the side of content regions.
It further, can nested next layer of label area and next layer of content regions in the content regions；Next layer of label area
Inside set one layer of label bar, several next layer of labeling key set in next layer of label bar, set in next layer of content regions it is several with
The corresponding next layer of container of next layer of labeling key；Next layer of label area may be provided in side identical with label area, may be alternatively provided at
The side opposite with label area；And so on, next layer of content regions can also continue to nested next layer of label area and content regions again.
Further, when listening to labeling key corresponding to the container currently shown and being clicked, container is reloaded
The content of default.
Further, when having just enter into system, only allow default show container loading content；Listening to the label
When key is clicked, if it is empty, container loads the content of default to corresponding container contents.
Further, when listening to the labeling key and being clicked, labeling key it is mobile to label area center unless
The edge that arrived label area on one side of label bar.
Another embodiment of the present invention is as follows: on the basis of a upper scheme, content is also provided in content regions
Item, several containers are in display state in uniline or single-row are arranged in content bar；Listening to labeling key quilt
When click, corresponding container is rolled to content regions center.
Further, when the content bar in content regions described in rolling allows container to be shown in content regions, container is corresponding
Labeling key is to the central movement of label area unless the edge that arrived label area on one side of label bar.
Further, when operating the key of this input method with mouse or other input equipments, the movement pressed is suitable
In the movement that finger touches, the movement lifted is equivalent to the movement that finger frames out, and mouse roller is equivalent to hand when rolling
Refer to the movement for sliding up and down object；This input method can make the response that above-mentioned movement corresponds to finger touch.
From These characteristics it is found that the present invention program has the following advantages compared with existing technical solution:
1, the interior perhaps state at each interface can be retained when can easily switch between each interface and jump, and jump.
2, it can easily refresh the content at each interface, each interface can easily be allowed to return to the original state of default.
3, can multi-layer show more interfaces, clear logic, using efficient side by side.
4, label area can be located at content regions top, lower part or side, facilitate the operation under the different conditions such as user's horizontal/vertical screen,
User experience is more preferable.
5, by the way of nested, public action code, program are more simplified.
As can be seen above, a kind of block form nested software design of tape label of the invention and programmed method and existing
Technology is compared, and can be shown more multiple solutions and can easily be switched over, and can not only have been retained interface content but also can have been defaulted boundary by quick-recovery fastly
The flexible variation of face content, label area is more suitable for one-handed performance, the program particularly suitable for touch panel device operation system of software
Design and programming.
Detailed description of the invention
Fig. 1 is the schematic illustration of one embodiment of the invention；
Fig. 2 is the schematic illustration of another embodiment of the present invention；
Fig. 3 is the interface schematic diagram of Fig. 1 embodiment；
Fig. 4 is the interface schematic diagram of Fig. 2 embodiment；
Fig. 5 is the interface schematic diagram that Fig. 1 embodiment label area is located at lower part；
Fig. 6 is the interface schematic diagram that Fig. 1 embodiment label area goes to side；
Fig. 7 is the interface schematic diagram of further embodiment of this invention；
Fig. 8 is the interface schematic diagram that Fig. 7 embodiment label area goes to side；
Fig. 9 is the interface schematic diagram of yet another embodiment of the invention.
Specific embodiment
The principle of the present invention is further described presently in connection with preferred embodiment shown in the drawings.
By Fig. 1, Fig. 3 it is found that the present invention includes the following steps:
1) label block 1, content regions 2 are set in user interface program, and label bar 11 is set in label block 1;
2) several labeling keys 111 are added in label bar 11, while addition and labeling key 111 1 in content regions 2
One corresponding several containers 211, the default of container 211 are in hidden state；
3) monitoring event is set, after labeling key 111 is clicked, is judged in the corresponding container 211 of the labeling key perhaps
Link whether there is, and if it does not exist, then sets the link of container 211 or loads the content of its default；If it exists, then judgement is current
Whether the container of display is to be clicked container 211 corresponding to labeling key 111；
If 4) container currently shown is not to be clicked container 211 corresponding to labeling key 111, be clicked label by
The corresponding container 211 of key 111 becomes display state, and other containers become hidden state；The labeling key 111 being clicked is toward label
The central movement of block 1 is unless the edge of label bar 11 arrived the edge of label block 1；
If 5) container currently shown is to be clicked the corresponding container 211 of labeling key more than 111, container 211 adds again
Carry default content.
6) setting program default interface, i.e., the corresponding label of container 211 where clicking default interface with code simulation are pressed
Key 111 triggers above-mentioned steps 3) arrive step 5).
By Fig. 2, Fig. 4 it is found that another embodiment of the invention on the basis of the above embodiments, is gone back in content regions 2
Provided with content bar 21, several containers 211 are in display state in uniline or single-row are arranged in content bar 21；?
When listening to labeling key 111 and being clicked, corresponding container 211 is rolled to 2 center of content regions.
By Fig. 3, Fig. 4 it is found that several labeling keys 111 in uniline or it is single-row be arranged in label bar 11, label bar 11
Wide and coca changes according to content automatically to accommodate full content, and label bar 11 is set in label area 1, and label bar 11 exceeds label area
1 part is hidden, and label bar 11 can be dragged to show the part being hidden in label area 1.
By Fig. 3, Fig. 4, Fig. 5, Fig. 6 it is found that label area 1 can be set at according to the demand of user content regions 2 top or
Lower part or side；User can setting screen it is vertical when label area 1 be located at the top or lower part of content regions 2, when screen level, is automatic
Variation is the side that label area 1 is located at content regions 2.
It is found that it can nested next layer of label area 3 and next layer of content regions 4 in content regions 2 by Fig. 7, Fig. 8, Fig. 9；Next layer
One layer of label bar 31 is set in label area 3, sets several next layer of labeling key 311 in next layer of label bar 31, in next layer
Hold in area 4 and sets several next floor containers 411 corresponding with next floor labeling key 311；Next layer of label area 3 may be provided in and label
The identical side in area 1, may be alternatively provided at the side opposite with label area 1；And so on, next layer of content regions 4 can also continue to nesting
Next layer of label area and content regions again.
As seen from Figure 1, Figure 2, when listening to labeling key 111 corresponding to the container 211 currently shown and being clicked, hold
Device 211 reloads the content of default.
As seen from Figure 1, Figure 2, when having just enter into system, only allow default show container loading content；Described in listening to
When labeling key 111 is clicked, if it is empty, container 211 loads the content of default to corresponding 211 content of container.
By Fig. 1 to Fig. 9 it is found that when listening to the labeling key 111 and being clicked, labeling key 111 is to label area 1
Central movement unless label bar 11 the edge that arrived label area 1 on one side.
By Fig. 2, Fig. 4 it is found that the content bar 21 rolled in the content regions 2 allows container 211 to be shown in content regions 2
When, the corresponding labeling key 111 of container 211 is to the central movement of label area 1 unless label bar 11 arrived label area 1 on one side
Edge.
When operating the key of this input method with mouse or other input equipments, the movement pressed is equivalent to finger touch
Movement, the movement lifted is equivalent to the movement that finger frames out, and mouse roller is equivalent to finger when rolling and slides up and down
The movement of object；This input method can make the response that above-mentioned movement corresponds to finger touch.
Compared with the prior art, the block form nested software design and programmed method of a kind of tape label of the present invention
Compared with the prior art, more multiple solutions can be shown and can easily be switched over, can not only retain interface content but also can fast quick-recovery
The flexible variation of default interface content, label area is more suitable for one-handed performance, particularly suitable for touch panel device operation system of software
Programming and programming, and due to by the way of nested, public action code, program are more simplified.
The present invention only illustrates some preferred embodiments in the present specification, is not to limit it.The professional technician
Design and spirit can make various variations or modification, such as addition key or monitoring hand in appearance according to the present invention
Gesture abstract factory area hides and display, other keys is arranged on the screen etc..Therefore these still should belong to protection of the invention
Range.
Claims (8)
1. the block form nested software design and programmed method of a kind of tape label, include the following steps:
1) label block (1), content regions (2) are set in user interface program, and label bar is set in label block (1)
(11)；
2) several labeling keys (111) of addition in label bar (11), while addition and labeling key in content regions (2)
(111) one-to-one several containers (211), container (211) default are in hidden state；
3) monitoring event is set, after labeling key (111) is clicked, is judged in the corresponding container of the labeling key (211) perhaps
Link whether there is, and if it does not exist, then sets the link of container (211) or loads the content of container default；Then sentence if it exists
Whether the disconnected container currently shown is to be clicked container (211) corresponding to labeling key (111)；
If 4) container currently shown is not to be clicked container (211) corresponding to labeling key (111), be clicked label by
The corresponding container (211) of key (111) becomes display state, and other containers become hidden state；The labeling key (111) being clicked
Center toward label block (1) is mobile, unless the edge of label bar (11) arrived the edge of label block (1)；
5) if the container currently shown is to be clicked the corresponding container (211) of labeling key (111), container (211) is brushed again
The setting link of new container (211) or the content of container default；
6) setting program default interface clicks the corresponding labeling key of container (211) where default interface with code simulation
(111), above-mentioned steps 3 are triggered) arrive step 5).
2. the block form nested software design and programmed method of tape label according to claim 1, it is characterised in that:
It is also provided with content bar (21) in content regions (2), several containers (211) are in uniline or single-row are arranged in content
In item (21)；When listening to labeling key (111) and being clicked, corresponding container (211) is rolled to content regions (2) center.
3. the block form nested software design and programmed method of tape label according to claim 1 or 2, feature exist
In: several labeling keys (111) in uniline or it is single-row be arranged in label bar (11), the width and coca evidence of label bar (11)
Content changes automatically to accommodate full content, and label bar (11) is set in label area (1), and label bar (11) exceeds label area (1)
Part be hidden, label bar (11) can be dragged to show the part being hidden in label area (1).
4. the block form nested software design and programmed method of tape label according to claim 1 or 2, feature exist
It can be set at the top or lower part or side of content regions (2) according to the demand of user in: the label area (1)；User can
Label area (1) is located at the top or lower part of content regions (2) when setting screen is vertical, and variation is label area automatically when screen level
(1) it is located at the side of content regions (2).
5. the block form nested software design and programmed method of tape label according to claim 1 or 2, feature exist
In: the content regions (2) are nested with next layer of label area (3) and next layer of content regions (4)；It is set in next layer of label area (3)
Next layer of label bar (31), next layer of label bar (31) is interior to set several next layer of labeling key (311), next layer of content regions
(4) several next layer of containers (411) corresponding with next layer labeling key (311) are set in；Next layer of label area (3) is located at and marks
Area (1) identical side is signed, or is located at the side opposite with label area (1)；And so on, next layer of content regions (4) can also be after
Continuous nested next layer of label area and content regions again.
6. the block form nested software design and programmed method of tape label according to claim 1 or 2, feature exist
In: when having just enter into system, only allow default show container loading content；It is clicked in the labeling key (111) for listening to described
When, if it is empty, container (211) loads the content of default to corresponding container (211) content.
7. the block form nested software design and programmed method of tape label according to claim 1 or 2, feature exist
In: when the labeling key (111) described in listening to is clicked, labeling key (111) is mobile to label area (1) center, unless
The edge that arrived label area (1) on one side of label bar (11).
8. the block form nested software design and programmed method of tape label according to claim 2, it is characterised in that: rolling
Move the content bar (21) in the content regions (2) allow container (211) be shown in content regions (2) it is interior when, container (211) is corresponding
The center of labeling key (111) to label area (1) is mobile, unless the edge that arrived label area (1) on one side of label bar (11).
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201610039394.0A CN105718265B (en) | 2016-01-21 | 2016-01-21 | A kind of the block form nested software design and programmed method of tape label |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201610039394.0A CN105718265B (en) | 2016-01-21 | 2016-01-21 | A kind of the block form nested software design and programmed method of tape label |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN105718265A CN105718265A (en) | 2016-06-29 |
| CN105718265B true CN105718265B (en) | 2019-10-11 |
Family
ID=56153691
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201610039394.0A Active CN105718265B (en) | 2016-01-21 | 2016-01-21 | A kind of the block form nested software design and programmed method of tape label |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN105718265B (en) |
Families Citing this family (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN108334321A (en) * | 2017-01-18 | 2018-07-27 | 阿里巴巴集团控股有限公司 | The presentation device of program code, method and device |
| CN109272337A (en) * | 2017-07-17 | 2019-01-25 | 阿里巴巴集团控股有限公司 | The generation method and relevant device of object tag |
| CN111625167B (en) * | 2020-05-28 | 2021-08-24 | 上海哔哩哔哩科技有限公司 | Page switching method and device and computer equipment |
| CN115080158B (en) * | 2021-03-12 | 2024-07-09 | Oppo广东移动通信有限公司 | Interface display method, device, terminal equipment and computer readable storage medium |
| CN113721801A (en) * | 2021-07-28 | 2021-11-30 | 北京达佳互联信息技术有限公司 | Material preview method, device, equipment and storage medium |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103488389A (en) * | 2013-07-05 | 2014-01-01 | 贝壳网际（北京）安全技术有限公司 | Page display method and device and browser device |
| CN104205098A (en) * | 2012-02-05 | 2014-12-10 | 苹果公司 | Navigating among content items in a browser using an array mode |
| CN104503763A (en) * | 2014-12-31 | 2015-04-08 | 深圳市航盛电子股份有限公司 | Android label page and realization method thereof |
| CN104571813A (en) * | 2014-12-12 | 2015-04-29 | 百度在线网络技术（北京）有限公司 | Information displaying method and device |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| EP2754004A4 (en) * | 2011-09-08 | 2015-08-19 | Double Verify Inc | System and method for enhanced interaction between an iframe or a web page and an embedded iframe from a different domain |
-
2016
- 2016-01-21 CN CN201610039394.0A patent/CN105718265B/en active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104205098A (en) * | 2012-02-05 | 2014-12-10 | 苹果公司 | Navigating among content items in a browser using an array mode |
| CN103488389A (en) * | 2013-07-05 | 2014-01-01 | 贝壳网际（北京）安全技术有限公司 | Page display method and device and browser device |
| CN104571813A (en) * | 2014-12-12 | 2015-04-29 | 百度在线网络技术（北京）有限公司 | Information displaying method and device |
| CN104503763A (en) * | 2014-12-31 | 2015-04-08 | 深圳市航盛电子股份有限公司 | Android label page and realization method thereof |
Also Published As
| Publication number | Publication date |
|---|---|
| CN105718265A (en) | 2016-06-29 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN105718265B (en) | A kind of the block form nested software design and programmed method of tape label | |
| CN103105995B (en) | Display packing and electronic equipment | |
| CN102662584B (en) | Multi-application execution method and mobile terminal | |
| CN102722334B (en) | The control method of touch screen and device | |
| CN102467318B (en) | Method and device for fast desktop switching of touch screen | |
| CN105210030B (en) | The automatic grouping of application widget | |
| CN103218138B (en) | Touch control terminal and application programe switch-over method thereof | |
| CN108205430B (en) | Double-screen mobile terminal, corresponding control method and storage medium | |
| CN103076973B (en) | A kind of windows switching method, system and intelligent terminal | |
| CN104049866B (en) | The implementation method and device of a kind of mobile terminal and its split screen | |
| CN101765236B (en) | Mobile terminal interface switching method and mobile terminal | |
| CN103218156A (en) | Method for realizing multi-Tab page switching and touch type mobile terminal thereof | |
| CN102736856A (en) | Method and device for selecting menu | |
| CN103106005A (en) | Method and device for arranging status bar icons of mobile appliance | |
| CN102707888B (en) | Terminal control method and terminal | |
| CN103902363A (en) | Electronic device supporting multiple-task switching and switching method | |
| CN103513912B (en) | A kind of interface switching method and device | |
| CN103546818A (en) | Method and device for focus control of list display interface of smart television | |
| CN102243573A (en) | Method and device for managing element attribute in application program | |
| CN102214067A (en) | Information processing apparatus | |
| CN103034452A (en) | Terminal and terminal controlling method | |
| CN105760102A (en) | Terminal interaction control method and device and application-program interaction control method | |
| CN104331244B (en) | The execution method of application program | |
| CN105094583A (en) | Quick operation method and apparatus for digital terminal with touch screen | |
| CN102880413B (en) | The method of the mobile terminal control display touching control screen for having and mobile terminal |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |