A picture display method and related apparatus

By stitching multiple thumbnails together into a large image and displaying it using a small number of view controls, the lag issue of electronic devices when displaying a large number of thumbnails is resolved, improving display performance and user experience.

CN120111229BActive Publication Date: 2026-03-17HUAWEI TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2024-06-20
Publication Date
2026-03-17

AI Technical Summary

Technical Problem

Electronic devices experience lag when displaying a large number of thumbnails, resulting in a poor user experience. Existing technologies cannot effectively solve the problems of resource contention and view control creation delays.

Method used

By stitching multiple thumbnails into a large image and displaying it using a small number of view controls, the number of I/O interface calls is reduced, and batch query and rendering techniques are used to improve the loading and display performance of electronic devices.

Benefits of technology

It reduces or eliminates lag when electronic devices display a large number of thumbnails, improves the display performance and frame rate of electronic devices, and enhances the user experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120111229B_ABST
    Figure CN120111229B_ABST
Patent Text Reader

Abstract

The embodiment of the application provides a picture display method and related device, which can include: first, when the electronic device stores the thumbnail corresponding to the photographed or saved picture, the electronic device stores the thumbnail according to the arrangement order of the thumbnail in the thumbnail display interface. In this way, the electronic device has the ability to batch query and obtain the thumbnail. Then, when the electronic device displays the thumbnail display interface, the electronic device can batch query and obtain the thumbnail. The electronic device can splice the obtained multiple thumbnails to obtain spliced thumbnails, and then the electronic device can display the spliced thumbnails through a view control. Through the picture display method provided by the application, the performance and frame rate of the electronic device in loading and displaying a large number of thumbnails can be improved, thereby avoiding or reducing the problem of white blocks and lagging during the user's browsing of a large number of thumbnails.
Need to check novelty before this filing date? Find Prior Art

Description

[0001] This application is a divisional application. The original application has the application number 202410808432.9 and the original application date is June 20, 2024. The entire contents of the original application are incorporated herein by reference. Technical Field

[0002] This application relates to the field of electronic devices and electronic technology, and in particular to a method for displaying images and related apparatus. Background Technology

[0003] Electronic devices can display thumbnails of photos (also known as images) taken or saved by the device in a thumbnail display interface. In some view scenarios, electronic devices can display a large number of thumbnails simultaneously. For example, in the monthly or yearly view scenarios of the gallery, electronic devices can display a large number of thumbnails at the same time.

[0004] Currently, for multiple thumbnails displayed on the thumbnail display interface of an electronic device, the device creates multiple view controls to each display a thumbnail. Each thumbnail displayed on the thumbnail display interface occupies its own view control. When the electronic device loads and displays thumbnails, it creates view controls, obtains image resources through input / output (IO) interfaces, decodes the image resources, and renders and displays the view controls. When the electronic device needs to load and display a large number of thumbnails, it needs to create a large number of view controls, make multiple calls to the IO interface to obtain image resources, perform multiple image decodings, and render and display the view controls multiple times. When the electronic device needs to display a large number of thumbnails in a short period of time, the rendering, display, IO interface calls to obtain image resources, and image decoding operations compete for the resources of the electronic device's central processing unit (CPU). This results in a longer time for the electronic device to obtain image resources, decode images, and create view controls. When users rapidly swipe or drag scrollbars in the thumbnail display of the gallery (which shows a large number of thumbnails), situations may occur where the view control is created before the image has finished decoding, or the view control cannot be created in time. This causes lag when the electronic device displays thumbnails, resulting in numerous white blocks appearing in the thumbnail display. This leads to a poor user experience.

[0005] Therefore, how to reduce or avoid display lag on electronic devices when displaying a large number of thumbnails is an urgent problem to be solved. Summary of the Invention

[0006] This application provides an image display method and related apparatus. With this image display method, when an electronic device displays a large number of thumbnails, the problem of lag in the electronic device can be reduced or avoided.

[0007] In a first aspect, this application provides an image display method, which may include: an electronic device receiving and responding to a user's first operation on a gallery application, acquiring a first set of thumbnails, the first set of thumbnails including at least two thumbnails; the electronic device stitching the first set of thumbnails into a first large image in display order; the electronic device rendering the first large image and displaying a thumbnail display interface of the gallery application, the thumbnail display interface displaying the first large image.

[0008] The first operation includes any one of the following: the user opening the gallery application, the user switching view scenes in the thumbnail display interface, or the user swiping in the thumbnail display interface.

[0009] Using the image display method provided in the first aspect, the electronic device can stitch together multiple acquired thumbnails to obtain a stitched thumbnail. Then, the electronic device can display the stitched thumbnail through a view control. The thumbnails displayed in the thumbnail display interface are stitched together into one or more large images. One view control can hold one large image. In this way, the electronic device only needs a few view controls to display a large number of thumbnails. Furthermore, the electronic device can batch query and retrieve thumbnails, reducing the number of I / O interface calls. This improves the performance and frame rate of the electronic device when loading and displaying a large number of thumbnails, thereby avoiding or reducing white blocks and stuttering issues that may occur when users browse a large number of thumbnails.

[0010] In conjunction with the first aspect, in one possible implementation, before displaying the thumbnail display interface of the gallery application, the method may include: the electronic device creating a first view control and carrying a first large image through the first view control.

[0011] In this way, a single view control can hold a large image, and electronic devices only need a small number of view controls to display a large number of thumbnails. This improves the display performance of electronic devices.

[0012] In conjunction with the first aspect, in one possible implementation, the method may further include: the electronic device responding to the first operation to acquire a second set of thumbnails, the second set of thumbnails including at least two thumbnails; the electronic device stitching the second set of thumbnails together in display order to form a second large image; the electronic device rendering the second large image and displaying the second large image on the thumbnail display interface.

[0013] In this way, the thumbnail display interface shows the stitched-together large images, and a single thumbnail display interface only needs a few view controls to display a large number of thumbnails. This can improve the display performance of electronic devices.

[0014] In conjunction with the first aspect, in one possible implementation, after the second large image is displayed on the thumbnail display interface, the method may further include: the electronic device receiving and responding to a second operation to display a portion of the content of the first large image and the entire content of the second large image on the thumbnail display interface, wherein the second operation is an operation of swiping upwards on the thumbnail display interface.

[0015] In this way, the electronic device can determine, based on the second operation, which controls to display in the thumbnail display interface, and what part of the large image within each control should be shown—part or all. Since the large image carried by the view control is complete, but due to user interaction, only a portion is displayed in the thumbnail display area. Because the undisplayed portion has already been pre-loaded and pieced together, the electronic device can more quickly display the undisplayed part of the large image in the view control when the user swipes. This improves the display performance of the electronic device and enhances the user experience.

[0016] In conjunction with the first aspect, in one possible implementation, before the second large image is displayed on the thumbnail display interface, the method may further include: the electronic device creating a second view control and using the second view control to carry the second large image.

[0017] In this way, a single view control can hold a large image, and electronic devices only need a small number of view controls to display a large number of thumbnails. This improves the display performance of electronic devices.

[0018] In conjunction with the first aspect, in one possible implementation, after displaying the thumbnail display interface of the gallery application, the method may further include: the electronic device receiving and responding to a third operation to acquire a third set of thumbnails, the third set of thumbnails including at least two thumbnails; the electronic device stitching the third set of thumbnails into a third large image in display order; the electronic device creating a third view control and carrying the third large image through the third view control; the electronic device rendering the third large image and displaying the third large image on the thumbnail display interface.

[0019] In this way, electronic devices can display a large number of thumbnails with only a few view controls.

[0020] In conjunction with the first aspect, in one possible implementation, obtaining the first set of thumbnails may include: the electronic device obtaining the first set of thumbnails from a database, wherein the storage order of the first set of thumbnails in the database is consistent with the display order of the first set of thumbnails.

[0021] In this way, since the storage order of the first set of thumbnails in the database is consistent with the display order of the first set of thumbnails, the electronic device can read the first set of thumbnails in batches at once. This reduces the number of times the electronic device calls the input / output interface, improves the performance and frame rate of loading and displaying a large number of thumbnails, and saves power consumption of the electronic device.

[0022] In conjunction with the first aspect, in one possible implementation, the electronic device stitches together the first set of thumbnails into a large image in display order, which may include: the electronic device requesting first memory; the electronic device's database filling the first set of thumbnails into the first memory in display order, and stitching them together in the first memory to obtain a large image.

[0023] The first memory is shared memory.

[0024] In this way, other processes on the electronic device, such as the rendering process, can read the large image across processes, which can improve rendering performance and save power consumption of the electronic device.

[0025] In conjunction with the first aspect, in one possible implementation, the rendering of the first large image by the electronic device may include: the rendering process of the electronic device reading the first large image from first memory and rendering the first large image. In this way, the rendering process can read the large image across processes, which can improve rendering performance and save power consumption of the electronic device.

[0026] In conjunction with the first aspect, in one possible implementation, the database stores metadata for the first set of thumbnails, including the date, time, and identification ID corresponding to each thumbnail. This allows electronic devices to distinguish between different thumbnails based on their corresponding date, time, and ID.

[0027] In conjunction with the first aspect, in one possible implementation, the first set of thumbnails includes a first thumbnail, the date and time corresponding to the first thumbnail is a first date and time, the ID corresponding to the first thumbnail is a first ID, the first date and time is the date and time when the electronic device saves the first thumbnail, and the first ID is a number generated by the electronic device when saving the first thumbnail to identify it. In this way, the electronic device can distinguish different thumbnails by the date and time corresponding to the thumbnail and by its ID.

[0028] In conjunction with the first aspect, in one possible implementation, obtaining the first set of thumbnails may include: the electronic device obtaining the metadata of the first set of thumbnails; the electronic device obtaining a first query range based on the date, time, and ID in the metadata of the first set of thumbnails; and the electronic device obtaining the first set of thumbnails within the first query range from the database at one time based on the first query range.

[0029] In this way, electronic devices can read multiple thumbnails at once, which can reduce the number of times input / output interfaces are called, improve the performance and frame rate of loading and displaying a large number of thumbnails, and save power consumption of electronic devices.

[0030] In conjunction with the first aspect, in one possible implementation, the electronic device obtains the query range based on the date, time, and ID in the metadata of the first set of thumbnails. This can include: the electronic device assembling the date, time, and ID of the first set of thumbnails to obtain multiple strings, the number of which is equal to the number of thumbnails in the first set; the electronic device determining the maximum and minimum values ​​among the multiple strings, and setting a first query range based on the maximum and minimum values. In this way, the electronic device can determine the query range of thumbnails using the maximum and minimum values ​​and obtain all thumbnails within that query range.

[0031] In conjunction with the first aspect, in one possible implementation, the third operation is a sliding operation, and obtaining the third set of thumbnails may include: the electronic device determining the date, time, and ID of the third set of thumbnails based on the third operation; the electronic device determining a second query range of the third set of thumbnails based on the date, time, and ID of the third set of thumbnails; and the electronic device obtaining the third set of thumbnails within the second query range from the database in one go based on the second query range.

[0032] In this way, electronic devices can determine which thumbnails to display based on operations and set the query scope by displaying the metadata of the thumbnails as needed. Thus, electronic devices can retrieve thumbnails within the query scope in batches at once.

[0033] In conjunction with the first aspect, in one possible implementation, the electronic device acquiring the first set of thumbnails may include: the electronic device assigning a first view control to hold the first set of thumbnails; the electronic device sending a thumbnail loading request to a database through the first view control, the thumbnail loading request being used to retrieve the first set of thumbnails from the database. In this way, the electronic device can request to load the thumbnails that the view control needs to hold through the view control.

[0034] In conjunction with the first aspect, in one possible implementation, the number of view controls required in the thumbnail display interface is determined by the total number of thumbnails stored by the electronic device and the number of thumbnails read in batches. In this way, the electronic device can determine the number of view controls required in the thumbnail display interface.

[0035] In conjunction with the first aspect, in one possible implementation, before the electronic device receives and responds to the user's first operation on the gallery application and acquires the first set of thumbnails, the method may further include: the electronic device acquiring a first image; the electronic device downsampling the first image to obtain a thumbnail of the first image; the electronic device saving the date, time, and ID corresponding to the thumbnail of the first image; and the electronic device saving the thumbnails of the first image to a database according to the sorting of the date, time, and ID corresponding to the thumbnails of the first image.

[0036] In this way, since the storage order of thumbnails is consistent with the display order, electronic devices have the ability to acquire thumbnails in batches.

[0037] In conjunction with the first aspect, in one possible implementation, the electronic device saves the thumbnails of the first image to the database according to the date, time, and ID corresponding to the thumbnails of the first image. This may include: the electronic device performing texture compression on the thumbnails of the first image to obtain texture data; and the electronic device saving the texture data to the database according to the sorting of the date, time, and ID corresponding to the thumbnails of the first image.

[0038] In this way, since texture data can be sent directly to the GPU without decoding, the decoding time of electronic devices is saved, thus saving power consumption of electronic devices.

[0039] In a second aspect, an electronic device is provided, which may include a first application, a processing module, a graphics subsystem, and a database, wherein the database is used to store thumbnails;

[0040] The first application can be used to: receive and respond to a user's first operation on the gallery application, and obtain a first set of thumbnails, the first set of thumbnails including at least two thumbnails;

[0041] The processing module can be used to: stitch the first group of thumbnails together into the first large image according to the display order;

[0042] The graphics subsystem can be used to: render the first large image;

[0043] The first application can be used to: display the thumbnail display interface of the gallery application, in which the first large image is displayed.

[0044] The first operation includes any one of the following: the user opening the first application, the user switching view scenes in the thumbnail display interface, or the user swiping in the thumbnail display interface.

[0045] The first application may include any one of the following: a gallery application, a file management application, and an image selection application.

[0046] In this way, the electronic device can stitch together multiple thumbnails to obtain a stitched thumbnail. Then, the electronic device can display the stitched thumbnail through view controls. The thumbnails displayed in the thumbnail display interface are stitched together into one or more large images. One view control can hold one large image. Thus, the electronic device only needs a few view controls to display a large number of thumbnails. Furthermore, the electronic device can batch query and retrieve thumbnails, reducing the number of I / O interface calls. This improves the performance and frame rate of the electronic device when loading and displaying a large number of thumbnails, thereby avoiding or reducing white blocks and stuttering issues that may occur when users browse a large number of thumbnails.

[0047] In conjunction with the second aspect, in one possible implementation, the first application may also include: creating a first view control and using the first view control to carry the first large image.

[0048] In this way, a single view control can hold a large image, and electronic devices only need a small number of view controls to display a large number of thumbnails. This improves the display performance of electronic devices.

[0049] In conjunction with the second aspect, in one possible implementation, the processing module can also be used to: in response to the first operation, obtain a second set of thumbnails, the second set of thumbnails including at least two thumbnails; and stitch the second set of thumbnails together in display order to form a second large image;

[0050] The graphics subsystem can also be used to render a second large image;

[0051] The first application can also be used to display a second large image in the thumbnail display interface.

[0052] In this way, the thumbnail display interface shows the stitched-together large images, and a single thumbnail display interface only needs a few view controls to display a large number of thumbnails. This can improve the display performance of electronic devices.

[0053] In conjunction with the second aspect, in one possible implementation, the first application can also be used to: receive and respond to the second operation, display a portion of the content of the first large image and the entire content of the second large image on the thumbnail display interface, wherein the second operation is an operation of swiping upwards in the thumbnail display interface.

[0054] In this way, the electronic device can determine, based on the second operation, which controls to display in the thumbnail display interface, and what part of the large image within each control should be shown—part or all. Since the large image carried by the view control is complete, but due to user interaction, only a portion is displayed in the thumbnail display area. Because the undisplayed portion has already been pre-loaded and pieced together, the electronic device can more quickly display the undisplayed part of the large image in the view control when the user swipes. This improves the display performance of the electronic device and enhances the user experience.

[0055] In conjunction with the second aspect, in one possible implementation, the first application can also be used for: the electronic device to create a second view control, and to carry a second large image through the second view control.

[0056] In this way, a single view control can hold a large image, and electronic devices only need a small number of view controls to display a large number of thumbnails. This improves the display performance of electronic devices.

[0057] In conjunction with the second aspect, in one possible implementation, the first application can also be used for: the electronic device receiving and responding to the third operation to acquire a third set of thumbnails, the third set of thumbnails including at least two thumbnails;

[0058] The processing module can also be used to: stitch the third set of thumbnails together into a third large image according to the display order;

[0059] The first application can also be used to: create a third-view control and use the third-view control to hold a third large image;

[0060] The graphics subsystem can also be used to render the third largest image;

[0061] The first application can also be used to display a third large image in the thumbnail display interface.

[0062] In this way, electronic devices can display a large number of thumbnails with only a few view controls.

[0063] In conjunction with the second aspect, in one possible implementation, the first application can also be used to: retrieve a first set of thumbnails from a database, wherein the storage order of the first set of thumbnails in the database is consistent with the display order of the first set of thumbnails.

[0064] In this way, since the storage order of the first set of thumbnails in the database is consistent with the display order of the first set of thumbnails, the electronic device can read the first set of thumbnails in batches at once. This reduces the number of times the electronic device calls the input / output interface, improves the performance and frame rate of loading and displaying a large number of thumbnails, and saves power consumption of the electronic device.

[0065] In conjunction with the second aspect, in one possible implementation, the database can also be used to: allocate first memory;

[0066] The database can also be used to: fill the first set of thumbnails into the first memory in the order of display, and stitch them together in the first memory to obtain a large image.

[0067] The first memory is shared memory.

[0068] In this way, other processes on the electronic device, such as the rendering process, can read the large image across processes, which can improve rendering performance and save power consumption of the electronic device.

[0069] In conjunction with the second aspect, in one possible implementation, the graphics subsystem can also be used to: read a first large image from first memory and render the first large image. In this way, the graphics subsystem can read the large image across processes, which can improve rendering performance and save power consumption of the electronic device.

[0070] In conjunction with the second aspect, in one possible implementation, the database stores metadata for the first set of thumbnails, including the date, time, and identification ID corresponding to each thumbnail. This allows electronic devices to distinguish between different thumbnails based on their corresponding date, time, and ID.

[0071] In conjunction with the second aspect, in one possible implementation, the first set of thumbnails includes a first thumbnail, the date and time corresponding to the first thumbnail is a first date and time, the ID corresponding to the first thumbnail is a first ID, the first date and time is the date and time when the electronic device saves the first thumbnail, and the first ID is a number generated by the electronic device when saving the first thumbnail to identify it. In this way, the electronic device can distinguish different thumbnails by the date and time corresponding to the thumbnail and by its ID.

[0072] In conjunction with the second aspect, in one possible implementation, the electronic device may further include a media library and a distributed data management module. The media library may be used to: obtain the metadata of the first set of thumbnails; and send a thumbnail query instruction to the distributed data management module, the query instruction carrying the metadata of the first set of thumbnails.

[0073] The distributed data management module can be used to: receive query instructions and obtain a first query range based on the date, time and ID in the metadata of the first set of thumbnails carried in the query instructions; and retrieve the first set of thumbnails within the first query range from the database at one time based on the first query range.

[0074] In this way, electronic devices can read multiple thumbnails at once, which can reduce the number of times input / output interfaces are called, improve the performance and frame rate of loading and displaying a large number of thumbnails, and save power consumption of electronic devices.

[0075] In conjunction with the second aspect, in one possible implementation, the distributed data management module can also be used to: assemble the date, time, and ID of the first set of thumbnails into multiple strings, the number of which is equal to the number of thumbnails in the first set; the electronic device determines the maximum and minimum values ​​among the multiple strings and sets a first query range based on the maximum and minimum values. In this way, the electronic device can determine the query range of thumbnails using the maximum and minimum values ​​and retrieve all thumbnails within that query range.

[0076] In conjunction with the second aspect, in one possible implementation, the third operation is a swipe operation, and the media library can also be used to: determine the date, time and ID of the third set of thumbnails based on the third operation;

[0077] The distributed data management module can also be used to: determine the second query range of the third set of thumbnails based on the date, time and ID of the third set of thumbnails; and retrieve the third set of thumbnails within the second query range from the database in one go based on the second query range.

[0078] In this way, electronic devices can determine which thumbnails to display based on operations and set the query scope by displaying the metadata of the thumbnails as needed. Thus, electronic devices can retrieve thumbnails within the query scope in batches at once.

[0079] In conjunction with the second aspect, in one possible implementation, the first application can also be used to: assign a first view control to carry a first set of thumbnails; and send a thumbnail loading request to a database through the first view control, the thumbnail loading request being used to retrieve the first set of thumbnails from the database. In this way, the electronic device can request to load the thumbnails required to be carried by the view control through the view control.

[0080] In conjunction with the second aspect, in one possible implementation, the number of view controls required in the thumbnail display interface is determined by the total number of thumbnails stored by the electronic device and the number of thumbnails read in batches. In this way, the electronic device can determine the number of view controls required in the thumbnail display interface.

[0081] In conjunction with the second aspect, in one possible implementation, the electronic device may further include a second application, which may be used to: acquire the first image;

[0082] The media library can also be used to: downsample the first image to obtain a thumbnail of the first image;

[0083] The media library can also be used to: instruct the distributed data management module to save the date, time, and ID corresponding to the thumbnail of the first image;

[0084] The distributed data management module can also be used to save the thumbnails of the first image to the database according to the date and time corresponding to the thumbnail of the first image and the sorting by ID.

[0085] In this way, since the storage order of thumbnails is consistent with the display order, electronic devices have the ability to acquire thumbnails in batches.

[0086] In conjunction with the second aspect, in one possible implementation, the media library can also be used for: the electronic device to perform texture compression on the thumbnail of the first image to obtain texture data;

[0087] The distributed data management module can also be used to save texture data to the database according to the date and time corresponding to the thumbnail of the first image and the sorting by ID.

[0088] In this way, since texture data can be sent directly to the GPU without decoding, the decoding time of electronic devices is saved, thus saving power consumption of electronic devices.

[0089] Thirdly, this application provides an electronic device that may include one or more processors, one or more displays, and a memory, wherein the one or more displays and the memory are coupled to one or more processors, and the memory stores code that, when the code is processed by the processor, causes the electronic device to execute the method in any of the possible implementations of the first aspect described above.

[0090] Fourthly, this application provides a computer-readable storage medium including computer instructions that, when executed on a computer, cause the computer to perform the method in any possible implementation of the first aspect described above.

[0091] Fifthly, this application provides a computer program product that, when run on a computer, causes the computer to perform the method in any possible implementation of the first aspect described above.

[0092] In a sixth aspect, this application provides a chip or chip system for use in an electronic device, including a processing circuit and an interface circuit. The interface circuit is used to receive code instructions and transmit them to the processing circuit, and the processing circuit is used to execute the code instructions to perform the method in any possible implementation of the first aspect described above.

[0093] Understandably, the electronic device provided in the third aspect, the computer-readable storage medium provided in the fourth aspect, the computer program product provided in the fifth aspect, and the chip or chip system provided in the sixth aspect are all used to perform the method provided in this application. Therefore, the beneficial effects they can achieve can be referred to the beneficial effects in the corresponding methods, and will not be repeated here. Attached Figure Description

[0094] Figure 1 This is a schematic diagram of the thumbnail display interface in the daytime view scenario provided in the embodiments of this application;

[0095] Figure 2 This is a schematic diagram of the thumbnail display interface in the moon view scenario provided in the embodiments of this application;

[0096] Figure 3 This is a schematic diagram of the thumbnail display interface in the year view scenario provided in the embodiments of this application;

[0097] Figure 4 This is a schematic diagram showing white blocks appearing on the thumbnail display interface in the year view scenario provided in the embodiments of this application;

[0098] Figure 5A This is a schematic diagram of the structure of the electronic device provided in the embodiments of this application;

[0099] Figure 5B This is a software structure block diagram of the electronic device provided in the embodiments of this application;

[0100] Figure 5C This is a software structure block diagram of the electronic device provided in the embodiments of this application;

[0101] Figure 6 This is a schematic diagram of the process of saving thumbnails in the electronic device 100 provided in the embodiments of this application;

[0102] Figure 7 This is a schematic diagram of the orderly storage of thumbnails in an electronic device provided in an embodiment of this application;

[0103] Figure 8 This is a flowchart illustrating an image display method provided in an embodiment of this application;

[0104] Figure 9A This is a schematic diagram of the view controls included in the thumbnail display interface provided in the embodiments of this application;

[0105] Figure 9B This is a schematic diagram of the display area view control of the thumbnail display interface provided in the embodiments of this application;

[0106] Figure 9C This is a schematic diagram of the display area view control of the thumbnail display interface provided in the embodiments of this application;

[0107] Figure 9D This is a schematic diagram of the display area view control of the thumbnail display interface provided in the embodiments of this application;

[0108] Figure 10 This is a schematic diagram of a stitched thumbnail provided in an embodiment of this application;

[0109] Figure 11 This is a flowchart illustrating an image display method provided in an embodiment of this application. Detailed Implementation

[0110] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0111] The terminology used in the following embodiments of this application is for the purpose of describing particular embodiments only and is not intended to be limiting of this application. As used in the specification and appended claims of this application, the singular expressions “a,” “an,” “the,” “the,” “the,” and “this” are intended to include the plural expressions as well, unless the context clearly indicates otherwise. The terms “first” and “second” are used for descriptive purposes only and should not be construed as implying or suggesting relative importance or implicitly indicating the number of indicated technical features. Thus, a feature defined as “first” or “second” may explicitly or implicitly include one or more of that feature. “First” and “second,” etc., are used to distinguish different objects, not to describe a particular order of objects. For example, a first object and a second object are used to distinguish different objects, not to describe a particular order of objects.

[0112] In the description of the embodiments in this application, unless otherwise stated, "multiple" means two or more. For example, multiple processing units refer to two or more processing units; multiple systems refer to two or more systems.

[0113] In the embodiments of this application, the terms "exemplary" or "for example" are used to indicate that something is an example, illustration, or description. Any embodiment or related scheme described as "exemplary" or "for example" in the embodiments of this application should not be construed as being more preferred or advantageous than other embodiments or design schemes. Specifically, the use of the terms "exemplary" or "for example" is intended to present the relevant concepts in a specific manner.

[0114] The term "and / or" in this application is merely a description of the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent three cases: A existing alone, A and B existing simultaneously, and B existing alone.

[0115] The term "user interface (UI)" used in the following embodiments of this application refers to the medium interface through which an application or operating system interacts and exchanges information with the user. It realizes the conversion between the internal form of information and the form that the user can accept. The user interface is source code written in a specific computer language such as Java or Extensible Markup Language (XML). The interface source code is parsed and rendered on the electronic device, ultimately presenting content that the user can recognize. A common form of user interface is the graphical user interface (GUI), which refers to a user interface related to computer operation displayed graphically. It can be visible interface elements such as text, icons, buttons, menus, tabs, text boxes, dialog boxes, status bars, navigation bars, and widgets displayed on the screen of an electronic device.

[0116] To better understand the technical solutions provided in this application, before describing the technical solutions, a brief introduction to the electronic device 100 with gallery or photo album functions to which this application applies will be given in conjunction with the accompanying drawings. In the embodiments of this application, the electronic device 100 may be referred to as a terminal or a user equipment (UE), and this application does not limit this terminology. The electronic device 100 involved in this application may include, but is not limited to: mobile phones, tablet computers, laptops, PDAs, mobile internet devices (MIDs), wearable devices, virtual reality (VR) devices, augmented reality (AR) devices, in-vehicle devices, etc. This application does not limit the specific form or type of the electronic device 100.

[0117] Currently, the gallery application of electronic device 100 displays thumbnail images in different view scenarios. For example, electronic device 100 can display thumbnail images in day view, month view, and year view scenarios in the gallery application. Users can preview thumbnails presented in chronological order on electronic device 100. Users can also preview thumbnails by year, month, and day. The preview views by year, month, and day can be referred to as year view, month view, and day view, respectively. The thumbnail display interfaces in different view scenarios show thumbnails of different sizes and orders of magnitude, and users can jump between different views, making it convenient for users to quickly find the corresponding images.

[0118] Figure 1An exemplary thumbnail display interface 101 of an electronic device 100 in a daytime view scene is shown. For example... Figure 1 As shown, the thumbnail display interface 101 can be used to display thumbnails of photos acquired on a specific date. The thumbnail display interface 101 may also include text prompts 102. For example, the text prompt 102 could be "February 23, 2023," indicating that the thumbnails of the multiple photos displayed on the thumbnail display interface 101 were taken or saved on "February 20, 2023." The thumbnails of the multiple photos displayed on the thumbnail display interface 101 may include a thumbnail 104 corresponding to photo 1.

[0119] Optionally, the electronic device 100 can arrange thumbnails corresponding to multiple photos taken or saved on February 20, 2023 in an 8-row, 4-column layout on the thumbnail display interface 101.

[0120] Optionally, users can also swipe up or down on the thumbnail display interface 101 to view thumbnails of photos (or images) taken or saved on other dates.

[0121] like Figure 1 As shown, the thumbnail display interface 101 may also include a view switching control 103. This view switching control 103 is used to switch between different view scenes. For example, the view switching control 103 may include a day view control 103a, a month view control 103b, and a year view control 103c. Currently, the day view control 103a is selected, indicating that the electronic device 100 is currently displaying a thumbnail display interface in the day view scene. The month view control 103b indicates that the electronic device 100 switches to displaying a thumbnail display interface in the month view scene. The year view control 103c indicates that the electronic device 100 switches to displaying a thumbnail display interface in the year view scene.

[0122] In some feasible examples, the user can click the moon view control 103b. In response to this user action, the electronic device 100 can display a thumbnail display interface of the moon view scene.

[0123] Figure 2 An exemplary thumbnail display interface 200 of an electronic device 100 in a moon view scene is shown. For example... Figure 2As shown, the thumbnail display interface 200 can be used to display thumbnails of photos acquired in a specific month. The thumbnail display interface 200 may also include text prompts 201. For example, the text prompt 201 could be "February 2023," indicating that the thumbnails of the multiple photos displayed on the thumbnail display interface 200 were taken or saved in "February 2023." The thumbnails of the multiple photos displayed on the thumbnail display interface 200 may include a thumbnail 202 corresponding to photo 1.

[0124] Optionally, the electronic device 100 can arrange thumbnails corresponding to multiple photos taken or saved in February 2023 in a 16-row, 8-column layout on the thumbnail display interface 200.

[0125] Optionally, users can also swipe up or down on the thumbnail display interface 200 to view thumbnails of photos taken or saved in other months.

[0126] like Figure 2 As shown, the thumbnail display interface 200 may also include a view switching control 103. Currently, the moon view control 103b in the view switching control 103 is selected, indicating that the electronic device 100 is currently displaying a thumbnail display interface in the moon view scene. For details regarding the view switching control 103, please refer to the above description. Figure 1 The description will not be repeated here.

[0127] In some feasible examples, the user can click on the year view control 103c. In response to this user action, the electronic device 100 can display a thumbnail display interface for the year view scene.

[0128] Figure 3 An exemplary thumbnail display interface 300 is shown in a yearly view scene of an electronic device 100. For example... Figure 3 As shown, the thumbnail display interface 300 can be used to display thumbnails of photos acquired in a specific year. The thumbnail display interface 300 may also include text prompts 301. For example, the text prompt 301 could be "2023," indicating that the thumbnails of the multiple photos displayed on the thumbnail display interface 300 were taken or saved in "2023." The thumbnails of the multiple photos displayed on the thumbnail display interface 300 may include a thumbnail 302 corresponding to photo 1.

[0129] Optionally, the electronic device 100 can arrange thumbnails corresponding to multiple photos taken or saved in 2023 in a 32-row, 16-column layout on the thumbnail display interface 300.

[0130] Optionally, users can also swipe up or down on the thumbnail display interface 300 to view thumbnails corresponding to photos taken or saved in other years.

[0131] like Figure 3 As shown, the thumbnail display interface 300 may also include a view switching control 103. Currently, the year view control 103c in the view switching control 103 is selected, indicating that the current electronic device 100 is displaying a thumbnail display interface in the year view scenario. For details regarding the view switching control 103, please refer to the above description. Figure 1 The description will not be repeated here.

[0132] In some feasible examples, since the number of thumbnails displayed in the thumbnail display interface gradually increases from the day view scene to the year view scene, while the size of the display screen of the electronic device 100 remains unchanged, the size of the thumbnails displayed in the thumbnail display interface gradually decreases from the day view scene to the year view scene. For example, for the same photograph, the thumbnail size displayed in the month view scene is smaller than the thumbnail size displayed in the day view scene. The thumbnail size displayed in the year view scene is smaller than the thumbnail size displayed in the month view scene. For instance, the size of thumbnail 302 corresponding to photograph 1 in the year view scene is smaller than the size of thumbnail 202 corresponding to photograph 1 in the month view scene. The size of thumbnail 202 corresponding to photograph 1 in the month view scene is smaller than the size of thumbnail 104 corresponding to photograph 1 in the day view scene.

[0133] In this embodiment, the number of thumbnails displayed by the electronic device 100 in the day view, month view, and year view scenarios is not limited. It is understood that the number of thumbnails that can be displayed in the thumbnail display interface in the day view, month view, and year view scenarios is related to the size of the electronic device 100's display screen. The larger the size of the electronic device 100's display screen, the more thumbnails can be displayed in the thumbnail display interface in the day view, month view, and year view scenarios.

[0134] Taking the year view scenario as an example, when a user is in the thumbnail display interface of the year view scenario (e.g., Figure 3When a finger touches and slides up or down in the thumbnail display interface 300 shown, the view control used to display images in the thumbnail display interface receives the touch event, and the corresponding display area requests a refresh of thumbnails arranged in reverse chronological order. The refresh request process includes reading the thumbnail resources, decoding the images, drawing, and rendering, ultimately causing each thumbnail to be displayed in its corresponding display area.

[0135] Currently, the number of thumbnails that electronic device 100 can display in monthly and yearly view scenarios far exceeds the number that can be displayed in daily view scenarios. When electronic device 100 needs to load and display a large number of thumbnails, it needs to create numerous view controls, make multiple calls to the I / O interface to obtain image resources, perform multiple image decodings, and render and display the view controls multiple times. When electronic device 100 needs to display a large number of thumbnails in a short period of time, the rendering, display, I / O interface calls to obtain image resources, and image decoding operations compete for CPU resources. This results in longer times for electronic device 100 to obtain image resources, decode images, and create view controls. When users quickly swipe or drag scroll bars in the thumbnail display interface of the gallery, situations may occur where the view control is created before the image has finished decoding, or the view control cannot be created in time, causing the electronic device to stutter when displaying thumbnails, for example, displaying a large number of white blocks in the thumbnail display interface. In scenarios where a large number of thumbnails are displayed in both month and year view modes, taking the year view mode as an example, when a user quickly swipes or drags the scroll bar in the thumbnail display interface 300 of the year view mode, a large number of white blocks will appear on the thumbnail display interface. For example... Figure 4 As shown, a white block appears in area 401 of the thumbnail display interface 300. This results in a poor user experience.

[0136] To address the issues of white blocks and lag when browsing thumbnails on an electronic device 100 displaying a large number of thumbnails, this application provides an image display method. This method includes: First, when storing thumbnails corresponding to captured or saved images, the electronic device 100 stores the thumbnails according to their arrangement order in the thumbnail display interface. This enables the electronic device 100 to batch query and retrieve thumbnails. Then, when the electronic device displays the thumbnail display interface, it can batch query and retrieve thumbnails. The electronic device 100 can then stitch together multiple retrieved thumbnails to obtain a stitched thumbnail, which can then be displayed via a view control.

[0137] The image display method provided in this application stitches together thumbnails displayed in the thumbnail display interface into one or more large images. One view control can hold one large image. Thus, the electronic device 100 only needs a small number of view controls (e.g., one or two, etc.) to display a large number of thumbnails. Furthermore, the electronic device 100 can batch query and retrieve thumbnails, reducing the number of I / O interface calls. This improves the performance and frame rate of the electronic device when loading and displaying a large number of thumbnails, thereby avoiding or reducing white blocks and stuttering issues that may occur when users browse a large number of thumbnails.

[0138] It should be noted that the thumbnails involved in this application can be thumbnails corresponding to images, video files, audio files, etc. The following description uses images as an example to illustrate the storage and display process of thumbnails corresponding to images. It is understood that the storage and display process of thumbnails for video files, audio files, etc., can be referenced to that of thumbnails corresponding to images, and will not be elaborated further in this embodiment.

[0139] The exemplary electronic device 100 provided in the embodiments of this application will be introduced below.

[0140] Figure 5A This is a schematic diagram of the structure of the electronic device 100 provided in the embodiments of this application.

[0141] The following detailed description uses electronic device 100 as an example. It should be understood that electronic device 100 may have more or fewer components than shown in the figures, may combine two or more components, or may have different component configurations. The various components shown in the figures can be implemented in hardware, software, or a combination of hardware and software, including one or more signal processing and / or application-specific integrated circuits.

[0142] Electronic device 100 may include: processor 110, external memory interface 120, internal memory 121, universal serial bus (USB) interface 130, charging management module 140, power management module 141, battery 142, antenna 1, antenna 2, mobile communication module 150, wireless communication module 160, audio module 170, speaker 170A, receiver 170B, microphone 170C, headphone jack 170D, sensor module 180, button 190, motor 191, indicator 192, camera 193, display screen 194, and subscriber identification module (SIM) card interface 195, etc. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, a barometric pressure sensor 180C, a magnetic sensor 180D, an accelerometer sensor 180E, a distance sensor 180F, a proximity sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L, a bone conduction sensor 180M, etc.

[0143] It is understood that the structures illustrated in the embodiments of this application do not constitute a specific limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may include more or fewer components than illustrated, or combine some components, or split some components, or have different component arrangements. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.

[0144] Processor 110 may include one or more processing units, such as: application processor (AP), modem processor, graphics processing unit (GPU), image signal processor (ISP), controller, memory, video codec, digital signal processor (DSP), baseband processor, and / or neural network processing unit (NPU), etc. Different processing units may be independent devices or integrated into one or more processors.

[0145] The controller can be the nerve center and command center of the electronic device 100. The controller can generate operation control signals according to the instruction opcode and timing signals to complete the control of fetching and executing instructions.

[0146] The processor 110 may also include a memory for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. This memory can store instructions or data that the processor 110 has just used or that are used repeatedly. If the processor 110 needs to use the instruction or data again, it can retrieve it directly from the memory. This avoids repeated accesses, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.

[0147] In some embodiments, the processor 110 may include one or more interfaces. Interfaces may include an inter-integrated circuit (I2C) interface, an inter-integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, a subscriber identity module (SIM) interface, and / or a universal serial bus (USB) interface, etc.

[0148] The I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (SCL). In some embodiments, the processor 110 may include multiple I2C buses. The processor 110 can couple to the touch sensor 180K, charger, flash, camera 193, etc., through different I2C bus interfaces. For example, the processor 110 can couple to the touch sensor 180K through the I2C interface, enabling the processor 110 and the touch sensor 180K to communicate through the I2C bus interface, thereby realizing the touch function of the electronic device 100.

[0149] The I2S interface can be used for audio communication. In some embodiments, the processor 110 may include multiple I2S buses. The processor 110 can be coupled to the audio module 170 via the I2S bus to enable communication between the processor 110 and the audio module 170. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the I2S interface to enable the function of answering phone calls through a Bluetooth headset.

[0150] The PCM interface can also be used for audio communication, sampling, quantizing, and encoding analog signals. In some embodiments, the audio module 170 and the wireless communication module 160 can be coupled via the PCM bus interface. In some embodiments, the audio module 170 can also transmit audio signals to the wireless communication module 160 via the PCM interface, enabling the function of answering phone calls through a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.

[0151] The UART interface is a universal serial data bus used for asynchronous communication. This bus can be a bidirectional communication bus. It converts the data to be transmitted between serial and parallel communication. In some embodiments, the UART interface is typically used to connect the processor 110 and the wireless communication module 160. For example, the processor 110 communicates with the Bluetooth module in the wireless communication module 160 via the UART interface to implement Bluetooth functionality. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the UART interface to enable music playback through Bluetooth headphones.

[0152] The MIPI interface can be used to connect the processor 110 to peripheral devices such as the display screen 194 and the camera 193. The MIPI interface includes a camera serial interface (CSI) and a display serial interface (DSI). In some embodiments, the processor 110 and the camera 193 communicate via the CSI interface to enable the electronic device 100 to capture images. The processor 110 and the display screen 194 communicate via the DSI interface to enable the electronic device 100 to display images.

[0153] The GPIO interface can be configured via software. It can be configured as a control signal or a data signal. In some embodiments, the GPIO interface can be used to connect the processor 110 to a camera 193, a display screen 194, a wireless communication module 160, an audio module 170, a sensor module 180, etc. The GPIO interface can also be configured as an I2C interface, an I2S interface, a UART interface, a MIPI interface, etc.

[0154] The SIM interface can be used to communicate with the SIM card interface 195 to transmit data to or read data from the SIM card.

[0155] USB port 130 is a USB standard compliant interface, specifically a Mini USB port, Micro USB port, USB Type-C port, etc. USB port 130 can be used to connect a charger to charge electronic device 100, and can also be used for data transfer between electronic device 100 and peripheral devices. It can also be used to connect headphones for audio playback. This interface can also be used to connect other electronic devices, such as AR devices.

[0156] It is understood that the interface connection relationships between the modules illustrated in the embodiments of this application are merely illustrative and do not constitute a structural limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may also employ different interface connection methods or combinations of multiple interface connection methods as described in the above embodiments.

[0157] The charging management module 140 is used to receive charging input from the charger. The charger can be a wireless charger or a wired charger.

[0158] The power management module 141 is used to connect the battery 142, the charging management module 140, and the processor 110. The power management module 141 receives input from the battery 142 and / or the charging management module 140 to power the processor 110, internal memory 121, external memory, display 194, camera 193, and wireless communication module 160, etc.

[0159] The wireless communication function of electronic device 100 can be realized through antenna 1, antenna 2, mobile communication module 150, wireless communication module 160, modem processor and baseband processor, etc.

[0160] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in electronic device 100 can be used to cover one or more communication frequency bands. Different antennas can also be multiplexed to improve antenna utilization. For example, antenna 1 can be multiplexed as a diversity antenna for a wireless local area network. In some other embodiments, the antennas can be used in conjunction with tuning switches.

[0161] The mobile communication module 150 can provide solutions for wireless communication, including 2G / 3G / 4G / 5G, applied to the electronic device 100. The mobile communication module 150 may include at least one filter, switch, power amplifier, low noise amplifier (LNA), etc. The mobile communication module 150 can receive electromagnetic waves via antenna 1, and perform filtering, amplification, and other processing on the received electromagnetic waves before transmitting them to a modem processor for demodulation. The mobile communication module 150 can also amplify the signal modulated by the modem processor and convert it into electromagnetic waves for radiation via antenna 1. In some embodiments, at least some functional modules of the mobile communication module 150 may be housed in the processor 110. In some embodiments, at least some functional modules of the mobile communication module 150 and at least some modules of the processor 110 may be housed in the same device.

[0162] The modem processor may include a modulator and a demodulator. The modulator modulates the low-frequency baseband signal to be transmitted into a mid-to-high frequency signal. The demodulator demodulates the received electromagnetic wave signal into a low-frequency baseband signal. The demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing. After processing by the baseband processor, the low-frequency baseband signal is transmitted to the application processor. The application processor outputs sound signals through an audio device (not limited to speaker 170A, receiver 170B, etc.) or displays images or videos through the display screen 194. In some embodiments, the modem processor may be a separate device. In other embodiments, the modem processor may be independent of the processor 110 and may be housed in the same device as the mobile communication module 150 or other functional modules.

[0163] The wireless communication module 160 can provide solutions for wireless communication applications on the electronic device 100, including wireless local area networks (WLANs) (such as wireless fidelity (Wi-Fi) networks), Bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), and infrared (IR) technologies. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via antenna 2, performs frequency modulation and filtering of the electromagnetic wave signals, and sends the processed signal to processor 110. The wireless communication module 160 can also receive signals to be transmitted from processor 110, perform frequency modulation and amplification, and convert them into electromagnetic waves for radiation via antenna 2.

[0164] In some embodiments, antenna 1 of electronic device 100 is coupled to mobile communication module 150, and antenna 2 is coupled to wireless communication module 160, enabling electronic device 100 to communicate with networks and other devices via wireless communication technology. The wireless communication technology may include Global System for Mobile Communications (GSM), General Packet Radio Service (GPRS), Code Division Multiple Access (CDMA), Wideband Code Division Multiple Access (WCDMA), Time Division Code Division Multiple Access (TD-SCDMA), Long Term Evolution (LTE), BT, GNSS, WLAN, NFC, FM, and / or IR technologies, etc. The GNSS may include the Global Positioning System (GPS), the Global Navigation Satellite System (GLONASS), the BeiDou Navigation Satellite System (BDS), the Quasi-Zenith Satellite System (QZSS), and / or satellite-based augmentation systems (SBAS).

[0165] Electronic device 100 implements display functions through a GPU, a display screen 194, and an application processor. The GPU is a microprocessor for image processing, connected to the display screen 194 and the application processor. The GPU is used to perform mathematical and geometric calculations and for graphics rendering. Processor 110 may include one or more GPUs, which execute program instructions to generate or modify display information.

[0166] Display screen 194 is used to display images, videos, etc. Display screen 194 includes a display panel. The display panel may be a liquid crystal display (LCD), an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), a Mini LED, a MicroLED, a Micro-OLED, a quantum dot light-emitting diode (QLED), etc. In some embodiments, electronic device 100 may include one or N displays 194, where N is a positive integer greater than 1.

[0167] Electronic device 100 can perform shooting functions through ISP, camera 193, video codec, GPU, display 194 and application processor.

[0168] The ISP (Image Signal Processor) is used to process data fed back from the camera 193. For example, when taking a picture, the shutter is opened, and light is transmitted through the lens to the camera's photosensitive element. The light signal is converted into an electrical signal, and the camera's photosensitive element transmits the electrical signal to the ISP for processing, transforming it into an image visible to the naked eye. The ISP can also perform algorithmic optimization of image noise, brightness, and color. The ISP can also optimize parameters such as exposure and color temperature of the shooting scene. In some embodiments, the ISP can be set in the camera 193.

[0169] Camera 193 is used to capture still images or videos. An object is projected onto a photosensitive element by generating an optical image through the lens. The photosensitive element can be a charge-coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the light signal into an electrical signal, which is then passed to an ISP for conversion into a digital image signal. The ISP outputs the digital image signal to a DSP for processing. The DSP converts the digital image signal into image signals in standard RGB, YUV, or other formats. In some embodiments, the electronic device 100 may include one or N cameras 193, where N is a positive integer greater than 1.

[0170] Digital signal processors (DSPs) are used to process digital signals. Besides digital image signals, they can also process other digital signals. For example, when electronic device 100 selects a frequency, the DSP can perform Fourier transforms on the frequency energy.

[0171] Video codecs are used to compress or decompress digital video. Electronic device 100 may support one or more video codecs. Thus, electronic device 100 can play or record videos in various encoding formats, such as Moving Picture Experts Group (MPEG) 1, MPEG2, MPEG3, MPEG4, etc.

[0172] An NPU (Neural Processing Unit) is a computational processor for neural networks (NNs). By borrowing the structure of biological neural networks, such as the transmission patterns between neurons in the human brain, it can rapidly process input information and continuously learn on its own. NPUs enable intelligent cognitive applications in electronic devices, such as image recognition, facial recognition, speech recognition, and text understanding.

[0173] The external storage interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100. The external memory card communicates with the processor 110 through the external storage interface 120 to perform data storage functions. For example, music, video, and other files can be saved on the external memory card.

[0174] Internal memory 121 can be used to store computer executable program code, which includes instructions. Processor 110 executes various functional applications and data processing of electronic device 100 by running the instructions stored in internal memory 121. Internal memory 121 may include a program storage area and a data storage area. The program storage area may store the operating system, at least one application required for a function (such as facial recognition, fingerprint recognition, mobile payment, etc.). The data storage area may store data created during the use of electronic device 100 (such as facial information template data, fingerprint information templates, etc.). Furthermore, internal memory 121 may include high-speed random access memory and non-volatile memory, such as at least one disk storage device, flash memory device, universal flash storage (UFS), etc.

[0175] Electronic device 100 can implement audio functions, such as music playback and recording, through audio module 170, speaker 170A, receiver 170B, microphone 170C, headphone jack 170D, and application processor.

[0176] The audio module 170 is used to convert digital audio information into analog audio signals for output, and also to convert analog audio input into digital audio signals. The audio module 170 can also be used for encoding and decoding audio signals. In some embodiments, the audio module 170 may be located in the processor 110, or some functional modules of the audio module 170 may be located in the processor 110.

[0177] The speaker 170A, also known as a "loudspeaker," is used to convert audio electrical signals into sound signals. The electronic device 100 can listen to music or make hands-free calls through the speaker 170A.

[0178] The receiver 170B, also known as the "earpiece," is used to convert audio electrical signals into sound signals. When the electronic device 100 answers a telephone call or voice message, the receiver 170B can be brought close to the ear to listen to the voice.

[0179] Microphone 170C, also known as a "microphone" or "voice transducer," is used to convert sound signals into electrical signals. When making a phone call or sending a voice message, the user can speak by bringing their mouth close to microphone 170C, inputting the sound signal into microphone 170C. Electronic device 100 may have at least one microphone 170C. In some embodiments, electronic device 100 may have two microphones 170C, which, in addition to collecting sound signals, can also perform noise reduction. In other embodiments, electronic device 100 may also have three, four, or more microphones 170C, which can collect sound signals, reduce noise, identify the sound source, and perform directional recording, etc.

[0180] The 170D headphone jack is used to connect wired headphones. The 170D headphone jack can be a USB 130 interface or a 3.5mm Open Mobile Terminal Platform (OMTP) standard interface, a CTIA (Cellular Telecommunications Industry Association of the USA) standard interface.

[0181] Pressure sensor 180A is used to sense pressure signals and convert them into electrical signals. In some embodiments, pressure sensor 180A can be disposed on display screen 194. There are many types of pressure sensors 180A, such as resistive pressure sensors, inductive pressure sensors, and capacitive pressure sensors. A capacitive pressure sensor may include at least two parallel plates with conductive material. When force is applied to pressure sensor 180A, the capacitance between the electrodes changes. Electronic device 100 determines the pressure intensity based on the change in capacitance. When a touch operation is applied to display screen 194, electronic device 100 detects the intensity of the touch operation based on pressure sensor 180A. Electronic device 100 can also calculate the touch position based on the detection signal from pressure sensor 180A. In some embodiments, touch operations applied to the same touch position but with different touch operation intensities can correspond to different operation commands. For example, when a touch operation with an intensity less than a first pressure threshold is applied to the SMS application icon, a command to view an SMS is executed. When a touch operation with an intensity greater than or equal to the first pressure threshold is applied to the SMS application icon, a command to create a new SMS is executed.

[0182] The gyroscope sensor 180B can be used to determine the motion attitude of the electronic device 100. In some embodiments, the gyroscope sensor 180B can determine the angular velocity of the electronic device 100 about three axes (i.e., the x, y, and z axes). The gyroscope sensor 180B can be used for image stabilization. For example, when the shutter is pressed, the gyroscope sensor 180B detects the angle of the shake of the electronic device 100, calculates the distance that the lens module needs to compensate based on the angle, and allows the lens to counteract the shake of the electronic device 100 by moving in the opposite direction, thus achieving image stabilization. The gyroscope sensor 180B can also be used in navigation and motion-sensing game scenarios.

[0183] The barometric pressure sensor 180C is used to measure air pressure. In some embodiments, the electronic device 100 calculates altitude using the air pressure value measured by the barometric pressure sensor 180C to assist in positioning and navigation.

[0184] The magnetic sensor 180D includes a Hall sensor. The electronic device 100 can use the magnetic sensor 180D to detect the opening and closing of the flip cover. In some embodiments, when the electronic device 100 is a flip phone, the electronic device 100 can detect the opening and closing of the flip cover using the magnetic sensor 180D. Then, based on the detected opening and closing state of the cover or the flip cover, features such as automatic flip unlocking can be set.

[0185] The 180E accelerometer can detect the magnitude of acceleration of electronic device 100 in various directions (typically three axes). When electronic device 100 is stationary, it can detect the magnitude and direction of gravity. It can also be used to identify the posture of electronic devices and applied to applications such as screen orientation switching and pedometers.

[0186] A distance sensor 180F is used to measure distance. Electronic device 100 can measure distance via infrared or laser. In some embodiments, during a shooting scene, electronic device 100 can utilize the distance sensor 180F to measure distance for rapid focusing.

[0187] The proximity sensor 180G may include, for example, a light-emitting diode (LED) and a light detector, such as a photodiode. The LED may be an infrared LED. The electronic device 100 emits infrared light outward through the LED. The electronic device 100 uses the photodiode to detect infrared reflected light from nearby objects. When sufficient reflected light is detected, it can be determined that there is an object near the electronic device 100. When insufficient reflected light is detected, the electronic device 100 can determine that there is no object near the electronic device 100. The electronic device 100 may use the proximity sensor 180G to detect when a user holds the electronic device 100 close to their ear for a call, so as to automatically turn off the screen to save power. The proximity sensor 180G can also be used in holster mode and pocket mode for automatic unlocking and locking of the screen.

[0188] The ambient light sensor 180L is used to sense the brightness of ambient light. The electronic device 100 can adaptively adjust the brightness of the display screen 194 based on the sensed ambient light brightness. The ambient light sensor 180L can also be used to automatically adjust the white balance when taking pictures. The ambient light sensor 180L can also work with the proximity sensor 180G to detect whether the electronic device 100 is in a pocket to prevent accidental touches.

[0189] The fingerprint sensor 180H is used to collect fingerprints. The electronic device 100 can utilize the characteristics of the collected fingerprints to achieve fingerprint unlocking, accessing application locks, taking photos with fingerprints, answering calls with fingerprints, etc.

[0190] Temperature sensor 180J is used to detect temperature. In some embodiments, electronic device 100 uses the temperature detected by temperature sensor 180J to execute a temperature handling strategy. For example, when the temperature reported by temperature sensor 180J exceeds a threshold, electronic device 100 performs thermal protection by reducing the performance of a processor located near temperature sensor 180J to reduce power consumption. In other embodiments, when the temperature is below another threshold, electronic device 100 heats battery 142 to prevent abnormal shutdown of electronic device 100 due to low temperature. In still other embodiments, when the temperature is below yet another threshold, electronic device 100 boosts the output voltage of battery 142 to prevent abnormal shutdown due to low temperature.

[0191] Touch sensor 180K, also known as a "touch panel," can be located on display screen 194. The touch sensor 180K and display screen 194 together form a touchscreen, also known as a "touch screen." Touch sensor 180K detects touch operations applied to or near it. The touch sensor can transmit the detected touch operation to the application processor to determine the type of touch event. Visual output related to the touch operation can be provided through display screen 194. In other embodiments, touch sensor 180K may also be located on the surface of electronic device 100, in a different position than display screen 194.

[0192] Buttons 190 include a power button, volume buttons, etc. Buttons 190 can be mechanical buttons or touch-sensitive buttons. Electronic device 100 can receive button input and generate key signal inputs related to user settings and function control of electronic device 100.

[0193] Motor 191 can generate vibration alerts. Motor 191 can be used for incoming call vibration alerts or for touch vibration feedback. For example, different vibration feedback effects can correspond to touch operations performed on different applications (such as taking photos, playing audio, etc.). Motor 191 can also correspond to different vibration feedback effects for touch operations performed on different areas of the display screen 194. Different application scenarios (such as time reminders, receiving messages, alarm clocks, games, etc.) can also correspond to different vibration feedback effects. The touch vibration feedback effect can also be customized.

[0194] Indicator 192 can be an indicator light, used to indicate charging status, power changes, or to indicate messages, missed calls, notifications, etc.

[0195] The SIM card interface 195 is used to connect a SIM card. The SIM card can be inserted into or removed from the SIM card interface 195 to make contact with and detach from the electronic device 100. The electronic device 100 can support one or N SIM card interfaces, where N is a positive integer greater than 1. The SIM card interface 195 can support Nano SIM cards, Micro SIM cards, and other SIM cards. Multiple cards can be inserted into the same SIM card interface 195 simultaneously. The multiple cards can be of the same or different types. The SIM card interface 195 is also compatible with different types of SIM cards. The SIM card interface 195 is also compatible with external memory cards. The electronic device 100 interacts with the network through the SIM card to realize functions such as calls and data communication.

[0196] Figure 5B This is a software structure block diagram of the electronic device 100 according to an embodiment of this application.

[0197] A layered architecture divides software into several layers, each with a clear role and function. Layers communicate with each other through software interfaces. In some embodiments, the system is structured from top to bottom as an application layer, a framework and system service layer, and a kernel layer.

[0198] The application layer can include a series of application packages. In some examples, the application layer may also be called the application layer.

[0199] like Figure 5B As shown, the application package can include applications (also known as apps) such as camera, gallery, file management, desktop, and photopicker.

[0200] The camera can capture images. The desktop can be used to display icons of applications installed on the electronic device 100. Applications such as gallery, file management, and image selection can all be used to display thumbnails. The following description uses the gallery application loading and displaying thumbnails as an example. In this embodiment, the gallery application can also be simply referred to as the gallery.

[0201] Optionally, in some examples, a gallery can be used to display a thumbnail display interface. This thumbnail display interface is used to display thumbnails of multiple photos acquired by the electronic device 100.

[0202] The gallery application can also be used to determine the preview specifications of the thumbnail display interface according to the UI interface display rules provided by the UI framework (e.g., the number of thumbnails that can be displayed, and the performance parameters that support batch thumbnail queries), as well as the number of view controls required to lay out the thumbnail display interface. Then, the gallery application can calculate the number of thumbnails that each view control in the thumbnail display interface needs to display based on the thumbnails to be displayed, and obtain the set of metadata information for the thumbnails. The gallery application can also assemble the metadata information according to the order in which the thumbnails are displayed in the thumbnail display interface to obtain the primary key information. The display module can also request to load and display batch thumbnails based on the key information and layout distribution information of multiple thumbnails.

[0203] The framework layer provides application programming interfaces (APIs) and programming frameworks for applications in the application layer. The framework layer may include some predefined functions.

[0204] Alternatively, in one possible implementation, the APIs and programming frameworks provided by the framework layer can support multiple languages, such as C, C++, Java, JS, and other programming languages.

[0205] like Figure 5BAs shown, the framework layer can also include a UI framework, which can provide UI components, interface layout calculation capabilities, UI interaction capabilities, and so on for applications in electronic devices, such as image galleries.

[0206] like Figure 5B As shown, the framework layer can include a loading framework. The loading framework can contain a reading module and a stitching module. The reading module can be used to batch read image data based on metadata information of the thumbnails that each view control can display, as well as layout distribution information.

[0207] The stitching module can be used to stitch together multiple thumbnails read by the reading module into a large image according to the layout and distribution information of the thumbnail display interface.

[0208] The stitching module can also be used to decode the ultra-compressed texture data of the read thumbnails into texture data.

[0209] like Figure 5B As shown, the framework layer can also include a graphics subsystem. The graphics subsystem can have the capability to encapsulate texture objects; for example, it can encapsulate texture data into bitmaps and store them in shared memory.

[0210] The graphics subsystem can also have texture rendering and display capabilities. For example, the graphics subsystem can render a large image obtained by the stitching module and send the rendered large image to the thumbnail display interface of the image library.

[0211] The system service layer is the core capability set of the operating system of electronic device 100. The system service layer can provide services to the application layer through the framework layer.

[0212] like Figure 5B As shown, the system service layer may include a media library, which can be used to provide the application layer with access to and retrieval of media resources (e.g., images, videos, audio, files, etc.) in electronic devices. The media library may also include a data processing module and a data storage module. The data processing module can process videos or images captured by the electronic device to obtain corresponding thumbnails. The data storage module can be used to send storage commands, which can instruct the distributed data management module to store the thumbnails.

[0213] like Figure 5B As shown, the system service layer may also include texture algorithms, which may include texture compression algorithms, texture super compression algorithms, and texture stitching algorithms.

[0214] The data processing module in the media library can call a texture compression algorithm to compress the thumbnail into texture data, and then call a texture supercompression algorithm to compress the texture data into supercompressed texture data (or texture supercompressed data, or supercompressed data, etc.).

[0215] After obtaining the supercompressed texture data corresponding to the thumbnail, the stitching module can call the texture supercompression algorithm to decode the supercompressed texture data into texture data, and then call the texture stitching algorithm to stitch the texture data of multiple thumbnails into a large texture image.

[0216] like Figure 5B As shown, the system service layer may also include a distributed data management module. This distributed data management module may include an owner / visitor database module, a key-value database (KVDB) management module, and a relational database management module.

[0217] The owner / visitor database module can be used to manage database access permissions. The database owner can directly read data from the database and write data to the database; the database visitor can directly read data from the database without crossing processes.

[0218] The KVDB management module can be used to store thumbnails based on storage instructions from the media library. Specifically, the KVDB management module can orderly store the texture data corresponding to the thumbnails of year view scenes or month view scenes generated by the media library into a thumbnail database file, which can be implemented as a KVDB. The KVDB management module can also store the texture data corresponding to the thumbnails of day view scenes generated by the media library into a thumbnail file.

[0219] The kernel layer can include one or more kernel subsystems, which can provide basic kernel capabilities to the upper layers, including kernel capabilities such as process / thread management, memory management, and file system.

[0220] like Figure 5B As shown, the kernel layer may include a file system module, which can be used to store media resources in the electronic device 100. The file system module may include multiple files, including a thumbnail database file for storing thumbnails for year and month view scenes, a metadata database file for storing metadata, and a thumbnail file for storing thumbnails for day view scenes.

[0221] like Figure 5B As shown, the kernel layer may also include a sandbox management module, which can be used to provide sandbox isolation for applications.

[0222] In the following text, the thumbnail database file will be referred to simply as the thumbnail database.

[0223] In combination with the above Figure 5B The software structure block diagram of the electronic device 100 provided in the document, Figure 5C This illustration shows the interaction between relevant modules involved in embodiments of this application, as well as the specific data flow when an electronic device saves and loads thumbnails for display. Figure 5C In this embodiment, application 1 can acquire an image and request to save the image, as well as the corresponding thumbnail. Application 2 can request to load and display the thumbnail. Application 1 can be any application in electronic device 100 that can acquire and save images, such as a camera. Application 2 can be any application in electronic device 100 that can display thumbnails, such as a gallery, file manager, image selection, etc. The following description uses application 1 as a camera and application 2 as a gallery as an example. It is understood that this application embodiment does not limit the specifics of application 1 and application 2.

[0224] like Figure 5C As shown, the electronic device 100's process of saving thumbnails and displaying thumbnails in a gallery may include the following steps:

[0225] Steps ①-③: Save the thumbnail.

[0226] ①. Electronic device 100 receives and responds to operations for camera applications, takes photos and transmits the captured photos to a media library.

[0227] Users can click the shooting control in the camera application's shooting interface, and in response to the user's operation, the camera of electronic device 100 can take a photo. Electronic device 100 can then transfer the photos taken by the camera to a media library.

[0228] In some feasible examples, the electronic device 100 can first transmit the photos captured by the camera to a camera application, process the photos using relevant algorithms in the camera application, and then transmit the processed photos to a media library. This application does not limit this approach.

[0229] ②. The data processing module in the media library processes the captured photos and sends the processed photo data to the file system module.

[0230] The media library can generate a thumbnail A2 corresponding to the captured photo A1. Then, the data processing module processes the thumbnail A2 to obtain texture data A3. The media library can then send a storage command, instructing the distributed data management module to transfer the texture data A3 to the thumbnail database in the file system module.

[0231] For example, the media library can compress the captured photo A1 to obtain a thumbnail A2 corresponding to the photo. This application embodiment does not limit the method of generating the thumbnail A2 corresponding to photo A1.

[0232] Optionally, in one possible implementation, when the electronic device 100 displays a browser application or a communication application, in response to a user's action of saving an image B1 displayed in the application's interface, the electronic device 100 can download the image B1. Then, the electronic device 100 can transfer the downloaded image B1 to a media library. The media library can generate a thumbnail B2 corresponding to the image B1 and process the thumbnail to obtain texture data B3. Then, the media library can transfer the texture data B3 to a thumbnail database in the file system module.

[0233] ③. The distributed data management module stores photo data in an orderly manner into the file system module.

[0234] The distributed data management module can store the texture data obtained from thumbnail processing into the file system module based on the storage instructions sent by the media library.

[0235] In one possible implementation, the distributed data management module can store the texture data in a thumbnail database within the file system module. In some examples, this thumbnail database can be implemented as a key-value database (KVDB). The KVDB can store or index data based on its key values.

[0236] Furthermore, in one possible implementation, the distributed data management module can also store the texture data corresponding to the thumbnails in the KVDB in an orderly manner according to the preview order of the thumbnails in the thumbnail display interface. This enables the KVDB to provide the ability to query the texture data of thumbnails by range.

[0237] In one possible implementation, the media library can also instruct the distributed data management module to send the captured photos to the file system module. The file system module can then store the captured photos.

[0238] For details on storing the texture images obtained from thumbnail processing, please refer to the section below. Figure 6 The description will not be repeated here.

[0239] Steps 4-8: Display thumbnails.

[0240] ④. The image library sends an image loading request to the loading framework.

[0241] When a user opens the gallery, or when a user swipes in the gallery's thumbnail display, the gallery can send an image loading request to the loading frame in the frame layer.

[0242] ⑤. Load the image data using the reading module in the framework.

[0243] The reading module in the loading framework can retrieve image data from the media library based on the image loading request issued by the application. Then, the media library can read the image data from the database of the file system module based on the image loading request.

[0244] In one possible implementation, the image data read by the reading module is the texture data corresponding to the thumbnail. This texture data does not need to be decoded and can be directly sent for display.

[0245] Furthermore, the reading module can read image data in batches, meaning it can obtain the texture data corresponding to multiple thumbnails at once.

[0246] ⑥. The reading module transmits the read image data to the stitching module.

[0247] The reading module can transmit the read image data, i.e., texture data, to the stitching module.

[0248] ⑦. The stitching module stitches the read image data together and sends the stitched large image to the graphics subsystem.

[0249] The stitching module can stitch together the read image data to obtain a stitched image. In some examples, the stitched image data is referred to as large image data or large image.

[0250] The stitching module can transmit the stitched image data to the graphics subsystem.

[0251] ⑧. The graphics subsystem renders the large image and sends the rendered large image to the image library.

[0252] The graphics subsystem can render the stitched image data to obtain a larger rendered image. After receiving the rendered image, the image library's display module can display it.

[0253] For details on how electronic device 100 loads and displays thumbnails, please refer to the following section. Figure 8 The description will not be repeated here.

[0254] The following describes in detail the specific process by which the electronic device 100 saves thumbnails in the embodiments of this application.

[0255] Figure 6 An exemplary schematic diagram illustrates the process of an electronic device 100 storing thumbnails in an embodiment of this application. For example... Figure 6 As shown, saving thumbnails on electronic device 100 may include the following steps:

[0256] S601. Electronic device 100 saves image 1 to the media library.

[0257] Image 1 may be taken by the camera of electronic device 100, or downloaded by electronic device 100 based on a user's save operation. This application embodiment does not limit this.

[0258] In some examples, image 1 can also be referred to as the original image.

[0259] The electronic device 100 can save image 1 to the media library based on the user's shooting operation or the user's click to save operation.

[0260] In some examples, the format of image 1 acquired by electronic device 100 may be RGBX. Electronic device 100 can then encode image 1 into binary data in Joint Photographic Experts Group (JPEG) format and store this JPEG-formatted binary data in a media library. This JPEG-formatted binary data can be referred to as the source data, or the source data of image 1.

[0261] S602. Electronic device 100 creates metadata for image 1, which includes the Uniform Resource Locator (URL) information, date and time information, and identification information of image 1.

[0262] When saving image 1 to a media library, electronic device 100 can create metadata for image 1. The metadata for image 1 may include, but is not limited to, one or more of the following: image 1's Uniform Resource Locator (URL), date and time information, and identification information.

[0263] In this embodiment, the electronic device 100 can create metadata corresponding to an image when saving it. Then, the electronic device 100 can store the created metadata in a metadata database. The image metadata describes the image's attribute information, such as its storage location, filename, size, storage space, creation time, and identifier. The electronic device 100 can find the corresponding image and its thumbnail based on the image's metadata.

[0264] Electronic device 100 may contain a metadata database and a thumbnail database. The metadata database can be used to store metadata, and the thumbnail database is used to store the texture data corresponding to the thumbnails. In some examples, the thumbnail data can be implemented as a key-value database (KVDB). The following explanation uses a key-value database (KVDB) as an example to illustrate this.

[0265] Metadata can include one or more of the following: Uniform Resource Locator (URL), date and time information, and identity information. The URL indicates the storage location of the image corresponding to the metadata. The date and time information indicates the time when the electronic device 100 acquired the image (also known as the creation time). The identity information is a unique identifier for the image; when two images have the same other attributes (e.g., storage location, creation time, filename, image size, occupied space, creation time, etc.), the identity information can distinguish between them.

[0266] In some examples, a URL can also be called a link. Electronic device 100 can find the location where the source data of image 1 is stored based on the URL in the metadata of image 1, and obtain the source data of image 1 based on the URL.

[0267] The date and time information of Image 1 can include the date and time when electronic device 100 took or downloaded Image 1. For example, if electronic device 100 took Image 1 on February 20, 2023, at 08:30:45, the date and time information of Image 1 created by electronic device 100 can be "20230220_083045". That is to say, the format of the date and time information created by electronic device 100 can be "year-month-day_hour-minute-second". It is understood that the format of this date and time information is not limited in this embodiment of the application.

[0268] The metadata of image 1 may also include the image's identification information, such as the primary key ID corresponding to image 1. Optionally, the primary key ID of image 1 may consist of numbers; for example, the primary key ID of image 1 may be 1. It is understood that the primary key ID of each image stored in electronic device 100 is different.

[0269] In one possible implementation, the electronic device 100 generates the primary key IDs of the images it saves in a sequentially increasing manner. That is, the more recent the date and time of the image saved by the electronic device 100, the larger the value of the primary key ID corresponding to that image. For example, if the electronic device 100 took image 1 on February 20, 2023, at 08:30:45, the primary key ID corresponding to image 1 could be 10. The primary key ID of the next image saved by the electronic device 100 after image 1, image 2, can be based on the primary key ID of image 1 by adding a first value. Taking a first value of 1 as an example, that is, the primary key ID of image 2 could be 11.

[0270] This application embodiment does not limit the specific primary key ID of Image 1. This application embodiment also does not limit the specific value of the first value.

[0271] S603. Electronic device 100 generates a thumbnail of image 1. Figure 1 .

[0272] Electronic device 100 can generate a thumbnail of image 1. Figure 1 For example, electronic device 100 can downsample image 1 to obtain a thumbnail. Figure 1 Abbreviation Figure 1 The size is smaller than the size of image 1.

[0273] In one possible implementation, see Figure 5B The media library of electronic device 100 may include a data processing module. Electronic device 100 can also use this data processing module to downsample image 1 to obtain a thumbnail of image 1. Figure 1 .

[0274] When image 1 is captured by electronic device 100, electronic device 100 can generate a thumbnail of image 1 simultaneously upon capturing the image. When image 1 is downloaded by electronic device 100, the thumbnail of image 1 will only be generated after the user opens the photo library following the download of the image by electronic device 100. Figure 1 .

[0275] It is understandable that this metadata database may include metadata corresponding to the original image (e.g., image 1), and may also include thumbnails (e.g., thumbnails). Figure 1 The corresponding metadata.

[0276] S604. Electronic Equipment 100 Pairs (abbreviation) Figure 1 Encode the data to obtain texture data 1.

[0277] Electronic device 100 can abbreviate Figure 1The data is encoded to obtain texture data 1. This texture data 1 can be directly displayed, meaning that electronic device 100 does not need to decode it before acquiring and displaying texture data 1.

[0278] In one possible implementation, the electronic device 100 can encode the thumbnail using adaptive scalable texture compression (ASTC) to obtain binary data in ASTC format. This ASTC format binary data can also be referred to as texture data.

[0279] In one possible implementation, see Figure 5B The media library of electronic device 100 may include a data processing module. Electronic device 100 can also use this data processing module to perform abbreviated data processing using ASTC. Figure 1 Encode to obtain abbreviation Figure 1 The corresponding binary data in ASTC format (which can be called texture data 1).

[0280] Compared to JPEG format binary data, ASTC format binary data can be directly displayed without decoding. JPEG format binary data, on the other hand, requires the electronic device 100 to decode before being displayed. Therefore, when the electronic device 100 uses ASTC format binary data to store thumbnails, it can directly display the corresponding ASTC format binary data without decoding, thus improving the display frame rate.

[0281] S605. Electronic device 100 saves texture data 1 to a database. The key information of texture data 1 in the database includes the date and time information and identification information of image 1.

[0282] The electronic device 100 saves the texture data corresponding to multiple thumbnails to a database according to the display order of the thumbnails. The multiple thumbnails include... Figure 1 The texture data corresponding to multiple thumbnails includes texture data 1. Electronic device 100 is configured according to the thumbnails... Figure 1 Save thumbnails in display order Figure 1 The corresponding texture data 1 is stored in the database. The key information of texture data 1 in the database includes the date and time information and identity information of image 1.

[0283] In some possible implementations, the electronic device 100 determines the display order of the thumbnails based on the date and time information of multiple thumbnails. The electronic device 100 may display the thumbnail with an earlier date and time before the thumbnail with a later date and time.

[0284] Furthermore, in one possible implementation, the electronic device 100 can display a thumbnail with an earlier date and time before a thumbnail with a later date and time. This can include: the electronic device 100 can display the thumbnail with the earlier date and time on the line above the thumbnail with the later date and time. Alternatively, for example, the electronic device 100 can display the thumbnail with the earlier date and time in the same line as the thumbnail with the later date and time, but the earlier thumbnail is positioned before the later thumbnail. Taking the electronic device 100 arranging the thumbnails from left to right as an example, then the thumbnail with the earlier date and time is displayed in the same line as the thumbnail with the later date and time, and the earlier thumbnail is positioned before the later thumbnail; that is, the earlier thumbnail is displayed in the same line as the later thumbnail, but to the left of the later thumbnail.

[0285] For example, abbreviation Figure 1 The corresponding original image (i.e., Image 1) has a date and time of "February 20, 2023, 08:30:45", thumbnail. Figure 2 The corresponding date and time of the original image is "February 20, 2023, 09:30:45". This refers to the abbreviated format obtained by electronic device 100. Figure 2 The original image was captured later than the thumbnail. Figure 1 The original image's time. Therefore, electronic device 100 will shorten it. Figure 2 Show in thumbnail Figure 1 On the same line, and abbreviated Figure 2 Located in abbreviation Figure 1 The left side; or electronic devices 100 will be abbreviated. Figure 1 Show in thumbnail Figure 2 The next line. When electronic device 100 is acquiring the abbreviation Figure 1 Get the original image's date and time to obtain the thumbnail. Figure 2 No other images were acquired within the date and time specified in the original image. Therefore, if the image is thumbnailed... Figure 2 and abbreviation Figure 1 When displayed on the same line, the abbreviation Figure 2 In abbreviation Figure 1 Left side and adjacent; if abbreviated Figure 2 and abbreviation Figure 1 If they are not on the same line, then abbreviate. Figure 2 It can display the rightmost line of the previous row, in thumbnail format. Figure 1 It can be displayed on the far left of the next line.

[0286] Alternatively, in another possible implementation, the electronic device 100 determines the display order of the thumbnails based on the date and time order of the multiple thumbnails and the order of the primary key IDs corresponding to the multiple thumbnails. When the electronic device 100 determines the display order of the thumbnails based on date and time information and primary key IDs, the electronic device 100 can store the texture data corresponding to the thumbnails in reverse order of date and time and primary key IDs.

[0287] For example, such as Figure 7 As shown, electronic device 100 displays thumbnails according to datetime and primary key ID, arranged in reverse chronological order. The datetime and primary key ID are arranged in reverse chronological order. In the first row of the thumbnail display interface of electronic device 100, the datetime and primary key ID of the first thumbnail form the string "20230201000102_768". This string "20230201000102_768" indicates that the datetime corresponding to the first thumbnail is "February 1, 2023, 00:01:02" and the primary key ID is "768". In the first row of the thumbnail display interface of electronic device 100, the datetime and primary key ID of the last thumbnail form the string "20230201000101_753". The string "20230201000101_753" indicates that the date and time corresponding to the last thumbnail is "February 1, 2023, 00:01:01", and the primary key ID corresponding to the last thumbnail is "753". In the thumbnail display interface of the electronic device 100, the string formed by combining the date and time and primary key ID of the first thumbnail in the second row is "20230201120101_752". The string "20230201120101_752" indicates that the date and time corresponding to the first thumbnail is "February 1, 2023, 12:01:01", and the primary key ID corresponding to the first thumbnail is "752". In the thumbnail display interface of the electronic device 100, the string formed by combining the date and time and primary key ID of the last thumbnail in the second row is "20230130120101_737". The string "20230130120101_737" indicates that the date and time corresponding to the last thumbnail is "January 30, 2023, 12:01:01", and the primary key ID corresponding to the last thumbnail is "737".

[0288] In other words, the 16 thumbnails in the first row are arranged in reverse date and time order, and the primary key IDs are arranged in reverse order from "768" to "753". Therefore, when electronic device 100 generates the thumbnails of the first row and stores them in the database, it also stores the 16 thumbnails in the first row in the thumbnail database in the order they are displayed. The 16 thumbnails in the second row are also arranged in reverse date and time order, and the primary key IDs are arranged in reverse order from "752" to "737". The 16 thumbnails in the second row are also stored in the thumbnail database in the order they are displayed. The position of the first thumbnail in the second row in the thumbnail database is adjacent to the position of the last thumbnail among the 16 thumbnails in the first row.

[0289] For example, the database can be a KVDB. That is, the storage order of multiple thumbnails in the database in the electronic device 100 is consistent with the display order of multiple thumbnails in the thumbnail display interface, and they correspond one-to-one.

[0290] It is understandable that the above Figure 7 The date, time, and primary key of the first thumbnail in the first and second row thumbnails shown are merely examples. Similarly, Figure 7 The date, time, and primary key of the last thumbnail in the first and second row thumbnails shown above are for illustrative purposes only. Figure 7 The display order of thumbnails in the thumbnail display interface is reflected by the date, time, and primary key of the first thumbnail in the first and second rows, and the date, time, and primary key of the last thumbnail.

[0291] In one possible implementation, the key information corresponding to the thumbnail in the database can be a datetime_id string composed of the thumbnail's date and time and the primary key ID. When storing thumbnails, the electronic device 100 stores them in order according to the datetime_id string corresponding to the thumbnail. Thus, the KVDB database storing thumbnails in the electronic device 100 provides the ability to query batch thumbnails by range. For example, a gallery application can initiate a request to read thumbnails, carrying the maximum value (max) and minimum value (min) of the key information. The KVDB can return all thumbnails whose key information is in the range of min-max. It can be understood that if the KVDB stores the texture data of the thumbnails, then the KVDB can return the texture data corresponding to all thumbnails in the range of min-max. If the KVDB stores decoded thumbnails, then the KVDB can return all decoded thumbnails in the range of min-max.

[0292] In the embodiments of this application, KVDB may store texture data of thumbnails or decoded thumbnails, and the embodiments of this application do not limit this.

[0293] In one possible implementation, the electronic device 100 can store multiple thumbnails in an ordered manner in a KVDB according to the display order through a data storage service in a distributed data management system.

[0294] Based on the thumbnail storage method described above, the following section will specifically introduce the process of reading and displaying thumbnails when an electronic device displays them.

[0295] Figure 8 A schematic flowchart illustrating an image display method provided in an embodiment of this application is shown as an example. Figure 8 As shown in the embodiments of this application, an image display method may include the following steps:

[0296] S801. In response to a user's operation on the gallery application, the gallery application of the electronic device 100 obtains all metadata, including one or more of Uniform Resource Locators, date and time information, and identity information.

[0297] User actions on the gallery application can include opening the gallery application and switching view scenes within the gallery application. These view scene switching operations can include any of the following: switching from a day view to a month or year view, switching from a month view to a day or year view, or switching from a year view to a day or month view. For example, a user can... Figure 1 In the thumbnail display interface 101 shown, click the month view control 103b or the year view control 103c. For example, a user can... Figure 2 In the thumbnail display interface 200 shown, clicking the day view control 103a or the year view control 103c. For example, the user can also... Figure 3 Click on either the day view control 103a or the month view control 103b in the thumbnail display interface 300 shown.

[0298] It is understood that this application does not impose any specific restrictions on the user's operations on the gallery application.

[0299] Electronic device 100 can receive user operations on its gallery application. In response to these operations, the gallery application of electronic device 100 can retrieve all metadata stored in the metadata database of electronic device 100. Each image retrieved by electronic device 100 has corresponding metadata. The image metadata describes the image's attribute information, such as its storage location, filename, size, storage space, creation time, and identifier. Electronic device 100 can find the corresponding image and its thumbnail based on the image's metadata.

[0300] Electronic device 100 may contain a metadata database and a thumbnail database. The metadata database can be used to store metadata, and the thumbnail database can be used to store the texture data corresponding to the thumbnails. In some examples, the thumbnail data can be implemented as a key-value database (KVDB).

[0301] Metadata can include one or more of the following: Uniform Resource Locator (URL), date and time information, and identity information. The URL indicates the storage location of the image corresponding to the metadata. The date and time information indicates the time when the electronic device 100 acquired the image (also known as the creation time). The identity information is a unique identifier for the image; when two images have the same other attributes (e.g., storage location, creation time, filename, image size, occupied space, creation time, etc.), the identity information can distinguish between them.

[0302] S802. Electronic device 100 assembles all metadata to obtain multiple assembly information.

[0303] Electronic device 100 can assemble all metadata, for example, combine date and time information and identity information in the metadata into a string; then, electronic device 100 can obtain the assembly information of each metadata.

[0304] In some possible implementations, since the key information in the KVDB storing thumbnails is a string composed of the date and time information and the primary key ID corresponding to each thumbnail, when the electronic device 100 queries the KVDB and reads the corresponding thumbnail, it needs to use the key information to retrieve the thumbnail corresponding to the key information stored in the KVDB. Therefore, the electronic device 100 needs to assemble the metadata according to the format of the key information to obtain assembled information. For example, the electronic device 100 can assemble the date and time and the primary key ID in the metadata corresponding to each thumbnail into a string of the form datetime_id. In this way, the electronic device 100 can obtain the assembled information corresponding to all thumbnails, and the assembled information of each thumbnail is the date and time and the primary key ID in the data corresponding to that thumbnail assembled into a string of the form datetime_id. For example, thumbnails Figure 1 The corresponding date and time in the metadata is "February 20, 2023, 08:30:45", and the primary key ID is 01. (Abbreviation) Figure 1 The corresponding assembly information could be "20230220083045_01".

[0305] It is understood that the format of the assembled information is consistent with the format of the key information. When the key information of the KVDB is in another format, the electronic device 100 can assemble the metadata to obtain assembled information that is consistent with the format of the key information. This application embodiment does not limit the specific format of the key information.

[0306] In one possible implementation, when a user opens the gallery, the electronic device 100 has already executed steps S801 and S802, meaning it has already acquired and assembled all metadata. Then, when the user switches view scenes within the gallery application, the electronic device 100 does not need to acquire and assemble the metadata again. It can directly use the assembled information obtained when opening the gallery. In other words, the electronic device 100 does not need to execute steps S801 and S802 again.

[0307] S803. Electronic device 100 determines the optimal number of thumbnails for batch reading performance to be m.

[0308] The electronic device 100 can store KVDB, which supports batch reading of thumbnails. The optimal number of thumbnails is m.

[0309] In one possible implementation, the optimal number of thumbnails that KVDB can read in batches is determined by the performance of the storage chip (also known as memory) and / or the I / O interface in electronic device 100. The better the performance of the storage chip and the better the performance of the I / O interface, the more thumbnails that electronic device 100 can read in batches from KVDB with optimal performance; that is, the larger the value of m.

[0310] It is understandable that the maximum number of thumbnails that KVDB supports for batch reading may vary depending on the performance of the storage chip and / or the I / O interface of the electronic device. That is, the value of m may differ for different electronic devices. This application does not limit the specific value of m in its embodiments.

[0311] It is understandable that electronic device 100 performs optimally when reading m thumbnails in a batch. However, this does not mean that electronic device 100 can only read m thumbnails at a time. The number of thumbnails read by electronic device 100 in a batch can be greater than m or less than m.

[0312] S804. Electronic device 100 determines that the total number of stored thumbnails is n, and the number of columns of thumbnails that the thumbnail display interface can display is y.

[0313] Electronic device 100 can determine that the total number of thumbnails stored in the KVDB is n. Understandably, regardless of the view scenario displayed by electronic device 100, the user can view all the thumbnails stored in electronic device 100 by swiping up and down.

[0314] It is understood that the total number of thumbnails stored on different users' electronic devices may be different. For the same user's electronic device, the total number of thumbnails stored at different times may also be different. This application embodiment does not limit the value of the total number of thumbnails stored in the electronic device 100, i.e., n.

[0315] The electronic device 100 system can be configured with a thumbnail display interface for different view scenarios, capable of displaying the number of columns y of thumbnails. The electronic device 100 can determine the number of columns y of thumbnails that the thumbnail display interface can display from the system configuration. This application embodiment does not limit the specific value of the number of columns y.

[0316] Although the thumbnail display interface in each view scenario can display all the thumbnails stored in the electronic device 100 through the user's up and down swiping, the number of thumbnails that can be displayed in the current display area and the number of columns of thumbnails that can be displayed are different for different scenarios. The size of the current display area is equal to the size of the display screen.

[0317] For example, the number of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the day view scene is less than the number of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the month view scene. The number of columns of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the day view scene is less than the number of columns of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the month view scene. The number of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the month view scene is less than the number of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the year view scene. The number of columns of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the month view scene is less than the number of columns of thumbnails that can be displayed in the current display area of ​​the thumbnail display interface in the year view scene. See also Figure 1 The image shows a thumbnail display interface 101 in a daytime view scene. The current display area of ​​this interface 101 shows 32 thumbnails, which can be arranged in an 8x4 grid. See also... Figure 2 The image shows a thumbnail display interface 200 in a lunar view scene. The current display area of ​​this interface 200 can display 108 thumbnails, which can be arranged in a 16x8 grid. See also... Figure 3 The thumbnail display interface 300 shown in the year view scene has a current display area that can display 512 thumbnails, which can be arranged in a distribution relationship of 32 rows and 16 columns.

[0318] The number of thumbnails and columns that can be displayed in the current display area of ​​the thumbnail display interface varies depending on the type of electronic device 100. The larger the display screen of the electronic device 100, the more thumbnails and columns can be displayed in the current display area of ​​its thumbnail display interface. For example, if a tablet's display screen is larger than a mobile phone's display screen, the tablet's current display area can display more thumbnails and columns in each view scenario than a mobile phone in the same view scenario. That is, in the same view scenario, a tablet's current display area can display more thumbnails and columns than a mobile phone's.

[0319] In one possible implementation, when a user opens the gallery, the electronic device 100 has already executed step S803, that is, it has determined that the optimal number of thumbnails for batch reading is m. Then, when the user switches view scenes in the gallery application, the electronic device 100 does not need to determine the optimal number of thumbnails for batch reading again, and can directly use the result determined when opening the gallery. That is, the electronic device 100 does not need to execute step S803 again.

[0320] S805. Electronic device 100 determines, based on m and n, the number of view controls required in the thumbnail display interface as v, the number of thumbnails that each view control in the v view controls can display, and the distribution relationship of each view control, wherein the v view controls include view control 1, the number of thumbnails that view control 1 can display is K, and the distribution relationship of view control 1 is x rows and y columns.

[0321] Electronic device 100 can determine the number of view controls (v) required for the thumbnail display interface based on the total number n of thumbnails stored in electronic device 100 and the optimal number m for batch reading thumbnails. Electronic device 100 also needs to determine the number of thumbnails each of the v view controls can display, and the distribution relationship of each view control. The v view controls may include view control 1, which supports displaying k thumbnails, and the k thumbnails are distributed in x rows and y columns.

[0322] In one possible implementation, if m is greater than n, then electronic device 100 can read all the thumbnails in a single batch. Therefore, electronic device 100 only needs to create one view control to initiate the thumbnail reading request. That is, the value of v is 1. For example, if n = 500 and m = 800, then electronic device 100 only needs to create one view control to initiate a thumbnail reading request, reading 500 thumbnails in a batch at once. Here, reading thumbnails refers to reading the texture data corresponding to the thumbnails stored in the KVDB.

[0323] In this way, the thumbnail display interface of the electronic device 100 only needs one view control. When the user scrolls up and down on the thumbnail display interface, the view control is already prepared with the thumbnails to be displayed. Thus, when the user scrolls up and down on the thumbnail display interface, the electronic device 100 can display the thumbnails on the thumbnail display interface more quickly, thereby improving the user experience.

[0324] Furthermore, in one possible implementation, the electronic device 100 can determine the number of rows x to be displayed by the view control based on the number of columns n that the view control can display thumbnails. The number of columns y that the view control can display thumbnails is equal to the number of columns y that the thumbnail display interface can display thumbnails. In different view scenarios, the number y that can display thumbnails in the thumbnail display interface is fixed, and this value can be configured by the system. The number of rows required by the view control to be displayed will vary with the number of thumbnails to be displayed.

[0325] In some feasible examples, x is equal to the floor value of (n / y). Here, " / " represents the division operator. For example, if n = 100 and y = 16, then 100 / 16 = 6.25, and floor value of 6.25 is 7, which means x = 7.

[0326] Alternatively, in another possible implementation, m is less than n, and one view control can read m thumbnails at a time. Therefore, electronic device 100 needs to use multiple view controls to obtain n thumbnails. The number of view controls, v, is equal to the floor of (n / m). For example, if n = 512 and m = 200, then n / m = 512 / 200 = 2.56, and rounding 2.56 up gives 3. That is, the number of view controls, v, is equal to 3. In other words, electronic device 100 needs to create 3 view controls to obtain 512 thumbnails.

[0327] Furthermore, in one possible implementation, the electronic device 100 first determines the number of rows x that view control 1 needs to display out of v view controls. x is equal to the floor value of (m / y). Then the maximum number of thumbnails that view control 1 can display is x*y, where x*y is greater than or equal to m. The number of rows that the other view controls in the v view controls need to display is determined based on n, the maximum number of thumbnails that view control 1 can display x*y (i.e., k), and the number of columns of thumbnails that the view control can display.

[0328] For example, let's take v = 3, n = 512, m = 200, and y = 16 as an example. Then, the number of rows x that view control 1 needs to display is equal to the rounded-up value of (200 / 16 = 12.5), which is 13. Therefore, view control 1 can display 13 * 16 = 208 thumbnails. The number of rows p that view control 2 needs to display is also equal to the rounded-up value of (200 / 16 = 12.5), which is 13. Therefore, view control 2 can display 13 * 16 = 208 thumbnails. Thus, both view control 1 and view control 2 can display 208 thumbnails, and view control 3 only needs to display the remaining 96 (512 - 208 - 208 = 96) thumbnails. The number of rows q that view control 3 needs to display is 6 (96 / 16 = 6).

[0329] Understandably, if view control 1 supports displaying k thumbnails, then view control 1 needs to batch read k thumbnails. When k equals m, view control 1 achieves optimal performance in batch thumbnail reading. When k is less than m, or greater than m, but the difference between k and m is small, while view control 1's performance in batch thumbnail reading is not optimal, the impact on overall performance is still significant.

[0330] For example, if the number of thumbnails stored in electronic device 100 is n = 768 and m = 256, then electronic device 100 can determine that the required number of view controls is 3 (768 / 256 = 3). Figure 9A As shown, the electronic device 100 can determine that the number of view controls required for the thumbnail display interface 300 is three, namely view control 901, view control 902, and view control 903. View controls 901 and 902 can be displayed in the current display area of ​​the thumbnail display interface 300, while view control 903 is not. The electronic device 100 needs to determine the number of thumbnails that view controls 901, 902, and 903 can support displaying, and then needs to determine the distribution relationship of view controls 901, 902, and 903 respectively. For example, the distribution relationship of view control 901 is x rows and y columns. That is, view control 901 can display thumbnails in x rows and y columns.

[0331] See Figure 5B In one possible implementation, electronic device 100 can create v view controls through the display module in a gallery application.

[0332] S806. Electronic device 100 allocates multiple assembly information according to the number of thumbnails supported by v view controls, and determines the assembly information corresponding to each view control, wherein view control 1 corresponds to k assembly information.

[0333] Electronic device 100 can allocate the assembly information of its thumbnails to determine which thumbnails each view control can display. For example, electronic device 100 can divide the thumbnail assembly information into v groups, assuming each view control can display x*y = k thumbnails. Then, electronic device 100 can allocate the assembly information of the x*y thumbnails with the most recent date and time, a total of k assembly information, to view control 1. Electronic device 100 can then sequentially allocate the v groups of assembly information to the v view controls according to the display order.

[0334] For example, such as Figure 9BAs shown, the electronic device 100 can assign a total of 256 assembly information entries, from assembly information 20230201000102_768 to assembly information 20230120080102_513, to the view control 901. The view control 901 can then display the 256 thumbnails corresponding to the assembly information entries 20230201000102_768 to 20230120080102_513.

[0335] like Figure 9B As shown, the electronic device 100 can assign a total of 256 assembly information entries, from assembly information 20230118090102_512 to assembly information 20230101120102_257, to the view control 902. The view control 902 can then display the 256 thumbnails corresponding to these 256 entries.

[0336] like Figure 9B As shown, the thumbnail display interface 300 can display view controls 901 and 902 in its current display area. Users can swipe up to view the thumbnails displayed in view control 903. In response to the user's swipe up in the current display area of ​​the thumbnail display interface 300, the electronic device 100 can display view control 903 in the current display area of ​​the thumbnail display interface 300.

[0337] like Figure 9C As shown, the electronic device 100 can respond to the user's upward swipe operation, and the electronic device 100 can display a portion of the large mosaic image carried by the view control 901, the entire large mosaic image carried by the view control 902, and a portion of the large mosaic image carried by the view control 903 in the current display of the thumbnail display interface 300.

[0338] As the user continues to swipe up, such as Figure 9D As shown, in response to the sliding operation, the electronic device 100 can display view controls 902 and 903 in the current display area of ​​the thumbnail display interface 300. The electronic device 100 can assign a total of 256 assembly information entries, from assembly information 20221218120102_256 to assembly information 20221010090102_001, to the view control 903. Therefore, the view control 903 can display the 256 thumbnails corresponding to these entries.

[0339] S807. The view control 1 in the electronic device 100 initiates a loading request, wherein the loading request carries k assembly information.

[0340] The view control 1 in the electronic device 100 initiates a loading request, which may carry k assembly information items.

[0341] See Figure 5C In one possible implementation, the display module in the electronic device 100 can send the loading request initiated by the view control 1 to the reading module in the loading frame.

[0342] S808. Electronic device 100 sets a query range based on k assembly information and obtains all thumbnails within the query range.

[0343] Electronic device 100 can find the largest and smallest datetime_id strings among the assembly information of k thumbnails. The largest datetime_id string represents the assembly information corresponding to the thumbnail with the most up-to-date date and time and the largest primary key ID value among the k thumbnail assembly information. The smallest datetime_id string represents the assembly information corresponding to the thumbnail with the earliest date and time and the smallest primary key ID value among the k thumbnail assembly information.

[0344] For ease of description, the largest datetime_id string can be recorded as datetime_id(max), and the smallest datetime_id string can be recorded as datetime_id(min).

[0345] Then, the electronic device 100 can set the query range to datetime_id(min)—datetime_id(max). Based on this query range, the electronic device 100 can obtain the texture data corresponding to the thumbnails of all key information in the thumbnail database within that query range.

[0346] For example, if the largest datetime_id string among the assembly information corresponding to the k thumbnails is "20240220100000_208" and the smallest datetime_id string is "20230220100000_000", then the query range set by electronic device 100 is "20230220100000_000" to "20240220100000_208". Electronic device 100 can obtain the texture data corresponding to all thumbnails within this query range according to the key information.

[0347] See Figure 5CIn one possible implementation, the electronic device 100 can set query information through a reading module in the loading framework. This reading module can retrieve texture data corresponding to all thumbnails within the query range from a thumbnail database. Specifically, the reading module can set a KVDB query command, which can carry datetime_id(min) and datetime_id(max). After receiving the query command, KVDB only needs to perform two queries: once to find the position of datetime_id(max), and then once to find the position of datetime_id(min). Finally, KVDB can return the entire block of storage buffer data within the query range to the reading module. The entire storage buffer data contains the texture data corresponding to all thumbnails within the query range.

[0348] Furthermore, in one possible implementation, after the reading module obtains the entire storage buffer data, it iterates through the buffer content and determines whether the key information of each thumbnail in the buffer falls within the query range of datetime_id(min)—datetime_id(max). If it is within the query range of datetime_id(min)—datetime_id(max), the texture data corresponding to the thumbnail stored in the buffer is retained. If it is not within the query range of datetime_id(min)—datetime_id(max), the texture data corresponding to the thumbnail stored in the buffer is deleted. In this way, the reading module can iterate through the key information corresponding to the entire buffer data, that is, the key information of the texture data corresponding to all thumbnails within the query range returned by KVDB. This avoids the possibility that the entire buffer data returned by KVDB contains data corresponding to thumbnails that the user has selected to delete. That is, if a user selects to delete a thumbnail in the thumbnail display interface, the electronic device 100 only performs logical deletion on that thumbnail, without physically deleting it. In other words, the electronic device 100 deleted the metadata corresponding to the thumbnail, but the texture data corresponding to the thumbnail stored in the KVDB was not deleted in time.

[0349] S809. Electronic device 100 stitches together the acquired thumbnails according to the distribution relationship x rows and y columns to obtain the stitched texture map.

[0350] The electronic device 100 can stitch together the acquired k thumbnails according to the grouping results to obtain a stitched texture image. That is, the electronic device 100 stitches together the k thumbnails according to their distribution in the x rows and y columns.

[0351] Specifically, in one possible implementation, the electronic device 100 can obtain the data size (singlesize) of the first thumbnail among the k thumbnails, the file header size (headsize), and allocate shared memory of size (x*y*singlesize+headsize) (* represents multiplication). The electronic device 100 then fills the shared memory with the texture data corresponding to the k thumbnails sequentially according to the grouping result, ultimately obtaining a buffer containing the k thumbnails.

[0352] For example, such as Figure 10 As shown, taking k = 192 (x = 12, y = 16) as an example, electronic device 100 can obtain texture data corresponding to 192 thumbnails from KVDB. Then, it allocates shared memory of size (12 * 16 * singlesize + headsize). Electronic device 100 can then sequentially fill each memory block of this shared memory with the 192 thumbnails according to the grouping results, ultimately obtaining a buffer containing the stitched texture map.

[0353] See Figure 5B In one possible implementation, the reading module in the electronic device 100 transmits the acquired k thumbnails to the stitching module, which then stitches the k thumbnails together according to the grouping results to obtain the stitched texture image.

[0354] S810. The view control 1 of the electronic device 100 displays a texture map.

[0355] The view control 1 of the electronic device 100 can directly display the stitched texture image without decoding. In this way, the electronic device 100 can display k thumbnails in the view control 1 more quickly.

[0356] In one possible implementation, the view control 1 of the electronic device 100 can instruct the graphics subsystem to render the stitched texture map. After the graphics subsystem completes rendering, the view control 1 can display the rendered large texture image.

[0357] Electronic device 100 can determine which view controls can be displayed in the current display area of ​​the thumbnail display interface based on the first operation. For example, electronic device 100 can determine that view control 1 can be displayed in the current display area of ​​the thumbnail display interface based on the first operation. Then, view control 1 can determine the query range and obtain the thumbnails within the query range based on the k assembly information corresponding to the k-length thumbnails assigned to it by electronic device 100. That is, view control 1 can obtain thumbnails according to the above steps S807-S810 and display the stitched thumbnails.

[0358] It is understandable that when the electronic device 100 creates multiple view controls, the multiple view controls can obtain and display k thumbnails according to the process of obtaining and displaying thumbnails in view control 1 in steps S807-S810 above. The specific steps of obtaining and displaying thumbnails for other view controls in the multiple view controls will not be described in detail in this application.

[0359] Understandably, taking the year view scenario as an example, when the electronic device 100 switches from other view scenarios to this year view scenario, the electronic device 100 can display the thumbnail display interface under the year view scenario according to the above steps S801-S810. When the electronic device 100 determines that the thumbnail display interface under the year view scenario contains v view controls, the electronic device 100 has already allocated the number of thumbnails to be displayed for each view control and which thumbnails to display. The electronic device 100 displays only one or more view controls in the current interface of the thumbnail display interface according to the above steps. When the user swipes up and down in the thumbnail display interface, the electronic device 100 can determine which view control is displayed in the current interface based on the user's swipe operation, and then batch obtains multiple thumbnails to be displayed in that view control and stitches the multiple thumbnails together. Then, the electronic device 100 can send the stitched thumbnail to be displayed. After being sent, the user can see the sent thumbnail in the current interface of the thumbnail display interface. That is, during refresh, each view control in the current interface can acquire and display thumbnails according to the process described in steps S807-S810 of view control 1. Since the electronic device 100 has already determined the thumbnails to be displayed for each view control, and the view controls can acquire thumbnails in batches when refreshing the thumbnail display based on the user's swipe operation, the electronic device 100 can display the refreshed thumbnails faster, thus improving its display performance and ultimately enhancing the user experience.

[0360] In addition, since the stitched texture map is stored in shared memory, and shared memory can support cross-process transmission, the rendering process can obtain the shared memory containing the stitched texture map across processes without copying between processes. This reduces the number of memory copy operations of the electronic device 100, thereby improving the display performance of the electronic device 100.

[0361] The image display method provided in this application embodiment allows the electronic device 100 to store thumbnails corresponding to captured or saved images according to their arrangement order in the thumbnail display interface. This enables the electronic device 100 to batch query and retrieve thumbnails. Then, when the electronic device displays the thumbnail display interface, it can batch query and retrieve thumbnails. The electronic device 100 can stitch together multiple retrieved thumbnails to obtain a stitched thumbnail, which can then be displayed via a view control. The thumbnails displayed in the thumbnail display interface are stitched together into one or more large images. One view control can hold one large image. Thus, the electronic device 100 requires only a small number of view controls (e.g., one or two, etc.) to display a large number of thumbnails. Furthermore, the ability to batch query and retrieve thumbnails reduces the number of I / O interface calls. This can improve the performance and frame rate of electronic devices when loading and displaying a large number of thumbnails, thereby avoiding or reducing issues such as white blocks and stuttering when users browse a large number of thumbnails.

[0362] It is understood that the image display method provided in this application embodiment is illustrated using the display of thumbnails in a gallery as an example. This application does not limit the applications capable of displaying thumbnails; for example, file management applications can also display thumbnails. The process of other applications capable of displaying thumbnails can be found in the gallery application thumbnail display process described above, and will not be repeated in this application embodiment.

[0363] Figure 11 An exemplary flowchart illustrating an image display method provided in an embodiment of this application is shown. Figure 11 As shown, an image display method provided in this application embodiment may include the following steps:

[0364] S1101. Electronic device 100 receives and responds to a first operation by a user for a first application, and acquires a first set of thumbnails, the first set of thumbnails including at least two thumbnails.

[0365] The first operation may include any one of the following: the user opening the gallery application, the user switching view scenes in the thumbnail display interface, or the user swiping in the thumbnail display interface.

[0366] In one possible implementation, obtaining the first set of thumbnails may include: the electronic device 100 obtaining the first set of thumbnails from a database, wherein the storage order of the first set of thumbnails in the database is consistent with the display order of the first set of thumbnails.

[0367] In one possible implementation, obtaining the first set of thumbnails may include: electronic device 100 obtaining metadata of the first set of thumbnails; electronic device 100 obtaining a first query range based on the date, time and ID in the metadata of the first set of thumbnails; and electronic device 100 obtaining the first set of thumbnails within the first query range from the database at one time based on the first query range.

[0368] In one possible implementation, the electronic device 100 obtains a query range based on the date, time, and ID in the metadata of the first set of thumbnails. This may include: the electronic device 100 assembling the date, time, and ID of the first set of thumbnails to obtain multiple strings, the number of which is equal to the number of the first set of thumbnails; the electronic device 100 determining the maximum and minimum values ​​among the multiple strings, and setting a first query range based on the maximum and minimum values.

[0369] In one possible implementation, the electronic device acquiring the first set of thumbnails may include: the electronic device 100 assigning a first view control to hold the first set of thumbnails; and the electronic device 100 sending a thumbnail loading request to a database through the first view control, the thumbnail loading request being used to retrieve the first set of thumbnails from the database. In this way, the electronic device 100 can request to load the thumbnails that the view control needs to hold through the view control.

[0370] In one possible implementation, before the electronic device 100 receives and responds to the user's first operation on the gallery application and obtains the first set of thumbnails, the method may further include: the electronic device 100 obtaining a first image; the electronic device 100 downsampling the first image to obtain a thumbnail of the first image; the electronic device 100 saving the date, time, and ID corresponding to the thumbnail of the first image; and the electronic device 100 saving the thumbnails of the first image to a database according to the sorting of the date, time, and ID corresponding to the thumbnails of the first image.

[0371] In conjunction with the first aspect, in one possible implementation, the electronic device 100 saves the thumbnails of the first image to the database according to the date, time, and ID corresponding to the thumbnails of the first image. This may include: the electronic device 100 performing texture compression on the thumbnails of the first image to obtain texture data; and the electronic device 100 saving the texture data to the database according to the date, time, and ID corresponding to the thumbnails of the first image.

[0372] The first set of thumbnails can be Figure 8 k thumbnails.

[0373] For details on how the electronic device 100 obtains the first set of thumbnails, please refer to the descriptions in steps S801-S808 above, which will not be repeated here.

[0374] S1102. Electronic device 100 stitches together the first set of thumbnails into the first large image according to the display order.

[0375] In one possible implementation, the electronic device 100 stitches together the first set of thumbnails into a large image in the order of display. This may include: the electronic device 100 requesting first memory; the database of the electronic device 100 filling the first set of thumbnails into the first memory in the order of display, and stitching together a large image in the first memory.

[0376] The first memory is shared memory.

[0377] For details on how to stitch together the electronic device 100 to obtain a larger image, please refer to the description in step S809 above. The resulting larger image can be found in [reference needed]. Figure 10 This will not be elaborated upon here.

[0378] S1103. Electronic device 100 renders the first large image and displays a thumbnail display interface of the first application, in which the first large image is displayed.

[0379] In one possible implementation, rendering the first large image by the electronic device 100 may include: the rendering process of the electronic device 100 reading the first large image from the first memory and rendering the first large image.

[0380] In one possible implementation, before displaying the thumbnail display interface of the gallery application, the method may include: the electronic device 100 creating a first view control and carrying a first large image through the first view control.

[0381] In one possible implementation, the method may further include: the electronic device 100 responding to the first operation to acquire a second set of thumbnails, the second set of thumbnails including at least two thumbnails; the electronic device 100 stitching the second set of thumbnails together in display order to form a second large image; the electronic device 100 rendering the second large image and displaying the second large image on the thumbnail display interface.

[0382] In one possible implementation, after the second large image is displayed on the thumbnail display interface, the method may further include: the electronic device 100 receiving and responding to a second operation to display a portion of the content of the first large image and the entire content of the second large image on the thumbnail display interface, wherein the second operation is an operation of swiping upwards on the thumbnail display interface.

[0383] In one possible implementation, before the second large image is displayed on the thumbnail display interface, the method may further include: the electronic device 100 creating a second view control and using the second view control to carry the second large image.

[0384] In one possible implementation, after the electronic device 100 displays the thumbnail display interface of the gallery application, the method may further include: the electronic device 100 receiving and responding to a third operation to acquire a third set of thumbnails, the third set of thumbnails including at least two thumbnails; the electronic device 100 stitching the third set of thumbnails into a third large image according to the display order; the electronic device 100 creating a third view control and carrying the third large image through the third view control; and the electronic device 100 rendering the third large image and displaying the third large image on the thumbnail display interface.

[0385] In one possible implementation, the third operation is a sliding operation, and obtaining the third set of thumbnails may include: the electronic device 100 determining the date, time and ID of the third set of thumbnails based on the third operation; the electronic device 100 determining the second query range of the third set of thumbnails based on the date, time and ID of the third set of thumbnails; and the electronic device 100 obtaining the third set of thumbnails within the second query range from the database at one time based on the second query range.

[0386] The first-view control can be Figure 9A The middle view control is 901, and the second view control can be... Figure 9A The middle view control is 902, and the third view control can be... Figure 9A The view control 903 in the middle.

[0387] This step S1103 can be referred to in the description of step S810 above, and will not be repeated here.

[0388] The image display method provided in this application embodiment allows the electronic device 100 to store thumbnails corresponding to captured or saved images according to their arrangement order in the thumbnail display interface. This enables the electronic device 100 to batch query and retrieve thumbnails. Then, when the electronic device displays the thumbnail display interface, it can batch query and retrieve thumbnails. The electronic device 100 can stitch together multiple retrieved thumbnails to obtain a stitched thumbnail, which can then be displayed via a view control. The thumbnails displayed in the thumbnail display interface are stitched together into one or more large images. One view control can hold one large image. Thus, the electronic device 100 requires only a small number of view controls (e.g., one or two, etc.) to display a large number of thumbnails. Furthermore, the ability to batch query and retrieve thumbnails reduces the number of I / O interface calls. This can improve the performance and frame rate of electronic devices when loading and displaying a large number of thumbnails, thereby avoiding or reducing issues such as white blocks and stuttering when users browse a large number of thumbnails.

[0389] This application also provides a computer-readable storage medium storing computer program code, which, when executed by the processor, causes the communication device to perform the method in any of the foregoing embodiments.

[0390] This application also provides a computer program product that, when run on a computer, causes the computer to perform the methods in any of the foregoing embodiments.

[0391] The above-described embodiments are only used to illustrate the technical solutions of this application, and are not intended to limit it. Although this application has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some of the technical features. Such modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of this application.

[0392] As used in the above embodiments, depending on the context, the term "when..." can be interpreted as meaning "if...", "after...", "in response to determining...", or "in response to detecting...". Similarly, depending on the context, the phrase "when determining..." or "if (the stated condition or event) is interpreted as meaning "if determining...", "in response to determining...", "when (the stated condition or event) is detected", or "in response to detecting (the stated condition or event)".

[0393] In the above embodiments, implementation can be achieved entirely or partially through software, hardware, firmware, or any combination thereof. When implemented using software, it can be implemented entirely or partially in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, all or part of the processes or functions described in the embodiments of this application are generated. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device. The computer instructions can be stored in a computer-readable storage medium or transmitted from one computer-readable storage medium to another. For example, the computer instructions can be transmitted from one website, computer, server, or data center to another website, computer, server, or data center via wired (e.g., coaxial cable, fiber optic, digital subscriber line) or wireless (e.g., infrared, wireless, microwave, etc.) means. The computer-readable storage medium can be any available medium that a computer can access or a data storage device such as a server or data center that integrates one or more available media. The available medium can be a magnetic medium (e.g., floppy disk, hard disk, magnetic tape), an optical medium (e.g., DVD), or a semiconductor medium (e.g., solid-state drive), etc.

[0394] Those skilled in the art will understand that all or part of the processes in the methods of the above embodiments can be implemented by a computer program instructing related hardware. This program can be stored in a computer-readable storage medium, and when executed, it can include the processes described in the above method embodiments. The aforementioned storage medium includes various media capable of storing program code, such as ROM or random access memory (RAM), magnetic disks, or optical disks.

Claims

1. A picture display method characterized by, The method is applied to an electronic device, the electronic device comprising a gallery application, the electronic device storing a first set of thumbnails and a second set of thumbnails, the method comprising: The electronic device receives and responds to a first operation of a user for the gallery application to obtain the first set of thumbnails and the second set of thumbnails, the first set of thumbnails comprising at least two thumbnails, and the second set of thumbnails comprising at least two thumbnails; The electronic device splices the first set of thumbnails into a first large image according to a display order, and splices the second set of thumbnails into a second large image according to the display order; The electronic device creates a first view control and a second view control, and carries the first large image through the first view control, and carries the second large image through the second view control; The electronic device displays a thumbnail display interface of the gallery application, the thumbnail display interface displaying the first large image and the second large image; The electronic device receives and responds to a second operation to display a part of the content of the first large image and all the content of the second large image in the thumbnail display interface, the second operation being an operation of swiping upwards in the thumbnail display interface.

2. The method of claim 1, wherein, After displaying the thumbnail display interface of the gallery application, the method further comprises: The electronic device receives and responds to a third operation to obtain a third set of thumbnails, the third set of thumbnails comprising at least two thumbnails; The electronic device splices the third set of thumbnails into a third large image according to the display order; The electronic device creates a third view control and carries the third large image through the third view control; The electronic device displays the third large image in the thumbnail display interface.

3. The method of claim 1, wherein, The first set of thumbnails is stored in a database according to metadata information of the first set of thumbnails, the storage order of the first set of thumbnails in the database being consistent with the display order of the first set of thumbnails, or the display order of the first set of thumbnails being determined by the metadata information of the first set of thumbnails.

4. The method of claim 1, wherein, The electronic device splices the first set of thumbnails into a first large image according to the display order, comprising: The electronic device applies for a first memory; The database of the electronic device fills the first set of thumbnails into the first memory according to the display order, and splices a first large image in the first memory.

5. The method of claim 4, wherein, After the database of the electronic device fills the first set of thumbnails into the first memory according to the display order, and splices a first large image in the first memory, the method further comprises: The rendering process of the electronic device reads the first large image from the first memory and renders the first large image.

6. The method of claim 5, wherein, The first operation comprises any one of an operation of the user opening the gallery application, an operation of the user switching a view scene in the thumbnail display interface, and a swiping operation of the user in the thumbnail display interface.

7. The method of claim 3, wherein, The database stores metadata information of the first set of thumbnails, the metadata information comprising a date and time corresponding to the first set of thumbnails and an identity ID.

8. The method of claim 4, wherein, The first set of thumbnails includes a first thumbnail, the first thumbnail corresponds to a first date and time, the first thumbnail corresponds to a first ID, the first date and time is the date and time when the electronic device saves the first thumbnail, and the first ID is a number generated by the electronic device when saving the first thumbnail to identify the first thumbnail.

9. The method of claim 8, wherein, The electronic device acquires the first set of thumbnails, including: The electronic device acquires metadata information of the first set of thumbnails; The electronic device acquires a first query range based on the date and time and the ID in the metadata information of the first set of thumbnails; The electronic device acquires the first set of thumbnails in the first query range from the database based on the first query range.

10. The method of claim 9, wherein, The electronic device acquires a query range based on the date and time and the ID in the metadata information of the first set of thumbnails, including: The electronic device assembles the date and time and the ID of the first set of thumbnails to obtain a plurality of strings, the number of the plurality of strings is equal to the number of the first set of thumbnails; The electronic device determines the maximum value and the minimum value in the plurality of strings, and sets the first query range based on the maximum value and the minimum value.

11. The method of claim 2, wherein, The third operation is a sliding operation, and the electronic device acquires the third set of thumbnails based on the third operation, including: The electronic device determines the date and time and the ID of the third set of thumbnails based on the third set of thumbnails; The electronic device determines a second query range of the third set of thumbnails based on the date and time and the ID of the third set of thumbnails; 12. The method of claim 3, wherein, The electronic device acquires the third set of thumbnails in the second query range from the database based on the second query range. The electronic device acquires the first set of thumbnails, including: The electronic device assigns the first view control to carry the first set of thumbnails; 13. The method according to any one of claims 1 to 12, characterized in that, The electronic device sends a thumbnail loading request to the database through the first view control, and the thumbnail loading request is used to acquire the first set of thumbnails from the database.

14. The method of claim 13, wherein, The number of view controls required in the thumbnail display interface is determined by the total number of thumbnails stored by the electronic device and the number of batches of thumbnails read. Before the electronic device acquires the first set of thumbnails in response to the first operation of the user on the gallery application, the method further includes: The electronic device acquires a first picture; The electronic device down-samples the first picture to obtain a thumbnail of the first picture; The electronic device saves the date and time and the ID corresponding to the thumbnail of the first picture; 15. The method of claim 14, wherein, The electronic device saves the thumbnail of the first picture to the database according to the sorting of the date and time and the ID corresponding to the thumbnail of the first picture. The electronic device saves the thumbnail of the first picture to the database according to the sorting of the date and time and the ID corresponding to the thumbnail of the first picture, including: The electronic device performs texture compression on the thumbnail of the first picture to obtain texture data; The electronic device saves the texture data to the database in an order of date and time and ID corresponding to the thumbnail of the first picture.

16. An electronic device, comprising: The electronic device comprises one or more processors; and a memory having code stored therein; which when executed by the processor, causes the electronic device to perform the method of any one of claims 1-15.

17. A computer readable storage medium characterized by: Computer instructions comprising, which when run on an electronic device, causes the electronic device to perform the method of any one of claims 1-15.

18. A computer program product, characterised in that, A computer program product, which when run on a computer, causes the computer to perform the method of any one of claims 1-15.

Citation Information

Patent Citations

  • Thumbnail display method and device, electronic equipment and readable storage medium

    CN113836335A

  • Image splicing method

    CN113900612A