CN111506243B

CN111506243B - Page information processing method and device and electronic equipment

Info

Publication number: CN111506243B
Application number: CN201910095979.8A
Authority: CN
Inventors: 杨进鹏; 陆东鑫
Original assignee: Alibaba Jiangxi Co ltd
Current assignee: Alibaba Jiangxi Co ltd
Priority date: 2019-01-31
Filing date: 2019-01-31
Publication date: 2023-07-14
Anticipated expiration: 2039-01-31
Also published as: CN111506243A

Abstract

The embodiment of the application discloses a page information processing method, a page information processing device and electronic equipment, wherein the method comprises the following steps: the method comprises the steps that a client displays a target page, wherein the target page comprises a header area and a main content area; in response to a slide operation performed on the subject content area, the following processing is performed: in a telescopic range corresponding to the header area, carrying out telescopic adjustment on the height of the header area, and carrying out translation processing on the main body content area in the height direction so as to follow the height change of the header area; after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation. Through the embodiment of the application, the header area can fully play the due function of the header area, and meanwhile, the influence on the display of the main content due to overlarge occupied page width is avoided.

Description

Page information processing method and device and electronic equipment

Technical Field

The present invention relates to the field of page information processing technologies, and in particular, to a page information processing method and apparatus, and an electronic device.

Background

For some applications or developers of a specific functional module within a program, a specific front-end page design is also an important part of the implementation of specific business logic, because the front-end page is a "portal" of the whole application or function, and a first impression is given to a user, and the first impression may affect the residence time of the user in the page, or whether some content is interested in forming a traffic conversion by performing actions such as clicking, etc. In a specific page, the head of the page at the top of the page (called the "header") impacts the user's visual sense at the first time. Therefore, conventionally, "finishing" for the header and the like have been important areas of interest to the developer or designer.

In general, two main aspects are considered for decorating the header, namely, specific put contents, for example, specific contents capable of playing marketing or baking atmosphere are displayed to the header area, and the like; on the other hand, the size of the specific header area, if the header area is too small, the content of the specific marketing or baking atmosphere may not be fully displayed, and the specific effect may be affected; if the display screen is too large, the display of the actual content of the page may be affected due to too large proportion of the occupied page, especially in the scene of the mobile terminal, so that the effect may be more prominent.

Therefore, how to more effectively design the header of the page becomes a technical problem that needs to be solved by those skilled in the art.

Disclosure of Invention

The application provides a page information processing method, a page information processing device and electronic equipment, which can make the header area fully play the due role and avoid the influence on the display of main content due to overlarge occupied page width.

The application provides the following scheme:

a page information processing method, comprising:

the method comprises the steps that a client displays a target page, wherein the target page comprises a header area and a main content area;

in response to a slide operation performed on the subject content area, the following processing is performed:

in a telescopic range corresponding to the header area, carrying out telescopic adjustment on the height of the header area, and carrying out translation processing on the main body content area in the height direction so as to follow the height change of the header area;

after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation.

A page information processing method, comprising:

The method comprises the steps that a server receives an access request to a target page submitted by a client, wherein the target page comprises a header area and a main body content area;

returning the page data of the target page to the client so that the client can stretch and retract the height of the header area in a stretch range corresponding to the header area in the process of responding to the sliding operation executed on the main content area, and translate the main content area in the height direction so as to follow the height change of the header area; after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation.

A page information processing apparatus comprising:

the page display unit is used for displaying a target page, wherein the target page comprises a header area and a main body content area;

a first processing unit configured to, in response to a sliding operation performed on the main body content area, perform telescopic adjustment on a height of the header area within a telescopic range corresponding to the header area, and perform translational processing on the main body content area in a height direction so as to follow a change in the height of the header area;

And the second processing unit is used for performing scroll display on the main content in the direction of the sliding operation by the main content area after the height of the header area stretches to a threshold value.

A page information processing apparatus comprising:

the request receiving unit is used for receiving an access request submitted by a client to a target page, wherein the target page comprises a header area and a main body content area;

a page data returning unit, configured to return page data of the target page to the client, so that in a process of responding to a sliding operation performed on the main content area, the client performs telescopic adjustment on a height of the header area within a telescopic range corresponding to the header area, and performs translation processing on the main content area in a height direction so as to follow a height change of the header area; after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation.

An electronic device, comprising:

one or more processors; and

a memory associated with the one or more processors, the memory for storing program instructions that, when read for execution by the one or more processors, perform the operations of:

Displaying a target page, wherein the target page comprises a header area and a main content area;

An electronic device, comprising:

one or more processors; and

receiving an access request to a target page submitted by a client, wherein the target page comprises a header area and a main content area;

According to a specific embodiment provided by the application, the application discloses the following technical effects:

through this application embodiment, through setting the header region of page to scalable, simultaneously, the main part content area of page can carry out translational motion in header region scalable within range to change the visual area of main part content area in window visual range, stretch out and draw back to the threshold value at the header region, follow specific sliding operation again and carry out the scroll show to specific main part content. In this way, in the initial state of the page rendering, the page width occupied by the header area can be larger, so that the effects of atmosphere rendering and the like can be fully exerted; after the operations such as screen sliding are triggered, the height of the header area can be contracted, and meanwhile, the main content area is moved upwards, so that the area of the main content area in the whole window visible range is enlarged, and the main content can be displayed better. Therefore, through the embodiment of the application, the header area can fully play the due function, and meanwhile, the influence on the display of the main content caused by overlarge occupied page width is avoided.

In the concrete implementation, the rolling inertia transmission triggered by the user can be realized by creating a shadow rolling device for an inner container object instance for displaying the main content, so that the sensing function triggered by the user by the inner container can be disabled, the sensing function is only performed by the shadow rolling device, and then the sensing function is transmitted to the inner container, thereby realizing the control and switching (from translation to content rolling and the like) of the movement mode of the specific main content area, and avoiding the conditions of confusing control and the like possibly occurring in the container nesting process.

In addition, for the case that a plurality of content tags exist in the same target page, different configurations of the header region display modes can be performed on different tags, for example, the header region contraction process can be performed on only one level of tag page, the heights of other tag pages can be kept unchanged, and the like

And under the condition that a plurality of content labels exist in the same target page, the main content corresponding to different labels can be displayed through a plurality of inner containers, so that the efficiency, namely the smoothness in the label switching process, is improved. In addition, the reuse of different labels to the same inner container can be realized, and the occurrence probability of memory swelling is reduced. Under the condition that the high memory is present, some idle containers which are not currently displayed can be recycled, so that the occupation of the memory is reduced.

Of course, not all of the above-described advantages need be achieved at the same time in practicing any one of the products of the present application.

Drawings

In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings that are needed in the embodiments will be briefly described below, and it is obvious that the drawings in the following description are only some embodiments of the present application, and that other drawings can be obtained according to these drawings without inventive effort for a person skilled in the art.

FIG. 1 is a schematic diagram of a system architecture provided by an embodiment of the present application;

FIG. 2 is a flow chart of a client method provided by an embodiment of the present application;

FIG. 3 is a header expansion schematic provided in an embodiment of the present application;

FIG. 4 is another header expansion schematic provided by an embodiment of the present application;

FIG. 5 is a flow chart of container multiplexing provided by an embodiment of the present application;

FIG. 6 is a flowchart of a server method provided in an embodiment of the present application;

FIG. 7 is a schematic diagram of a client device provided in an embodiment of the present application;

fig. 8 is a schematic diagram of a server device provided in an embodiment of the present application;

fig. 9 is a schematic diagram of an electronic device provided in an embodiment of the present application.

Detailed Description

The following description of the embodiments of the present application will be made clearly and fully with reference to the accompanying drawings, in which it is evident that the embodiments described are only some, but not all, of the embodiments of the present application. All other embodiments obtained by a person of ordinary skill in the art based on the embodiments in the present application are within the scope of the protection of the present application.

In the embodiment of the application, in order to more effectively design the header of the page, the purposes of marketing, atmosphere rendering and the like can be more fully achieved, the influence on the display of the main body content in the page due to overlarge occupied plate width is avoided, and a corresponding solution is provided. In the scheme, the header area of the specific page can be designed to be in a telescopic state, and in the initial state, the area of the header area can be larger, so that marketing information display or atmosphere rendering can be more fully performed; after the user triggers operations such as sliding in the page, the user proves that the user possibly has interest in the page and needs to further check the main content, at this time, the height of the header area can be contracted along with the sliding operation of the user, and meanwhile, the main content area can be translated upwards, so that the main content of the page is displayed in a visible range of the screen; after the height of the header area has shrunk to a certain extent, a fixed presentation may be made at that height, and then if the user continues to slide upward, the content in the body content area may be controlled to scroll upward accordingly so that more page content is presented into the viewable range of the window.

Therefore, when a specific header is designed, the problem of occupation of page width is not needed to be considered too much, but the area is considered as a primary factor for displaying marketing information or rendering atmosphere preferentially, so that a user can be firstly subjected to visual impact of content displayed in the header area in an initial state of the page, and further interest for continuing browsing the page is generated. When a specific user starts to slide the page upwards, the "life" of the header area in the aspect of marketing information display or atmosphere rendering is basically finished, so that the window visual range can be reserved for the main content of the page to a greater extent along with gradual contraction of the sliding operation of the user. Therefore, the header area can fully play the role of the header area, and can avoid excessive influence on the display of the main page content.

In specific implementation, referring to fig. 1, the specific implementation in the embodiments of the present application may be implemented by a client of an application program, or a specific functional module within an application program, and so on. For example, if a page is the first page of an application, and the main thread of the application is responsible for the presentation of the page, the relevant processing logic for header expansion described in the embodiments of the present application may be implemented in the application. If a page provided by a specific independent functional module in an application program is required to realize the expansion and contraction function of the header when the page is provided, processing logic specifically related to the expansion and contraction processing of the header can be realized in the related code of the functional module, and other functional modules in the application program are not influenced by the business logic. In addition, if the page is displayed based on a browser, relevant processing logic of specific header area expansion and contraction can be realized in page codes, and the like. In summary, the related processing logic involved in the embodiments of the present application may be implemented on the client side, where the server only needs to provide corresponding support for specific page data or content.

Specific embodiments provided in the embodiments of the present application are described in detail below.

Example 1

First, a method for processing page information is provided in an embodiment of the present application, referring to fig. 2, the method specifically may include:

s201: the method comprises the steps that a client displays a target page, wherein the target page comprises a header area and a main content area;

in a specific implementation, content, data and the like which are specifically required to be displayed in the target page can be obtained from a server, wherein the content or the data which are required to be displayed in a header area, the content or the data which are required to be displayed in a main content area and the like are included.

s202: in a telescopic range corresponding to the header area, carrying out telescopic adjustment on the height of the header area, and carrying out translation processing on the main body content area in the height direction so as to follow the height change of the header area;

s203: after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation.

The telescopic range information of the specific header area may be preset, for example, a maximum height, a minimum height, and the like of the header area may be specifically set, so that the header area may be telescopic between the maximum height and the minimum height. Will remain unchanged after the retraction to the minimum height. In order to enlarge the main content area within the window visible range during the height contraction of the header area, the main content area may be displaced upward as a whole, that is, during this process, the main content area is not scrolled, and when the header area is contracted to the minimum height, the main content area is scrolled in a specific sliding operation direction.

In particular, the above object can be achieved in various ways, for example, in one way, by page container technology. The page container is a container object capable of adding page contents, and can realize various different effects such as page turning, slide show and the like of a small area in a page. In general, container objects may have at least the following main properties:

ID: the ID is a unique identification of the properties, variables, and functions of the call container object.

X: x-coordinates of the container object, the container object X-coordinates are determined according to the origin of coordinates of the parent object and the origin of coordinates of the object. The default is the X coordinate position of the upper left corner of the container object relative to the parent object, and if the origin of coordinates is changed, the X coordinate is the X coordinate of the origin of coordinates of the object relative to the parent object.

Y: the Y-coordinate of the container object is determined according to the origin of coordinates of the parent object and the origin of coordinates of the object. The default is the Y coordinate position of the upper left corner of the container object relative to the parent object, and if the coordinate origin is changed, the Y coordinate is the Y coordinate of the object coordinate origin relative to the parent object.

W: the width of the container object is in pixels. When the association ratio is changed to the width and height, the width and height are changed proportionally.

H: the height of the container object is in pixels. When the association ratio is changed to the width and height, the width and height are changed proportionally.

In particular implementations, multiple container objects may be created in the same page, and different content may be presentation controlled within different container objects. Therefore, in the embodiment of the present application, the above features are utilized first to implement specific expansion and contraction of the header area, and perform relevant processing such as translation and scrolling on the content area of the page body.

Specifically, first, when a target page is displayed, a first container object instance is created for the header area and is used for displaying the content of the header area; in this way, the header area height is telescopically adjusted by adjusting the height change of the first container object instance in response to the slide operation performed on the main body content area.

The specific implementation of the page body content area is relatively complex, because the same container object instance is involved in different processing in different states, some of which require translation, and some of which require scrolling. For the same container object instance, it is often difficult to set two properties at the same time, so a feasible solution is to implement the container nesting method. That is, this is achieved by creating two different container object instances in the same body content area and then controlling the manner of relative movement of the two container object instances. In particular, if two container object instances are simply nested, and both container object instances roll under the sliding operation of the user, the situation of confusion or the phenomenon of jamming and the like may occur, so that the whole page display process is not smooth enough.

To this end, in the embodiment of the present application, a second container object instance and a third container object instance with a binding relationship may be created for the main content area, where a specific second container object may also be a child object of the third container object, and so on. Wherein the second container object instance is for presenting the subject content and in a state in which scrolling is prohibited from being triggered by a user sliding operation, and the third container object instance is for providing a scroller in response to the user sliding operation. That is, the second container object instance is mainly used to present specific page body content and also has a scroll function itself, but cannot be directly triggered to scroll by a sliding operation of the user. In other words, the function of the specific second container object instance for responding to the sliding operation of the user may be set to a disabled state, so that when the user performs the specific sliding operation such as up and down in the page, the user only directly triggers the scrolling of the third container object instance, and the second container object instance needs to determine the telescoping state of the first container object according to the scrolling distance of the third container object instance, and then determine the specific movement mode.

Specifically, the third container object instance rolling device can respond to the sliding operation, when the rolling distance of the rolling device is in the telescopic area, the height synchronous change of the first container object instance is adjusted, and the vertex of the second container object instance in the height direction is displaced by the same rolling distance as the rolling distance of the rolling device; and when the rolling distance of the rolling device is beyond the telescopic area, controlling the second container object instance to synchronously roll along with the rolling device of the third container object instance.

That is, in the above-described scheme provided in the embodiment of the present application, the third container object instance may be regarded as a "shadow" of the second container object instance, scrolling is performed on the "back" of the second container object instance according to the sliding operation performed by the user, and information such as the scrolling distance may be calculated, and accordingly, the motion state of the second container object instance may be controlled according to the information such as the scrolling distance of the third container object instance. As shown in fig. 3, since the bottommost layer of the whole page generally further includes an outer container for initializing each container therein, the second container object instance in the embodiment of the present application may be referred to as an inner container, and the third container object instance may be referred to as a shadow scroller, accordingly. In the embodiment of the application, the composite rolling and the multi-rolling inertia transfer of the user are realized by binding the inner container and the shadow rolling device (the inertia transfer refers to the process of transferring the rolling inertia triggered by the user to the inner container by the shadow rolling device).

Specifically, assuming that the initial state of the page is shown on the left side in fig. 3, the following operations such as sliding the page may be performed, and the specific control procedure may be divided into two stages: phase 1 and phase 2, phase 1 refers to the process of scrolling from point B to point a, and phase 2 refers to the process of scrolling from point C to point B. In stage 1, the distance that the header rolls along with the shadow rolling device is synchronously reduced, and the Y-axis vertex of the inner container is displaced by the same distance as the rolling distance of the shadow rolling device. Stage 2: the inner container rolls synchronously with the rolling of the shadow rolling device.

For a better understanding of the foregoing aspects provided by the embodiments of the present application, the following description is provided by way of example in one specific implementation:

firstly, a calling party (a specific service party is mainly responsible for calling service logic provided by the embodiment of the application and providing specific service contents to be displayed and configuration required by the embodiment of the application, including positions, heights, widths, telescopic ranges and the like of all containers) sends specific service data and configuration contents into an outer container of a target page through creating the outer container of the target page, so that initialization is completed.

Thereafter, the outer container, upon initialization, creates a shadow roller (i.e., the third container object instance described above) that is used to provide transfer of rolling capability and rolling inertia; a header container (first container object instance) is also created, the header container has attribute information of a height value, a width value, a scalable range, and the like, and service contents presented by the header container can be acquired by a back-calling service caller. Furthermore, an inner container (second container object instance) may also be created and bound by associating the inner container with the shadow scroller.

In this way, the expansion and contraction of the head container and the translation or rolling control of the inner container can be realized through the mode provided in the above-mentioned manner in the process of displaying the page.

When the method is specifically implemented, the specific scheme can be applied to various specific scenes, and can be used for controlling corresponding header and main content areas as long as the content needs to be transmitted in the header area or the page width of the header area is required to be high. In addition, in some of these scenarios, the target page may further include a tab toolbar for displaying a plurality of switchable content tabs, so as to switch the content displayed in the main content area by switching the content tab. For example, in a page of a certain functional module provided by the network sales service system, the information of some business circles or markets is mainly used for aggregate display by taking the city where the user is or is selected as a unit. At this time, a first page tag (specifically may be referred to as a first level tag) and a plurality of tags (second level tags) corresponding to specific shopping malls or shopping malls may be provided in the page, in a default state, the main content corresponding to the first page tag may be displayed, and when switching to a second level tag corresponding to a certain shopping mall or shopping mall, the information of the shopping mall or shopping mall may be mainly displayed. In this scenario, some content for rendering a specific atmosphere is usually required to be presented in the header area of the page, especially in the state corresponding to the top page label, in order to be able to attract the user to continue browsing in the label page, or enter a specific mall or browse in the label page of the business district, many content related to the specific atmosphere may be required to be rendered in the header corresponding to the top page label. For example, picture information of a logo business associated with a particular city, or picture or even moving picture information associated with a feature building associated with a city, etc., etc. Of course, since the specific main content area may further include more specific content, the user is guided to click or browse, and the user cannot pay attention to the rendering function of the header area only, but the influence on the main content area is ignored. In this case, therefore, control of the header area and the body content presentation area in particular can be achieved using the scheme provided in the embodiments of the present application.

For example, as shown in FIG. 4, based on the example shown in FIG. 3, the outer container may create a tab toolbar in which each tab for performing a switching operation is presented, in addition to creating a shadow scroller, a header container, and an inner container. As shown in fig. 4, a is the height of the inner container, B is the height of the head container, C is the height of the shadow rolling device, D is the content height of the inner container, E is the content height of the shadow rolling device, J is the rolling position of the inner container, and K is the rolling position of the shadow rolling device. Wherein a=c, d=e, j=k. In the case where the state 1 corresponds, the height B of the head container may be the maximum value, and as the operation of sliding the page upward is performed, the height of the head container is shortened to the minimum value when the state 2 is reached. At the same time, the tag toolbar is also displaced upwards therewith, and when state 2 is reached, the height of the head container will not change any more, nor will the position of the tag toolbar. The inner container is first shifted upward during the transition of the head container from state 1 to state 2 and then begins to roll with the shadow rolling machine. It should be noted that, during the process that the inner container rolls along with the shadow rolling device, the specific main content will roll upwards, during which, the content will roll out of the window visual range continuously, and also the content will enter into the window visual range continuously, but the head container will always exist in the state of the minimum height, and the tab toolbar will still be convenient for switching to other tab pages at any time for browsing. The above description is given by taking the upward sliding process as an example, and in the case of downward sliding, the above is just opposite to the case of upward sliding, which will not be described in detail here.

It should be noted that, in the case that one primary label and a plurality of secondary labels are included in the same page, since each secondary label may be the same or similar to the atmosphere specifically required to be baked under the primary label, in order to avoid resource waste caused by repeating the header scaling operation in the plurality of label pages, respectively, and also to avoid aesthetic fatigue to the user, the height of the header area may be telescopic only when the primary label obtains the display focus, and the height of the header area may be fixed when the secondary label obtains the focus, so that the telescopic process is not required.

In the sub-page display state corresponding to each secondary label, the height of a specific header area can be customized, for example, the specific header area can be configured in configuration information, and the like. Of course, in practical application, if processing such as header expansion and contraction is required to be performed on the sub-page corresponding to the secondary label, the processing can be implemented, and only the corresponding configuration is required in advance.

In addition, in the multi-tag scenario, if related processing such as expansion and contraction of a header is implemented by using a page container technology, in order to obtain a smoother effect in a tag switching process, a plurality of second container object instances may be created for the plurality of content tags, so as to be used for displaying the content corresponding to each content tag through different second container object instances. That is, the main content corresponding to each different label may be displayed in a different second container object instance, so that the efficiency is relatively high and the smoothness of the switching process is improved compared with the manner of switching the content in the same container.

Of course, in practical application, if the number of the built inner containers is excessive, the conditions such as memory storm and the like may be caused, so that in specific implementation, the threshold value of the number of the second container object instances may also be determined; in this way, when a request for switching to a target content tag is received, it may be first determined whether a second container object instance corresponding to the target content tag exists, if so, the content corresponding to the target content tag is displayed by the second container object instance, otherwise, it is determined whether the total number of created second container object instances reaches the threshold, and if not, a second container object instance is created for the target content tag. And if the total number of the created second container object instances reaches the threshold value, selecting a second container object instance from the second container object instances in the idle state at present, and displaying the content corresponding to the target content tag.

That is, each tag page can be guaranteed to correspond to a second container object instance as much as possible under the condition that the memory is allowed, and if the memory is swelled, multiplexing of the second container object instance can be realized on part of the tag pages. In particular implementation, the container multiplexing pool may also be created with respect to the execution of the tag switching operation, so that when a certain tag (tab) is specifically clicked, the following processing may be executed as shown in fig. 5:

Step 1: acquiring a new inner container, and entering a step 2;

step 2: judging whether an inner container corresponding to the tab index exists in the container multiplexing pool, if so, entering the step 3, otherwise, entering the step 4;

step 3: directly using the inner container hit in the multiplexing pool to render, and entering step 11;

step 4: obtaining the maximum number of inner containers, and entering a step 5;

step 5: judging whether the number of inner containers in the multiplexing pool is larger than or equal to the maximum number of inner containers, and entering step 6;

step 6: randomly selecting an inner container which is not the first page in the multiplexing pool, and entering a step 7;

step 7: rendering corresponding service content by using the inner container selected randomly, and executing step 11;

step 8: creating a new inner container, and entering step 9;

step 9: putting the new inner container into a multiplexing pool, and entering step 10;

step 10: rendering corresponding business content by using the newly created inner container, and entering step 11;

step 11: and (5) ending.

In a specific implementation, the number threshold of the second container object instances may be determined according to a preset value, or in another mode, the number threshold of the second container object instances may be determined according to the number of the created second container object instances and the current memory occupation condition of the terminal device. That is, the specific number threshold can be determined according to the actual memory occupation situation instead of adopting a preset fixed value, so that the method can better adapt to the actual running situation in the actual terminal equipment, and is convenient to obtain better display effect and switching efficiency on the premise of avoiding memory storm.

In addition, in the concrete implementation, the memory can be monitored, a memory recycling mechanism is introduced, and after the memory high-order warning is received, the non-currently displayed inner container is recycled, so that the influence on the actual program running condition is avoided. Specifically, the reclaiming process may be performed on the second container object instance currently in the idle state when the memory amount of the terminal device currently located reaches the threshold value. The memory recovery switch may be set in the program, and the judgment and recovery processing may be performed in a state where the switch is turned on. Otherwise, if the switch is not opened, the received memory high-order warning information can be uploaded to the server, and the server performs subsequent processing.

In summary, through the embodiment of the present application, by setting the header area of the page to be telescopic, at the same time, the main body content area of the page may perform a translational motion within the telescopic range of the header area, so as to change the visible area of the main body content area within the visible range of the window, and after the header area stretches to the threshold value, then scroll display is performed on the specific main body content following the specific sliding operation. In this way, in the initial state of the page rendering, the page width occupied by the header area can be larger, so that the effects of atmosphere rendering and the like can be fully exerted; after the operations such as screen sliding are triggered, the height of the header area can be contracted, and meanwhile, the main content area is moved upwards, so that the area of the main content area in the whole window visible range is enlarged, and the main content can be displayed better. Therefore, through the embodiment of the application, the header area can fully play the due function, and meanwhile, the influence on the display of the main content caused by overlarge occupied page width is avoided.

Example two

The second embodiment corresponds to the first embodiment, and from the perspective of the server, a method for processing page information is provided, referring to fig. 6, where the apparatus specifically may include:

s601: the method comprises the steps that a server receives an access request to a target page submitted by a client, wherein the target page comprises a header area and a main body content area;

s602: returning the page data of the target page to the client so that the client can stretch and retract the height of the header area in a stretch range corresponding to the header area in the process of responding to the sliding operation executed on the main content area, and translate the main content area in the height direction so as to follow the height change of the header area; after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation.

For details not described in the second embodiment, please refer to the description in the first embodiment, and the details are not repeated here.

Corresponding to the first embodiment, the embodiment of the present application further provides a page information processing apparatus, referring to fig. 7, where the apparatus specifically may include:

A page display unit 701, configured to display a target page, where the target page includes a header area and a main content area;

a first processing unit 702 configured to, in response to a sliding operation performed on the main body content area, perform telescopic adjustment on the header area height within a telescopic range corresponding to the header area, and perform a translation process on the main body content area in a height direction so as to follow a height change of the header area;

the second processing unit 703 is configured to scroll the main content in the direction of the sliding operation by the main content area after the height of the header area is scaled to a threshold value.

The target page comprises a tag toolbar area and a plurality of content tags, wherein the content tags are used for switching the content displayed in the main content area;

the content tags include a primary tag and at least one secondary tag;

when the primary label obtains a display focus, the height of the header area is telescopic, and when the secondary label obtains the focus, the height of the header area is fixed.

Specifically, the page display unit may specifically include:

a first container creation unit configured to create a first container object instance for the header area for presenting contents of the header area;

the first processing unit may specifically be configured to:

and in the sliding operation process, adjusting the height of the header area by adjusting the height change of the first container object example.

In addition, the page display unit may specifically further include:

a second container creation unit configured to create, for the main body content area, a second container object instance for presenting the main body content in a state in which scrolling is prohibited from being triggered by a user sliding operation, and a third container object instance for providing a scroller in response to the user sliding operation;

the first processing unit may specifically be configured to respond to the sliding operation by using the third container object instance scroller, and adjust a height synchronous change of the first container object instance when a rolling distance of the scroller is within the telescopic range, and make a vertex of the second container object instance in a height direction perform a displacement that is the same as the rolling distance of the scroller;

The second processing unit may be specifically configured to control the second container object instance to scroll synchronously with the scroller of the third container object instance when the rolling distance of the scroller is out of the telescopic range.

In particular, the target page may further include a tab toolbar for displaying a plurality of switchable content tabs, so as to switch the content displayed in the main content area by switching the content tab;

at this time, the page display unit may further be configured to:

and creating a plurality of second container object examples for the plurality of content labels, wherein the second container object examples are used for displaying the content corresponding to each content label through different second container object examples.

Specifically, the page display unit may be configured to:

determining a number threshold for the second container object instance;

and when a request for switching to the target content label is received, judging whether a second container object instance corresponding to the target content label exists, if so, displaying the content corresponding to the target content label through the second container object instance, otherwise, judging whether the total number of the created second container object instances reaches the threshold value, and if not, creating the second container object instance for the target content label.

And if the total number of the created second container object instances reaches the threshold value, selecting a second container object instance from the second container object instances in the idle state at present, and displaying the content corresponding to the target content tag.

The number threshold of the second container object instances can be determined according to the number of the created second container object instances and the memory occupation condition of the terminal equipment where the second container object instances are currently located.

In addition, the apparatus may further include:

and the memory recycling unit is used for recycling the second container object instance in the idle state currently under the condition that the memory amount of the terminal equipment currently located reaches the threshold value.

Compared with the embodiment, the embodiment of the application also provides a page information processing device, referring to fig. 8, the device may include:

a request receiving unit 801, configured to receive an access request submitted by a client to a target page, where the target page includes a header area and a main content area;

a page data returning unit 802, configured to return page data of the target page to the client, so that in a process of responding to a sliding operation performed on the main content area, the client performs telescopic adjustment on a height of the header area within a telescopic range corresponding to the header area, and performs translation processing on the main content area in a height direction so as to follow a height change of the header area; after the height of the header area is stretched to a threshold value, the main content area performs scroll display on the main content in the direction of the sliding operation.

In addition, the embodiment of the application also provides electronic equipment, which comprises:

one or more processors; and

and after the height of the header area stretches to a preset threshold value, the main content area performs rolling display on the main content in the sliding operation direction.

And an electronic device comprising:

one or more processors; and

returning the page data of the target page to the client so that the client can stretch and retract the height of the header area in a stretch range corresponding to the header area in the process of responding to the sliding operation executed on the main content area, and translate the main content area in the height direction so as to follow the height change of the header area; and after the height of the header area stretches to a preset threshold value, the main content area performs rolling display on the main content in the sliding operation direction.

Fig. 9, among other things, illustrates an architecture of an electronic device, for example, device 900 may be a mobile phone, a computer, a digital broadcast terminal, a messaging device, a game console, a tablet device, a medical device, an exercise device, a personal digital assistant, an aircraft, and so forth.

Referring to fig. 9, device 900 may include one or more of the following components: a processing component 902, a memory 904, a power component 906, a multimedia component 908, an audio component 910, an input/output (I/O) interface 912, a sensor component 914, and a communication component 916.

The processing component 902 generally controls overall operation of the device 900, such as operations associated with display, telephone calls, data communications, camera operations, and recording operations. The processing element 902 may include one or more processors 920 to execute instructions to perform all or part of the steps of the methods provided by the disclosed subject matter. Further, the processing component 902 can include one or more modules that facilitate interaction between the processing component 902 and other components. For example, the processing component 902 can include a multimedia module to facilitate interaction between the multimedia component 908 and the processing component 902.

The memory 904 is configured to store various types of data to support operations at the device 900. Examples of such data include instructions for any application or method operating on device 900, contact data, phonebook data, messages, pictures, videos, and the like. The memory 904 may be implemented by any type of volatile or nonvolatile memory device or combination thereof, such as Static Random Access Memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic or optical disk.

The power supply component 906 provides power to the various components of the device 900. Power supply components 906 may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power for device 900.

The multimedia component 908 comprises a screen between the device 900 and the user that provides an output interface. In some embodiments, the screen may include a Liquid Crystal Display (LCD) and a Touch Panel (TP). If the screen includes a touch panel, the screen may be implemented as a touch screen to receive input signals from a user. The touch panel includes one or more touch sensors to sense touches, swipes, and gestures on the touch panel. The touch sensor may sense not only the boundary of a touch or sliding action, but also the duration and pressure associated with the touch or sliding operation. In some embodiments, the multimedia component 908 includes a front-facing camera and/or a rear-facing camera. The front-facing camera and/or the rear-facing camera may receive external multimedia data when the device 900 is in an operational mode, such as a shooting mode or a video mode. Each front camera and rear camera may be a fixed optical lens system or have focal length and optical zoom capabilities.

The audio component 910 is configured to output and/or input audio signals. For example, the audio component 910 includes a Microphone (MIC) configured to receive external audio signals when the device 900 is in an operational mode, such as a call mode, a recording mode, and a voice recognition mode. The received audio signals may be further stored in the memory 904 or transmitted via the communication component 916. In some embodiments, the audio component 910 further includes a speaker for outputting audio signals.

The I/O interface 912 provides an interface between the processing component 902 and peripheral interface modules, which may be keyboards, click wheels, buttons, etc. These buttons may include, but are not limited to: homepage button, volume button, start button, and lock button.

The sensor assembly 914 includes one or more sensors for providing status assessment of various aspects of the device 900. For example, the sensor assembly 914 may detect the on/off state of the device 900, the relative positioning of the components, such as the display and keypad of the device 900, the sensor assembly 914 may also detect the change in position of the device 900 or one component of the device 900, the presence or absence of user contact with the device 900, the orientation or acceleration/deceleration of the device 900, and the change in temperature of the device 900. The sensor assembly 914 may include a proximity sensor configured to detect the presence of nearby objects without any physical contact. The sensor assembly 914 may also include a light sensor, such as a CMOS or CCD image sensor, for use in imaging applications. In some embodiments, the sensor assembly 914 may also include an acceleration sensor, a gyroscopic sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.

The communication component 916 is configured to facilitate communication between the device 900 and other devices, either wired or wireless. The device 900 may access a wireless network based on a communication standard, such as WiFi,2G, or 3G, or a combination thereof. In one exemplary embodiment, the communication part 916 receives a broadcast signal or broadcast-related information from an external broadcast management system via a broadcast channel. In an exemplary embodiment, the communication component 916 further includes a Near Field Communication (NFC) module to facilitate short range communication. For example, the NFC module may be implemented based on Radio Frequency Identification (RFID) technology, infrared data association (IrDA) technology, ultra Wideband (UWB) technology, bluetooth (BT) technology, and other technologies.

In an exemplary embodiment, the apparatus 900 may be implemented by one or more Application Specific Integrated Circuits (ASICs), digital Signal Processors (DSPs), digital Signal Processing Devices (DSPDs), programmable Logic Devices (PLDs), field Programmable Gate Arrays (FPGAs), controllers, microcontrollers, microprocessors, or other electronic elements for executing the methods described above.

In an exemplary embodiment, a non-transitory computer readable storage medium is also provided, such as a memory 904 including instructions executable by the processor 920 of the device 900 to perform the methods provided by the disclosed subject matter. For example, the non-transitory computer readable storage medium may be ROM, random Access Memory (RAM), CD-ROM, magnetic tape, floppy disk, optical data storage device, etc.

From the above description of embodiments, it will be apparent to those skilled in the art that the present application may be implemented in software plus a necessary general purpose hardware platform. Based on such understanding, the technical solutions of the present application may be embodied essentially or in a part contributing to the prior art in the form of a software product, which may be stored in a storage medium, such as a ROM/RAM, a magnetic disk, an optical disk, etc., including several instructions to cause a computer device (which may be a personal computer, a server, or a network device, etc.) to perform the methods described in the embodiments or some parts of the embodiments of the present application.

In this specification, each embodiment is described in a progressive manner, and identical and similar parts of each embodiment are all referred to each other, and each embodiment mainly describes differences from other embodiments. In particular, for a system or system embodiment, since it is substantially similar to a method embodiment, the description is relatively simple, with reference to the description of the method embodiment being made in part. The systems and system embodiments described above are merely illustrative, wherein the elements illustrated as separate elements may or may not be physically separate, and the elements shown as elements may or may not be physical elements, may be located in one place, or may be distributed over a plurality of network elements. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of this embodiment. Those of ordinary skill in the art will understand and implement the present invention without undue burden.

The above detailed description of the page information processing method, device and electronic equipment provided by the present application applies specific examples to illustrate the principles and embodiments of the present application, and the above description of the examples is only used to help understand the method and core ideas of the present application; also, as will occur to those of ordinary skill in the art, many modifications are possible in view of the teachings of the present application, both in the detailed description and the scope of its applications. In view of the foregoing, this description should not be construed as limiting the application.

Claims

1. A page information processing method, characterized by comprising:

2. The method of claim 1, wherein the step of determining the position of the substrate comprises,

the content tags include a primary tag and at least one secondary tag;

3. The method of claim 1, wherein the step of determining the position of the substrate comprises,

the displaying the target page comprises the following steps:

creating a first container object instance for the header area for presenting the contents of the header area;

the method includes, in response to a sliding operation performed on the main content area:

4. The method of claim 3, wherein the step of,

the displaying the target page further includes:

creating a second container object instance and a third container object instance with binding relation for the main content area, wherein the second container object instance is used for displaying the main content and is in a state of prohibiting the triggering of scrolling by a user sliding operation, and the third container object instance is used for providing a scroller to respond to the user sliding operation;

responding to the sliding operation by the third container object instance rolling device, adjusting the height synchronous change of the first container object instance when the rolling distance of the rolling device is in the telescopic range, and making the vertex of the second container object instance in the height direction perform displacement the same as the rolling distance of the rolling device;

and when the rolling distance of the rolling device is out of the telescopic range, controlling the second container object instance to synchronously roll along with the rolling device of the third container object instance.

5. The method of claim 4, wherein the step of determining the position of the first electrode is performed,

the target page comprises a tag toolbar for displaying a plurality of switchable content tags so as to switch the content displayed in the main content area by switching the content tags;

the method further comprises the steps of:

6. The method of claim 5, wherein the step of determining the position of the probe is performed,

The creating a plurality of second container object instances for the plurality of content tags includes:

determining a number threshold for the second container object instance;

7. The method as recited in claim 6, further comprising:

8. The method of claim 6, wherein the step of providing the first layer comprises,

the determining the number threshold of the second container object instances includes:

and determining a quantity threshold value of the second container object instances according to the quantity of the created second container object instances and the memory occupation condition of the terminal equipment where the second container object instances are currently located.

9. The method as recited in claim 5, further comprising:

and under the condition that the memory amount of the terminal equipment currently located reaches a threshold value, recycling the second container object instance currently in the idle state.

10. A page information processing method, characterized by comprising:

11. A page information processing apparatus, characterized by comprising:

12. A page information processing apparatus, characterized by comprising:

13. An electronic device, comprising:

one or more processors; and

14. The electronic device of claim 13, wherein the electronic device comprises a memory device,

the program instructions are further for performing the method of any of claims 2 to 9.

15. An electronic device, comprising:

One or more processors; and