CN107066244A - The generation method and device of a kind of mobile terminal application interface - Google Patents
The generation method and device of a kind of mobile terminal application interface Download PDFInfo
- Publication number
- CN107066244A CN107066244A CN201611139006.2A CN201611139006A CN107066244A CN 107066244 A CN107066244 A CN 107066244A CN 201611139006 A CN201611139006 A CN 201611139006A CN 107066244 A CN107066244 A CN 107066244A
- Authority
- CN
- China
- Prior art keywords
- control
- viewing area
- data
- display
- client
- 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
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
- G06F9/452—Remote windowing, e.g. X-Window System, desktop virtualisation
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
- Digital Computer Display Output (AREA)
Abstract
The invention provides a kind of generation method of mobile terminal application interface and device.The generation method includes：Each cell view that display is needed in client is marked off into multiple viewing areas, each viewing area has one uniquely No. ID；The multiple data for needing to show on each cell view are read out from database when server receives the interface display request of client transmission, and reorganize the multiple data in a predetermined format and are then sent to client；Client receives and parses through out the data with predetermined format sended over from server end, and corresponding control is generated according to the control type of record, is included according to No. ID control by generation on corresponding viewing area.
Description
Technical field
The present invention relates to technical field of information processing, in particular to a kind of generation method of mobile terminal application interface
And device.
Background technology
In recent years, with the fast development of development of Mobile Internet technology, various intelligent mobile terminals are widely applied.More
Carry out more people by intelligent mobile terminal browse network resource, communicated, doings and shopping etc., this is the work of people
Make and life brings great convenience.However, mobile terminal device is due to disposal ability, stand-by time, screen size etc.
And application environment (operating system, network condition etc.) is very different with conventional personal computer (PC), although existed
The Internet resources of magnanimity, but most of these resources design exclusively for PC use.If directly using mobile terminal device
Access, effect is not satisfactory.Therefore, in order to meet mobile terminal device the characteristics of, Consumer's Experience is lifted, developer needs to be directed to
Different platform is developed, and primary interface development is the ring of most important of which one.
At present, in main flow smart mobile terminal platform (iOS and Android) exploitation, developer is carried using platform
The basic control construction mobile terminal application interface supplied, and carry out data biography using the data format arranged in advance with server end
It is defeated, so that client is used.But because the design details of application interface varies, and the basic control of system can only provide spy
Fixed basic function, this is accomplished by developer for specific interface to write GUI code.But in fact, in order to
The continuity and uniformity of Consumer's Experience, most interface (outward appearance layout, mode of operation etc.) all has phase in
When the similitude of degree, this can produce a large amount of codes substantially repeated in software development.
Fig. 1 a-d are the sectional drawing example of existing APP application interfaces.Fig. 1 a are to provide one of the APP application interfaces of take-away
Sectional drawing example, Fig. 1 b are to provide a sectional drawing example of the APP application interfaces of KTV information, and Fig. 1 c are to provide cinema's information
One sectional drawing example of APP application interfaces, Fig. 1 d are to provide a sectional drawing example of the APP application interfaces of lodging information, from this 4
Width sectional drawing can be seen that this 4 application interfaces are designed with similitude but had differences, it is therefore desirable to which developer applies to this 4
GUI code is write at interface respectively, and this will produce a large amount of codes substantially repeated.This can provide a variety of disappear for a
For the APP products of charge information, such as certain money can provide cuisines, film, hotel, take-away, amusement and recreation, KTV, spend a holiday out
There is provided different information for row, air ticket/train ticket, sight spot, sport and body-building, Training and Learning etc. the APP products of much information
Application interface designs having differences property, it is necessary to write GUI code respectively to these different application interfaces.
In addition, if a plurality of information shown on an application interface is if there is the difference on display format, it is necessary to
Information to different display format individually writes display code, although such case is rarely found in practice, because this needs to compile
The duplicated code amount write can be very big.
When developing a APP products, when the APP of shopping online can be especially provided, different application interface is distinguished
GUI code is write, and a large amount of codes substantially repeated can be produced, the exploitation on application is caused series of negative to influence by this,
Such as development efficiency reduction, code cubage increase, debugging maintenance difficulty.
The content of the invention
It is an object of the invention to provide a kind of generation method of cell view on application interface and device and
The generation method and device of thus obtained mobile terminal application interface, the problem of to improve above-mentioned.
The embodiments of the invention provide a kind of generation method of the cell view on application interface, it is characterised in that
Including：
Each cell view that display is needed in client is marked off into multiple viewing areas, each viewing area has one
Individual unique No. ID；
When server receives the interface display request of client transmission each cell view is read out from database
The upper multiple data for needing to show, and reorganize the multiple data in a predetermined format and be then sent to client, wherein often
One data correspondence, one viewing area, the predetermined format at least includes：Id field, type fields and value fields, wherein should
Id field is used to preserve No. ID, and the type fields are used for the type for preserving control, and the value fields, which are used to preserve, needs what is shown
Data content；
Client receives and parses through out the data with predetermined format sended over from server end, according to the control of record
Part type generates corresponding control, is included according to No. ID control by generation on corresponding viewing area.
It is preferred that, in the step of each cell view that display is needed in client is marked off into multiple viewing areas,
Multiple viewing areas are marked off according to the design requirement of display is needed on cell view, and each viewing area has relatively
Positional information.
It is preferred that, in the step of reorganizing the multiple data in a predetermined format, on each cell view
The number of data object for needing multiple data of display to be re-organized into an array form, one of array is equal to
Or less than the number for the viewing area for marking off a cell view.
It is preferred that, the predetermined format also includes：Name fields and/or action fields, wherein the name fields are used
In verification of the title and realization for describing divided viewing area to No. ID, the action fields are used to describe the dynamic of control
Make.
It is preferred that, control type includes but is not limited to：Image control, text control and button control.
It is preferred that, when the number of the data object in an array is less than the viewing area for marking off a cell view
Number when, the control location shown on viewing area can change according to rules self-adaptive is pre-designed.
It is preferred that, the rule that is pre-designed adaptively changed includes：Shown control location is with preferentially to left-hand
Upper or preferential upward rules self-adaptive to the right changes.
It is preferred that, the rule that is pre-designed adaptively changed also includes：The alignment rule of shown control location.
It is preferred that, the rule that is pre-designed adaptively changed also includes：In the control for specifying orientation to place specified type
The rule of part.
The embodiment of the present invention additionally provides a kind of generation method of mobile terminal application interface, and it includes：Use as above institute
The method stated generates one or more cell views.
The embodiment of the present invention additionally provides a kind of generating means of the cell view on application interface, and its feature exists
In it includes：
Division unit, for each cell view that display is needed in client to be marked off into multiple viewing areas, each
Viewing area all has one uniquely No. ID；
Control is generated and display unit, has predetermined format for receiving and parsing through out from what server end was sended over
Data, corresponding control is generated according to the control type of record, is included according to No. ID control by generation in corresponding viewing area
On, one viewing area of each of which data correspondence, the predetermined format at least includes：Id field, type fields and value words
Section, the wherein id field are used to preserve No. ID, and the type fields are used for the type for preserving control, and the value fields are used to preserve
Need the data content of display.
It is preferred that, read out each unit from database when server receives the interface display request of client transmission
Multiple data of display are needed on lattice view, and reorganizes the multiple data in a predetermined format and is then sent to client.
Client can send these data to control generation and display unit.
It is preferred that, the division unit is used for multiple to mark off according to the design requirement for needing to show on cell view
Viewing area, and each viewing area has relative position information.
It is preferred that, need multiple data of display to be re-organized into an array shape on each cell view
The number of data object in formula, one of array is equal to or less than for the viewing area for marking off a cell view
Number.
It is preferred that, the predetermined format also includes：Name fields and/or action fields, wherein the name fields are used
In verification of the title and realization for describing divided viewing area to No. ID, the action fields are used to describe the dynamic of control
Make.
It is preferred that, control type includes but is not limited to：Image control, text control and button control.
It is preferred that, when the number of the data object in an array is less than the viewing area for marking off a cell view
Number when, the control location shown on viewing area can change according to rules self-adaptive is pre-designed.
It is preferred that, the rule that is pre-designed adaptively changed includes：Shown control location is with preferentially to left-hand
Upper or preferential upward rules self-adaptive to the right changes.
It is preferred that, the rule that is pre-designed adaptively changed also includes：The alignment rule of shown control location.
It is preferred that, the rule that is pre-designed adaptively changed also includes：In the control for specifying orientation to place specified type
The rule of part.
The embodiment of the present invention additionally provides a kind of generating means of mobile terminal application interface, and it includes：As described above
The generating means of cell view.
The embodiment of the present invention additionally provides a kind of generation system of mobile terminal application interface, and it includes：Client kimonos
Business device,
The client includes the generating means of mobile terminal application interface as described above；
The server is used for the interface display request that customer in response end is sent, and each cell view is read out from database
The upper multiple data for needing to show, and reorganize the multiple data in a predetermined format and be then sent to client.
It is preferred that, when the server is additionally operable to reorganize the multiple data in a predetermined format, according to described advance
Design rule is to corresponding data distribution ID and is stored in id field to ensure that the data content shown on viewing area is accorded with
Close design requirement.
According to the generation method of the cell view on application interface of the present invention and device and thus obtained shifting
The generation method and device and system at dynamic terminal applies interface, can constitute a unit by the multiple control displays of dynamic generation
Lattice view, this, which allows for different types of control location, actively to exchange without writing GUI code again to realize difference
The cell view of display is laid out, so that GUI code can be sufficiently multiplexed, Structural application circle is greatly reduced
The size of code in face, improves development efficiency, reduces exploitation and the cost safeguarded.
Brief description of the drawings
Fig. 1 a-d are the sectional drawing examples for the APP application interfaces realized according to prior art；
Fig. 2 is the schematic sectional drawing example that a cell view is marked off to multiple viewing areas of the present invention.
Fig. 3 is another schematic sectional drawing example that a cell view is marked off to multiple viewing areas of the present invention；
Fig. 4 is the flow chart of the generation method of the cell view on application interface of the present invention；
Fig. 5 is the schematic block diagram of the generating means of the cell view on application interface of the present invention.
Fig. 6 is the schematic block diagram of the generation system of the mobile terminal application interface of the present invention.
Embodiment
Below in conjunction with the embodiment of the present invention and accompanying drawing, the technical scheme in the embodiment of the present invention is carried out clear, complete
Ground is described, it is clear that described embodiment is only a part of embodiment of the invention, rather than whole embodiments.Generally herein
The component of the embodiment of the present invention described and illustrated in place's accompanying drawing can be arranged and designed with a variety of configurations.Therefore,
The detailed description of the embodiments of the invention to providing in the accompanying drawings is not intended to limit the model of claimed invention below
Enclose, but be merely representative of the selected embodiment of the present invention.Based on embodiments of the invention, those skilled in the art are not making
The every other embodiment obtained on the premise of creative work, belongs to the scope of protection of the invention.
Before description technical scheme, first simply introduce in the application interface exploitation that will be related to herein
Some knowledge and terms used herein.
The operating system of the intelligent mobile terminal of existing market main flow is Android (Android) system and IOS systems, movement
The various interfaces shown in terminal are generated using the control under corresponding system.ListView controls are in Android system
One of conventional control at various interfaces shown on lower exploitation mobile terminal, UITableView controls are moved in IOS system developments
One of conventional control at various interfaces shown in dynamic terminal.Application interface exploitation is briefly explained by taking IOS systems as an example below.
UITableView is used for display data in table form.Data only have capable concept in UITableView,
The concept not arranged, due to the screen size problem of mobile terminal, the screen of especially smart mobile phone is small, in small-size screen
Upper display multiple row is detrimental to operation.UITableView is used for showing the visible part of form, and UITableViewCell
For showing a line of form, when all UITableView are realized actually only have a row, but can be by
Sub- view is added in UITableViewCell so that it appears to have several row.
Each row of data is all a UITableViewCell in UITableView, and in terms of presentation of information, for example
One sectional drawing example of the APP application interfaces that take away service available shown in Fig. 1 a a, business information shown can include multiple
Data content, such as picture, firm name, star, sales volume, distance, price, discount etc., and one comprising the plurality of
The business information of data content is data line in UITableView, i.e., completed by control UITableViewCell to one
The programming of business information of the bar comprising multiple data contents is more in order to show in this control so that it is shown on screen
Information, IOS set multiple child controls so that developer uses inside it, such as one UIView control
(contentView is used as father's control of other elements), two UILable controls (textLabel,
DetailTextLabel), a UIImage control (imageView), is respectively used to container, display content, details and picture.
In addition, from shown in Fig. 1 a-1d example come intuitively watch, it is also seen that be all with behavior unit display information,
Listed in the way of a line shows an information, such as Fig. 1 a example shows 4 business informations that take away service available, Fig. 1 b
Example 4 offer KTV business informations are provided, Fig. 1 c example shows the business informations of 5 offer cinemas, Fig. 1 d
Example show 4 business informations accommodated.
In interface display development field, those skilled in the art are generally by with each row of tabular form display data
Unit is referred to as a cell or Cell.The presentation of information carried out on mobile terminal screen with row unit is properly termed as unit
Lattice view.As mentioned above, the APP products of consumption category information are for example being provided, can with the business information that row unit is shown
Combined with the arrangement comprising multiple data contents, the plurality of data content and then form the abundant cell view of form.For example,
The full detail on such as " fresh fruit time (west outer shop) " shown in Fig. 1 a is to show in a cell view, Fig. 1 b
On for example " rich and honour city ktv " full detail is to show in cell view, Fig. 1 c on such as " Poly world shadow
The full detail in city (apple orchard shop) " is to show in cell view, Fig. 1 d on such as " ten thousand Cheng Xin moisten hotel "
Full detail is a cell view.
The technical scheme told about herein below will be related to above-mentioned terms unit lattice and cell view.
Below in conjunction with the drawings and specific embodiments of the present invention, technical scheme is carried out clearly and completely
Description.
As previously described, it can be seen that this 4 application interfaces are designed with similitude but deposited from the sectional drawing shown in Fig. 1 a-1d
In difference, according to existing technology, it is necessary to which developer writes GUI code respectively to this 4 application interfaces, this will be produced
The code largely substantially repeated so that development efficiency reduction, code cubage increase.
The present invention proposes a new mentality of designing to this.Fig. 2 is the marking off a cell view of the present invention
The signal sectional drawing example of multiple viewing areas.According to Fig. 2, a cell view is needed into many of display on application interface
Individual data (such as picture, text, icon, rich text) split into multiple viewing areas, and unique ID is assigned to each viewing area
Number, read out when server receives the interface display request of client transmission from database needs on each cell view
Multiple data of display, and the multiple number is reorganized with the pre-set predetermined format of client and server end both sides
According to client is then sent to, the predetermined format at least includes：The data that No. ID, the control type to be generated and needs are shown,
Client is received and parsed through out after the data with predetermined format sended over from server end, according to the control type of record
Corresponding control is generated, and is included according to No. ID control by generation on corresponding viewing area, so as to constitute a list
First lattice view, multiple cell view+toolbars etc. constitute a complete application interface.The advantage of this new method is
Various types of controls can be appeared on any viewing area with dynamic generation and according to pre-designed requirement, and this allows for inhomogeneity
The control location of type can be exchanged actively without being realized by writing code again, and so a set of GUI code can be obtained
Sufficiently multiplexing to show the cell views of different layouts, which thereby enhance development efficiency, reduce exploitation and safeguard into
This.
Fig. 4 is the flow chart of the generation method of the cell view on application interface of the present invention.As shown in figure 4, this
The generation method of the cell view on application interface of invention comprises the following steps：
S1：Each cell view that display is needed in client is marked off into multiple viewing areas, each viewing area has
There is one uniquely No. ID.
Specifically, the cell view that we generally see on mobile terminals, although in theory can only display one
Item content, i.e. only one of which viewing area, but such case is very rare in practice, is also just only provided with the one of display scrolling news
Part news website, such as www.xinhuanet.com, moreover it is possible to see a cell view and show a scrolling information.And many news websites
The interface of the scrolling display news provided, every news (a cell view) is except one simplified summary (text) of display
Outside, there is the time (time that i.e. this news is issued on the web site) in the small size word of lower section display of text, and to this
Multinomial information is shown on the cell view of the number of reviews of bar news, i.e., one.
In order to attract the attention of user, APP interface is very important, and letter is provided on a cell view
Clean and more information amount interface layout is to need designer to spend many painstaking effort to design.Sectional drawing as shown in Fig. 1 a-d
Shown is all different there is provided the interface of the whole application interface of different information and a cell view of subdivision.In addition,
Though not shown here, even if but it is known that being to provide answering for the APP products designed by the different company of same services
Be also with interface it is different, for example provide tourist service ctrip.com's client and go where net client.
In addition, as shown in Fig. 1 a-d, a cell view includes multiple display contents.Cut with the interface shown in Fig. 1 a
Trade name shown in figure is exemplified by " fresh fruit time ", the cell view shows：Picture, trade name：" the fresh fruit time, (west was outer
Shop) ", star：" ☆ ☆ ☆ ☆ ☆ ", sales volume：" moon pin 562 ", the time：" 30 minutes ", distance：" 436 meters ", rise and send valency：
" $20 rises and sent ", freight charges：" $0 dispatchings ", other information etc..The information shown with other 3 shops is compared, and there are some differences,
Such as trade name also show " invoice " information and discount information for the cell view of " De Keshi ", and trade name is " Burger King "
Cell view then also show " must reach on time " and " hummingbird special delivery " information.
Above said content illustrates that programming personnel is before development and application interface, even one cell view interface
Interface personnel are needed to design different interface layouts according to the market demand.Therefore, in a preferred embodiment, inciting somebody to action
Needed in client in the step of each cell view of display marks off multiple viewing areas, according to needs on cell view
The design requirement of display marks off multiple viewing areas, and each viewing area has relative position information.I.e. cell is regarded
The design requirement that display is needed on figure is exactly that different presentation of information layouts are designed according to the market demand.
From example shown in Fig. 2 can be seen that by needed in client display each cell view marked off it is multiple
Viewing area, each viewing area has one uniquely No. ID.In addition, the layout of multiple viewing areas can be related to each other
Azimuth information, so each viewing area also has relative position information.
S2：Each cell is read out when server receives the interface display request of client transmission from database to regard
Multiple data of display are needed on figure, and reorganizes the multiple data in a predetermined format and is then sent to client, wherein
One viewing area of each data correspondence, the predetermined format at least includes：Id field, type fields and value fields, wherein
The id field is used to preserve No. ID, and the type fields are used for the type for preserving control, and the value fields, which are used for preservation, needs display
Data content.
The information shown on current various APP application interfaces is all to change in real time, is generally required for a client
End and a server.Client is arranged on the mobile terminal that user possesses, and the general clothes by providing APP products of server
Business business's management, waits the requirement from client, processing requirement and returned results, so shown on the interface of APP clients
Information is all stored on server, and client is sent in real time by network.
In order to be able to be achieved technical scheme, it is necessary to carry out record data object using new data format.
So, just read out each cell view from database when server receives the interface display request of client transmission
The upper multiple data for needing to show, and reorganize the multiple data in a predetermined format and be then sent to client, and it is each
Individual data need one viewing area of correspondence, and the predetermined format at least includes：Id field, type fields and value fields, its
In the id field be used to preserve No. ID, the type fields are used to preserving the type of control, the value fields be used to preserve need it is aobvious
The data content shown.The control type includes but is not limited to：Image control, text control and button control.Currently known
The various control types shown on application interface can be recorded in type fields.In addition, institute more multi-functional in order to realize
Stating predetermined format can also include but is not limited to：Name fields and/or action fields, wherein the name fields are used to describe
Verification of the title and realization of the viewing area divided to No. ID, the action fields are used for the action for describing control.Ability
Field technique personnel both know about, and for data format, can supplement other control fields to realize phase according to actual needs completely
The demand answered, is just no longer listed one by one here.
It is to need to show on first module lattice view in order to distinguish which data, which data is needed the
On two cell views show ... ... etc., one it is preferable that：The multiple of display are needed on each cell view
Data are re-organized into an array form.In addition, as mentioned above, being needed according to design by a cell view
Multiple viewing areas are marked off, are actually not the necessary display content in the viewing area each marked off, as example from above illustrates
As：Trade name also show " invoice " information and discount information for the cell view of " De Keshi ", and trade name is " during fresh fruit
Between " cell view do not show, but interface layout design in need to design viewing area as much as possible for not
Its personalized service that can be provided is shown with businessman, the data that thus be accordingly used in the array that a cell view is shown
The number of object can be equal to or less than the number for the viewing area for marking off a cell view.It is data under normal circumstances
The number of object is less than the number of viewing area, because the number of the viewing area marked off is designed using redundancy thinking.Fig. 3 is
Another signal sectional drawing example that a cell view is marked off to multiple viewing areas of the present invention.Can from example shown in Fig. 3
To find out, the number of the data object of display is less than No. ID divided in the number of the viewing area marked off, layout designs and is
1009-1011 viewing area is hidden due to no data display, is indicated by the dashed box.
In brief, in a preferred embodiment, multiple data quilts of display are needed on each cell view
The number for the data object being reorganized into an array form, one of array, which is equal to or less than, regards a cell
The number for the viewing area that figure is marked off.
Conventional data format has at present：JSON, XML and HTML.XML and JSON forms are all retouched using structural method
Data are stated, are suitable for using in the present invention.Here it is used to show there is provided one by taking the data object using JSON structures as an example
The data object example in area.
One data object example for being used for viewing area is as follows：
It can be seen that by this data object example and one generated on one No. ID position for 1001 viewing area
Button control, No. ID is the entitled of 1001 viewing area：Tel (phone), the action of the button control, which is to provide, calls,
Phone number is：010-88888888.
In one cell view often include multiple viewing areas, then in code is write multiple data objects with array form
Preserve and transmit, this is easily achieved for a person skilled in the art, no longer illustrates.
S3：Client receives and parses through out the data with predetermined format sended over from server end, according to record
Control type generate corresponding control, included according to No. ID control by generation on corresponding viewing area.
When user triggers demand, user end to server sends request, and server is connected to after request and handled and by phase
Close data and be sent to client.User's triggering demand is determined by the specific logic of client.For example when can be opening APP,
When can also be some module of opening, or when triggering some condition.
Parsed after client is received from the data with predetermined format that server end is sended over, according to
The field of agreement reads corresponding data, and (array, key-value pair or self-defined structure) is stored in locally in the form of structuring.
By taking above-mentioned domain_list structures as an example.During parsing, preserved with array (NSArray) in the JSON arrays, array
Each domain data objects with dictionary (NSDictionary) form preserve.
Then it is necessary to generate cell view according to the data parsed, that is, the array (NSArray) is traveled through,
Corresponding control is generated according to the control type recorded in the type fields of each domain data objects, remembered according in id field
No. ID control by generation of record is included on corresponding viewing area, and the content that control is shown is what is recorded in value fields
Need the data of display.
In order that the layout of the cell view of generation is attractive in appearance, neat, in a preferred embodiment, when in an array
The number of data object when being less than the number for the viewing area for marking off a cell view, the control shown on viewing area
Position can change according to rules self-adaptive is pre-designed.Specifically, it is as discussed above, because the viewing area marked off
Number be to be designed using redundancy thinking, and it is endless to provide the information that the businessman of different services shows on cell view
It is complete the same, in terms of the information of businessman's issue shown in one of Fig. 1 a and Fig. 1 b-d, the letter of the cell view shown in every width sectional drawing
Breath layout is all not exclusively the same, if Fig. 1 a GUI code can be multiplexed on Fig. 1 b-d interface, then for showing
The control location shown on the viewing area of information cannot immobilize, and the control location shown on viewing area is required to basis
Rules self-adaptive variation is pre-designed, i.e., the control of dynamic generation can adaptively change according to pre-designed movement rule
The position of oneself.
In a preferred embodiment, the rule that is pre-designed adaptively changed includes：Shown control location
With preferentially to the left upwards or preferential upward rules self-adaptive to the right changes.Below with shown control location with preferentially to
Exemplified by rules self-adaptive on left-hand changes, the rule is briefly described.That is, when the control of generation finds that the viewing area on the left of it does not have
There is automatic be moved to the left during display control to fill up corresponding display zone position, when the control of generation finds that the viewing area above it does not have
It is automatically moved up filling up corresponding display zone position when having display control., can be first to moving to left and then again according to design rule
, can also be first to moving up and then again to moving to left to moving up.Shown control location is with preferentially upward rules self-adaptive to the right
The method of variation is identical with this, is not repeating.
In a further advantageous embodiment, the rule that is pre-designed adaptively changed also includes：Shown control
The alignment rule of position.The alignment rule can be left-justify, Right Aligns or two ends alignment, can also provide with multirow
Certain one or more columns per page left-justify of viewing area or Right Aligns or two ends alignment.For example, the text message shown in Fig. 1 a is shown, right side
Align right, left side is close to picture to left-justify.
In a further advantageous embodiment, the rule that is pre-designed adaptively changed also includes：Put in specified orientation
Put the rule of the control of specified type.For example, the custom browsed according to consumer, it is possible to specify the left side of cell view is shown
Area, which is fixed, shows a pictures, and name of firm, which is fixed, to be included in top middle portion, as shown in Fig. 1 a, Fig. 1 c and Fig. 1 d.Also
Can be according to the custom browsed, button control, which is fixed, to be included in bottom position.
Above-mentioned three preferred embodiments for being pre-designed rule adaptively changed can be combined together, that is, be shown
The control location shown with preferentially to the left upwards or preferential upward rules self-adaptive to the right change, shown control location
The rule of alignment rule and the control for placing specified type in specified orientation can be combined together.
The property value of the control generated can be preset.For example, the size of control is also to be defined by design requirement, than
The interval between interval, control between such as the size of picture, the font size of word, per a line is in accordance with design requirement demarcation
's.The font size being such as labelled with a word control is 20pt, then the height of the control is exactly 20pt, and the length of the control
Degree is determined by the length of word (if beyond border with ... show), can so ensure the accurate of imposition layout.
In addition, in a further advantageous embodiment, in order to ensure the Data Position that cell view is shown is that trade company is expected
, so that the trade name shown in the interface sectional drawing shown in Fig. 1 a is " fresh fruit time " as an example, the left side display figure of the cell view
" ☆ ☆ ☆ ☆ ☆ " are below text 1, " the moon pin 562 of text 3 in top, text 2 for piece, text 1 " fresh fruit time (west outer shop) "
Pen " is gone together with text 2, text 4 " 30 minutes " below text 2, text 5 " 436 meters " and text 4 are gone together, the " $20 of text 6 rises
Send " gone together with text 1 and right alignment, the " $0 of text 7 are dispensed " go together and right alignment with text 2, except on the client
Outside the control location shown on viewing area can change according to rules self-adaptive is pre-designed, server end is in a predetermined format
When reorganizing multiple data that display is needed on each cell view read from database, in addition it is also necessary to according to described advance
Design rule is to corresponding data distribution appropriate No. ID and is stored in id field to ensure the data shown on viewing area
Content meets the design requirement, is especially being pre-designed the rule that rule is included in the control of specified orientation placement specified type
When then, so that the trade name shown in the interface sectional drawing shown in Fig. 1 a is " fresh fruit time " as an example, No. ID to picture distribution will be with a left side
No. ID of side viewing area consistent, No. ID one of No. ID distributed to text 1 " fresh fruit time (the outer shop in west) " and top viewing area
Cause, rise and send to the " $20 of text 6 " No. ID of distribution be located at top and text 1 ID right positions viewing area ID
It is number consistent ... that by that analogy, to avoid the occurrence of such as text 2, " ☆ ☆ ☆ ☆ ☆ " are in text 1 " fresh fruit time (the outer shop in west) "
The mistake that top is shown.
The embodiment of the present invention additionally provides a kind of generation method of mobile terminal application interface, and it includes：Using as above institute
The generation method for the cell view stated generates one or more cell views.The sectional drawing shown in Fig. 1 a-1d, one
Status bar, navigation bar, main menu bar, multiple cell views on content area etc. are contained on mobile terminal application interface,
And status bar, navigation bar, main menu bar are essentially all identical and immobilized, and multiple cells on content area are regarded
Figure is because the information type of display is different and designs different interface layouts and shows.In one embodiment, in the movement
In the generation method at terminal applies interface, status bar, navigation bar, main menu bar etc. can be using existing method generations, using such as
The generation method of described cell view is gone up to generate one or more cell views.In another embodiment, described
In the generation method of mobile terminal application interface, status bar, navigation bar, main menu bar, multiple cells on content area are regarded
Figure etc. generates one or more cell views using the generation method of cell view as described above.
According to the generation method and thus obtained mobile terminal of the cell view on application interface of the present invention
The generation method of application interface, can constitute a cell view, this is allowed for not by the multiple control displays of dynamic generation
The control location of same type can actively be exchanged without writing GUI code again to realize the cell of different layout displays
View, so that GUI code can be sufficiently multiplexed, greatly reduces the size of code at Structural application interface, improves
Development efficiency, reduces exploitation and the cost safeguarded.
Fig. 5 is the schematic block diagram of the generating means of the cell view on application interface of the present invention.Such as Fig. 5 institutes
Show, the generating means of the cell view of the invention on application interface, it is characterised in that it includes：
Division unit, for each cell view that display is needed in client to be marked off into multiple viewing areas, each
Viewing area all has one uniquely No. ID；
Control is generated and display unit, has predetermined format for receiving and parsing through out from what server end was sended over
Data, corresponding control is generated according to the control type of record, is included according to No. ID control by generation in corresponding viewing area
On, one viewing area of each of which data correspondence, the predetermined format at least includes：Id field, type fields and value words
Section, the wherein id field are used to preserve No. ID, and the type fields are used for the type for preserving control, and the value fields are used to preserve
Need the data content of display.
Wherein, each cell is read out from database when server receives the interface display request of client transmission
Multiple data of display are needed on view, and reorganizes the multiple data in a predetermined format and is then sent to client.Visitor
Family end can send these data to control generation and display unit.
Wherein, the division unit is used to mark off multiple show according to the design requirement of display is needed on cell view
Show area, and each viewing area has relative position information.
Wherein, multiple data of display are needed to be re-organized into an array form on each cell view,
The number of data object in one of array is equal to or less than the number for the viewing area for marking off a cell view.
Wherein, the predetermined format also includes：Name fields and/or action fields, wherein the name fields are used for
Verification of the title and realization of the divided viewing area of description to No. ID, the action fields are used for the action for describing control.
Wherein, the control type includes but is not limited to：Image control, text control and button control.
Wherein, when the number of the data object in an array is less than the viewing area for marking off a cell view
During number, the control location shown on viewing area can change according to rules self-adaptive is pre-designed.
Wherein, the rule that is pre-designed adaptively changed includes：Shown control location is with preferentially upward to the left
Or preferential upward rules self-adaptive to the right changes.
Wherein, the rule that is pre-designed adaptively changed also includes：The alignment rule of shown control location.
Wherein, the rule that is pre-designed adaptively changed also includes：In the control for specifying orientation to place specified type
Rule.
Wherein, shown control location with preferentially to the left upwards or preferential upward rules self-adaptive to the right change,
The rule of the alignment rule of shown control location and the control for placing specified type in specified orientation can exist in any combination
Together.
The embodiment of the present invention additionally provides a kind of generating means of mobile terminal application interface, and it includes：As described above
The generating means of cell view.
Fig. 6 is the schematic block diagram of the generation system of the mobile terminal application interface of the present invention.As shown in fig. 6, of the invention
The generation system of mobile terminal application interface include：Client and server,
The client includes the generating means of mobile terminal application interface as described above；
The server is used for the interface display request that customer in response end is sent, and each cell view is read out from database
The upper multiple data for needing to show, and reorganize the multiple data in a predetermined format and be then sent to client.
In a preferred embodiment, the server is additionally operable to reorganizing the multiple data in a predetermined format
When, according to it is described be pre-designed rule to corresponding data distribution ID and be stored in id field with ensure on viewing area show
The data content shown meets design requirement.
It is apparent to those skilled in the art that, for convenience and simplicity of description, the device of foregoing description
Specific work process, may be referred to the corresponding process in preceding method embodiment, will not be repeated here.
According to the generating means and thus obtained mobile terminal of the cell view on application interface of the present invention
The generating means and system of application interface, can constitute a cell view, this is just by the multiple control displays of dynamic generation
Different types of control location is actively exchanged without writing GUI code again to realize different layout displays
Cell view, so that GUI code can be sufficiently multiplexed, greatly reduces the size of code at Structural application interface,
Development efficiency is improved, exploitation and the cost safeguarded is reduced.
In addition, when data are transmitted between clients and servers, can use HTTP transport protocol, FTP host-host protocols,
HTTPS host-host protocols etc.；Can be with ASCII fromat, Base64 forms etc. to data encoding.These are all skills well known in the art
Art, no longer does excessive introduction.
The computer program product of the generation method for the mobile terminal application interface that the embodiment of the present invention is provided, including deposit
The computer-readable recording medium of program code is stored up, the instruction that described program code includes can be used for performing previous methods implementation
Method described in example, implements and can be found in embodiment of the method, will not be repeated here.
If the function is realized using in the form of SFU software functional unit and is used as independent production marketing or in use, can be with
It is stored in a computer read/write memory medium.Understood based on such, technical scheme is substantially in other words
The part contributed to prior art or the part of the technical scheme can be embodied in the form of software product, the meter
Calculation machine software product is stored in a storage medium, including some instructions are to cause a computer equipment (can be individual
People's computer, server, or network equipment etc.) perform all or part of step of each of the invention embodiment methods described.
And foregoing storage medium includes：USB flash disk, mobile hard disk, read-only storage (ROM), random access memory (RAM), magnetic disc or
Person's CD etc. is various can be with the medium of store program codes.
The foregoing is only a specific embodiment of the invention, but protection scope of the present invention is not limited thereto, any
Those familiar with the art the invention discloses technical scope in, change or replacement can be readily occurred in, should all be contained
Cover within protection scope of the present invention.Therefore, protection scope of the present invention should be based on the protection scope of the described claims.
Claims (23)
1. a kind of generation method of cell view on application interface, it is characterised in that including：
Each cell view that display is needed in client is marked off into multiple viewing areas, each viewing area has one only
No. ID of one；
Read out when server receives the interface display request of client transmission from database needs on each cell view
The multiple data to be shown, and reorganize the multiple data in a predetermined format and be then sent to client, each of which
One viewing area of data correspondence, the predetermined format at least includes：Id field, type fields and value fields, wherein the ID words
Section is used to preserve No. ID, and the type fields are used for the type for preserving control, and the value fields are used to preserve the data for needing to show
Content；
Client receives and parses through out the data with predetermined format sended over from server end, according to the control class of record
Type generates corresponding control, is included according to No. ID control by generation on corresponding viewing area.
2. generation method according to claim 1, it is characterised in that each cell of display will be being needed in client
In the step of view marks off multiple viewing areas, marked off according to the design requirement of display is needed on cell view multiple aobvious
Show area, and each viewing area has relative position information.
3. generation method according to claim 1, it is characterised in that reorganizing the multiple data in a predetermined format
The step of in, needed on each cell view display multiple data be re-organized into an array form, wherein
The number of data object in one array is equal to or less than the number for the viewing area for marking off a cell view.
4. generation method according to claim 1, it is characterised in that the predetermined format also includes：Name fields and/or
Action fields, wherein the name fields are used for the title for describing divided viewing area and realize the verification to No. ID, institute
State the action that action fields are used to describe control.
5. generation method according to claim 1, it is characterised in that the control type includes but is not limited to：Image control
Part, text control and button control.
6. generation method according to claim 3, it is characterised in that when the number of the data object in an array is less than
During the number for the viewing area that one cell view is marked off, the control location shown on viewing area can be according to being pre-designed
Rules self-adaptive changes.
7. generation method according to claim 6, it is characterised in that it is described adaptively change be pre-designed regular bag
Include：Shown control location is with preferentially to the left upwards or preferential upward rules self-adaptive to the right changes.
8. generation method according to claim 7, it is characterised in that the rule that is pre-designed adaptively changed is also wrapped
Include：The alignment rule of shown control location.
9. the generation method according to one of claim 6-8, it is characterised in that it is described adaptively change be pre-designed rule
Then also include：In the rule for the control for specifying orientation placement specified type.
10. a kind of generation method of mobile terminal application interface, it includes：Using the method as described in one of claim 1-9
Generate one or more cell views.
11. the generating means of a kind of cell view on application interface, it is characterised in that it includes：
Division unit, for each cell view that display is needed in client to be marked off into multiple viewing areas, each display
Area all has one uniquely No. ID；
Control is generated and display unit, for receiving and parsing through out the number with predetermined format sended over from server end
According to, corresponding control is generated according to the control type of record, included according to No. ID control by generation on corresponding viewing area,
One viewing area of each of which data correspondence, the predetermined format at least includes：Id field, type fields and value fields,
Wherein the id field is used to preserve No. ID, and the type fields are used for the type for preserving control, and the value fields, which are used to preserve, to be needed
The data content of display.
12. generating means according to claim 11, it is characterised in that when server receives the interface of client transmission
Being read out during display request from database needs multiple data of display on each cell view, and group again in a predetermined format
Knit the multiple data and be then sent to client.
13. generating means according to claim 11, it is characterised in that the division unit is used for according to cell view
The upper design requirement for needing to show marks off multiple viewing areas, and each viewing area has relative position information.
14. generating means according to claim 11, it is characterised in that display is needed on each cell view
The number that multiple data are re-organized into the data object in an array form, one of array is equal to or less than one
The number for the viewing area that individual cell view is marked off.
15. generating means according to claim 11, it is characterised in that the predetermined format also includes：Name fields and/
Or action fields, wherein the name fields are used for the title for describing divided viewing area and realize the verification to No. ID,
The action fields are used for the action for describing control.
16. generating means according to claim 11, it is characterised in that the control type includes but is not limited to：Image
Control, text control and button control.
17. generating means according to claim 11, it is characterised in that when the number of the data object in an array is small
When the number for the viewing area for marking off a cell view, the control location shown on viewing area can be according to setting in advance
Rules self-adaptive is counted to change.
18. generating means according to claim 11, it is characterised in that it is described adaptively change be pre-designed regular bag
Include：Shown control location is with preferentially to the left upwards or preferential upward rules self-adaptive to the right changes.
19. generating means according to claim 17, it is characterised in that the rule that is pre-designed adaptively changed is gone back
Including：The alignment rule of shown control location.
20. the generating means according to one of claim 17-19, it is characterised in that it is described adaptively change set in advance
Meter rule also includes：In the rule for the control for specifying orientation placement specified type.
21. a kind of generating means of mobile terminal application interface, it includes：Cell as described in one of claim 11-20
The generating means of view.
22. a kind of generation system of mobile terminal application interface, it includes：Client and server,
The client includes the generating means of mobile terminal application interface as claimed in claim 21；
The server is used for the interface display request that customer in response end is sent, and read out from database needs on each cell view
The multiple data to be shown, and reorganize the multiple data in a predetermined format and be then sent to client.
23. generation system according to claim 22, it is characterised in that the server is additionally operable to weighing in a predetermined format
During the multiple data of new organization, rule is pre-designed to corresponding data distribution ID and is stored in id field according to described
To ensure that the data content shown on viewing area meets design requirement.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201611139006.2A CN107066244B (en) | 2016-12-12 | 2016-12-12 | Method and device for generating application interface of mobile terminal |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201611139006.2A CN107066244B (en) | 2016-12-12 | 2016-12-12 | Method and device for generating application interface of mobile terminal |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN107066244A true CN107066244A (en) | 2017-08-18 |
| CN107066244B CN107066244B (en) | 2020-12-18 |
Family
ID=59619585
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201611139006.2A Active CN107066244B (en) | 2016-12-12 | 2016-12-12 | Method and device for generating application interface of mobile terminal |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN107066244B (en) |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107479960A (en) * | 2017-08-25 | 2017-12-15 | 广州优视网络科技有限公司 | The display methods and device of a kind of cell view |
| CN109446199A (en) * | 2018-10-19 | 2019-03-08 | 天津字节跳动科技有限公司 | Cell data processing method and device |
| WO2019105099A1 (en) * | 2017-11-29 | 2019-06-06 | 广东神马搜索科技有限公司 | Advertising style metadata configuration method and device, computing device and storage medium |
| CN111124208A (en) * | 2019-12-24 | 2020-05-08 | 三一重工股份有限公司 | Text sending method and system based on sending button |
| CN112988928A (en) * | 2021-02-08 | 2021-06-18 | 北京金和网络股份有限公司 | Catering store map display method and device |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US6744451B1 (en) * | 2001-01-25 | 2004-06-01 | Handspring, Inc. | Method and apparatus for aliased item selection from a list of items |
| CN101551743A (en) * | 2008-03-31 | 2009-10-07 | 上海宝信软件股份有限公司 | Popup hidden-type data selecting container type control and realizing method thereof |
| CN105446710A (en) * | 2014-08-06 | 2016-03-30 | 阿里巴巴集团控股有限公司 | Interface providing system and interface providing method |
-
2016
- 2016-12-12 CN CN201611139006.2A patent/CN107066244B/en active Active
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US6744451B1 (en) * | 2001-01-25 | 2004-06-01 | Handspring, Inc. | Method and apparatus for aliased item selection from a list of items |
| CN101551743A (en) * | 2008-03-31 | 2009-10-07 | 上海宝信软件股份有限公司 | Popup hidden-type data selecting container type control and realizing method thereof |
| CN105446710A (en) * | 2014-08-06 | 2016-03-30 | 阿里巴巴集团控股有限公司 | Interface providing system and interface providing method |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107479960A (en) * | 2017-08-25 | 2017-12-15 | 广州优视网络科技有限公司 | The display methods and device of a kind of cell view |
| WO2019105099A1 (en) * | 2017-11-29 | 2019-06-06 | 广东神马搜索科技有限公司 | Advertising style metadata configuration method and device, computing device and storage medium |
| CN109446199A (en) * | 2018-10-19 | 2019-03-08 | 天津字节跳动科技有限公司 | Cell data processing method and device |
| CN111124208A (en) * | 2019-12-24 | 2020-05-08 | 三一重工股份有限公司 | Text sending method and system based on sending button |
| CN112988928A (en) * | 2021-02-08 | 2021-06-18 | 北京金和网络股份有限公司 | Catering store map display method and device |
Also Published As
| Publication number | Publication date |
|---|---|
| CN107066244B (en) | 2020-12-18 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN107066244A (en) | The generation method and device of a kind of mobile terminal application interface | |
| US20230086529A1 (en) | Method for serving interactive content to a user | |
| US11132736B2 (en) | Object driven newsfeed | |
| CN105373567B (en) | Page generation method and client | |
| US10035065B2 (en) | Geographic-based content curation in a multiplayer gaming environment | |
| CN100458794C (en) | Method for carrying advertisement in electronic map | |
| CN107479861A (en) | Page processing method and its system | |
| CN107924527A (en) | Advertisement is shown in application launcher | |
| US11727442B2 (en) | Method for serving interactive content to a user | |
| CN106407220A (en) | Information publishment control method, control apparatus, and system | |
| CN110287464A (en) | The methods of exhibiting, device of option data, computer equipment and computer storage medium in list | |
| CN109543098A (en) | A kind of update method and device of web advertisement | |
| CN108269103A (en) | The display methods of the page, the providing method of advertising information, client and server | |
| CN101551812A (en) | Distributed method for generating digital blocks | |
| CN110515609B (en) | Application generation method, device, equipment and storage medium | |
| CN110070668A (en) | A kind of unmanned retail terminal and unmanned retail trade system | |
| CN102467714A (en) | Construction method of network business district and system thereof | |
| CN107862728A (en) | Adding method, device and the computer-readable recording medium of picture tag | |
| US20230316342A1 (en) | Method for augmenting digital ads with interactive formats | |
| McCabe et al. | Mobile Marketing Strategies for Educational Programs | |
| KR20190091128A (en) | Server and system of providing content reservation service | |
| Nandedkar et al. | Design & implementation of remotely managed embedded digital signage using raspberry pi for railway system | |
| Regmi | Website development using modern design features and future web trends | |
| US20120173630A1 (en) | Systems and methods for creating and sustaining cause-based social communities using wireless mobile devices and the global computer network | |
| CN112380660A (en) | Network layout configuration method and device, electronic equipment and storage medium |
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 | ||
| TA01 | Transfer of patent application right |
Effective date of registration: 20200526 Address after: 310051 room 508, floor 5, building 4, No. 699, Wangshang Road, Changhe street, Binjiang District, Hangzhou City, Zhejiang Province Applicant after: Alibaba (China) Co.,Ltd. Address before: 510627 Guangdong city of Guangzhou province Whampoa Tianhe District Road No. 163 Xiping Yun Lu Yun Ping square B radio tower 12 layer self unit 01 Applicant before: GUANGZHOU SHENMA MOBILE INFORMATION TECHNOLOGY Co.,Ltd. |
|
| TA01 | Transfer of patent application right | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |