CN114022243A

CN114022243A - Interface display method and device

Info

Publication number: CN114022243A
Application number: CN202111295717.XA
Authority: CN
Inventors: 郭挺
Original assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Current assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Priority date: 2021-11-03
Filing date: 2021-11-03
Publication date: 2022-02-08

Abstract

The invention discloses an interface display method and device, and relates to the technical field of computers. One embodiment of the method comprises: receiving an interface display request, and calling a target component to receive configuration information of an interface to be displayed; calling a corresponding target container through the target component, and transmitting the configuration information serving as a parameter to the target container; and the target container receives the configuration information and controls a content view in the target container to display the interface to be displayed according to the configuration information. The method and the device can display different interfaces according to the configuration information so as to be suitable for different display requirements of the application on the interfaces.

Description

Interface display method and device

Technical Field

The invention relates to the technical field of computers, in particular to an interface display method and device.

Background

A variety of different application interfaces are required in different applications. For example, most applications will have a login interface for logging in. When a user browses a commodity using the e-commerce application, the application provides a commodity detail interface. For another example, when the user uses chat software, the application may provide a photographic interface for the user to send dynamic or circle of friends, etc. However, the interface display mode provided in the existing system is relatively fixed, and personalized customization is difficult to perform according to the service scene.

Disclosure of Invention

In view of this, embodiments of the present invention provide an interface display method and apparatus, which can display different interfaces according to configuration information, so as to be suitable for different display requirements for the interfaces.

In a first aspect, an embodiment of the present invention provides an interface display method, including:

receiving an interface display request, and calling a target component to receive configuration information of an interface to be displayed;

calling a corresponding target container through the target component, and transmitting the configuration information serving as a parameter to the target container;

and the target container receives the configuration information and controls a content view in the target container to display the interface to be displayed according to the configuration information.

Optionally, a scroll view is disposed on the content view, and the configuration information includes: the size information of the interface to be displayed;

the controlling the content view in the target container to display the interface to be displayed according to the configuration information includes:

adding a to-be-displayed view corresponding to the to-be-displayed interface to the scroll view;

determining the display width and the display height of the scroll view according to the interface size information;

determining the self width and the transverse activity state of the scroll view according to the display width;

determining the self height and the longitudinal activity state of the scroll view according to the display height; wherein the self width, the self height, the transverse active state and the longitudinal active state are used for controlling the scrolling view to display the view to be displayed.

Optionally, the determining the self-width and the lateral activity state of the scroll view according to the display width includes:

determining a maximum supported width of the scroll view;

determining whether the display width is less than the maximum supported width;

if so, determining that the self width of the scroll view is the display width, and the transverse moving state is a non-slidable state;

if not, determining that the self width of the scroll view is the maximum support width, and the transverse moving state is a slidable state.

Optionally, the determining the self-height and the longitudinal activity state of the scroll view according to the display height includes:

determining a maximum supported height for the scrolling view;

determining whether the display height is less than the maximum supported height;

if so, determining that the self height of the scroll view is the display height, and the longitudinal activity state is a non-slidable state;

if not, determining that the height of the scroll view is the maximum support height, and the longitudinal activity state is a slidable state.

Optionally, a title view is disposed on the content view, and the configuration information includes: the title of the interface to be displayed;

and controlling the title view to display the title of the interface to be displayed.

Optionally, a background view is disposed below the content view, and the configuration information includes: a background pop-up parameter and/or a background close parameter;

when an interface pop-up instruction is received, controlling and displaying the background view according to the background pop-up parameter;

and/or the presence of a gas in the gas,

and when an interface closing instruction is received, controlling to close the background view according to the background closing parameter.

Optionally, the configuration information includes: an interface pop-up parameter and/or an interface close parameter;

when an interface pop-up instruction is received, controlling and displaying the content view according to the interface pop-up parameter;

and/or the presence of a gas in the gas,

and when an interface closing instruction is received, controlling to close the content view according to the interface closing parameter.

Optionally, the configuration information includes: a container style parameter;

setting a display style of the content view according to the container style parameter;

and controlling the content view to display the interface to be displayed.

Optionally, the content view is located on a viewing layer of the target component.

In a second aspect, an embodiment of the present invention provides an interface display apparatus, including:

the information receiving module is used for receiving the interface display request and calling the target component so as to receive the configuration information of the interface to be displayed;

the container calling module is used for calling the corresponding target container through the target component and transmitting the configuration information serving as a parameter to the target container;

and the interface display module is used for receiving the configuration information and controlling the content view in the target container to display the interface to be displayed according to the configuration information.

In a third aspect, an embodiment of the present invention provides an electronic device, including:

one or more processors;

a storage device for storing one or more programs,

when executed by the one or more processors, cause the one or more processors to implement the method of any of the embodiments described above.

In a fourth aspect, an embodiment of the present invention provides a computer-readable medium, on which a computer program is stored, where the computer program, when executed by a processor, implements the method of any one of the above embodiments.

One embodiment of the above invention has the following advantages or benefits: and calling the target container by the target component, receiving the configuration information of the interface to be displayed by the target container, and displaying the view to be displayed according to the configuration information. The personalized parameters of the interface to be displayed can be set through configuration information, and the configuration information can comprise: the size information of the interface to be displayed, the title of the interface to be displayed, the background pop-up parameter, the background close parameter and the like. Different interface display is realized by setting different configuration information. Therefore, different display requirements of different applications on the interface can be well supported.

Further effects of the above-mentioned non-conventional alternatives will be described below in connection with the embodiments.

Drawings

The drawings are included to provide a better understanding of the invention and are not to be construed as unduly limiting the invention. Wherein:

fig. 1 is a schematic diagram illustrating a flow of an interface display method according to an embodiment of the present invention;

FIG. 2 is a schematic diagram illustrating a flow of another interface presentation method according to an embodiment of the present invention;

FIG. 3 is a schematic diagram illustrating a flow of another interface displaying method according to an embodiment of the present invention;

FIG. 4 is a schematic view of the internal structure of a container according to one embodiment of the present invention;

FIG. 5 is a diagram of an application view hierarchy provided by an embodiment of the present invention;

FIG. 6 is a schematic structural diagram of an interface display apparatus according to an embodiment of the present invention;

FIG. 7 is an exemplary system architecture diagram in which embodiments of the present invention may be employed;

fig. 8 is a schematic structural diagram of a computer system suitable for implementing a terminal device or a server according to an embodiment of the present invention.

Detailed Description

Exemplary embodiments of the present invention are described below with reference to the accompanying drawings, in which various details of embodiments of the invention are included to assist understanding, and which are to be considered as merely exemplary. Accordingly, those of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the invention. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.

The interface display mode provided in the existing system is relatively fixed, and personalized customization is difficult to carry out according to the service scene. Taking the IOS platform as an example, when a friend list or a certain commodity is clicked, a new interface slides from the right side of the screen to the left side of the screen until a new page is completely displayed in the current screen, and the previous page slides from right to left along with the new page until the previous page disappears; if the friend does not chat with the friend or the detailed browsing of the goods is finished, after the page is clicked to close, the new page slides from the left side to the right side of the screen until the new page disappears completely, and the previous page also slides from left to right along with the new page until the new page appears completely. In fact, as for the opening mode of such pages, so-called push and pop, a new page is pushed to the top of the stack (open) by a push mode, and the new page is popped (close) by a pop mode.

When a login interface or a photographing interface pops up, a new interface pops up from the bottom of a screen under most conditions until the current screen is completely covered, and the previous page disappears along with the covering of the new page; when such a page is closed, it will also go back from top to bottom until it disappears completely, and the previous page will appear as the new page exits. In fact, such pages are opened in a modal view, i.e. present; when the page is closed, this is done in a dismiss manner.

The above two types of full interfaces are all displayed in the screen completely. In addition, there are many personalized interfaces, the most common of which are, for example, clicking on address selections in shopping carts, clicking on specification information in details of goods, shipping addresses, date selections in personal information, and the like, and so on. For such a page, it is not necessary to fill the whole screen sufficiently according to the requirements of the service scene, so that in most cases, only a simple view is developed and directly overlaid on the current view.

In IOS development, a complete page is usually implemented by a vc (view controller), and the above-mentioned present and push open is a normal vc. Most of applications integrate a plurality of navigationcontrollers by using a tabController, and people can click different tab buttons to switch, each navigationController has a root vc, when a new page is opened, a new vc is pushed to a stack, pop is a pop vc operation, and correspondingly, the page is closed.

Firstly, since the push and the present are page pop-up modes provided by the system, the departure and closing animations of a new page are relatively fixed, and personalized customization cannot be performed according to a service scene.

Secondly, since the push and present ways are both to open a new vc, the method is suitable for a complete page. In many scenarios like the above, for example, when the commodity details are used to select specification information, a receiving address, etc., these interfaces often do not occupy the whole screen, and may only need one view to implement, so the present and push methods in the prior art are not applicable.

Based on this, the embodiment of the invention provides an interface display method which can be used for personalized setting to realize different display effects. Fig. 1 is a schematic diagram of a flow of an interface display method according to an embodiment of the present invention. As shown in fig. 1, the method includes:

step 101: and receiving an interface display request, and calling the target component to receive the configuration information of the interface to be displayed.

The method provided by the embodiment of the invention is applied to the application program and is used for realizing different display effects aiming at different configuration information of the application program. The application program corresponds to a target assembly, the application program can correspond to a plurality of target assemblies, the target assemblies are used for displaying elements in a screen, and a user can interact with the content in the target assemblies to complete a certain task when using the terminal equipment.

For an IOS system, the target components may include tabconroller, etc., and the containers may be docked to tabconroller, manipulated directly by tabconroller, and interfaces of different layouts displayed. For the Android system, the application components may include activity components in Android, and one activity component may provide one screen, and may interact with a user through the activity component.

The configuration information is used for characterizing personalized parameters of different interface requirements, and the configuration information can comprise: the size information of the interface to be displayed, the title of the interface to be displayed, the background pop-up parameter, the background close parameter and the like. And through the configuration information, the target container can be controlled to generate an interface meeting the preset requirement.

Step 102: and calling the corresponding target container through the target component, and transmitting the configuration information serving as a parameter to the target container.

The target container is used to generate and present an interface. To flexibly present various interfaces, a plurality of views, such as a title view, a content view, a scroll view, and a background view, may be provided in the target container. The content view may be based on placing other views, such as a title view, a scroll view, a background view, etc., on top of the content view, and setting size, position, style parameters, etc., for the various views.

It should be noted that, the views included in the target container and the information such as the size, position, style parameters and the like of each view may be set according to specific requirements, and the method of the embodiment of the present invention does not set any limit on specific component views and related parameters and the like in the target container.

The target component can directly manipulate and invoke the target container. For example, for tabconroller, the target container may be hung to tabconroller with runtime of tabconroller, since the classification is not supporting build attributes.

Step 103: and the target container receives the configuration information and controls the content view in the target container to display the interface to be displayed according to the configuration information.

In the embodiment of the invention, the target component calls the target container, and the target container receives the configuration information of the interface to be displayed and displays the view to be displayed according to the configuration information. The personalized parameters of the interface to be displayed can be set through the configuration information. Different interface display is realized by setting different configuration information. Therefore, different display requirements of different applications on the interface can be well supported.

In an embodiment of the present invention, a title view is disposed on the content view, and the configuration information includes: the title of the interface to be displayed; controlling the content view in the target container to display the interface to be displayed according to the configuration information, wherein the method comprises the following steps: and controlling the title view to display the title of the interface to be displayed. The title of the interface to be displayed can be set according to specific requirements, and the final display interface is controlled to display the title.

In one embodiment of the invention, the configuration information includes: a container style parameter; controlling the content view in the target container to display the interface to be displayed according to the configuration information, wherein the method comprises the following steps: setting a display style of the content view according to the container style parameter; and controlling the content view to display the interface to be displayed.

The container style parameter is used to control a display style of the content view. Different container style parameters represent different display styles of content views. For example, if the container style parameter is 1, the content view includes: title view, close button. If the container style parameter is 2, the content view includes: title view, scroll view, close button. And if the container style parameter is 3, the content view is a custom style, and the target container can generate content views of different styles according to the container style parameter. By setting different container style parameters, interface display of different styles can be carried out more richly and flexibly.

The prior art IOS system also has a view level problem. Analyzing the view hierarchy framework of the IOS application, finding that the view of the tabController is at the bottom, the navigationController is added at the bottom of the view hierarchy of the tabController (the view hierarchy of the tab menu is higher, so if there is the tab menu, all the views on the navigationController are hidden by the tab menu), and all the vc in the routing stack managed by the navigationController are sequentially added on the navigationController from the bottom of the stack to the top of the stack. Wherein each push adds a normal vc to the top layer, i.e. the level of vc added to the navigationController later is higher. Typically, a page such as the details of the item being displayed described above is the top of stack vc in the conditional controller routing stack, and when selecting the item specification, it is common practice to implement a view and then simply add to the view level of the current vc. However, as mentioned above, this presents a view level presentation problem: that is, if there is a tab menu, and the business just requires the product specification to be displayed on the top layer (which cannot be covered by the tab menu), it cannot be satisfied.

Based on the above analysis, the target container may be hung to tabconroller with runtime of tabconroller, since the classification is not supporting build attributes. The method of the embodiment of the invention can enable the content view to be positioned above the view layer of the target component, so as to solve the problem that the view added later can only be positioned below the view of the tab menu.

Fig. 2 is a schematic diagram of a flow of an interface display method according to an embodiment of the present invention. As shown in fig. 2, the method includes:

step 201: the target component receives configuration information of an interface to be displayed, wherein the configuration information comprises: and dimension information of the interface to be displayed.

The size information of the interface to be displayed may include at least one of: height information, width information, area information and the like of the interface to be displayed.

Step 202: the target component invokes the target container and passes the configuration information as a parameter to the target container.

Step 203: and the target container receives the configuration information, adds the view to be displayed corresponding to the interface to be displayed to a rolling view arranged on the content view, and the target container is provided with the content view.

Step 204: and determining the display width and the display height of the scroll view according to the interface size information.

Default values for the display width and display height of the scroll view may be set in the system. For example, the default value of the display width of the scroll view is the screen width, and the default value of the display height of the scroll view is the difference between the screen height and the height of the title view, and the like. And when the width information or the height information of the interface to be displayed is missing, directly setting the display width or the display height of the scroll view by using the default value.

When the width information and the height information of the interface to be displayed are received, the display width of the scroll view can be set to be the width of the interface to be displayed, and the display height of the scroll view can be set to be the height of the interface to be displayed.

Step 205: and determining the self width and the transverse activity state of the scroll view according to the display width.

Step 206: determining the self height and the longitudinal activity state of the scroll view according to the display height; the self width, the self height, the transverse activity state and the longitudinal activity state are used for controlling the scroll view to display the view to be displayed.

The width of the scroll view itself is the width of the scroll view that is ultimately displayed in the interface. The self length of the scroll view is the length of the scroll view that is ultimately displayed in the interface. In the embodiment of the invention, the width, the height, the transverse activity state and the longitudinal activity state of the scroll view are determined according to the size information of the interface to be displayed, and the scroll view can be controlled to display the content in the view to be displayed in a more reasonable mode.

In one embodiment of the present invention, determining the self-width and the horizontal activity state of the scroll view according to the display width comprises: determining a maximum supported width of the scroll view; determining whether the display width is less than a maximum supported width; if so, determining that the self width of the scroll view is the display width, and the transverse moving state is the non-sliding state; if not, determining that the self width of the scroll view is the maximum support width, and the transverse moving state is the slidable state.

The maximum supported width of the scroll view can be set according to specific requirements. For example, the maximum supported width of the scroll view may be the screen width, or the width obtained by subtracting the safety distance from the screen width. In the case where the display width is smaller than the maximum supported width, the self width of the scroll view is determined as the display width, and the horizontally active state is the non-slidable state. In the case where the display width is not less than the maximum supported width, the self width of the scroll view is determined to be the maximum supported width, and the horizontally active state is the slidable state.

In one embodiment of the invention, the determination of the self height and the longitudinal activity state of the scroll view according to the display height comprises the following steps: determining a maximum supported height of the scrolling view; determining whether the display height is less than a maximum supported height; if so, determining that the self height of the scroll view is the display height, and the longitudinal activity state is the non-slidable state; if not, determining that the self height of the scroll view is the maximum support height, and the longitudinal activity state is a slidable state.

The maximum support height of the scroll view can be set according to specific requirements. For example, the maximum supported height of the scroll view may be the screen height, the height obtained by subtracting the safety distance from the screen height and then subtracting the height of the title view, and the like. And under the condition that the display height is smaller than the maximum support height, determining the self height of the scroll view as the display height, and determining the longitudinal activity state as the nonslip state. In the case where the display height is not less than the maximum supported height, the self height of the scroll view is determined to be the maximum supported height, and the horizontally active state is the slidable state.

Fig. 3 is a schematic diagram illustrating a flow of another interface display method according to an embodiment of the present invention. As shown in fig. 3, the method includes:

step 301: the target component receives configuration information of an interface to be displayed, wherein the configuration information comprises: a background pop-up parameter and/or a background close parameter.

The background pop-up parameter is a parameter for controlling pop-up of a background view. The background pop-up parameters may include: color parameters, brightness parameters, animation parameters, picture parameters, pop-up modes and the like. The background-off parameter is a parameter for controlling the closing of the background view. The background shutdown parameters may include: the background pop-up parameters may include: color parameters, brightness parameters, animation parameters, picture parameters, closing modes, and the like.

Step 302: the target component invokes the target container and passes the configuration information as a parameter to the target container.

Step 303: the target container receives the configuration information and controls a content view in the target container to display an interface to be displayed, and a background view is arranged below the content view.

Step 304: and when an interface pop-up instruction is received, controlling and displaying a background view according to the background pop-up parameter.

Step 305: and when an interface closing instruction is received, controlling to close the background view according to the background closing parameter.

In the embodiment of the invention, the background view is controlled to pop up or close in a preset mode through the background pop-up parameter and/or the background close parameter, and the background pop-up or close mode is more flexible and changeable so as to meet different requirements of different applications on the interface pop-up or close effect.

In one embodiment of the invention, the configuration information includes: an interface pop-up parameter and/or an interface close parameter; controlling the content view in the target container to display the interface to be displayed according to the configuration information, wherein the method comprises the following steps: when an interface pop-up instruction is received, controlling the display content view according to the interface pop-up parameter; and/or controlling to close the content view according to the interface closing parameter when the interface closing instruction is received.

The interface pop-up parameter is a relevant parameter for controlling the pop-up of the content view. The interface pop-up parameters may include: size parameters, position parameters, pop-up modes, etc. The pop-up mode can set different parameters according to requirements. For example: pop-up mode is 1, the content view pops up by sliding the left side of the screen from the right side of the screen. Pop-up mode is 2, the content view pops up in a manner of sliding the screen below from above the screen, and so on. Pop-up mode is 3, the content view pops up in a gradually brightening manner, and so on. The interface closing parameter is a relevant parameter for controlling the closing of the content view. The interface close parameters may include: size parameters, position parameters, closing mode, etc. The closing mode can set different parameters according to requirements. For example: the closing mode is 1, the content view is closed in a manner of sliding the right side of the screen from the left side of the screen. The closed mode is 2, the content view is closed in a manner of sliding the screen lower side from the screen upper side, and the like. The closed mode is 3, the content view is closed in a gradually darkening mode, etc. The interface view is controlled to pop up or close in a preset mode through the interface pop-up parameter and/or the interface close parameter, and the realization of various applications on the interface pop-up or close effect can be met.

To facilitate an understanding of the method of embodiments of the present invention, a description of one embodiment developed under the IOS system follows. The embodiment of the invention creates a set of new container rules, and the container receives the view corresponding to the interface to be displayed and is responsible for popping up and closing the view. View level pop-up and close-down can be well supported. Some styles are built in the container, so that the container can be set conveniently, and meanwhile, the styles and the extension of animations can be customized, so that the container is very friendly to some personalized service scenes.

The embodiment of the invention also establishes tabController classification, the created container is externally hung to tabController, and finally the tabController directly operates the container. This has two benefits: firstly, the existing logic cannot be invaded, and a user can directly use the file only by referring to the header file; secondly, since the navigationController and the ordinary vc (view) can directly index to the corresponding tabcotroller, it is very convenient to operate the container through the tabcotroller, and the user can directly call the pop-up logic in any vc.

Finally, as can be seen from the above, the container is directly added to the upper layer of the tabconroller, so that the page popped up by the container is preferentially displayed, and the display problem of the view level is perfectly solved.

It should be noted that tabconeroller in the embodiment of the present invention is a lower implementation of a target component, contentView is a lower implementation of a content view, backView is a lower implementation of a background view, titleBar is a lower implementation of a title view, scrollView is a lower implementation of a scroll view, and visibleView is a lower implementation of a view to be displayed corresponding to an interface to be displayed.

The following is a description of a specific implementation of the method of the embodiments of the present invention. The design and implementation of the embodiment of the invention comprise two parts: the first part is the design and packaging of the container, and the second part is that the container is hung on the tabController by means of runtime and finally packaged with the api of tabController type to directly operate the container.

Fig. 4 is a schematic view of the internal structure of a container according to an embodiment of the present invention. As shown in fig. 4, the interface design of the container is started first: firstly, setting a container style, wherein the container defines two enumeration types by default, the TabBarControleconnecterStyleDefault is a common simple style with a title and a closing button and is also a container default style, the TabBarControleconnecterStyleConsultom is a completely self-defined style without any content, and the content is completely given by a user of the container; secondly, the proxy object comprises four methods of tabBar ControleconaierWillShow, tabBar ControleconainerDidShow, tabBar ControleconaierWillHide and tabBar ControleconainerDHide, which respectively represent the methods that the container needs to be notified to the proxy object when the container is popped up, closed or closed; thirdly, setting the content of the container, namely popping up a title and a view required to be displayed; and finally, specifically operating the pop-up and the close method, wherein a showContainnerrAnised: completion and a hidContainnerrAnised: completion are provided, a common animation mode is arranged in the container according to the requirement, a first parameter can select whether to use the animation, and a second parameter completion transmits a block, so that the user can conveniently perform the operation required after pop-up and close.

Next, the inside implementation of the container follows, fig. 5 is a schematic diagram of an application view hierarchical relationship provided by an embodiment of the present invention, as shown in fig. 5, a full-screen background view is set first at the bottom layer of the container, generally, the default style of the background view is a black and high-transparency mask, which is hidden by default, when the container performs a pop-up interface operation, it appears simultaneously in some animation manner to weaken the effect of interfaces other than the pop-up view in the screen (becoming darker), if there are some special service scenes, a desired picture of the background view can be set directly or the animation can be played, and when the container is closed, the background view can be hidden therewith; on the upper layer of the backView, a contentView is arranged, the contentView acts as an intermediate role, the container ejection and closing are actually operation contentView, the contentView is displayed on the screen when the container is ejected, and the contentView is hidden at the bottom of the screen when the container is closed (the user cannot perceive the content). The contentView comprises a titlerBar and a scrollView, when the style is set as TabBarControleconnecterStyleDefault, the titlerBar and the scrollView are both displayed, when the style is TabBarControleconnecterStyleConsult, the titlerBar is hidden, the scrollView completely coincides with the contentView, and the scrollView is the 'container' really used for filling the view to be popped.

The above is the internal view structure of the container, and the following description focuses on how to configure visibleView, i.e., the view to pop up. When the container receives the configuration of the visibleView, firstly checking whether the View is the View, and if the View is the View, adding the visibleView to the scrollView; secondly, the width of the visibleView is required to be standardized as the width of a screen, then the height vHeight of the visibleView is obtained, and the actual display height of the scrollView is set as vHeight; taking the length of the screen minus the upper and lower safety distances and the length of the titleBar as an example, when vHeight is smaller than maxHeight, the self-size of the scrollView needs to be set to vHeight (note that the display size and the self-size of the scrollView are distinguished), at which time the state of the scrollView is not slidable, and when vHeight is larger than maxHeight, the self-size of the scrollView is set to maxHeight, at which time the scrollView is slidable (slidable when the display size of the scrollView is larger than the self-size).

It can be easily guessed from the above that the height of the contentView is actually the height of the titleBar plus the self-height of the scrollView, and maxHeight is the maximum height that the contentView can exhibit.

The true pop-up and shut-down logic is then implemented. It is necessary to set an attribute for temporarily storing the callback block inside the container, when a pop (show) operation is executed, first determine whether the callback block is already shown, and if not, perform the following operations:

step S01: and saving the popped callback block.

Step S02: the agent is notified that the container will pop up.

Step S03: the size of the contentView is set to the sum of the scrollView and the titleBar (if the titleBar exists).

Step S05: when animation is needed, moving the position of the contentView to the displayed position in an animation mode, and simultaneously displaying the backView in a gradient manner; when the animation is finished, executing the block and informing the agent container that the agent container is popped up; when animation is not needed, the next step is performed directly.

Step S06: and directly adjusting the position of the contentView to the displayed position, simultaneously directly displaying the backView, and finally executing the block and informing the agent container of popping.

When the closing (hide) operation is executed, whether the hidden operation is hidden or not is judged, and if not, the following operations are carried out:

step S11: and saving the closed callback block.

Step S12: the agent is notified that the container will close.

Step S13: when animation is needed, moving the position of the contentView to the bottom of the screen in an animation mode until the user cannot see the contentView, and meanwhile, gradually hiding the background View; when the animation is finished, executing the block and informing the agent container that the agent container is closed; when animation is not needed, the next step is performed directly.

Step S14: and directly adjusting the position of the contentView to the bottom of the screen, simultaneously directly hiding the backView, and finally executing the block and informing the agent container of closing.

Step S15: the visibleView is removed from the scrollView, and then the dimensions of the scrollView itself and the display size are zeroed.

To this end, the design and implementation of the container has been completed. Next, a classification Container of tabcon controller is established, which contains two parts:

the first part is how to add containers, which needs to be done internally with runtime since classification does not support establishing attributes. After the container attribute containerView is implemented, the container needs to be added to the view layer of the tabController. As shown in FIG. 5, it is necessary to add containers to tabController after tabController has loaded all views, so that the final effect of presentContainrWidth: title: animated: completion is that the presentation of containers will be at the top of tabController (containers are presented above tab menu and navigationController). Note that the container is used as an external attribute of the tabController, that is, the container is exposed to the user for direct access, so that the user can set an agent to monitor the popping and closing of the container by himself to realize any operation he wants;

the second part is that the present and the dissmiss of tabconroller operate, and the method comprises 2 types: the first is the present method: 1. a container for ejecting a default style; 2. PresentCustomConnitainerWith-animated: completion-used to pop up a container of a fully custom style. The two present ways are internally the same, first configure style, title, and visibleView, and then perform the show operation of the container attribute. Wherein style characterizes a container style parameter, and is used for setting a display style of the content view. title characterizes the title of the interface to be presented. And the visibleView represents the view to be displayed corresponding to the interface to be displayed, and the visibleView comprises content information to be displayed in the interface to be displayed. The second type is the differential containment organized: completion, which is a hide operation that directly calls container attributes inside a method, noting that no matter what type of present is passed, the closing can be done by the dis method.

It can be seen from the above implementation process that the container only operates one view at the same time, the view is added again when the container is popped up, the view is released in time after the container is closed, and more memories are not occupied along with the increase of the number of times of operating the view, so that the use of the memories is also very efficient.

Fig. 6 is a schematic structural diagram of an interface display apparatus according to an embodiment of the present invention. As shown in fig. 6, the apparatus includes:

the information receiving module 601 is configured to receive an interface display request and call a target component to receive configuration information of an interface to be displayed;

a container calling module 602, configured to call a corresponding target container through the target component, and transmit the configuration information as a parameter to the target container;

an interface display module 603, configured to receive the configuration information, and control, according to the configuration information, a content view in the target container to display the interface to be displayed.

the interface display module 603 is specifically configured to:

Optionally, the interface display module 603 is specifically configured to:

determining a maximum supported width of the scroll view;

determining whether the display width is less than the maximum supported width;

Optionally, the interface display module 603 is specifically configured to:

determining a maximum supported height for the scrolling view;

the interface display module 603 is specifically configured to:

and/or the presence of a gas in the gas,

the interface display module 603 is specifically configured to:

and/or the presence of a gas in the gas,

the interface display module 603 is specifically configured to:

and controlling the content view to display the interface to be displayed.

An embodiment of the present invention provides an electronic device, including:

one or more processors;

a storage device for storing one or more programs,

when the one or more programs are executed by the one or more processors, the one or more processors are caused to implement the method of any of the embodiments described above.

Fig. 7 illustrates an exemplary system architecture 700 to which the interface presentation methods and apparatus of embodiments of the invention may be applied.

As shown in fig. 7, the system architecture 700 may include

terminal devices

701, 702, 703, a network 704, and a server 705. The network 704 serves to provide a medium for communication links between the

terminal devices

701, 702, 703 and the server 705. Network 704 may include various connection types, such as wired, wireless communication links, or fiber optic cables, to name a few.

A user may use the

terminal devices

701, 702, 703 to interact with a server 705 over a network 704, to receive or send messages or the like. Various web browser applications may be installed on the

terminal devices

701, 702, 703.

The

terminal devices

701, 702, 703 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop portable computers, desktop computers, and the like.

The

terminal devices

701, 702, and 703 send access requests for accessing the interface, and receive content information and configuration information of the interface to be displayed, which are returned by the server 705. The

terminal devices

701, 702 and 703 call the target container by using the target component, transmit the configuration information as a parameter to the target container, receive the configuration information by the target container, and control the content view in the target container to display the interface to be displayed according to the configuration information.

It should be noted that the interface display method provided by the embodiment of the present invention is generally executed by the

terminal devices

701, 702, and 703, and accordingly, the interface display apparatus is generally disposed in the

terminal devices

701, 702, and 703.

It should be understood that the number of terminal devices, networks, and servers in fig. 7 is merely illustrative. There may be any number of terminal devices, networks, and servers, as desired for implementation.

Referring now to FIG. 8, shown is a block diagram of a computer system 800 suitable for use with a terminal device implementing an embodiment of the present invention. The terminal device shown in fig. 8 is only an example, and should not bring any limitation to the functions and the scope of use of the embodiments of the present invention.

As shown in fig. 8, the computer system 800 includes a Central Processing Unit (CPU)801 that can perform various appropriate actions and processes in accordance with a program stored in a Read Only Memory (ROM)802 or a program loaded from a storage section 808 into a Random Access Memory (RAM) 803. In the RAM 803, various programs and data necessary for the operation of the system 800 are also stored. The CPU 801, ROM 802, and RAM 803 are connected to each other via a bus 804. An input/output (I/O) interface 805 is also connected to bus 804.

The following components are connected to the I/O interface 805: an input portion 806 including a keyboard, a mouse, and the like; an output section 807 including a signal such as a Cathode Ray Tube (CRT), a Liquid Crystal Display (LCD), and the like, and a speaker; a storage portion 808 including a hard disk and the like; and a communication section 809 including a network interface card such as a LAN card, a modem, or the like. The communication section 809 performs communication processing via a network such as the internet. A drive 810 is also connected to the I/O interface 805 as necessary. A removable medium 811 such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, or the like is mounted on the drive 810 as necessary, so that a computer program read out therefrom is mounted on the storage section 808 as necessary.

In particular, according to the embodiments of the present disclosure, the processes described above with reference to the flowcharts may be implemented as computer software programs. For example, embodiments of the present disclosure include a computer program product comprising a computer program embodied on a computer readable medium, the computer program comprising program code for performing the method illustrated in the flow chart. In such an embodiment, the computer program can be downloaded and installed from a network through the communication section 809 and/or installed from the removable medium 811. The computer program executes the above-described functions defined in the system of the present invention when executed by the Central Processing Unit (CPU) 801.

It should be noted that the computer readable medium shown in the present invention can be a computer readable signal medium or a computer readable storage medium or any combination of the two. A computer readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the foregoing. More specific examples of the computer readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In the present invention, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. In the present invention, however, a computer readable signal medium may include a propagated data signal with computer readable program code embodied therein, for example, in baseband or as part of a carrier wave. Such a propagated data signal may take many forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A computer readable signal medium may also be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device. Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, fiber optic cable, RF, etc., or any suitable combination of the foregoing.

The flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems, methods and computer program products according to various embodiments of the present invention. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams or flowchart illustration, and combinations of blocks in the block diagrams or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.

The modules described in the embodiments of the present invention may be implemented by software or hardware. The described modules may also be provided in a processor, which may be described as: the device comprises an information receiving module, a container calling module and an interface display module. The names of the modules do not constitute a limitation to the module itself in some cases, for example, the information receiving module may also be described as a module that receives an interface presentation request and calls a target component to receive configuration information of an interface to be presented.

As another aspect, the present invention also provides a computer-readable medium that may be contained in the apparatus described in the above embodiments; or may be separate and not incorporated into the device. The computer readable medium carries one or more programs which, when executed by a device, cause the device to comprise:

According to the technical scheme of the embodiment of the invention, the target component calls the container, and the container receives the configuration information of the interface to be displayed and displays the view to be displayed according to the configuration information. The personalized parameters of the interface to be displayed can be set through configuration information, and the configuration information can comprise: the size information of the interface to be displayed, the title of the interface to be displayed, the background pop-up parameter, the background close parameter and the like. Different interface display is realized by setting different configuration information. Therefore, different display requirements of different applications on the interface can be well supported.

The above-described embodiments should not be construed as limiting the scope of the invention. Those skilled in the art will appreciate that various modifications, combinations, sub-combinations, and substitutions can occur, depending on design requirements and other factors. Any modification, equivalent replacement, and improvement made within the spirit and principle of the present invention should be included in the protection scope of the present invention.

Claims

1. An interface display method, comprising:

2. The method of claim 1, wherein a scroll view is disposed on the content view, and wherein the configuration information comprises: the size information of the interface to be displayed;

3. The method of claim 2, wherein determining the self-width and lateral activity status of the scrolling view according to the display width comprises:

determining a maximum supported width of the scroll view;

determining whether the display width is less than the maximum supported width;

4. The method of claim 2, wherein determining the self-height and the vertical activity status of the scrolling view according to the display height comprises:

determining a maximum supported height for the scrolling view;

5. The method of claim 1, wherein a title view is disposed on the content view, and wherein the configuration information comprises: the title of the interface to be displayed;

6. The method according to claim 1, wherein a background view is provided below the content view, and the configuration information comprises: a background pop-up parameter and/or a background close parameter;

and/or the presence of a gas in the gas,

7. The method of claim 1, wherein the configuration information comprises: an interface pop-up parameter and/or an interface close parameter;

and/or the presence of a gas in the gas,

8. The method of claim 1, wherein the configuration information comprises: a container style parameter;

and controlling the content view to display the interface to be displayed.

9. The method of claim 1, wherein the content view is located on a viewing layer of the target component.

10. An interface display device, comprising:

11. An electronic device, comprising:

one or more processors;

a storage device for storing one or more programs,

when executed by the one or more processors, cause the one or more processors to implement the method of any one of claims 1-9.

12. A computer-readable medium, on which a computer program is stored, which, when being executed by a processor, carries out the method according to any one of claims 1-9.