Data scrolling method, device and computer equipment based on virtual list

Abstract

This article relates to a data scrolling method, device and computer equipment based on a virtual list. The method includes extracting part of the data from the pre-stored data to be displayed according to the user's access needs, rendering and displaying it by the virtual list; determining the scrolling distance between the specified data in the current display area where the user slides and the first data rendered by the virtual list; when the scrolling distance exceeds the first preset distance threshold, adding a data return scrolling identifier in the display area; when the user clicks on the data return scrolling identifier, setting the data return scrolling speed according to the scrolling distance value; scrolling the data rendered in the virtual list from the display area back to the first data. This solution records the list data sequence number and scrolling distance. For the case of exceeding the rendering data threshold, it first returns to the threshold, and then sets the scrolling distance of each step back to the first data. While avoiding the white screen due to untimely rendering during the scrolling process, it also achieves the effect of dynamic scrolling back to the top.

Description

Technical Field

[0001] The present invention relates to the field of program development, and in particular to a data scrolling method, device and computer equipment based on a virtual list. Background Art

[0002] There are many methods for simulating returning to the top of a list on current technical forums and websites. These technologies all rely on the scenario where the data items loaded in the div exceed the visible area and a scroll bar appears in the div. In the process of returning to the top, the scroll bar needs to be operated to return to the top of the list.

[0003] Without considering device performance, existing technologies prioritize using lists to load and render all data. When a scroll bar appears in the container div due to excessive data being loaded and rendered, exceeding the device's display area, the list can be quickly returned to the top by scrolling. However, due to device performance limitations, loading more than a certain amount of data can lead to memory overflow, resulting in page errors such as a blank screen.

[0004] In view of the problem in the current technology that a scroll bar needs to be operated to return to the top of a list and a white screen appears, a data scrolling method and device based on a virtual list is needed. Summary of the Invention

[0005] To solve the above-mentioned problems of the prior art, embodiments of this document provide a data scrolling method, apparatus, computer device, computer-readable storage medium, and computer program product based on a virtual list.

[0006] An embodiment of the present invention provides a data scrolling method based on a virtual list, the method comprising: extracting part of the data to be displayed from pre-stored data according to user access requirements, rendering the data in a virtual list, and displaying the data in a display area, wherein the virtual list updates the rendered data and displays it as the user access requirements change; determining the scrolling distance between the specified data in the current display area slid by the user and the first data rendered by the virtual list; when the scrolling distance exceeds a first preset distance threshold, adding a data return scrolling identifier in the current display area; when the user clicks the data return scrolling identifier, setting the data return scrolling speed according to the value of the scrolling distance; and scrolling the data rendered in the virtual list from the display area back to the first row of data according to the data return scrolling speed and the scrolling distance.

[0007] According to one aspect of the embodiments of this document, determining the scrolling distance between the specified data of the current display area slid by the user and the first data rendered in the virtual list includes: setting a data serial number for each item of the data to be displayed; determining the scrolling distance between the current display area and the first data rendered in the virtual list based on the serial number of the specified data, the serial number of the first data and the data capacity of the current display area, wherein the data capacity is the amount of data that the current display area can accommodate.

[0008] According to one aspect of the embodiments of this document, determining the data capacity of the current display area includes: obtaining the model of the user-end device and the data font format set by the user; determining the size of the user-end display area based on the model of the user-end device; and determining the amount of data that can be accommodated in the user-end display area based on the data font format set by the user.

[0009] According to one aspect of the embodiments of this document, when the user clicks the data return scrolling indicator, setting the data return scrolling speed according to the scrolling distance value includes: determining the length occupied by all the data to be displayed according to the serial numbers of all the data to be displayed and the data capacity of the current display area; judging whether the ratio of the scrolling distance value to the length occupied by all the data to be displayed exceeds a first preset ratio; if the ratio does not exceed the first preset ratio, setting the first scrolling speed for data return; judging whether the ratio exceeds a second preset ratio, if the ratio is greater than the first preset ratio but does not exceed the second preset ratio, setting the second scrolling speed for data return; if the ratio is greater than the second preset ratio, setting the third scrolling speed for data return.

[0010] According to one aspect of the embodiments of this document, scrolling the rendered data of the virtual list back to the first data in the display area according to the return scrolling speed and the scrolling distance includes: when the ratio does not exceed a first preset ratio, scrolling the rendered data back according to the value of the scrolling distance and the first scrolling speed; when the ratio is greater than the first preset ratio, scrolling the rendered data back according to a second preset distance threshold and the second scrolling speed or the third scrolling speed.

[0011] According to one aspect of the embodiments of this document, the method further includes: determining the data return scrolling speed according to the hardware performance of the device to which the display area belongs, or determining the data return scrolling speed according to the height of the rendered data of the virtual list.

[0012] According to one aspect of the embodiments of this document, the first preset distance threshold is an integer multiple of the size of the display area.

[0013] According to one aspect of the embodiments of this document, the method further includes: obtaining specific data of the user in the current display area, the specific data being data marked by the user; and scrolling the data rendered in the virtual list from the display area back to the specific data based on the scrolling speed and scrolling distance of the data.

[0014] An embodiment of the present invention provides a data scrolling device based on a virtual list, the device comprising: a data display unit, for extracting part of the data to be displayed from pre-stored data to be displayed according to user access requirements, rendering the data in a virtual list, and displaying the data in a display area, wherein the virtual list updates the rendered data and displays it as the user access requirements change; a distance determination unit, for determining the scrolling distance between the specified data in the current display area slid by the user and the first data rendered by the virtual list; a data return scrolling identifier adding unit, for adding a data return scrolling identifier in the current display area when the scrolling distance exceeds a first preset distance threshold; a return scrolling speed setting unit, for setting the data return scrolling speed according to the value of the scrolling distance when the user clicks the data return scrolling identifier; and a return scrolling unit, for scrolling the data rendered in the virtual list from the display area back to the first data according to the data return scrolling speed and the scrolling distance.

[0015] An embodiment of the present invention provides a computer device, including a memory, a processor, and a computer program stored in the memory and executable on the processor. When the processor executes the computer program, the method for data scrolling based on a virtual list is implemented.

[0016] An embodiment of the present invention provides a computer-readable storage medium storing a computer program. When the computer program is executed by a processor, the method for scrolling data based on a virtual list is implemented.

[0017] An embodiment of the present invention provides a computer program product, which includes a computer program. When the computer program is executed by a processor, the method for scrolling data based on a virtual list is implemented.

[0018] This solution, based on virtual list technology and scenarios, records the serial number of the currently displayed list data and the distance between the scrolled data and the first data. If the rendering data threshold set by the virtual list is exceeded, it will first return to the threshold and then return to the first data by setting the scrolling distance for each step. This avoids the white screen due to untimely rendering during the scrolling process and also achieves the effect of dynamic scrolling back to the top. BRIEF DESCRIPTION OF THE DRAWINGS

[0019] In order to more clearly illustrate the technical solutions in the embodiments of this article or the prior art, the following briefly introduces the drawings required for use in the embodiments or the description of the prior art. Obviously, the drawings described below are only some embodiments of this article. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.

[0020] Figure 1 The figure shows a flow chart of a data scrolling method based on a virtual list according to an embodiment of this invention;

[0021] Figure 2 The figure shows a flow chart of a method for determining a scrolling distance according to an embodiment of the present invention;

[0022] Figure 3 FIG2 is a flow chart of a method for determining the data capacity of the current display area according to an embodiment of the present invention;

[0023] Figure 4 The figure shows a flow chart of a method for setting the data return scrolling speed according to an embodiment of the present invention;

[0024] Figure 5 The figure shows a flow chart of a method for scrolling data back to the first data in a display area according to an embodiment of the present invention;

[0025] Figure 6 FIG2 is a flow chart of a method for determining a data return scrolling speed according to an embodiment of the present invention;

[0026] Figure 7 The figure shows a flow chart of a data scrolling method based on a virtual list according to an embodiment of this invention;

[0027] Figure 8 FIG2 is a schematic diagram showing the structure of a data scrolling device based on a virtual list according to an embodiment of the present invention;

[0028] Figure 9 FIG2 is a schematic diagram showing a specific structure of a data scrolling device based on a virtual list according to an embodiment of the present invention;

[0029] Figure 10 Shown is a structural diagram of a computer device according to an embodiment of this invention.

[0030] Description of the accompanying symbols:

[0031] 801, data display unit;

[0032] 802, scroll distance determination unit;

[0033] 8021, data sequence number setting module;

[0034] 8022, display area data capacity determination module;

[0035] 803. Data return scrolling identification adding unit;

[0036] 804. Return to the scroll speed setting unit;

[0037] 8041, hardware performance acquisition module;

[0038] 8042, rendering data height acquisition module;

[0039] 805. Return to the scroll unit;

[0040] 1002. Computer equipment;

[0041] 1004, processor;

[0042] 1006. Memory;

[0043] 1008, driving mechanism;

[0044] 1010, input / output module;

[0045] 1012. Input device;

[0046] 1014. Output device;

[0047] 1016. Presentation equipment;

[0048] 1018. Graphical user interface;

[0049] 1020, network interface;

[0050] 1022, communication link;

[0051] 1024. Communication bus. DETAILED DESCRIPTION

[0052] In order to help those skilled in the art better understand the technical solutions in this specification, the technical solutions in the embodiments of this specification will be clearly and completely described below in conjunction with the drawings in the embodiments of this specification. Obviously, the embodiments described are only part of the embodiments of this specification, not all of the embodiments. Based on the embodiments of this specification, all other embodiments obtained by ordinary technicians in this field without making creative efforts shall fall within the scope of protection of this specification.

[0053] It should be noted that the terms "first," "second," and the like in the specification and claims herein and in the accompanying drawings are used to distinguish similar objects and are not necessarily used to describe a particular order or precedence. It should be understood that the terms used in this manner are interchangeable where appropriate so that the embodiments of the present invention described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having," as well as any variations thereof, are intended to cover non-exclusive inclusions. For example, a process, method, apparatus, product, or device comprising a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units that are not explicitly listed or that are inherent to these processes, methods, products, or devices.

[0054] This specification provides method operation steps as described in the embodiments or flowcharts, but more or fewer operation steps may be included based on routine or non-creative work. The order of steps listed in the embodiments is only one way of executing the steps among many orderings and does not represent the only execution order. When a system or device product is actually executed, the method can be executed in the order shown in the embodiments or the drawings or in parallel.

[0055] It should be noted that the virtual list-based data scrolling method described herein can be used in both the program development field and the financial field. This document does not limit the application areas of the virtual list-based data scrolling method and device. The acquisition, storage, use, and processing of data in this application's technical solution comply with relevant national laws and regulations.

[0056] Figure 1 The data scrolling method based on a virtual list in the embodiment of this article is shown, which specifically includes the following steps:

[0057] Step 101, based on the user's access needs, extract part of the data to be displayed from the pre-stored data to be displayed, render it by a virtual list and display it in the display area, wherein the virtual list updates the rendered data and displays it as the user's access needs change. In this step, the data to be displayed is stored in the database of the server. Based on the user's access needs, extract part of the data to be displayed from the pre-stored data to be displayed in the database into the memory, and further display it in the display area of the user end. Specifically, the virtual list extracts part of the data from a large amount of pre-stored data to be displayed into the memory, and establishes a DOM tree. The virtual list operates the DOM tree, renders the extracted data, and displays it in the display area of the user end. The DOM tree is a tree structure stored in the memory and used to represent all the content in the web page, etc.

[0058] Among them, the virtual list is a technology for on-demand display. The virtual list can render only the list data in the display area into a DOM tree according to the user's scrolling operation in the display area, and partially render the data outside the display area, or immediately destroy the rendered DOM to release memory and optimize performance. In some embodiments of the present specification, the virtual list mainly ensures the rendering and update of the data in the virtual list by continuously destroying and creating new DOM objects. Since the virtual list does not always establish DOM objects, the height of the actual rendered DOM tree is limited. For example, the height of the display area is 550px, and the height of a list item data is 55px, then the user can only see the data corresponding to a maximum of 10 list items in the display area. When rendering, the virtual list needs to render the data of 10 list items at a time and destroy the previous DOM to save memory.

[0059] In some embodiments of the present specification, the height of the DOM tree actually rendered by the virtual list or the number of rows of the actually rendered list data will be set according to the size and height of the display area on the user end, and whether the data currently in the display area has exceeded the height of the DOM tree actually rendered by the virtual list is determined by the scrolling distance or the sequence number of the data displayed in the display area.

[0060] In this step, the virtual list extracts partial data from the database, renders it, and displays it in the display area. The data in the display area is list data. Specifically, list data refers to the data that needs to be displayed to the user in list form on the display area. In some embodiments of this specification, the list data may be transfer record data. The information in each row of the list data includes, but is not limited to, payment name, payee account number, payee name, payee account number, transfer amount, and notes.

[0061] Step 102, determining the scrolling distance between the specified data in the current display area swiped by the user and the first data rendered by the virtual list. In this step, the user swipes up or down on the display area by clicking or touching the user-side display device. As the user slides, the data appearing in the display area may be different and constantly changing. Taking the first data rendered by the virtual list as the first data, this step needs to determine the scrolling distance between a specific data in the current display area swiped by the user and the first data rendered by the virtual list.

[0062] In this specification, the data displayed in the display area can be presented in the form of one column and multiple rows of data, or in the form of multiple columns and multiple rows of data. Regardless of the form in which the data is presented in the display area, the first data in this step is always the first data rendered in the virtual list. In this step, the specified data in the display area can be specific data specified by the user, or it can be randomly specified data pre-set by the system or server. For example, the specific data specified by the user is a specific word, number or letter selected by the user; for another example, the specified data pre-set by the system or server at any time is: the 100th word, number or letter in the display area, or the 80th row of data in the display area, etc. This application does not limit the method and form of determining the specified data in the display area.

[0063] Step 103, when the scrolling distance exceeds the first preset distance threshold, add data to the current display area and return the scrolling identifier. This step determines the scrolling distance between the specified data in the current display area and the first data rendered by the virtual list. If the scrolling distance exceeds the first preset distance, add data to the current display area where the user is staying and return the scrolling identifier. Specifically, the first preset distance threshold can be determined based on the height of the DOM tree rendered by the virtual list or the number of rows of list data actually rendered by the virtual list. If the scrolling distance exceeds the first preset distance threshold, the scrolling identifier can be returned by operating the data. In some embodiments of the present specification, the first preset distance threshold can be an integer multiple of the size of the display area. In some other embodiments of the present specification, the first preset distance threshold can also be the preset number of rows of data items supported for rendering by the virtual list, or the height of the maximum number of rows of data items rendered. For example, if the height of the maximum number of data item rendering functions of the DOM tree supported for rendering by the virtual list is 30 rows, then the first preset distance threshold can be set to 30 rows.

[0064] In step 104, when the user clicks the data return scrolling indicator, the data return scrolling speed is set based on the scrolling distance. In this step, the system further determines the scrolling distance in step 103 based on the user's click on the data return scrolling indicator and sets the corresponding data return scrolling speed. Specifically, the larger the scrolling distance, the faster the data return scrolling speed is set; the smaller the scrolling distance, the slower the data return scrolling speed is set.

[0065] Step 105: Scroll the rendered data in the virtual list back from the display area to the first data item based on the data return scrolling speed and the scrolling distance. Based on the scrolling distance and data return scrolling distance determined in the previous steps, control the scrolling of all previously rendered data in the virtual list. Visually, the data in the current display area is returned to the first data item. During this process, all previously rendered data is quickly displayed in the current display area during the scrolling process, and the data item is ultimately returned to the first rendered data item.

[0066] Figure 2 The flowchart of a method for determining a scrolling distance according to an embodiment of the present invention is shown, which specifically includes the following steps:

[0067] Step 201: Assign a data sequence number to each item of data to be displayed. In this step, the data in the virtual list is uniquely numbered. Once each item of data has a data sequence number, no matter how the user scrolls through the data in the current display area, the data in the display area will have a unique, unchanging sequence number.

[0068] Step 202, based on the sequence number of the specified data, the sequence number of the first data and the data capacity of the current display area, determine the scrolling distance between the current display area and the first row of data rendered by the virtual list, wherein the data capacity is the amount of data that the current display area can accommodate. In this step, when the specified data is displayed in the display area, it has been rendered by the virtual list using DOM, so the specified data also has its data sequence number. Further, based on the sequence number of the first data rendered by the virtual list determined in the aforementioned steps, the sequence number of the specified data in the current display area, and the data capacity of the current display area, determine the scrolling distance. Among them, the sequence number of the first data is 1, and based on the sequence number of the specified data of the current page and the sequence number of the first data, it can be determined which data the specified data of the current page is rendered by the virtual list.

[0069] Because the display areas of different users' client terminals have different sizes, and different users have different reading and browsing preferences, the font sizes of the data displayed in the user segment may have different settings and jumps. After determining the size and font size of the user's current display area, the data capacity of the current display area can be determined, that is, how much data the current page can accommodate. Furthermore, after the aforementioned steps have determined that the specified data of the current page is the number of data rendered in the virtual list, the scrolling distance between the current display area and the first data can be determined based on the data capacity of the current display area. That is, determine the distance between the current display area and the first data.

[0070] Figure 3The flowchart of a method for determining the data capacity of the current display area according to an embodiment of the present invention is shown, which specifically includes the following steps:

[0071] Step 301: Obtain the user terminal device model and the user-defined data font format. Different users may have different user terminal hardware devices; different users may set different data font formats for the display area based on their reading preferences and usage habits. Different data formats can affect the amount of data that can be displayed in the display area.

[0072] Step 302: Determine the size of the user terminal display area based on the model of the user terminal device. In this step, the model of the user terminal device can be obtained automatically or after user authorization. The size of the user terminal display area is determined based on the different models.

[0073] Step 303 determines the amount of data that can be accommodated in the user terminal's display area based on the data font format set by the user. For example, if, according to step 302, it can be determined that user B's user terminal device is an Android device with a model number of K, the user terminal's interface size is 720*1280, and excluding the dimensions of the status bar, navigation bar, and main menu, the content area of the display area is 720*1020px, and the regular text font size is 20px, then the amount of data that can be accommodated by the user terminal device can be determined. In the embodiment of this specification, if the data is presented in the display area as one column and multiple rows, each row in the display area can accommodate 36 data items, for a total of 51 rows of data, and the display area can accommodate a total of 36*15 data items.

[0074] Figure 4 The flowchart of a method for setting the data return scrolling speed according to an embodiment of the present invention is shown, which specifically includes the following steps:

[0075] Step 401 determines the length of all data to be displayed based on the sequence numbers of all data to be displayed and the data capacity of the current display area. The length of all data to be displayed is determined based on the pre-set data sequence numbers for all data and the amount of data that can be accommodated in the display area of the user terminal. For example, if the sequence numbers of all data to be displayed are 1-10000, and the data displayed in a display area is in the form of one column and multiple rows, and the data capacity of the display area is pre-determined to be 50 rows of data based on the size of the display area, and each row can accommodate a maximum of 20 data items, then the length of all data to be displayed can be determined to be 10 display interface page heights.

[0076] Step 402, determine whether the ratio of the scrolling distance value to the length occupied by all the data to be displayed exceeds a first preset ratio. According to the scrolling distance value determined in the previous step, determine whether the scrolling distance exceeds the first preset ratio of the total length occupied by all the data to be displayed. For example, the length occupied by all the data to be displayed is equivalent to the length of the displayable area of 10 display areas, and the specified distance of the current display area and the scrolling distance of the first data rendered in the virtual list are equivalent to the length occupied by 3 display areas, then the ratio can be determined to be 3 / 10. In this step, the first preset ratio can be pre-set or adjusted in real time according to actual conditions.

[0077] In step 403, if the ratio does not exceed the first preset ratio, a first scrolling speed for data return is set. If the ratio does not exceed the first preset ratio, the scrolling distance is relatively short. Therefore, a smaller first scrolling speed can be set. When the user clicks the data return scrolling indicator, the data in the display area can be scrolled back to the first data item at the first scrolling speed.

[0078] Step 404, determine whether the ratio exceeds the second preset ratio. If the ratio is greater than the first preset ratio but does not exceed the second preset ratio, set the second scrolling speed for data return. The method for judging the ratio in this step is similar to step 403, and this application will not go into details here. Among them, the second preset ratio is larger than the first preset ratio. If the ratio does not exceed the second preset ratio but is greater than the first preset ratio, the scrolling distance is at a medium level. Then a conventional second scrolling speed can be set. When the user clicks the data return scrolling indicator, the data in the display area can be returned to the first data at the second scrolling speed. For example, the length occupied by all the data to be displayed is equivalent to the length of the displayable area of 10 display areas, and the specified distance of the current display area and the scrolling distance of the first data rendered in the virtual list are equivalent to the length occupied by 5 display areas, then the ratio can be determined to be 1 / 2. In this manual, the second scrolling speed can be set to every 2px / 0.2 seconds, or other values.

[0079] In step 405, if the ratio is greater than the second preset ratio, a third scrolling speed for data return is set. Consistent with steps 403 and 404, if the ratio exceeds the second preset ratio, indicating a large scrolling distance, a faster second scrolling speed can be set. When the user clicks the data return scrolling indicator, the data in the display area can be scrolled back to the first data at the third scrolling speed.

[0080] In some embodiments of the present specification, the second scrolling speed may be a speed having the same value as the third scrolling speed, or the second scrolling speed and the third scrolling speed may be speeds having different values.

[0081] Figure 5The flowchart of a method for scrolling data back to the first data in a display area according to an embodiment of the present invention is shown, which specifically includes the following steps:

[0082] In step 501, when the ratio does not exceed the first preset ratio, the rendered data is scrolled back based on the scroll distance and the first scroll speed. Corresponding to step 402, when the ratio of the scroll distance to the length occupied by all the data to be displayed does not exceed the first preset ratio, the current scroll distance is directly used as the distance to be scrolled back, and the data in the display area is scrolled back in combination with the first scroll speed.

[0083] For example, if the sequence number of the data to be displayed is 1-10000, and the height of a display area is 1000px, which can accommodate 1000 data, then the length occupied by the data to be displayed is equivalent to the length of 10 display areas. Specifically, the specified data in the current page display area is the 2500th data, and the scrolling distance between the specified distance of the current page display area and the first data rendered in the virtual list is equivalent to the length occupied by 3 display areas, and the height of all data in the data to be displayed is unified to 20px. The scrolling distance of the specified data in the current display area can be calculated based on the product of the sequence number of the specified data and the data height.

[0084] For example, if the scrolling distance of the 2500th data is 2500px, the scrolling is directly returned at the first scrolling speed based on the scrolling distance.

[0085] In step 502, when the ratio is greater than a first preset ratio, the rendered data is scrolled back based on a second preset distance threshold and the second scrolling speed or the third scrolling speed. Corresponding to steps 403 and 404, when the ratio of the scrolling distance to the length occupied by all the data to be displayed exceeds a first preset ratio, the second preset distance threshold is used as the distance to scroll back, and the data in the display area is scrolled back in combination with the second scrolling speed or the third scrolling speed. In this specification, when the ratio is greater than the first preset ratio, it is considered that the specified distance is far from the first data item.

[0086] For example, the sequence number of the data to be displayed is 1-10000, and the height of a display area is 1000px, which can accommodate 1000 data items. The length occupied by the data to be displayed is equivalent to the length of 10 display areas. Specifically, the specified data in the current page display area is the 4800th data item. The scrolling distance between the specified distance of the current page display area and the first data item rendered in the virtual list is equivalent to the length of 5 display areas. The height of all data items in the data to be displayed is uniformly 20px. The scrolling distance of the specified data in the current display area can be calculated based on the product of the sequence number of the specified data and the data height.

[0087] For example, the scrolling distance of the 4800th data is 4800px, which is relatively large. In this case, the second preset distance threshold is used as the scrolling distance to scroll back. In some embodiments of this specification, the second preset distance can be an integer multiple of the size of the display area, and the second preset distance threshold can be the same distance as the value of the first preset distance threshold, or a distance different from the value of the first preset distance threshold. The value of the second preset distance threshold can be pre-set or adjusted according to actual conditions. For example, the second preset distance threshold is 3000px. In this step, the second preset distance threshold is directly used as the return scrolling distance, combined with the second scrolling speed, to scroll the rendered data back.

[0088] For another example, the designated data in the current page display area is the 8200th data item. The scroll distance between the designated distance in the current page display area and the first data item rendered in the virtual list is equivalent to the length of 9 display areas, and the height of all data items to be displayed is uniformly 20px. Based on the product of the designated data item's sequence number and the data item's height, the scroll distance to the 8200th data item in the current display area can be calculated to be 8200px. Since this scroll distance is larger, the second preset distance threshold is used as the scroll distance to scroll back.

[0089] That is to say, when the scrolling distance of the specified data in the display area is large, the specified data is far away from the first data. Therefore, in order to save the time of scrolling back and improve the user browsing experience, the scrolling distance is shortened. Among them, when the ratio of the scrolling distance of multiple specified data to the length occupied by the data to be displayed is greater than the first preset ratio or the second preset ratio, the scrolling distance of different specified data can be shortened to a unified preset distance threshold and scrolled back at the same scrolling speed; the scrolling distance of different specified data can also be shortened to different preset distance thresholds and scrolled back at different scrolling speeds to ensure that the specified data at different positions have the same scrolling visual effect during the scrolling back process, and can effectively avoid exceeding the DOM height actually rendered by the virtual list, and further avoid the white screen problem caused by page redrawing.

[0090] Therefore, in this application, for data whose ratio of the scrolling distance to the length occupied by the data to be displayed is greater than the second preset ratio, a third preset distance can be set as the scrolling distance for scrolling back. This application does not limit the third preset distance.

[0091] Figure 6 The flowchart of a method for determining the data return scrolling speed according to an embodiment of the present invention is shown, which specifically includes the following steps:

[0092] Step 601: Determine the data return scrolling speed based on the hardware performance of the device to which the display area belongs. In this step, different devices have different hardware performance. Hardware performance includes, but is not limited to, device memory, device processor speed, network transmission speed, etc.

[0093] For example, different smartphones have varying amounts of memory, with some lacking sufficient memory to cache tens of thousands of pieces of data to be rendered. Another example is the rapid scrolling speed of users browsing data, which places high demands on the speed at which virtual lists render data. However, slower device processor and network transmission speeds may not be sufficient to meet these requirements, easily resulting in a blank screen. Therefore, it is necessary to determine the specific scrolling speed for data return based on the hardware performance of each device.

[0094] Step 602: Determine the data return scrolling speed based on the height of the rendered data of the virtual list. Alternatively, the data amount of the virtual list rendered once may be determined based on the data height of the list items in the virtual list, and the data return speed may be further determined.

[0095] Figure 7 The flowchart of a data scrolling method based on a virtual list according to an embodiment of this invention is shown, which specifically includes the following steps:

[0096] Step 701: Obtain specific data in the current display area, including data marked by the user. While browsing data in the display area, the user can mark portions of the data in the display area by touching or clicking the screen. In this specification, user-marked data is referred to as specific data. In some embodiments of this specification, user-marked specific data may include data that the user is interested in, data that the user considers critical, data that the user considers to be favorited, data that the user needs to return to later and review, and the like.

[0097] Step 702, scroll the data rendered in the virtual list from the display area back to the specific data according to the data scrolling speed and scrolling distance. When using the data scrolling method based on the virtual list in this specification, the data previously rendered in the virtual list can be returned to the specific data according to the data scrolling speed set in the aforementioned steps and the scrolling distance between the specified data and the first data rendered in the virtual list. Alternatively, according to the data scrolling method, after returning the data previously rendered in the virtual list to the feature data, pause and time it, and when the time reaches the preset time threshold, continue to scroll back to other specific data marked by the user. Repeat the above operation until the scrolling back process traverses all the specific data marked by the user, and finally returns to the first data rendered in the virtual list, that is, the top of the page.

[0098] This manual uses a data scrolling method based on a virtual list to scroll the specified data in the current display area back to the specific data marked by the user during the previous browsing process. During the data scrolling back, it can help users record data that the user may be interested in or data that the user considers critical, and help users quickly return to the data they are concerned about, thereby improving the user browsing experience while meeting the performance requirements of virtual list rendering data.

[0099] like Figure 8 FIG2 is a schematic diagram of a data scrolling device based on a virtual list according to an embodiment of the present invention. The basic structure of the data scrolling device based on a virtual list is described in this figure. The functional units and modules therein can be implemented in software or with a general-purpose chip or a specific chip to implement data scrolling based on a virtual list. The device specifically includes:

[0100] The data display unit 801 is used to extract part of the data from the pre-stored data to be displayed according to the user's access requirements, render the data into a virtual list, and display it in the display area, wherein the virtual list updates the rendered data and displays it as the user's access requirements change;

[0101] A scroll distance determining unit 802 is configured to determine the scroll distance between the designated data in the current display area slid by the user and the first data rendered in the virtual list;

[0102] A data return scrolling mark adding unit 803 is configured to add a data return scrolling mark in the current display area when the scrolling distance exceeds a first preset distance threshold;

[0103] A return scrolling speed setting unit 804 is configured to set a data return scrolling speed according to the scrolling distance when the user clicks the data return scrolling indicator;

[0104] The return scrolling unit 805 is configured to scroll the rendered data in the virtual list from the display area back to the first data according to the data return scrolling speed and the scrolling distance.

[0105] This solution, based on virtual list technology and scenarios, records the serial number of the currently displayed list data and the distance between the scrolled data and the first data. If the rendering data threshold set by the virtual list is exceeded, it will first return to the threshold and then return to the first data by setting the scrolling distance for each step. This avoids the white screen due to untimely rendering during the scrolling process and also achieves the effect of dynamic scrolling back to the top.

[0106] As an embodiment of this article, you can also refer to Figure 9 FIG. 1 is a schematic diagram showing the specific structure of the data scrolling device based on the virtual list in this embodiment.

[0107] As an embodiment of this document, the scroll distance determining unit 802 further includes:

[0108] The data sequence number setting module 8021 is used to set a data sequence number for each item of the data to be displayed;

[0109] The display area data capacity determination module 8022 is used to determine the amount of data that can be accommodated in the display area of the user terminal.

[0110] As an embodiment of this invention, the return scrolling speed setting unit 804 further includes:

[0111] The hardware performance acquisition module 8041 is used to obtain the hardware performance of the device to which the display area belongs;

[0112] The rendering data height acquisition module 8042 is used to determine the data return scrolling speed according to the rendering data height of the virtual list.

[0113] like Figure 10 As shown, a computer device provided in an embodiment of this invention can be applied to the data scrolling method based on a virtual list in this invention. The computer device 1002 can include one or more processors 1004, such as one or more central processing units (CPUs), each of which can implement one or more hardware threads. The computer device 1002 can also include any memory 1006, which is used to store any type of information such as code, settings, data, etc. Without limitation, for example, the memory 1006 can include any one or more combinations of the following: any type of RAM, any type of ROM, flash memory device, hard disk, optical disk, etc. More generally, any memory can use any technology to store information. Furthermore, any memory can provide volatile or non-volatile retention of information. Furthermore, any memory can represent a fixed or removable component of the computer device 1002. In one embodiment, when the processor 1004 executes associated instructions stored in any memory or combination of memories, the computer device 1002 can perform any operation of the associated instructions. The computer device 1002 also includes one or more drive mechanisms 1008 for interacting with any storage, such as a hard disk drive mechanism, an optical disk drive mechanism, and the like.

[0114] The computer device 1002 may also include an input / output module 1010 (I / O) for receiving various inputs (via input devices 1012) and for providing various outputs (via output devices 1014). A specific output mechanism may include a presentation device 1016 and an associated graphical user interface (GUI) 1018. In other embodiments, the input / output module 1010 (I / O), input devices 1012, and output devices 1014 may not be included, and the computer device 1002 may simply be a computer device in a network. The computer device 1002 may also include one or more network interfaces 1020 for exchanging data with other devices via one or more communication links 1022. One or more communication buses 1024 couple the components described above together.

[0115] The communication link 1022 may be implemented in any manner, for example, via a local area network, a wide area network (e.g., the Internet), a point-to-point connection, etc., or any combination thereof. The communication link 1022 may include any combination of hardwired links, wireless links, routers, gateway functions, name servers, etc., governed by any protocol or combination of protocols.

[0116] Corresponding to Figures 1 to 6 The embodiment of the present invention further provides a computer-readable storage medium having a computer program stored thereon, which executes the steps of the above method when executed by a processor.

[0117] The embodiment of the present invention also provides a computer readable instruction, wherein when the processor executes the instruction, the program causes the processor to execute the following Figures 1 to 6 The method shown.

[0118] It should be understood that in the various embodiments of this document, the size of the serial numbers of the above-mentioned processes does not mean the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of this document.

[0119] It should also be understood that in the embodiments herein, the term "and / or" merely describes an association between associated objects, indicating that three possible relationships exist. For example, "A and / or B" could represent: A alone, A and B simultaneously, or B alone. Furthermore, the character " / " in this document generally indicates an "or" relationship between the associated objects.

[0120] Those skilled in the art will appreciate that the units and algorithm steps of each example described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, computer software, or a combination of the two. In order to clearly illustrate the interchangeability of hardware and software, the above description has generally described the composition and steps of each example according to function. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of this document.

[0121] Those skilled in the art will clearly understand that, for the convenience and brevity of description, the specific working processes of the systems, devices and units described above can refer to the corresponding processes in the aforementioned method embodiments and will not be repeated here.

[0122] In the several embodiments provided herein, it should be understood that the disclosed systems, devices, and methods can be implemented in other ways. For example, the device embodiments described above are merely illustrative. For example, the division of the units is merely a logical function division. In actual implementation, there may be other division methods, such as multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. In addition, the mutual coupling or direct coupling or communication connection shown or discussed can be an indirect coupling or communication connection through some interfaces, devices, or units, or can be an electrical, mechanical, or other form of connection.

[0123] The units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed across multiple network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the embodiments herein.

[0124] In addition, the functional units in the various embodiments herein may be integrated into a single processing unit, each unit may exist physically separately, or two or more units may be integrated into a single unit. The aforementioned integrated units may be implemented in the form of hardware or software functional units.

[0125] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this article is essentially or the part that contributes to the existing technology, or all or part of the technical solution can be embodied in the form of a software product, which is stored in a storage medium and includes several instructions for enabling a computer device (which can be a personal computer, server, or network device, etc.) to execute all or part of the steps of the method described in each embodiment of this article. The aforementioned storage medium includes: various media that can store program code, such as a USB flash drive, a mobile hard disk, a read-only memory (ROM), a random access memory (RAM), a magnetic disk or an optical disk.

[0126] This article uses specific embodiments to illustrate the principles and implementation methods of this article. The description of the above embodiments is only used to help understand the methods and core ideas of this article. At the same time, for those skilled in the art, based on the ideas of this article, there will be changes in the specific implementation methods and application scope. In summary, the content of this specification should not be understood as a limitation to this article.

Claims

1. A data scrolling method based on a virtual list, characterized in that: The method comprises: According to the user's access requirements, extract part of the data from the pre-stored data to be displayed, render it in a virtual list, and display it in the display area, wherein the virtual list updates the rendered data and displays it as the user's access requirements change; Determining the scroll distance between the specified data in the current display area slid by the user and the first data rendered in the virtual list, which includes: setting a data sequence number for each data item in the data to be displayed; Determining a scroll distance between the current display area and the first data rendered in the virtual list according to the sequence number of the designated data, the sequence number of the first data, and the data capacity of the current display area, where the data capacity is the amount of data that can be accommodated in the current display area; When the scrolling distance exceeds a first preset distance threshold, adding data to the current display area and returning the scrolling indicator; When the user clicks the data return scrolling indicator, the data return scrolling speed is set according to the value of the scrolling distance; The rendered data in the virtual list are scrolled back from the display area to the first data according to the data return scrolling speed and the scrolling distance.

2. The data scrolling method based on a virtual list according to claim 1, characterized in that: Determining the data capacity of the current display area includes: Obtain the model of the user terminal device and the data font format set by the user; Determine the size of the user terminal display area based on the model of the user terminal device; The amount of data that can be accommodated in the display area of the user terminal is determined according to the data font format set by the user.

3. The data scrolling method based on a virtual list according to claim 2, characterized in that: When the user clicks the data return scrolling indicator, setting the data return scrolling speed according to the scrolling distance includes: Determine the length of all data to be displayed based on the sequence numbers of all data to be displayed and the data capacity of the current display area; Determining whether a ratio of the scrolling distance to the length occupied by all the data to be displayed exceeds a first preset ratio; If the ratio does not exceed the first preset ratio, setting a first scrolling speed for data return; determining whether the ratio exceeds a second preset ratio, and if the ratio is greater than the first preset ratio but does not exceed the second preset ratio, setting a second scrolling speed for data return; If the ratio is greater than a second preset ratio, a third scrolling speed for returning data is set.

4. The data scrolling method based on a virtual list according to claim 3, characterized in that: Scrolling the rendered data of the virtual list back to the first data in the display area according to the return scrolling speed and the scrolling distance includes: When the ratio does not exceed a first preset ratio, scrolling the rendered data back according to the value of the scrolling distance and the first scrolling speed; When the ratio is greater than a first preset ratio, the rendered data is scrolled back according to a second preset distance threshold and the second scrolling speed or the third scrolling speed.

5. The data scrolling method based on a virtual list according to claim 4, characterized in that: The method further comprises: Determine the data return scrolling speed based on the hardware performance of the device to which the display area belongs, or Determine the data return scrolling speed based on the rendered data height of the virtual list.

6. The data scrolling method based on a virtual list according to claim 1, characterized in that: The first preset distance threshold is an integer multiple of the size of the display area.

7. The data scrolling method based on a virtual list according to claim 1, characterized in that: The method further comprises: Obtaining specific data of the user in the current display area, wherein the specific data is data marked by the user; The data rendered in the virtual list is scrolled back from the display area to the specific data according to the scrolling speed and scrolling distance of the data.

8. A data scrolling device based on a virtual list, characterized in that: The device comprises: A data display unit is used to extract part of the data from the pre-stored data to be displayed according to the user's access requirements, render the data into a virtual list, and display the data in the display area, wherein the virtual list updates the rendered data and displays it as the user's access requirements change; A distance determination unit is used to determine the scroll distance between the designated data in the current display area slid by the user and the first data rendered in the virtual list, which includes: setting a data sequence number for each data item in the data to be displayed; Determining a scroll distance between the current display area and the first data rendered in the virtual list according to the sequence number of the designated data, the sequence number of the first data, and the data capacity of the current display area, where the data capacity is the amount of data that can be accommodated in the current display area; a data return scrolling mark adding unit, configured to add a data return scrolling mark in the current display area when the scrolling distance exceeds a first preset distance threshold; a return scrolling speed setting unit, configured to set a data return scrolling speed according to the scrolling distance when the user clicks the data return scrolling indicator; The return scrolling unit is configured to scroll the rendered data in the virtual list from the display area back to the first data according to the data return scrolling speed and the scrolling distance.

9. A computer device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein: When the processor executes the computer program, the method according to any one of claims 1 to 7 is implemented.

10. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the method according to any one of claims 1 to 7 is implemented.

11. A computer program product, characterized in that The computer program product comprises a computer program, and when the computer program is executed by a processor, the method according to any one of claims 1 to 7 is implemented.

Images