Data display control method and device and electronic equipment

Abstract

The invention provides a data display control method and apparatus, and an electronic device. The method comprises the steps of displaying a scrolling view and a slider control on a graphical user interface; wherein the scrolling view and the slider control have a binding relationship; the slider control comprises a slider and a slider; the scroll view is used for displaying partial data in the specified data; determining the position of the slider in the slider in response to a specified touch operation acting on the slider control, and acquiring to-be-displayed data in the specified data based on the position of the slider in the slider; and displaying the to-be-displayed data in the scroll view. In the mode, the data displayed by the scrolling view does not need to be continuously obtained by carrying out a large amount of sliding operation on the scrolling view, the data needing to be displayed is determined by changing the position of the sliding block in the sliding bar, and then the corresponding data is obtained to be displayed in the scrolling view, so that the data display efficiency is improved, and the user experience is improved. The problem of view display lagging caused by obtaining a large amount of data is reduced, and the user experience is improved.

Description

Technical Field

[0001] The present disclosure relates to the technical field of data display control, and in particular to a data display control method, device and electronic equipment. Background Art

[0002] When a large amount of data is displayed through a scrolling container such as a list or grid view, the data is usually obtained in segments. In the related art, segmented data acquisition is mainly achieved through the following two methods: one is: lazy loading based on scrolling position. Load the initial data set into the scrolling container, listen for scrolling events, trigger data loading when the user scrolls close to the bottom, and append new data based on the existing content; the second is: paging loading, load the first page of data, provide a "load more" button or automatic paging function, and load the new page of data when clicking the button or scrolling to the bottom. However, in the above method, when the amount of background data is large, you can only scroll page by page in the scrolling container or click the next page, the speed is slow and the player needs a lot of operations. Summary of the invention

[0003] In view of this, the purpose of the present disclosure is to provide a data display control method, device and electronic device to improve the efficiency of data display, avoid the problem of view display freeze caused by obtaining a large amount of data, and improve the user experience.

[0004] In a first aspect, an embodiment of the present disclosure provides a method for controlling data display, providing a graphical user interface through a terminal device; the method comprises: displaying a scroll view and a slider control in the graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control comprises a slider and a slider; the scroll view is used to display part of the data in the specified data; in response to a specified touch operation acting on the slider control, determining the position of the slider in the slider, and obtaining the data to be displayed in the specified data based on the position of the slider in the slider; and displaying the data to be displayed in the scroll view.

[0005] In a second aspect, an embodiment of the present disclosure provides a control device for data display, which provides a graphical user interface through a terminal device; the device includes: a view and control display module, which is used to display a scroll view and a slider control in the graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the data in the specified data; a data acquisition module is used to respond to a specified touch operation acting on the slider control, determine the position of the slider in the slider, and obtain the data to be displayed in the specified data based on the position of the slider in the slider; and a data display module is used to display the data to be displayed in the scroll view.

[0006] In a third aspect, an embodiment of the present invention provides an electronic device, including a processor and a memory, wherein the memory stores machine executable instructions that can be executed by the processor, and the processor executes the machine executable instructions to implement the above-mentioned data display control method.

[0007] In a fourth aspect, an embodiment of the present invention provides a machine-readable storage medium, which stores machine-executable instructions. When the machine-executable instructions are called and executed by a processor, the machine-executable instructions prompt the processor to implement the above-mentioned data display control method.

[0008] The embodiments of the present invention bring the following beneficial effects:

[0009] The above-mentioned data display control method, device and electronic device display a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data; in response to a specified touch operation on the slider control, the position of the slider in the slider is determined, and based on the position of the slider in the slider, the data to be displayed in the specified data is obtained; and the data to be displayed is displayed in the scroll view. In this method, there is no need to continuously obtain the data displayed by the scroll view by performing a large number of sliding operations on the scroll view, but the data to be displayed is determined by changing the position of the slider in the slider, and then the corresponding data is obtained to be displayed in the scroll view, which improves the efficiency of data display, reduces the problem of view display freeze caused by obtaining a large amount of data, and improves the user experience.

[0010] Other features and advantages of the present disclosure will be described in the following description, and partly become apparent from the description, or understood by practicing the present disclosure. The purpose and other advantages of the present disclosure are realized and obtained by the structures particularly pointed out in the description, claims and drawings.

[0011] In order to make the above-mentioned objectives, features and advantages of the present disclosure more obvious and easy to understand, preferred embodiments are specifically cited below and described in detail with reference to the attached drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0012] In order to more clearly illustrate the specific embodiments of the present disclosure or the technical solutions in the prior art, the drawings required for use in the specific embodiments or the description of the prior art will be briefly introduced below. Obviously, the drawings described below are some embodiments of the present disclosure. For those skilled in the art, other drawings can be obtained based on these drawings without paying any creative work.

[0013] Figure 1 A flowchart of a data display control method provided by an embodiment of the present disclosure;

[0014] Figure 2 A schematic diagram of a graphical user interface provided by an embodiment of the present disclosure;

[0015] Figure 3 A schematic diagram of another graphical user interface provided by an embodiment of the present disclosure;

[0016] Figure 4 A schematic diagram of the structure of a data display control device provided in an embodiment of the present disclosure;

[0017] Figure 5 A schematic diagram of the structure of an electronic device provided in an embodiment of the present disclosure. DETAILED DESCRIPTION

[0018] In order to make the purpose, technical solution and advantages of the embodiments of the present disclosure clearer, the technical solution of the present disclosure will be clearly and completely described below in conjunction with the accompanying drawings. Obviously, the described embodiments are part of the embodiments of the present disclosure, rather than all of the embodiments. Based on the embodiments in the present disclosure, all other embodiments obtained by those skilled in the art without creative work are within the scope of protection of the present disclosure.

[0019] When dealing with large amounts of data, especially in list or grid views, segmented data retrieval is an effective optimization technique. This approach can reduce initial loading time and memory consumption while improving user experience. In related technologies, segmented data of scrolling containers is mainly achieved through the following two methods:

[0020] 1. Lazy loading based on scroll position. Load the initial data set into the scroll container, listen for scroll events, trigger data loading when the user scrolls close to the bottom, and append new data based on the existing content.

[0021] 2. Paged loading. Load the first page of data, provide a "load more" button or automatic paging function, and load the new page of data when clicking the button or scrolling to the bottom.

[0022] However, the above methods bring poor interactive experience to users. For lazy loading and paging loading based on scroll position, when the amount of background data is large, since players can only scroll page by page in the scroll container or click the next page, the speed is slow and players need a lot of operations; in addition, due to the lack of obvious progress signs, players cannot intuitively experience how much data is left and how much data they have swiped.

[0023] Based on this, the embodiments of the present disclosure provide a method, device and electronic device for controlling data display. The technology can be applied to a scenario in which data is displayed through a graphical user interface.

[0024] See also Figure 1 First, a data display control method provided by an embodiment of the present invention is introduced, and a graphical user interface is provided by a terminal device. The method comprises the following steps:

[0025] Step S102, displaying a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider. The scroll view is used to display part of the specified data.

[0026] The scroll view and slider mentioned above are both common user interface components. The scroll view can help users view data content beyond the visible area, and allow players to change the currently displayed data in the visible area by sliding or scrolling. In actual applications, the scroll view provides a scrollable container in which subitems can be added, so that different content can be displayed by sliding within a limited window range.

[0027] Slidebar controls are usually used to select a value within a range or to make adjustments. In actual applications, a slider is an interactive control. Players can change the value of the slider by dragging the slider. Slidebar controls usually consist of a slider and a slider bar (the slider bar is also called a "track"). The slider represents the current value, and the slider bar represents the range of optional values.

[0028] The binding relationship between the scroll view and the slider control displayed in the graphical user interface can be preset. The binding relationship usually means that the control operation on the slider control will also affect the display content of the scroll view, or the control operation on the scroll view will also affect the display content of the scroll view, or both. It can also be regarded as a corresponding relationship between a parameter of the slider control and a parameter of the scroll view. The parameter of the slider control is usually the value corresponding to the slider, while the parameter of the scroll view is usually related to the data displayed by the scroll view.

[0029] Because there is a binding relationship between the scroll view and the slide control, the scroll view is usually displayed adjacent to the slide control, such as Figure 2 When the scroll view is scrolled up and down, the slider in the slide control is usually displayed vertically; when the scroll view is scrolled left and right, the slider in the slide control is usually displayed horizontally. The two can also be displayed in other ways, which are not limited here.

[0030] The above-mentioned specified data can be various business data, such as game data, etc. The specified data is usually stored in the corresponding server. When the user needs to view the specified data through the terminal device, and the specified data needs to be displayed in the form of a scroll view, the terminal device usually obtains the data part that the scroll view currently needs to display, or the data part adjacent to the data part that needs to be displayed as a cache. When the data displayed by the scroll view changes, it is necessary to obtain the part that needs to be displayed from the cache data or the server.

[0031] Step S104, in response to a designated touch operation on the slider control, determining the position of the slider in the slider, and acquiring data to be displayed in designated data based on the position of the slider in the slider.

[0032] The above-mentioned specified touch operation can usually be of multiple types. For example, the above-mentioned specified touch operation can be a sliding operation acting on a slider. When the sliding operation slides along the slider bar, the slider moves along with the contact point of the sliding operation, and the position of the slider on the slider bar is changed. The user may only want to view the data content displayed in the scroll view when the sliding operation ends. In this case, the data to be displayed in the specified data can be obtained based on the position of the slider in the slider bar when the sliding operation ends. It is also possible to obtain the data to be displayed in the specified data based on the position of the slider in the slider bar when the user controls the slider to stay at a certain position in the slider bar for longer than the specified time during the sliding operation.

[0033] The above-mentioned designated touch operation can also be a click, long press, etc. on a certain position in the slider, in which case the slider can be controlled to move to the position, and based on the position of the slider in the slider at this time, the data to be displayed in the designated data is obtained. The specific setting can be based on the needs and is not limited here.

[0034] As described above, the slider represents a range of selectable values, and different positions on the slider generally correspond to different selectable values. The selectable value corresponding to the position of the slider on the slider can be determined as the target value. For example, when the selectable value range corresponding to the slider is 0-100, if the slider is in the middle of the slider, the target value corresponding to the slider is 50.

[0035] When a scroll view displays data, the data is usually sorted in the form of data items. That is, the specified data usually has multiple data items arranged in a display order. A container is usually set in the scroll view, and at least some of the data items in the container will be displayed in the scroll view. The target value corresponding to the slider is usually set to have a corresponding relationship with the rank of the data items in the specified data. For example, there are 100 data items in the specified data, and as mentioned above, the optional value range corresponding to the slider is 0-100, and the target value corresponding to the slider is 50, then the data items displayed in the scroll view usually need to include a data item with a rank of 50. The data item with a rank of 50 can be the first data item displayed in the scroll view, or it can be the data item displayed in the middle, or it can be the last data item to be displayed. It can be set according to needs and is not set here.

[0036] As described above, the order of some data items in the data to be displayed in the scroll view can be determined based on the position of the slider in the slide bar, and the start and end order of the data to be obtained can be further determined based on the capacity of the container.

[0037] When obtaining the data to be displayed, you can first check whether the cached data in the terminal device includes the data to be displayed, usually by determining whether the cached data contains the data to be displayed by the order of the data items. If not, you need to obtain the data to be displayed from the server that stores the specified data.

[0038] Step S106: display the data to be displayed in the scroll view.

[0039] After the data to be displayed is acquired, the data display area in the scroll view may be rendered based on the data to be displayed, so that the user can understand the data to be displayed by viewing the scroll view.

[0040] The above-mentioned method for controlling data display displays a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data; in response to a specified touch operation on the slider control, the position of the slider in the slider is determined, and based on the position of the slider in the slider, the data to be displayed in the specified data is obtained; and the data to be displayed is displayed in the scroll view. In this method, there is no need to continuously obtain the data displayed by the scroll view by performing a large number of sliding operations on the scroll view, but the data to be displayed is determined by changing the position of the slider in the slider, and then the corresponding data is obtained to be displayed in the scroll view, which improves the efficiency of data display, reduces the problem of view display freeze caused by obtaining a large amount of data, and improves the user experience.

[0041] The following embodiments provide a specific method for responding to a specified touch operation on a slider control, determining a position of a slider in the slider, and obtaining data to be displayed in the specified data based on the position of the slider in the slider.

[0042] The above-mentioned designated touch operation can be a sliding operation acting on the slider or a triggering operation acting on the slider. In response to the triggering operation acting on the first position of the slider, the first position is determined as the position of the slider in the slider, and the slider is controlled to move to the position.

[0043] The above-mentioned specified data usually includes multiple data items with a preset arrangement order, and the arrangement order is usually consistent with the display order of the data items. After the specified operation is performed on the slider control, it is first necessary to determine the first order in the arrangement order based on the position of the slider in the slider and the total number of data items of the specified data. Specifically, it is necessary to determine the first ratio of the value corresponding to the position of the slider in the slider and the total number of values ​​corresponding to the slider, wherein the total number represents the difference between the upper and lower limits of the optional value range corresponding to the slider. When the lower limit is not zero, the value corresponding to the position of the slider in the slider needs to be subtracted from the lower limit value to obtain a calculation result, and then the ratio between the calculation result and the above-mentioned total number is calculated. Then, based on the first ratio and the total number of data items in the specified data, the first order in the arrangement order is determined. The above-mentioned total number of data items is usually the number of data items included in the specified data. For example, if the first ratio is 20% calculated by the demerit calculation, and the total number of data items is 20, then the first order is 20×20%=4, that is, the order 4.

[0044] After determining the first rank, the target rank range corresponding to the data item to be acquired can be determined based on the first rank and the container capacity corresponding to the scrolling view. The above-mentioned first rank is the rank corresponding to the data item that needs to be displayed in the scrolling view. However, the scrolling view usually displays more than one data item. For example, the container corresponding to the scrolling view needs to contain 4 data items, and the first rank is 4, and the data item corresponding to the first rank needs to be displayed in the scrolling view first, then the target rank range is usually 4-7. The target rank range usually includes the above-mentioned first rank. The data in the container may not all be displayed in the scrolling view, and it is further necessary to determine the data to be displayed from the acquired data.

[0045] The above-mentioned terminal device usually caches at least part of the data items in the specified data. In the process of obtaining data that matches the target sequence range in the specified data, the data items that match the target sequence range can be first searched from at least part of the data items cached in the terminal device; if all or part of the data is not found, it is necessary to send a data acquisition request to a preset server based on the target sequence range. The data acquisition request needs to clearly specify the sequence range of the data items to be obtained, which can be the entire target sequence range or a partial sequence range in the target sequence range. The server that stores the specified data will return the data corresponding to the data acquisition request to the terminal device, and the returned data includes data that matches the target sequence range.

[0046] In order to make the position of the slider in the slider bar indicate the order of the data in the scroll view in the specified data, that is, to prompt the user how much data is before the currently displayed data and how much data is after it, when the user slides the scroll view and changes the displayed content in the scroll view, the position of the slider in the slider bar also needs to be updated. In response to the sliding operation acting on the scroll view, the data items displayed by the scroll view are updated; and then based on the order of the data items in the arrangement order, the position of the slider in the slider bar is updated. In the specific implementation, it is necessary to first determine the second ratio of the order of the updated data item in the arrangement order to the total amount of data items in the specified data. For example, the order of the data item is 20 and the total amount of data items is 100, then the ratio is 0.2. Then, based on the second ratio and the total number of data items corresponding to the slider, determine the target value, for example, if the total number is 10, then the target value is 10×0.2=2; further, display the slider at the position corresponding to the target value in the slider bar. At this time, the position of the slider can prompt the user that 20% of the data has been viewed, and 80% of the data has not been viewed.

[0047] The present disclosure also provides another method for controlling data display. Figure 1 This method is implemented based on the method shown in the figure. This method implements the following functions by introducing a two-way binding between the slider and the scroll view:

[0048] 1. The position of the slider in the slider bar indicates the ordinal position of the item currently displayed in the scroll view in the total data, so that players can intuitively estimate the total number of data items.

[0049] 2. Players can quickly locate the data item they want to display by dragging the slider in the slider bar, and can also obtain background data based on the position of the slider, avoiding the performance loss of rendering all intermediate data when sliding and scrolling the container.

[0050] like Figure 3As shown, the live broadcast window list above is displayed through a scroll view, and a sliding bar is added below to slide and display the position of the live broadcast list of the currently displayed page in the total list.

[0051] The method is mainly divided into two parts: one is to monitor the sliding events of the slider of the slider bar to update the content of the scroll container display page; the other is to monitor the sliding events of the scroll container to update the position of the slider in the slider bar.

[0052] Listening to the sliding events of the slider is mainly achieved through the following logic: when the slider moves, the index of the data item that should be displayed in the scrolling container as the slider moves is calculated based on the represented value of the slider and the starting index of the cached data item in the scrolling container in the total data. At the same time, based on the internal container size of the scrolling container and the position offset of the currently displayed data item, it is calculated whether the currently displayed data item is already located in the last page of data in the cache. If the data item to be displayed is in the scrolling container cache data, the data item is displayed directly; if the data item to be displayed is not in the scrolling container cache data or the displayed data item is already located in the last page of data in the cache, new data is requested to be placed in the cache, and a data request flag is added to prevent frequent data requests during sliding.

[0053] Listening to the sliding events of the scrolling container is mainly implemented through the following logic: when sliding the scrolling container, the position ratio of the current displayed data item in the scrolling container cache data is calculated according to the position offset of the current displayed data item in the internal container, and the ordinal position of the displayed data item in the total data volume is calculated according to the starting index of the cached data and the total data volume, and the ordinal position is converted into a percentage and mapped to the slider position.

[0054] The method is implemented by the following steps:

[0055] 1. Set the hasReqData flag to indicate whether a new piece of data has been requested. Initially, it is false.

[0056] 2. When the data segment set to be displayed is transmitted from the server to the terminal device, it is represented in the form of (allCount, beginIdx, count, items), where allCount indicates the number of data items in the total data, beginIdx indicates the sequence number of the first data item in the data segment set in the total data, count indicates the amount of data in the data segment set, and items indicates the specific data items. Execute step 4 to display the data items.

[0057] 3. Set the slider value range of the slider to 0 to 100, which means that the slider can represent a value range of 1% to 100%, and the position of the slider on the slider track is exactly the corresponding percentage.

[0058] 4. Put the acquired data items into the scroll view for rendering and display, calculate the order percentage of the currently displayed data item in the total data as oriPercent = (beginIdx / allCount)*100, and set the slider value of the slider bar to oriPercent.

[0059] 5. Bind the scrolling event callback of the scrolling view. Taking the coordinates of the lower left corner of the current display page of the scrolling view as the origin, the relative position of the internal container of the scrolling view can be known as (x, y) during the scrolling callback. It is known that the width of the visible window of the scrolling view is width, and the width of the internal container of the scrolling view is innerWidth. Then, the display position percentage of the view display page in the current internal container (cached data segment data) can be obtained as sPercent = (-x / (innerWidth-width))*100. The percentage of the display page in the total data is calculated as percent = oriPercent + (count / allCount)*sPercent, and the value of the slider is set to percent. Execute step 6 to determine whether the content of the display page is the last page of cached data in the scrolling view. If so, apply for the next segment of data. After the data is obtained, execute step 2.

[0060] 6. Bind the sliding event callback of the slider. It is known that the current value of the slider is curPercent. If curPercent is greater than or equal to oriPercent+(count / allCount)*100, it means that the data page that should be displayed is not in the scroll view. If the value of hasReqData is false, request the data segment with curPercent*allCount as the starting position from the background total data, and set the value of hasReqData to true. After the data arrives, execute step 2 and set the timer to reset the value of hasReqData to false after 0.3 seconds; if curPercent is less than oriPercent+(count / allCount)*100, it means that the data page that should be displayed is in the scroll view, then set the scroll view to scroll to the percentage jumpPercent, where jumpPercent = (curPercent-oriPercent) / (count / allCount).

[0061] 7. Determine whether the content of the scroll view display page has reached the last page of cached data. Take the coordinates of the lower left corner of the scroll view's current display page as the origin, and the relative position of the scroll view's internal container is known to be (x, y), the width of the scroll view's visible window is width, and the width of the scroll view's internal container is innerWidth, let flag = width - (x + innerWidth), if flag is less than 0, it means it has not reached the last page, otherwise it means it has been displayed to the last page.

[0062] This method implements a two-way binding between a scroll view that can obtain data in segments and a slider, optimizing the player's interactive experience when the scroll view needs to display a large amount of data. It also avoids the problem of rendering a large number of data items when loading data by sliding the scroll view and obtaining data on demand. Players can skip the acquisition and rendering of intermediate data by quickly dragging the slider of the slider, optimizing the experience while also improving rendering performance.

[0063] For the above method embodiments, see Figure 2 A data display control device is shown, which provides a graphical user interface through a terminal device; the device includes:

[0064] The view and control display module 402 is used to display a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data;

[0065] The data acquisition module 404 is used to respond to the specified touch operation on the slider control, determine the position of the slider in the slider, and acquire the data to be displayed in the specified data based on the position of the slider in the slider;

[0066] The data display module 406 is used to display the data to be displayed in the scroll view.

[0067] The above-mentioned data display control device displays a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data; in response to a specified touch operation on the slider control, the position of the slider in the slider is determined, and based on the position of the slider in the slider, the data to be displayed in the specified data is obtained; and the data to be displayed is displayed in the scroll view. In this method, there is no need to continuously obtain the data displayed by the scroll view by performing a large number of sliding operations on the scroll view, but the data to be displayed is determined by changing the position of the slider in the slider, and then the corresponding data is obtained to be displayed in the scroll view, which improves the efficiency of data display, reduces the problem of view display freeze caused by obtaining a large amount of data, and improves the user experience.

[0068] The above-mentioned specified data includes multiple data items with a preset arrangement order; based on the position of the slider in the sliding bar, the step of obtaining the data to be displayed in the specified data includes: determining the first order in the arrangement order based on the position of the slider in the sliding bar and the total number of data items of the specified data; determining the target order range corresponding to the data items to be obtained based on the first order and the container capacity corresponding to the scrolling view; obtaining data in the specified data that matches the target order range; and determining the data to be displayed from the obtained data.

[0069] The above-mentioned terminal device caches at least part of the data items in the specified data; the step of obtaining data in the specified data that matches the target sequence range includes: searching for data items that match the target sequence range from at least part of the data items cached in the terminal device; if not found, based on the target sequence range, sending a data acquisition request to a preset server, so that the server returns the data corresponding to the data acquisition request to the terminal device; the returned data includes data that matches the target sequence range.

[0070] The above-mentioned step of determining the first order in the arrangement order based on the position of the slider in the slider bar and the total number of data items in the specified data includes: determining a first ratio of the numerical value corresponding to the position of the slider in the slider bar and the total number of values ​​corresponding to the slider bar; determining the first order in the arrangement order based on the first ratio and the total number of data items in the specified data.

[0071] The specified data includes a plurality of data items having a preset arrangement order; the method further includes: updating the data items displayed by the scroll view in response to a sliding operation on the scroll view; and updating the position of the slider in the slide bar based on the order of the data items in the arrangement order.

[0072] The above-mentioned step of updating the position of the slider in the sliding bar based on the rank of the data item in the arrangement order includes: determining a second ratio of the rank of the updated data item in the arrangement order to the total number of data items in the specified data; determining a target value based on the second ratio and the total number value corresponding to the sliding bar; and displaying the slider at a position in the sliding bar corresponding to the target value.

[0073] The step of determining the position of the slider in the slider in response to a designated touch operation on the slider control includes: responding to a trigger operation on a first position of the slider, determining the first position as the position of the slider in the slider.

[0074] This embodiment also provides an electronic device, including a processor and a memory, wherein the memory stores machine executable instructions that can be executed by the processor, and the processor executes the machine executable instructions to implement the above data display control method, for example:

[0075] Displaying a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control are in a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data; in response to a specified touch operation on the slider control, determining the position of the slider in the slider, and obtaining the data to be displayed in the specified data based on the position of the slider in the slider; and displaying the data to be displayed in the scroll view.

[0076] In the above method, there is no need to perform a large number of sliding operations on the scroll view to continuously obtain the data displayed by the scroll view. Instead, the data to be displayed is determined by changing the position of the slider in the slider bar, and then the corresponding data is obtained to display it in the scroll view. This improves the efficiency of data display, reduces the view display jamming problem caused by obtaining a large amount of data, and improves the user experience.

[0077] Optionally, the above-mentioned designated data includes multiple data items with a preset arrangement order; based on the position of the slider in the sliding bar, the step of obtaining the data to be displayed in the designated data includes: determining the first order in the arrangement order based on the position of the slider in the sliding bar and the total number of data items of the designated data; determining the target order range corresponding to the data items to be obtained based on the first order and the container capacity corresponding to the scrolling view; obtaining data in the designated data that matches the target order range; and determining the data to be displayed from the obtained data.

[0078] Optionally, the terminal device caches at least part of the data items in the specified data; the step of obtaining data in the specified data that matches the target sequence range includes: searching for data items that match the target sequence range from at least part of the data items cached in the terminal device; if not found, based on the target sequence range, sending a data acquisition request to a preset server, so that the server returns data corresponding to the data acquisition request to the terminal device; the returned data includes data that matches the target sequence range.

[0079] Optionally, the step of determining the first order in the arrangement order based on the position of the slider in the slider bar and the total number of data items in the specified data includes: determining a first ratio of the numerical value corresponding to the position of the slider in the slider bar and the total number of values ​​corresponding to the slider bar; determining the first order in the arrangement order based on the first ratio and the total number of data items in the specified data.

[0080] Optionally, the specified data includes multiple data items with a preset arrangement order; the method also includes: updating the data items displayed by the scroll view in response to a sliding operation on the scroll view; and updating the position of the slider in the slide bar based on the order of the data items in the arrangement order.

[0081] Optionally, the above-mentioned step of updating the position of the slider in the slider bar based on the rank of the data item in the arrangement order includes: determining a second ratio of the rank of the updated data item in the arrangement order to the total number of data items in the specified data; determining a target value based on the second ratio and the total number value corresponding to the slider bar; and displaying the slider at a position in the slider bar corresponding to the target value.

[0082] Optionally, the step of determining the position of the slider in the slider in response to a specified touch operation applied to the slider control includes: responding to a trigger operation applied to a first position of the slider, determining the first position as the position of the slider in the slider.

[0083] See also Figure 5 As shown, the electronic device includes a processor 100 and a memory 101. The memory 101 stores machine executable instructions that can be executed by the processor 100. The processor 100 executes the machine executable instructions to implement the above-mentioned data display control method.

[0084] Further, Figure 5 The electronic device shown further includes a bus 102 and a communication interface 103 , and the processor 100 , the communication interface 103 and the memory 101 are connected via the bus 102 .

[0085] The memory 101 may include a high-speed random access memory (RAM), and may also include a non-volatile memory, such as at least one disk storage. The communication connection between the system network element and at least one other network element is realized through at least one communication interface 103 (which may be wired or wireless), and the Internet, wide area network, local area network, metropolitan area network, etc. may be used. The bus 102 may be an ISA bus, a PCI bus, or an EISA bus, etc. The bus may be divided into an address bus, a data bus, a control bus, etc. For ease of representation, Figure 5 Only one bidirectional arrow is used in the diagram, but this does not mean that there is only one bus or only one type of bus.

[0086] The processor 100 may be an integrated circuit chip with signal processing capabilities. In the implementation process, each step of the above method can be completed by the hardware integrated logic circuit or software instructions in the processor 100. The above processor 100 can be a general-purpose processor, including a central processing unit (CPU), a network processor (NP), etc.; it can also be a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a field-programmable gate array (FPGA) or other programmable logic devices, discrete gates or transistor logic devices, discrete hardware components. The methods, steps and logic block diagrams disclosed in the embodiments of the present disclosure can be implemented or executed. The general-purpose processor can be a microprocessor or the processor can also be any conventional processor, etc. The steps of the method disclosed in conjunction with the embodiments of the present disclosure can be directly embodied as a hardware decoding processor for execution, or a combination of hardware and software modules in the decoding processor for execution. The software module may be located in a storage medium mature in the art, such as a random access memory, a flash memory, a read-only memory, a programmable read-only memory, or an electrically erasable programmable memory, a register, etc. The storage medium is located in the memory 101, and the processor 100 reads the information in the memory 101 and completes the steps of the method of the above embodiment in combination with its hardware.

[0087] This embodiment further provides a machine-readable storage medium, which stores machine-executable instructions. When the machine-executable instructions are called and executed by a processor, the machine-executable instructions prompt the processor to implement the above-mentioned data display control method.

[0088] A data display control method, device, and electronic device provided in an embodiment of the present disclosure include a computer-readable storage medium storing program code, and the program code includes instructions that can be used to execute the methods described in the foregoing method embodiments, for example:

[0089] Displaying a scroll view and a slider control in a graphical user interface; wherein the scroll view and the slider control are in a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data; in response to a specified touch operation on the slider control, determining the position of the slider in the slider, and obtaining the data to be displayed in the specified data based on the position of the slider in the slider; and displaying the data to be displayed in the scroll view.

[0090] In the above method, there is no need to perform a large number of sliding operations on the scroll view to continuously obtain the data displayed by the scroll view. Instead, the data to be displayed is determined by changing the position of the slider in the slider bar, and then the corresponding data is obtained to display it in the scroll view. This improves the efficiency of data display, reduces the view display jamming problem caused by obtaining a large amount of data, and improves the user experience.

[0091] Optionally, the above-mentioned designated data includes multiple data items with a preset arrangement order; based on the position of the slider in the sliding bar, the step of obtaining the data to be displayed in the designated data includes: determining the first order in the arrangement order based on the position of the slider in the sliding bar and the total number of data items of the designated data; determining the target order range corresponding to the data items to be obtained based on the first order and the container capacity corresponding to the scrolling view; obtaining data in the designated data that matches the target order range; and determining the data to be displayed from the obtained data.

[0092] Optionally, the terminal device caches at least part of the data items in the specified data; the step of obtaining data in the specified data that matches the target sequence range includes: searching for data items that match the target sequence range from at least part of the data items cached in the terminal device; if not found, based on the target sequence range, sending a data acquisition request to a preset server, so that the server returns data corresponding to the data acquisition request to the terminal device; the returned data includes data that matches the target sequence range.

[0093] Optionally, the step of determining the first order in the arrangement order based on the position of the slider in the slider bar and the total number of data items in the specified data includes: determining a first ratio of the numerical value corresponding to the position of the slider in the slider bar and the total number of values ​​corresponding to the slider bar; determining the first order in the arrangement order based on the first ratio and the total number of data items in the specified data.

[0094] Optionally, the specified data includes multiple data items with a preset arrangement order; the method also includes: updating the data items displayed by the scroll view in response to a sliding operation on the scroll view; and updating the position of the slider in the slide bar based on the order of the data items in the arrangement order.

[0095] Optionally, the above-mentioned step of updating the position of the slider in the slider bar based on the rank of the data item in the arrangement order includes: determining a second ratio of the rank of the updated data item in the arrangement order to the total number of data items in the specified data; determining a target value based on the second ratio and the total number value corresponding to the slider bar; and displaying the slider at a position in the slider bar corresponding to the target value.

[0096] Optionally, the step of determining the position of the slider in the slider in response to a specified touch operation applied to the slider control includes: responding to a trigger operation applied to a first position of the slider, determining the first position as the position of the slider in the slider.

[0097] Those skilled in the art can clearly understand that, for the convenience and brevity of description, the specific working process of the system and device described above can refer to the corresponding process in the aforementioned method embodiment, and will not be repeated here.

[0098] In addition, in the description of the embodiments of the present disclosure, unless otherwise clearly specified and limited, the terms "installed", "connected", and "connected" should be understood in a broad sense, for example, it can be a fixed connection, a detachable connection, or an integral connection; it can be a mechanical connection or an electrical connection; it can be a direct connection, or it can be indirectly connected through an intermediate medium, or it can be the internal communication of two components. For those skilled in the art, the specific meanings of the above terms in the present disclosure can be understood according to specific circumstances.

[0099] If the function 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 the present disclosure, or the part that contributes to the prior art or the part of the technical solution, can be embodied in the form of a software product, and the computer software product is stored in a storage medium, including a number of instructions to enable a computer device (which can be a personal computer, a server, or a network device, etc.) to perform all or part of the steps of the method described in each embodiment of the present disclosure. The aforementioned storage medium includes: U disk, mobile hard disk, read-only memory (ROM, Read-Only Memory), random access memory (RAM, Random Access Memory), disk or optical disk and other media that can store program code.

[0100] In the description of the present disclosure, it should be noted that the terms "center", "upper", "lower", "left", "right", "vertical", "horizontal", "inner", "outer", etc., indicating the orientation or positional relationship, are based on the orientation or positional relationship shown in the drawings, and are only for the convenience of describing the present disclosure and simplifying the description, rather than indicating or implying that the device or element referred to must have a specific orientation, be constructed and operated in a specific orientation, and therefore cannot be understood as a limitation of the present disclosure. In addition, the terms "first", "second", and "third" are used for descriptive purposes only, and cannot be understood as indicating or implying relative importance.

[0101] Finally, it should be noted that the above embodiments are only specific implementation methods of the present disclosure, which are used to illustrate the technical solutions of the present disclosure, rather than to limit them. The protection scope of the present disclosure is not limited thereto. Although the present disclosure is described in detail with reference to the above embodiments, those skilled in the art should understand that any technician familiar with the technical field can still modify the technical solutions recorded in the above embodiments within the technical scope disclosed in the present disclosure, or can easily think of changes, or make equivalent replacements for some of the technical features therein; and these modifications, changes or replacements do not make the essence of the corresponding technical solutions deviate from the spirit and scope of the technical solutions of the embodiments of the present disclosure, and should be included in the protection scope of the present disclosure. Therefore, the protection scope of the present disclosure should be based on the protection scope of the claims.

Claims

1. A data display control method, characterized in that: Providing a graphical user interface through a terminal device; the method comprises: Displaying a scroll view and a slider control on the graphical user interface; wherein the scroll view and the slider control are in a binding relationship; the slider control includes a slider and a slider; the scroll view is used to display part of the specified data; In response to a designated touch operation on the slider control, determining a position of the slider in the slider, and acquiring data to be displayed in the designated data based on the position of the slider in the slider; The data to be displayed is displayed in the scroll view.

2. The method according to claim 1, characterized in that The specified data includes a plurality of data items having a preset arrangement order; The step of acquiring the data to be displayed in the specified data based on the position of the slider in the slide bar comprises: Determining a first order in the arrangement sequence based on the position of the slider in the slide bar and the total number of data items of the designated data; Determine a target sequence range corresponding to the data item to be acquired based on the first sequence and the container capacity corresponding to the scroll view; Acquire data in the specified data that matches the target sequence range; The data to be displayed is determined from the acquired data.

3. The method according to claim 2, characterized in that The terminal device caches at least some data items in the specified data; The step of obtaining data in the specified data that matches the target sequence range includes: searching the at least some of the data items cached in the terminal device for data items that match the target sequence range; If not found, based on the target sequence range, a data acquisition request is sent to a preset server, so that the server returns the data corresponding to the data acquisition request to the terminal device; the returned data includes data matching the target sequence range.

4. The method according to claim 2, wherein the step of determining the first order in the arrangement sequence based on the position of the slider in the slide bar and the total number of data items of the specified data comprises: Determine a first ratio of a value corresponding to the position of the slider in the slider bar to a total value corresponding to the slider bar; A first rank in the arrangement sequence is determined based on the first ratio and the total number of data items in the designated data.

5. The method according to claim 1, wherein the specified data comprises a plurality of data items having a preset arrangement order; The method further comprises: In response to a sliding operation on the scroll view, updating a data item displayed by the scroll view; Based on the position of the data item in the arrangement sequence, the position of the slider in the slide bar is updated.

6. The method according to claim 5, wherein the step of updating the position of the slider in the slider bar based on the position of the data item in the arrangement sequence comprises: Determine a second ratio of the rank of the data item in the arrangement sequence to the total number of data items in the specified data; Determining a target value based on the second ratio and the total value corresponding to the sliding bar; The slider is displayed at a position in the slider bar corresponding to the target value.

7. The method according to claim 1, wherein the step of determining the position of the slider in the slider in response to a specified touch operation on the slider control comprises: In response to a triggering operation acting on a first position of the slide bar, the first position is determined as a position of the slider in the slide bar.

8. A data display control device, characterized in that: Providing a graphical user interface through a terminal device; the device comprises: A view and control display module, used for displaying a scroll view and a slider control in the graphical user interface; wherein the scroll view and the slider control have a binding relationship; the slider control includes a slider and a slider; the scroll view is used for displaying part of the specified data; A data acquisition module, configured to respond to a designated touch operation on the slider control, determine a position of the slider in the slider, and acquire data to be displayed in the designated data based on the position of the slider in the slider; The data display module is used to display the data to be displayed in the scroll view.

9. An electronic device, characterized in that: The invention comprises a processor and a memory, wherein the memory stores machine executable instructions that can be executed by the processor, and the processor executes the machine executable instructions to implement the data display control method according to any one of claims 1 to 7.

10. A machine-readable storage medium, characterized in that: The machine-readable storage medium stores machine-executable instructions, and when the machine-executable instructions are called and executed by a processor, the machine-executable instructions prompt the processor to implement the data display control method according to any one of claims 1 to 7.

Images