CN113110837A - Method and device for processing page information - Google Patents
Method and device for processing page information Download PDFInfo
- Publication number
- CN113110837A CN113110837A CN202110363718.7A CN202110363718A CN113110837A CN 113110837 A CN113110837 A CN 113110837A CN 202110363718 A CN202110363718 A CN 202110363718A CN 113110837 A CN113110837 A CN 113110837A
- Authority
- CN
- China
- Prior art keywords
- page information
- size
- value
- container
- reference container
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 70
- 238000012545 processing Methods 0.000 title claims abstract description 57
- 238000009877 rendering Methods 0.000 claims abstract description 51
- 238000004364 calculation method Methods 0.000 claims description 12
- 238000004590 computer program Methods 0.000 claims description 11
- 230000010365 information processing Effects 0.000 claims description 4
- 239000000126 substance Substances 0.000 claims description 3
- 230000000694 effects Effects 0.000 abstract description 9
- 238000011161 development Methods 0.000 abstract description 8
- 230000008569 process Effects 0.000 description 13
- 238000010586 diagram Methods 0.000 description 8
- 230000006870 function Effects 0.000 description 7
- 238000004891 communication Methods 0.000 description 6
- 239000012634 fragment Substances 0.000 description 6
- 230000000007 visual effect Effects 0.000 description 5
- 230000003287 optical effect Effects 0.000 description 4
- 230000004048 modification Effects 0.000 description 3
- 238000012986 modification Methods 0.000 description 3
- 230000008901 benefit Effects 0.000 description 2
- 230000008602 contraction Effects 0.000 description 2
- 238000013461 design Methods 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 2
- 239000000835 fiber Substances 0.000 description 2
- 230000000644 propagated effect Effects 0.000 description 2
- 239000004065 semiconductor Substances 0.000 description 2
- 230000000712 assembly Effects 0.000 description 1
- 238000000429 assembly Methods 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 239000013256 coordination polymer Substances 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Human Computer Interaction (AREA)
- Data Mining & Analysis (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The invention discloses a method and a device for processing page information, and relates to the technical field of computers. One embodiment of the method comprises: adding page information to be processed in an application to a reference container, obtaining the actual display size of the page information through rendering the reference container, calculating a boundary value of an element corresponding to the page information according to the set display size, a folding assembly and the actual display size, and dynamically determining a display element and a hidden element of the page information according to the boundary value; the problem of inconsistent folding effect shown by page information containing different characters is solved, the problem of poor compatibility of different terminal screen sizes is solved, the page development efficiency is improved, and the user experience of browsing the page information is improved.
Description
Technical Field
The present invention relates to the field of computer technologies, and in particular, to a method and an apparatus for processing page information.
Background
With the popularization of internet technology, internet applications become indispensable tools in people's work and life, and the internet applications can show various page information through pages. Due to the limited size of the terminal screen for displaying the page, when one or more pieces of page information to be displayed are long, part of the content of the page information is displayed by a folding method, and a folding component is provided to enable a user to switch the folding or unfolding of the content.
The existing method for implementing folding generally utilizes a set display threshold to control the content of page information displayed on a page, for example, a threshold for displaying the number of characters is set, characters below the threshold are displayed, and other characters are hidden; due to the width difference of different characters contained in the page information and the difference of different screen sizes, the existing method for realizing folding by utilizing the set threshold value in the development may cause inconsistent folding effect and has the problem of poor compatibility of different screen sizes, thereby influencing the experience of a user for browsing the page.
Disclosure of Invention
In view of this, embodiments of the present invention provide a method and an apparatus for processing page information, which can add page information to be processed in an application to a reference container, obtain an actual display size of the page information by rendering the reference container, calculate a boundary value of an element corresponding to the page information according to a set display size, a folding component, and the actual display size, and dynamically determine a display element and a hidden element of the page information according to the boundary value; the problem of inconsistent folding effect shown by page information containing different characters is solved, the problem of poor compatibility of different terminal screen sizes is solved, the page development efficiency is improved, and the user experience of browsing the page information is improved.
To achieve the above object, according to an aspect of an embodiment of the present invention, there is provided a method for processing page information, including:
creating a reference container; acquiring page information to be processed, and adding the page information into the reference container; determining a container size of the reference container by rendering the page information contained in the reference container; adding a folding assembly in the reference container when the container size is larger than a set display size; calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size; and processing the page information to be processed according to the folding assembly and the actual display size included by the reference container.
Optionally, the method of processing page information,
calculating an actual display size of the page information for the reference container, comprising:
acquiring each element of the page information, and numbering each element in sequence; acquiring the maximum value of the serial number; calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value; determining display elements by using the boundary values, wherein the elements with the numbers not larger than the boundary values are display elements, and the elements with the numbers larger than the boundary values are hidden elements; calculating an actual display size of the display element.
Optionally, the method of processing page information,
calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value, wherein the boundary value comprises the following steps:
calculating a middle value of the number according to the preset numbering strategy and the maximum value; circularly executing the following steps until the boundary value is acquired:
a: acquiring elements with numbers less than or equal to the intermediate value as current display content;
b: rendering the current display content and the folding component for the reference container, and obtaining the current size of the reference container according to the rendering result;
c: judging whether the current size is larger than the set display size, if so, calculating a middle value of the number according to a preset number strategy and the middle value, taking the middle value as the middle value, and executing the step A; otherwise, executing step D;
d: and calculating the number of elements with the serial numbers less than or equal to the intermediate value, and determining the boundary value according to the number of the elements.
Optionally, the method for processing page information, where determining the boundary value according to the number of elements includes:
updating the current display content, wherein the updated current display content comprises the number of elements which is the number of the elements plus one; re-rendering the updated current display content for the reference container;
updating the current size of the reference container according to the re-rendering result; judging whether the updated current size is larger than the set display size: if so, taking the intermediate value as the boundary value; if not, calculating a middle value of the number between the middle value and the maximum value according to a preset numbering strategy, taking the middle value as the middle value, and executing the step A.
Optionally, the method for processing page information is further characterized by:
storing the demarcation value; and responding to the triggering operation of the page, determining a display element and a hidden element of page information included in the page according to the boundary value, and displaying the display element on the page.
Optionally, the method for processing page information is further characterized by:
when the container size is smaller than the set display size, removing the reference container and the corresponding content.
Optionally, the method for processing page information is characterized in that the processing of the to-be-processed page information includes:
replacing the page information to be processed with the content contained in the reference container; the reference container and corresponding content are removed.
Optionally, the method of processing page information,
determining a display element by using the boundary value aiming at the condition that the page information comprises text information and the elements of the page information are characters, wherein the method comprises the following steps: and determining the number of display characters in the text information by using the boundary value.
Optionally, the method of processing page information,
determining a display element by using the boundary value aiming at the condition that the page information comprises list information and an element of the page information is a list item, wherein the determining comprises the following steps: and determining the number of displayed list items in the list information by using the boundary value.
Optionally, the method for processing page information, where the container size is larger than a set display size, includes: the height of the container size is greater than the height of the set display size; and/or the width of the container size is larger than the width of the set display size.
To achieve the above object, according to a second aspect of the embodiments of the present invention, there is provided an apparatus for processing paging messages, including: the system comprises a rendering container module, a calculation display module and an information processing module; wherein the content of the first and second substances,
the rendering container module is used for creating a reference container; acquiring page information to be processed, and adding the page information into the reference container; determining a container size of the reference container by rendering the page information contained in the reference container;
the calculation display module is used for adding a folding component in the reference container when the size of the container is larger than a set display size; calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size;
and the information processing module is used for processing the page information to be processed according to the folding assembly and the actual display size included by the reference container.
Optionally, the apparatus for processing page information is characterized in that,
calculating an actual display size of the page information for the reference container, comprising:
acquiring each element of the page information, and numbering each element in sequence; acquiring the maximum value of the serial number; calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value; determining display elements by using the boundary values, wherein the elements with the numbers not larger than the boundary values are display elements, and the elements with the numbers larger than the boundary values are hidden elements; calculating an actual display size of the display element.
Optionally, the apparatus for processing page information is characterized in that,
calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value, wherein the boundary value comprises the following steps:
calculating a middle value of the number according to the preset numbering strategy and the maximum value; circularly executing the following steps until the boundary value is acquired:
a: acquiring elements with numbers less than or equal to the intermediate value as current display content;
b: rendering the current display content and the folding component for the reference container, and obtaining the current size of the reference container according to the rendering result;
c: judging whether the current size is larger than the set display size, if so, calculating a middle value of the number according to a preset number strategy and the middle value, taking the middle value as the middle value, and executing the step A; otherwise, executing step D;
d: and calculating the number of elements with the serial numbers less than or equal to the intermediate value, and determining the boundary value according to the number of the elements.
Optionally, the apparatus for processing page information, where determining the boundary value according to the number of elements includes:
updating the current display content, wherein the updated current display content comprises the number of elements which is the number of the elements plus one; re-rendering the updated current display content for the reference container; updating the current size of the reference container according to the re-rendering result; judging whether the updated current size is larger than the set display size: if so, taking the intermediate value as the boundary value; if not, calculating a middle value of the number between the middle value and the maximum value according to a preset numbering strategy, taking the middle value as the middle value, and executing the step A.
Optionally, the apparatus for processing page information further includes:
storing the demarcation value; and responding to the triggering operation of the page, determining a display element and a hidden element of page information included in the page according to the boundary value, and displaying the display element on the page.
Optionally, the apparatus for processing page information further includes:
when the container size is smaller than the set display size, removing the reference container and the corresponding content.
Optionally, the apparatus for processing page information is characterized in that, the processing the to-be-processed page information includes:
replacing the page information to be processed with the content contained in the reference container; the reference container and corresponding content are removed.
Optionally, the apparatus for processing page information is characterized in that,
determining a display element by using the boundary value aiming at the condition that the page information comprises text information and the elements of the page information are characters, wherein the method comprises the following steps: and determining the number of display characters in the text information by using the boundary value.
Optionally, the apparatus for processing page information is characterized in that,
determining a display element by using the boundary value aiming at the condition that the page information comprises list information and an element of the page information is a list item, wherein the determining comprises the following steps: and determining the number of displayed list items in the list information by using the boundary value.
Optionally, the apparatus for processing page information, where the container size is larger than a set display size, includes:
the height of the container size is greater than the height of the set display size; and/or the width of the container size is larger than the width of the set display size.
To achieve the above object, according to a third aspect of the embodiments of the present invention, there is provided an electronic device for processing page information, comprising: one or more processors; storage means for storing one or more programs which, when executed by the one or more processors, cause the one or more processors to implement a method as in any one of the above-described methods of processing page information.
To achieve the above object, according to a fourth aspect of embodiments of the present invention, there is provided a computer readable medium having stored thereon a computer program, characterized in that the program, when executed by a processor, implements the method as any one of the methods of processing page information described above.
One embodiment of the above invention has the following advantages or benefits: the method comprises the steps that page information to be processed in an application can be added to a reference container, the actual display size of the page information is obtained through rendering the reference container, the boundary value of an element corresponding to the page information is calculated according to the set display size, a folding assembly and the actual display size, and the display element and the hidden element of the page information are dynamically determined according to the boundary value; the problem of inconsistent folding effect shown by page information containing different characters is solved, the problem of poor compatibility of different terminal screen sizes is solved, the page development efficiency is improved, and the user experience of browsing the page information is improved.
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 flowchart illustrating a method for processing page information according to an embodiment of the present invention;
FIG. 2 is a flowchart illustrating a process for calculating a boundary value of a page element according to an embodiment of the present invention;
FIG. 3 is a schematic structural diagram of an apparatus for processing page information according to an embodiment of the present invention;
FIG. 4 is an exemplary system architecture diagram in which embodiments of the present invention may be employed;
fig. 5 is a schematic block diagram of a computer system suitable for use in implementing a terminal device or server of an embodiment of the 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.
In the process of developing a web page of an internet application, when the content of a text (e.g., a text introduction) or a list (e.g., an item list) in the web page is long, the user needs to slide and turn pages to view the complete content of the web page due to the limited size of the terminal screen, which is inconvenient. In order to make the user intuitively browse the general overview of the page and increase the speed of searching for the interested content, the design scheme is usually to fold and display the area of the longer content and place an expansion/contraction button (i.e. folding component), and the user can switch the expansion and contraction of the content by clicking the button.
To implement this function, the prior art adopts a method of presetting a number threshold, for example:
(1) for longer text, a threshold number of words is set. Text above the quantity threshold is hidden (i.e., collapsed), and text below the quantity threshold is displayed.
(2) For longer lists, a threshold number of list entries is set. List items above the quantity threshold are hidden (i.e., collapsed), and list items below the quantity threshold are displayed.
Controlling deployment and retraction is actually controlling the magnitude of this number threshold. In the retracted state, the quantity threshold is small; in the deployed state, the number threshold is large. The technical scheme has the following defects:
firstly, the width of characters in the text is dynamic, so that the visual effect of the same folding state is inconsistent. For example: for the number "1" and the letter "M", the width of "M" is larger; also below the number of folds threshold (e.g., 50), 50 "1 s" may occupy 2 rows, while 50 "M" may occupy half of 2 rows. Similarly, the width and height of the list items in the list are dynamic according to the content of the list items, so that the visual effect in the folded state is inconsistent by using the set quantity threshold value.
Second, the number threshold needs to be preset, but due to the difference in rendering effect, the maximum number of words/list items displayed on the screen of the terminal a may not be consistent with the display of the screen of the terminal B, thereby causing the failure of the folding scheme due to the problem of compatibility.
In view of this, as shown in fig. 1, an embodiment of the present invention provides a method for processing page information, where the method may include the following steps:
step S101: creating a reference container; acquiring page information to be processed, and adding the page information into the reference container; determining a container size of the reference container by rendering the page information contained in the reference container.
Specifically, a reference container is created for containing page information to be processed; creating the reference container includes: JavaScript is used for creating an off-screen document fragment which is separated from the document stream, and the position of the off-screen document fragment is translated to the outside of the visual range of the terminal screen in an absolute positioning mode, so that the added page information content of the off-screen document fragment can not appear in the screen after being rendered, and the development flexibility is improved; further, in the off-screen document fragment, an empty block level node (e.g., div block level node) is added as a reference container, and the page information is added to the reference container. Namely, the page information to be processed is acquired, and the page information is added to the reference container.
Further, the page information to be processed may be a longer text, or a longer list; the method used for adding the page information to the reference container may be: reading page information (such as InnerHTML character strings corresponding to long texts or long lists) in the page to be processed by JavaScript, and adding the page information into a reference container by using an interface of DOM (Document Object Model).
Further, rendering the page information contained in the reference container, and determining the container size of the reference container; the rendering operation is completed by the browser; further, the container size of the reference container is determined, for example, the container size of the reference container may be read by JavaScript, including the values of the width and height of the reference container. I.e. by rendering and reading, the container size of the reference container is determined.
Step S102: adding a folding assembly in the reference container when the container size is larger than a set display size; calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size.
Specifically, as described in step S101, the container size of the reference container is determined, that is, the display size of the page information to be processed is determined; further, judging whether the size of the container is larger than a set display size; wherein the setting of the display size is a size of an area for displaying the page information, which is set according to the page layout, of the page information to be processed, for example: the width is 10 and the height is 50. Wherein, judging the container size comprises obtaining the width and height of the container size, comparing the width and height based on the container size with the width or/and height of the set display size to determine whether the container size is larger than the set display size, that is, the container size is larger than the set display size, and comprises: the height of the container size is greater than the height of the set display size; and/or the width of the container size is larger than the width of the set display size.
Further, according to a judgment result, when the size of the container is larger than a set display size, a folding assembly is added into the reference container; it can be understood that, when the size of the container is larger than the set display size, the content of the page information needs to be folded (that is, a part of the page information is displayed, and the rest is hidden), so a folding component needs to be added, so that a user can control the folding of the page information during page operation, wherein the folding component may be an image control or a custom control.
Further, an actual display size of the page information is calculated for the reference container based on the folder component and the set display size such that a sum of the actual display size and a size of the folder component is not greater than the set display size.
Specifically, the actual display size of the page information is determined based on the set display size and the added folding component, wherein the actual display size is the size corresponding to the display part of the page information. For example: the page information is a text containing 1000 characters, and based on the set display size and the added folding component, through calculation, the displayed content is determined to be 200 characters, and then the display size corresponding to 200 characters is the actual display size.
Further, calculating an actual display size of the page information for the reference container, including: acquiring each element of the page information, and numbering each element in sequence; acquiring the maximum value of the serial number; calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value; determining display elements by using the boundary values, wherein the elements with the numbers not larger than the boundary values are display elements, and the elements with the numbers larger than the boundary values are hidden elements; calculating the actual display size of the page information for the reference container, i.e. calculating the actual display size of the display element. For example: the page information is a text containing 1000 characters, and according to the determination result, if the container size corresponding to the page information is larger than the set display size, 1000 characters in the text are obtained (that is, each element of the page information is obtained), and the number of the character is 1000 characters, for example: numbering from 1 to 1000 and obtaining a maximum value of 1000 for the number (i.e., and numbering each of the elements in sequence; obtaining a maximum value for the number); numbered from 1 to 1000; wherein, the serial number is added with 1 in sequence from 1 as the serial number, namely the preset serial number strategy; it is to be understood that the preset numbering strategy may be a sequential discontinuous integer, and the preset numbering strategy is not limited by the present invention.
Further, according to the set display size, the size of the folding assembly, and the maximum number 1000, calculating a boundary value of an element included in the page information, for example, the calculated boundary value is 266; displaying characters numbered 1-266, wherein the characters numbered 1-266 are display elements; hiding the character with the number 267-; namely, determining a display element by using the boundary value; and the elements with the numbers not larger than the dividing values are display elements, and the elements with the numbers larger than the dividing values are hidden elements. That is, for the case that the page information includes text information and the element of the page information is a character, determining a display element by using the boundary value includes: determining the number of display characters in the text information by using the boundary value, for example: 266 is the number of characters displayed.
Further, the page information may also be a list, such as: and calculating the boundary value of the element included in the page information for each list item number according to the set display size, the size of the folding component and the maximum value of the number, wherein the list comprises 100 list items, for example: the calculated boundary value is 26, and the list items numbered 1-26 are display elements; the list items numbered 27-100 are hidden elements, that is, for the case that the page information includes list information and the element of the page information is a list item, determining a display element by using the boundary value, including: determining the number of displayed list items in the list information by using the boundary value; for example: the number of display list items is shown at 26.
Further, the specific description of calculating the boundary values of the elements included in the page information according to the set display size, the size of the folding component, the preset numbering strategy and the maximum value is consistent with the description of step S201 to step S209, and is not repeated here.
When the container size is smaller than the set display size, removing the reference container and the corresponding content. Specifically, whether the size of the container is larger than a set display size is judged, when the size of the container is smaller than the set display size, the page information to be processed is indicated, and the reference container and the corresponding content are removed to release the memory without folding.
Step S103: and processing the page information to be processed according to the folding assembly and the actual display size included by the reference container.
Specifically, the page information to be processed is processed according to the folding assembly included in the reference container and the actual display size obtained through calculation; there may be two methods for processing the page information to be processed:
the first method comprises the following steps: after the content contained in the reference container is replaced with the page information to be processed; the reference container and corresponding content are removed. Specifically, the content of the off-screen document fragment including the reference container is substituted for the inner HTML string corresponding to the original page information to be processed, where the reference container includes the folding component and the calculated boundary value (the boundary value may be an attribute value of the reference container), and further, the off-screen document fragment (including the reference container) is removed to release the memory.
The second method comprises the following steps: and sending the calculated boundary value and the information of the folding component to an application for developing the page to be processed, so that codes in the application automatically generate the folding component through the acquired boundary value and the information of the folding component, and determining a display element and a hidden element based on the boundary value so as to automatically process the folding display of the page information to be processed.
The invention carries out folding calculation according to the set display size set by a developer, automatically carries out folding processing on the part exceeding the size of the container, and can dynamically process the display of characters or list items on the premise of ensuring the visual effect; the compatibility under different rendering conditions can be ensured by automatically calculating according to the content rendering effect displayed by the real screen size; meanwhile, the reference container is utilized, so that the calculation process can be carried out outside the screen, the page is not interfered, the user does not sense, the page development efficiency is improved, and the page rendering performance is considered to the maximum extent.
As shown in fig. 2, an embodiment of the present invention provides a schematic flowchart for calculating a page element boundary value, where the flowchart may include the following steps:
in the process of calculating a page element boundary value provided in this embodiment, numbering is started from 1, and 1 is sequentially added until numbering is added to each element as a preset numbering strategy, and the following steps are described by taking a bisection method as an example of a calculation method.
Step S201: acquiring each element of the page information, and numbering each element in sequence; and acquiring the maximum value of the number.
Specifically, the page information takes text as an example, for example: obtain 1000 characters contained in a text (i.e., obtain each element of the page information), and number 1000 characters, for example: numbered from 1 to 1000 and the maximum value of the number is taken to be 1000 (i.e. and numbered sequentially for each of said elements; the maximum value of said number is taken).
Step S202: and calculating the intermediate value of the number according to the preset numbering strategy and the maximum value.
Specifically, the numbering is that 1 is added sequentially from 1 until each element is numbered, that is, the preset numbering strategy, and further, the maximum value of the obtained numbering is 1000; further, calculating a median value of the number; taking the dichotomy as an example, the maximum value is divided by 2 and rounded to obtain 500 as an intermediate value. Namely, calculating the intermediate value of the number according to the preset number strategy and the maximum value.
Step S203: and obtaining the elements with the numbers less than or equal to the intermediate value as current display contents, rendering the current display contents and the folding assemblies for the reference container, and obtaining the current size of the reference container according to the rendering result.
Specifically, the element with the number less than or equal to the intermediate value is acquired as the current display content, and still taking the example of step S202 as an example, for example: if the intermediate value is 500, acquiring characters (i.e., elements) numbered from 1 to 500 as the current display content; further, rendering the current display content and the folding component for the reference container, and obtaining the current size of the reference container according to a rendering result; for example: the resulting current size of the rendering is 10x 100.
It will be appreciated that when the page information is a list, the steps used are consistent.
Step S204: and judging whether the current size is larger than the set display size.
Specifically, it is determined whether the current size is larger than the set display size, and the description about setting the current size is consistent with the description of step S102, which is not repeated herein.
And judging whether the current size is larger than the set display size, if so, executing step S205, otherwise, executing step S206.
Step S205: and calculating the intermediate value of the number according to the preset numbering strategy and the intermediate value, and taking the intermediate value as the intermediate value.
Specifically, for example, the current size obtained as a result of rendering is 10x100, and the display size is set to 10x 50; it is known that the current size is larger than the set display size. Then, the intermediate value is continuously obtained, and the obtaining method may be that, by using a bisection method, the intermediate value of the number is calculated according to the preset number policy and the intermediate value, and the intermediate value is taken as the intermediate value, for example: if the intermediate value obtained in step S203 is 500, the intermediate value between number 1 and number 500 is calculated, and if the intermediate value obtained by dividing 500 by 2 and rounding is 250, 250 is taken as a new intermediate value and is taken as the intermediate value of the next cycle.
Step S206: updating the current display content, wherein the updated current display content comprises the number of elements which is the number of the elements plus one; re-rendering the updated current display content for the reference container; updating the current size of the reference container according to the result of the re-rendering.
Specifically, when the current size is judged to be smaller than the set display size, the number of display elements of the current display content is obtained by using the intermediate value, and 1 is added (i.e., the current display content is updated) to obtain the updated current display content, for example: the intermediate value is 250, corresponding to 250 characters, the updated current content is 251 characters, the reference container is re-rendered based on the 251 characters, and the current size of the reference container is updated according to the re-rendering result.
Step S207: and judging whether the updated current size is larger than the set display size.
Specifically, based on step S206, the current size is obtained, and it is determined whether the updated current size is larger than the set display size; if yes, go to step S209; otherwise, step S208 is performed.
Step S208: and calculating the intermediate value of the number between the intermediate value and the maximum value according to the preset numbering strategy, and taking the intermediate value as the intermediate value.
Specifically, when the current size after updating is judged to be smaller than the set display size, the intermediate value of the number from the intermediate value to the maximum value is taken, for example: the median value is 500, the maximum value is 1000, and 750 is taken as the median value when the median value of the numbers between the median value and the maximum value is 750 by the dichotomy.
Step S209: and taking the intermediate value as the boundary value.
Specifically, the obtained intermediate value is used as a boundary value, and a display element is determined by using the boundary value, wherein an element with a number not greater than the boundary value is a display element, and an element with a number greater than the boundary value is a hidden element.
Circularly executing the step S201 to the step S209 to determine a boundary value, and further storing the boundary value; and responding to the triggering operation of the page, determining a display element and a hidden element of page information included in the page according to the stored boundary value, and displaying the display element on the page. Specifically, the boundary value is stored, so that when the application processes the page information, the display element and the hidden element of the page information included in the page are determined according to the acquired boundary value.
The description of step S201 to step S209 is:
calculating a middle value of the number according to the preset numbering strategy and the maximum value;
circularly executing the following steps until the boundary value is acquired:
a: acquiring elements with numbers less than or equal to the intermediate value as current display content;
b: rendering the current display content and the folding component for the reference container, and obtaining the current size of the reference container according to the rendering result;
c: judging whether the current size is larger than the set display size, if so, calculating a middle value of the number according to a preset number strategy and the middle value, taking the middle value as the middle value, and executing the step A; otherwise, executing step D;
d: and calculating the number of elements with the serial numbers less than or equal to the intermediate value, and determining the boundary value according to the number of the elements.
Wherein determining the demarcation value according to the number of elements comprises:
updating the current display content, wherein the updated current display content comprises the number of elements which is the number of the elements plus one; re-rendering the updated current display content for the reference container;
updating the current size of the reference container according to the re-rendering result;
judging whether the updated current size is larger than the set display size: if so, taking the intermediate value as the boundary value; if not, calculating a middle value of the number between the middle value and the maximum value according to a preset numbering strategy, taking the middle value as the middle value, and executing the step A.
Therefore, by utilizing the circulation operation, the boundary value can be automatically calculated according to the content rendering effect displayed by the real screen size, so that the display of the characters or list items is dynamically processed on the premise of ensuring the visual effect through the boundary value; therefore, the compatibility under different rendering conditions can be ensured; meanwhile, the reference container is utilized, so that the calculation process can be carried out in the range outside the screen, the page is not interfered, the user does not sense, the page development efficiency is improved, and the page rendering performance is considered to the maximum extent.
As shown in fig. 3, an embodiment of the present invention provides an apparatus 300 for processing page information, including: the method comprises the following steps: a rendering container module 301, a calculation display module 302 and a processing information module 303; wherein the content of the first and second substances,
the render container module 301 is configured to create a reference container; acquiring page information to be processed, and adding the page information into the reference container; determining a container size of the reference container by rendering the page information contained in the reference container;
the calculation display module 302 is configured to add a folding component to the reference container when the container size is larger than a set display size; calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size;
the processing information module 303 is configured to process the page information to be processed according to the folding assembly and the actual display size included in the reference container.
An embodiment of the present invention further provides an electronic device for processing page information, including: one or more processors; the storage device is used for storing one or more programs, and when the one or more programs are executed by the one or more processors, the one or more processors are enabled to realize the method provided by any one of the above embodiments.
Embodiments of the present invention further provide a computer-readable medium, on which a computer program is stored, where the computer program, when executed by a processor, implements the method provided in any of the above embodiments.
Fig. 4 illustrates an exemplary system architecture 400 of a method of processing page information or an apparatus for processing page information to which embodiments of the present invention may be applied.
As shown in fig. 4, the system architecture 400 may include terminal devices 401, 402, 403, a network 404, and a server 405. The network 404 serves as a medium for providing communication links between the terminal devices 401, 402, 403 and the server 405. Network 404 may include various types of connections, such as wire, wireless communication links, or fiber optic cables, to name a few.
A user may use terminal devices 401, 402, 403 to interact with a server 405 over a network 404 to receive or send messages or the like. The terminal devices 401, 402, 403 may have various client applications installed thereon, such as an e-mall client application, a web browser application, a search-type application, an instant messaging tool, a mailbox client, and the like.
The terminal devices 401, 402, 403 may be various electronic devices having display screens and supporting various client applications, including but not limited to smart phones, tablet computers, laptop portable computers, desktop computers, and the like.
The server 405 may be a server providing various services, such as a background management server providing support for client applications used by users with the terminal devices 401, 402, 403. The background management server can process the received request for displaying the page information and feed back the page information responding to the request to the terminal equipment.
It should be noted that the method for processing page information provided by the embodiment of the present invention is generally executed by the terminal devices 401, 402, and 403, and accordingly, the apparatus for processing page information is generally disposed in the terminal devices 401, 402, and 403.
It should be understood that the number of terminal devices, networks, and servers in fig. 4 is merely illustrative. There may be any number of terminal devices, networks, and servers, as desired for implementation.
Referring now to FIG. 5, shown is a block diagram of a computer system 500 suitable for use with a terminal device implementing an embodiment of the present invention. The terminal device shown in fig. 5 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. 5, the computer system 500 includes a Central Processing Unit (CPU)501 that can perform various appropriate actions and processes according to a program stored in a Read Only Memory (ROM)502 or a program loaded from a storage section 508 into a Random Access Memory (RAM) 503. In the RAM 503, various programs and data necessary for the operation of the system 500 are also stored. The CPU 501, ROM 502, and RAM 503 are connected to each other via a bus 504. An input/output (I/O) interface 505 is also connected to bus 504.
The following components are connected to the I/O interface 505: an input portion 506 including a keyboard, a mouse, and the like; an output portion 507 including a display such as a Cathode Ray Tube (CRT), a Liquid Crystal Display (LCD), and the like, and a speaker; a storage portion 508 including a hard disk and the like; and a communication section 509 including a network interface card such as a LAN card, a modem, or the like. The communication section 509 performs communication processing via a network such as the internet. The driver 510 is also connected to the I/O interface 505 as necessary. A removable medium 511 such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, or the like is mounted on the drive 510 as necessary, so that a computer program read out therefrom is mounted into the storage section 508 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 may be downloaded and installed from a network through the communication section 509, and/or installed from the removable medium 511. The computer program performs the above-described functions defined in the system of the present invention when executed by the central processing unit (CP U) 501.
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 and/or units described in the embodiments of the present invention may be implemented by software, and may also be implemented by hardware. The described modules and/or units may also be provided in a processor, and may be described as: a processor includes a render container module, a compute display module, and a process information module. The names of these modules do not in some cases constitute a limitation to the module itself, and for example, the processing information module may be further described as "a module for processing page information, which is a folding component included in the reference container, and an actual display size".
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: creating a reference container; acquiring page information to be processed, and adding the page information into the reference container; determining a container size of the reference container by rendering the page information contained in the reference container; adding a folding assembly in the reference container when the container size is larger than a set display size; calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size; and processing the page information to be processed according to the folding assembly and the actual display size included by the reference container.
The method comprises the steps that page information to be processed in an application can be added to a reference container, the actual display size of the page information is obtained through rendering the reference container, the boundary value of an element corresponding to the page information is calculated according to the set display size, a folding assembly and the actual display size, and the display element and the hidden element of the page information are dynamically determined according to the boundary value; the problem of inconsistent folding effect shown by page information containing different characters is solved, the problem of poor compatibility of different terminal screen sizes is solved, the page development efficiency is improved, and the user experience of browsing the page information is improved.
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 (13)
1. A method for processing page information, comprising:
creating a reference container;
acquiring page information to be processed, and adding the page information into the reference container;
determining a container size of the reference container by rendering the page information contained in the reference container;
adding a folding assembly in the reference container when the container size is larger than a set display size;
calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size;
and processing the page information to be processed according to the folding assembly and the actual display size included by the reference container.
2. The method of claim 1,
calculating an actual display size of the page information for the reference container, comprising:
acquiring each element of the page information, and numbering each element in sequence; acquiring the maximum value of the serial number;
calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value;
determining display elements by using the boundary values, wherein the elements with the numbers not larger than the boundary values are display elements, and the elements with the numbers larger than the boundary values are hidden elements;
calculating an actual display size of the display element.
3. The method of claim 2,
calculating a boundary value of an element included in the page information according to the set display size, the size of the folding assembly, a preset numbering strategy and the maximum value, wherein the boundary value comprises the following steps:
calculating a middle value of the number according to the preset numbering strategy and the maximum value;
circularly executing the following steps until the boundary value is acquired:
a: acquiring elements with numbers less than or equal to the intermediate value as current display content;
b: rendering the current display content and the folding component for the reference container, and obtaining the current size of the reference container according to the rendering result;
c: judging whether the current size is larger than the set display size, if so, calculating a middle value of the number according to a preset number strategy and the middle value, taking the middle value as the middle value, and executing the step A; otherwise, executing step D;
d: and calculating the number of elements with the serial numbers less than or equal to the intermediate value, and determining the boundary value according to the number of the elements.
4. The method of claim 3, wherein determining the cutoff value based on the number of elements comprises:
updating the current display content, wherein the updated current display content comprises the number of elements which is the number of the elements plus one;
re-rendering the updated current display content for the reference container;
updating the current size of the reference container according to the re-rendering result;
judging whether the updated current size is larger than the set display size: if so, taking the intermediate value as the boundary value; if not, calculating a middle value of the number between the middle value and the maximum value according to a preset numbering strategy, taking the middle value as the middle value, and executing the step A.
5. The method of claim 3 or 4, further comprising:
storing the demarcation value;
and responding to the triggering operation of the page, determining a display element and a hidden element of page information included in the page according to the boundary value, and displaying the display element on the page.
6. The method of claim 1, further comprising:
when the container size is smaller than the set display size, removing the reference container and the corresponding content.
7. The method according to claim 1, wherein processing the page information to be processed comprises:
replacing the page information to be processed with the content contained in the reference container;
the reference container and corresponding content are removed.
8. The method of claim 2,
for the case that the page information includes text information and the elements of the page information are characters,
determining a display element using the bounding value, comprising:
and determining the number of display characters in the text information by using the boundary value.
9. The method of claim 2,
for the case that the page information includes list information and the elements of the page information are list items,
determining a display element using the bounding value, comprising:
and determining the number of displayed list items in the list information by using the boundary value.
10. The method of claim 1, wherein the container size is larger than a set display size, comprising:
the height of the container size is greater than the height of the set display size;
and/or the presence of a gas in the gas,
the width of the container size is larger than the width of the set display size.
11. An apparatus for processing page information, comprising: the system comprises a rendering container module, a calculation display module and an information processing module; wherein the content of the first and second substances,
the rendering container module is used for creating a reference container; acquiring page information to be processed, and adding the page information into the reference container; determining a container size of the reference container by rendering the page information contained in the reference container;
the calculation display module is used for adding a folding component in the reference container when the size of the container is larger than a set display size; calculating an actual display size of the page information for the reference container based on the collapsed component and the set display size such that a sum of the actual display size and a size of the collapsed component is not greater than the set display size;
and the information processing module is used for processing the page information to be processed according to the folding assembly and the actual display size included by the reference container.
12. 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-10.
13. 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-10.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110363718.7A CN113110837A (en) | 2021-04-02 | 2021-04-02 | Method and device for processing page information |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110363718.7A CN113110837A (en) | 2021-04-02 | 2021-04-02 | Method and device for processing page information |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113110837A true CN113110837A (en) | 2021-07-13 |
Family
ID=76713829
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110363718.7A Pending CN113110837A (en) | 2021-04-02 | 2021-04-02 | Method and device for processing page information |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113110837A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114356327A (en) * | 2021-12-29 | 2022-04-15 | 上海万物新生环保科技集团有限公司 | React visual area rendering method and device |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20060209212A1 (en) * | 2005-03-16 | 2006-09-21 | Fujitsu Limited | Apparatus for presenting information and method thereof |
| US20130238609A1 (en) * | 2012-03-07 | 2013-09-12 | Microsoft Corporation | Query result rendering |
| CN104484360A (en) * | 2014-12-02 | 2015-04-01 | 百度在线网络技术（北京）有限公司 | Acquiring method and device of parameter information |
| CN105893602A (en) * | 2016-04-21 | 2016-08-24 | 北京京东尚科信息技术有限公司 | Full screen displaying method and full screen displaying system for diagram in webpage applied to terminal browser |
| US20180052943A1 (en) * | 2016-08-18 | 2018-02-22 | Qualcomm Incorporated | Systems and methods for controlling webpage pre-rendering |
| CN107885799A (en) * | 2017-10-30 | 2018-04-06 | 维沃移动通信有限公司 | Info web display methods and device |
| CN110717120A (en) * | 2018-07-12 | 2020-01-21 | 北京京东尚科信息技术有限公司 | Webpage list display method and device |
| CN111026396A (en) * | 2019-12-13 | 2020-04-17 | 北京小米移动软件有限公司 | Page rendering method and device, electronic equipment and storage medium |
-
2021
- 2021-04-02 CN CN202110363718.7A patent/CN113110837A/en active Pending
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20060209212A1 (en) * | 2005-03-16 | 2006-09-21 | Fujitsu Limited | Apparatus for presenting information and method thereof |
| US20130238609A1 (en) * | 2012-03-07 | 2013-09-12 | Microsoft Corporation | Query result rendering |
| CN104484360A (en) * | 2014-12-02 | 2015-04-01 | 百度在线网络技术（北京）有限公司 | Acquiring method and device of parameter information |
| CN105893602A (en) * | 2016-04-21 | 2016-08-24 | 北京京东尚科信息技术有限公司 | Full screen displaying method and full screen displaying system for diagram in webpage applied to terminal browser |
| US20180052943A1 (en) * | 2016-08-18 | 2018-02-22 | Qualcomm Incorporated | Systems and methods for controlling webpage pre-rendering |
| CN107885799A (en) * | 2017-10-30 | 2018-04-06 | 维沃移动通信有限公司 | Info web display methods and device |
| CN110717120A (en) * | 2018-07-12 | 2020-01-21 | 北京京东尚科信息技术有限公司 | Webpage list display method and device |
| CN111026396A (en) * | 2019-12-13 | 2020-04-17 | 北京小米移动软件有限公司 | Page rendering method and device, electronic equipment and storage medium |
Non-Patent Citations (1)
| Title |
|---|
| 冯兴利;洪丹丹;罗军锋;锁志海;: "自适应网页设计中的关键技术", 计算机应用, no. 1, 10 June 2016 (2016-06-10) * |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114356327A (en) * | 2021-12-29 | 2022-04-15 | 上海万物新生环保科技集团有限公司 | React visual area rendering method and device |
| CN114356327B (en) * | 2021-12-29 | 2024-05-17 | 上海万物新生环保科技集团有限公司 | Method and equipment for rendering real visible area |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US9766778B2 (en) | Method and apparatus for rapid access to a contact in a contact list | |
| CN109933322B (en) | Page editing method and device and computer readable storage medium | |
| CN109669617B (en) | Method and device for switching pages | |
| CN110389807B (en) | Interface translation method and device, electronic equipment and storage medium | |
| CN109145272B (en) | Text rendering and layout method, device, equipment and storage medium | |
| CN113536173B (en) | Page processing method and device, electronic equipment and readable storage medium | |
| KR20160086842A (en) | Resizing technique for display content | |
| CN113760276A (en) | Method and device for generating page code | |
| EP3654175A1 (en) | Terminal device, ui extension method, and ui extension program | |
| CN113382083A (en) | Webpage screenshot method and device | |
| CN115935925A (en) | Form adapting method, electronic device and computer readable storage medium | |
| CN110489162B (en) | Method, device, medium and equipment for simplifying installation package SO (storage and retrieval) file | |
| CN113110837A (en) | Method and device for processing page information | |
| JP2011086050A (en) | Information processing terminal and computer program | |
| CN111078219B (en) | Page display method, device and system, electronic equipment and storage medium | |
| CN112256370A (en) | Information display method and device and electronic equipment | |
| CN111367606A (en) | Application page display method, device, terminal and medium | |
| CN110647327A (en) | Method and device for dynamic control of user interface based on card | |
| CN112256254A (en) | Method and device for generating layout code | |
| CN111506841A (en) | Webpage display method, device and equipment and readable storage medium | |
| CN112528593B (en) | Document processing method, device, electronic equipment and storage medium | |
| CN114489639A (en) | File generation method, device, equipment and storage medium | |
| CN113642289A (en) | Text typesetting method and device, electronic equipment, server and storage medium | |
| CN113361286A (en) | Information prompting method and device | |
| CN109783100B (en) | Method and device for checking user interface element attribute and electronic equipment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |