Image display method, electronic equipment and medium

Abstract

The invention relates to the field of image display, and provides an image display method, electronic equipment and a medium, which can quickly finish the management of photo album sorting, has few operation steps, is convenient and fast, and has good user experience. An interface of the gallery application comprises a navigation bar and a content area, the navigation bar comprises a first-level photo album label (such as a photo album label) and a label of a first-class photo album (such as a common photo album), and the content area can display the corresponding first-class photo album after the first-level photo album label is selected. After each second-level photo album label of the labels of the first-class photo albums is selected, the content area can display each photo album in a corresponding photo album group or each image material in one photo album, and on the basis, an interface of the picture library application supports a user to move the photo albums displayed in the content area into a navigation bar; the second-level photo album labels of the moved photo album are sorted in the navigation bar so as to achieve the purpose of sorting the photo album, and after sorting, the sorting of the moved photo album changes.

Description

An image display method, electronic device and medium Technical Field

[0001] This application relates to the field of image display, and more specifically, to an image display method, electronic device, and medium. Background Technology

[0002] Currently, images and videos (referred to as image materials) obtained by electronic devices through various means such as user photography, downloading from the internet, or receiving from contacts are stored in gallery applications (also known as photo albums) for viewing. To facilitate the management of image materials, albums can be used to categorize and manage them, and gallery applications support user sorting of albums.

[0003] In existing technology, users need to first select the album tab of the gallery application to enter the album interface. In the album interface, users first need to click "More Controls" to display sorting options. Only after selecting a sorting option will the album sorting editing interface appear, where albums can be sorted. The above process of sorting albums is relatively cumbersome and has low human-computer interaction efficiency.

[0004] Therefore, there is a need to provide a technology that can solve the above problems.

[0005] Summary of the Invention

[0006] This application provides an image display method, electronic device, and medium that can quickly manage the sorting of photo albums with few and convenient operation steps, resulting in a good user experience.

[0007] In a first aspect, an image display method is provided, comprising, in response to an operation on a gallery application, an electronic device displaying a first interface, the first interface including a navigation bar and a content area, the navigation bar including primary album labels (e.g., album tags) and labels for first-type albums (e.g., regular albums), the labels for the first-type albums including M secondary album labels under the primary album labels, each primary album label corresponding to at least one first-type album, and when a primary album label is selected, the content area can display each album in the corresponding first-type album, each secondary album label corresponding to an album group or an album in the first-type album, and when each secondary album label is selected, the content area can display each album in the corresponding album group or each image material in an album, the order of the secondary album labels in the navigation bar within the labels of the first-type albums being consistent with the content area. The albums corresponding to each secondary album tag in the content area are ordered in the same order as those in the first type of albums. The image materials include images and / or videos, and M is an integer greater than or equal to 1. The content area displays at least a portion of the albums corresponding to the selected album tag (such as an album tag or other album tags). The selected album tag is one of the primary album tags and M secondary album tags. In response to a move operation that moves N1 albums selected from all albums to the navigation bar, the navigation bar updates and displays the N1 secondary album tags corresponding to each of the N1 albums to update the order of the N1 albums in the content area in the first type of albums. After the update, the order of the N1 secondary album tags in the navigation bar in the first type of albums is consistent with the order of the N1 albums in the content area in the first type of albums.

[0008] In some embodiments, when a user clicks the icon of the Gallery app on the desktop, the electronic device displays the Gallery app interface in response to the user's click. The interface includes a navigation bar and a content area. When the user selects an album tab (such as an album tag or other album tags) in the navigation bar, a first interface is displayed in response to the user's selection of the album tag. In the first interface, the selected album tag in the navigation bar can be highlighted to facilitate the user's focus on the currently selected content. The content area displays at least a portion of the albums corresponding to the selected album tag.

[0009] For example, the first type of album can be a regular album, and the tags of the first type of album can be the tags of a regular album.

[0010] The first-level album tag corresponds to at least the first type of album. This means that the first-level album tag can correspond to the first type of album, or the first-level album tag can correspond to other types of albums, such as the second type of album, which can be a smart album.

[0011] The order of the secondary album tags in the navigation bar within the tags of the primary album category is consistent with the order of the corresponding albums in the content area within the primary album category. This means that the order of the same album in the content area within the primary album category is consistent with the order of the corresponding secondary album tags in the navigation bar within the tags of the primary album category.

[0012] For example, a move operation can be any operation that can move the position of the object being acted on, such as dragging or sliding.

[0013] The "updating and displaying N1 secondary album tabs in the navigation bar" described in this application embodiment can have multiple forms.

[0014] In one scenario (denoted as Scenario 1), updating the display of N1 secondary album labels in the navigation bar means adding N1 secondary album labels to the navigation bar, thereby updating the first-class album labels in the navigation bar and updating the order of the N1 albums in the content area. In this case, the updated first-class album (such as regular albums) labels include M secondary album labels and N1 secondary album labels.

[0015] In another scenario (denoted as Scenario 2), updating the display of N1 secondary album tabs in the navigation bar means updating the order of the existing N1 secondary album tabs in the navigation bar, thereby updating the first-class album tabs in the navigation bar, and also updating the order of the N1 albums in the content area. In this case, the updated first-class album tabs still consist of M secondary album tabs, but the order of the N1 secondary album tabs within those M secondary album tabs has changed.

[0016] The image display method provided in this application embodiment, in response to a user's operation on a gallery application, allows an electronic device to display the gallery application's interface (such as a first interface). This interface includes a navigation bar and a content area. The navigation bar guides the user to quickly find and manage the gallery. The navigation bar includes multiple album tabs, comprising primary album tabs (such as album labels) and labels for first-type albums (such as regular albums). Each primary album tab corresponds to at least one first-type album in the gallery application. When a primary album tab is selected, the content area displays the corresponding albums within that first-type album. The first-type album labels include multiple (e.g., M) secondary album tabs, each corresponding to an album group or a single album. When each secondary album tab is selected, the content area displays the corresponding albums within an album group or the individual image materials within an album. Thus, by setting primary album tabs and first-type album labels within the navigation bar, albums at different levels can be organized and displayed, achieving a flattened management of album hierarchy. Furthermore, compared to searching for albums through primary album tags, selecting a secondary album tag (such as the "All Photos" tag or the "Camera" tag) allows the content area to directly display the corresponding content (each image in an album or each album in a group of albums). Users only need to select the secondary album tag in the navigation bar, and the content area will directly display the corresponding content. In this way, secondary album tags facilitate users to quickly find and manage the content they need, with fewer steps and greater convenience, improving human-computer interaction efficiency and providing a superior user experience.

[0017] More importantly, the navigation bar and content area are linked. The order of each secondary album tag in the navigation bar within the first category of album tags is consistent with the order of the corresponding albums in the content area within the first category of albums. Based on this interface, the method allows users to move albums from the content area to the navigation bar to freely sort the album tags of the moved albums, thus achieving the purpose of sorting the albums. After the update, the order of the N1 moved albums in the first category of albums is consistent with the order of the N1 secondary album tags in the navigation bar. The updated sorting is more in line with user habits, thereby improving the efficiency of finding image materials and the user experience in the gallery application. Compared to the existing technology that requires clicking more controls on the album interface and then selecting a sorting item before further sorting, the above sorting process only requires moving albums from the content area to the navigation bar to reorder the moved albums (N1 albums). It can be seen that the above sorting process has fewer and more convenient operation steps, can quickly complete the album sorting, and effectively improves the user experience. In addition, the navigation bar and content area are linked. After the update, the sorting of the album tabs in the navigation bar is consistent with the sorting of the albums in the content area. Users can perceive the consistency of the same event changes in the navigation bar and content area in a friendly way, avoiding confusion in event perception and providing a good user experience.

[0018] In some embodiments, the M secondary album tags include a first set of album tags and a second set of album tags. Each secondary album tag in the first set of album tags corresponds to an album in a certain type of album. When each secondary album tag in the first set of album tags is selected, the content area can display the various image materials in the corresponding album. Each secondary album tag in the second set of album tags (such as other album tags) corresponds to an album group in the first type of album. When each secondary album tag in the second set of album tags is selected, the content area can display the various albums in the corresponding album group. The navigation bar does not include the album tags of the various albums in the album group corresponding to each secondary album tag in the second set of album tags.

[0019] The image display method provided in this application embodiment includes a first part album label and a second part album label for a first type of album (such as a regular album). Each second-level album label in the first part corresponds to an album in the gallery application, and each second-level album label in the second part (such as other album labels) corresponds to an album group in the gallery application. Thus, for each second-level album label in the second part, it is equivalent to including all albums in the album group corresponding to each second-level album label into that album group. The album group is displayed through a second-level album label to find each album in the album group, without displaying the album labels of each album in the album group. In this way, when there are many albums, the list length of the navigation bar can be effectively reduced and the search efficiency can be improved. Moreover, from a development perspective, the second part of the album tags reduces the number of album tags in each album group corresponding to each second-level album tag. This reduces the performance impact caused by the need to read information such as name, number of images, and cover from the album tags, thus improving development performance and effectively enhancing the overall user experience.

[0020] In one example, the albums corresponding to the second set of album tags have a lower priority than at least some of the albums in the albums corresponding to the first set of album tags.

[0021] Wherein, when at least some albums are partial albums, the partial albums do not include the recently deleted albums in the albums corresponding to the first partial album tag, or in other words, the partial albums are the albums in the albums corresponding to the first partial album tag other than the recently deleted albums. Thus, it can be understood that even if at least some albums represent partial albums, they are still most of the albums in the albums corresponding to the first partial album tag.

[0022] The image display method provided in this application, since the albums corresponding to the second part of the album tags have a lower priority than at least some (all or most) of the albums corresponding to the first part of the album tags, for each album group corresponding to a second-level album tag in the second part of the album tags, it is equivalent to hiding the album tags of each album in the lower-priority album group and not displaying them, but only displaying the album group through a single second-level album tag to view each album. For users, the frequency of viewing lower-priority album groups is low, or in other words, the usage rate of lower-priority album groups is low. Therefore, hiding the album tags of these lower-priority albums based on user habits can effectively reduce the list length of the navigation bar and improve development performance with minimal impact on user experience, thus improving the overall user experience.

[0023] In one example, at least some of the album tabs of the first part are arranged on the first side of the second part album tab (as above), and the first side of the second part album tab is close to the beginning of the navigation bar (as at the top of the navigation bar).

[0024] Wherein, when at least some album tags are partial album tags, the partial album tags do not include the recently deleted tag of the first partial album tags, or in other words, the partial album tags are the tags in the first partial album tags other than the recently deleted tag. Thus, it can be understood that even if at least some album tags represent partial album tags, they are still most of the album tags in the first partial album tag pair.

[0025] The image display method provided in this application embodiment arranges at least a portion (all or most) of the album tabs in the first part of the album tabs on one side of the second part of the album tabs near the beginning of the navigation bar. For the user, the browsing level of at least a portion (all or most) of the album tabs in the first part of the album tabs is higher than that of the second part of the album tabs. Therefore, the order in which the browsing level of at least a portion (all or most) of the album tabs in the first part of the album tabs is higher than that of the second part of the album tabs follows the priority order of the albums. This ensures that the user can browse the first part of the album tabs corresponding to albums with higher priority more conveniently, so as to find the content corresponding to each second-level album tab in the first part of the album tabs more quickly.

[0026] In the embodiments where the above M secondary album labels include a first part album label and a second part album label, corresponding to the above situation 1, in some embodiments, the selected album label is the first album label in the second part album label (such as other album labels), the content area displays at least some albums in the first album group (such as the "other albums" album group) corresponding to the first album label, and the labels of the first type of albums in the navigation bar before the update (such as the labels of ordinary albums) do not include the album labels of each album in the first album group; and, in the above step of updating and displaying N1 secondary album labels corresponding to N1 albums in the navigation bar in response to the movement operation of moving N1 albums selected from all albums to the navigation bar, for example, in response to the movement operation of moving N1 albums selected from the first album group to the navigation bar, the electronic device adds N1 secondary album labels to the navigation bar, and the labels of the first type of albums in the navigation bar after the update include N1 secondary album labels and M secondary album labels.

[0027] The image display method provided in this application embodiment allows users to move albums (such as Alipay albums) from the content area to the navigation bar. The album's album tags are then sorted within the navigation bar to achieve album sorting. Secondary album tags (such as Alipay album tags) are added to the navigation bar to display the album, and the tags for the first type of album (such as regular albums) are updated, along with the album's sorting within the first type of album. This completes the album sorting, and the order of the secondary album tags in the navigation bar within the first type of album tags is consistent with the album's sorting within the first type of album in the content area. Compared to the relatively cumbersome sorting process of existing technologies, the above sorting process involves fewer steps and is more convenient, resulting in a better user experience. Furthermore, for each second-level album tag (such as other album tags) in the second part of the album tags, the hierarchy of albums in the album group corresponding to each second-level album tag is relatively deep. At least one needs to select the second-level album tag to display the corresponding album group and then click on a specific album to view it. This is not conducive to user experience when users need to frequently view one or more albums under the album group. The above sorting process can add the album tags of the albums in the album group to the navigation bar in the form of second-level album tags, which is equivalent to reducing the album hierarchy. In this way, users can directly view the corresponding album based on the shallower second-level album tags, with fewer operation steps and greater convenience, resulting in a better user experience.

[0028] Corresponding to situation 2 above, in some embodiments, the selected album tag is a first-level album tag (such as album tag), and the content area displays at least some albums in the first type of albums (such as ordinary albums) corresponding to the first-level album tag. Before the update, the tags of the first type of albums include N1 second-level album tags (such as Meitu Xiu Xiu tags); and, in response to the movement operation of moving the N1 albums selected from all albums to the navigation bar, updating the display of the N1 second-level album tags corresponding to the N1 albums in the navigation bar includes: in response to the movement operation of moving the N1 albums selected from the first type of albums to the navigation bar, updating the sorting of the N1 second-level album tags in the navigation bar. After the update, the sorting of the N1 second-level album tags in the navigation bar is different from the sorting of the N1 second-level album tags in the navigation bar before the update.

[0029] The image display method provided in this application embodiment allows users to move albums from the content area to the navigation bar. The album's tags are then sorted within the navigation bar to achieve album sorting. The sorting of the album's secondary album tags in the navigation bar is updated, as is the album's sorting within the first-category albums (e.g., regular albums). Before the sorting update, the album's secondary album tags are displayed in the navigation bar. This completes the album sorting. After the update, the order of the album's secondary album tags in the first-category albums (e.g., regular albums) in the navigation bar matches the album's order in the content area within regular albums. However, the order of the album's secondary album tags in the first-category albums in the navigation bar after the update differs from the order before the update. Compared to the relatively cumbersome sorting process of existing technologies, the above sorting process involves fewer steps and is more convenient, resulting in a better user experience. Especially in scenarios where a user is viewing albums, particularly those towards the end of the content area, and wants to move those albums to the front of the list, the user experience described above is even better. Furthermore, the navigation bar and content area are linked; after sorting, the change in the album tabs in the navigation bar mirrors the change in the albums' order in the content area. This allows users to perceive a consistent change in the same event across both the navigation bar and the content area, avoiding confusion and improving the user experience.

[0030] In some embodiments, in response to a floating operation of N1 albums, the electronic device displays the floating albums corresponding to the N1 albums, and in response to a move operation of moving the floating albums to the navigation bar, the electronic device updates and displays the N1 secondary album tabs corresponding to the floating albums in the navigation bar.

[0031] In one example, the float operation is a long press operation on any of the N1 selected albums.

[0032] The image display method provided in this application embodiment displays floating albums corresponding to the moved albums (N1 albums), which allows users to perform movement operations on the floating albums, making it convenient for users to operate without affecting the display of the moved albums in the content area.

[0033] In the above-described step of updating and displaying N1 secondary album tabs in the navigation bar in response to a user's movement operation of moving the floating album to the navigation bar, in some embodiments, in response to a movement operation of moving the floating album to a first position in the navigation bar and a user's release operation of the floating album, the N1 secondary album tabs are displayed at least at the first position.

[0034] It should be understood that the above-mentioned first position refers to the position where the floating album has been successfully moved. When the floating album is successfully moved to the first position, after the user releases the floating album, the electronic device can display at least N1 secondary album tags corresponding to the floating album in response to the user's release operation.

[0035] In one example, N1 = 1, and the electronic device displays N1 secondary album tabs in the first position.

[0036] In another example, N1 is greater than 1, and the electronic device displays N1 secondary album tabs in N1 locations, including the first location, which are distributed continuously within the navigation bar.

[0037] For example, if N1 is greater than 1, the order of the N1 secondary album tabs in the navigation bar is the same as the order of the N1 albums in the content area before the update.

[0038] In other words, the update changes the order of the N1 albums in the navigation bar within the first category of albums, but does not change the order of the N1 albums in the content area before or after the update. In implementation, the electronic device displays the N1 secondary album labels in the navigation bar at N1 corresponding positions along the first direction, according to the order of the N1 albums in the content area from front to back.

[0039] In the image display method provided in this application embodiment, when N1 is greater than 1, a user moves multiple albums from the content area to the navigation bar in a single operation. It is understood that the user intends to change the overall order of these multiple albums. Therefore, the order among the N1 secondary album tabs updated and displayed in the navigation bar remains the same as the order among the N1 albums before the update. This ensures that the order among the N1 albums remains unchanged before and after the update, conforming to the intentions of most users and improving the user experience. Furthermore, compared to moving one album to the navigation bar at a time, moving multiple albums to the navigation bar for sorting at once effectively reduces the number of user operations and is more convenient.

[0040] In this embodiment, the navigation bar includes an area that supports receiving photo albums, and the area that supports receiving photo albums is used to receive floating photo albums.

[0041] In some embodiments, the area supporting receiving albums includes a first tab area, which includes multiple contents including at least some of the album tabs among M secondary album tabs, and the first position is the position of any one of the multiple contents.

[0042] In cases where at least some album tags are partial album tags, the partial album tags do not include the recently deleted tag. In other words, in this case, the location of the recently deleted tag does not support receiving albums.

[0043] In the image display method provided in this application embodiment, since the first tab area is an area used to display all or most of the tabs of the first type of album (such as a normal album), and the album moved from the content area is also a first type of album, setting the first tab area as an area that supports receiving albums allows the floating album to be moved to any position in the first tab area. In this way, the album tabs (N1 secondary album tabs) of the moved album that are updated and displayed will be located in the first tab area, which can maintain the consistency of the overall layout of a specific area such as the first tab area in the navigation bar, and will not change too much due to user operation, resulting in a better overall visual experience.

[0044] In other embodiments, the area supporting receiving the album includes a preset area located on either side of the first tab area, and the first position is a position within the preset area.

[0045] It should be understood that either side of the first tab area refers to the side of the first tab area closer to the beginning of the navigation bar or the side farther from the beginning of the navigation bar.

[0046] The image display method provided in this application embodiment is set in a preset area on either side of the label area (first label area) of the first type of album (such as a normal album) in the navigation bar. It can support moving albums from the content area for sorting, achieving the effect of sorting and displaying secondary album labels in areas other than the labels of the first type of album. It is no longer limited to sorting within the label area (first label area) of the first type of album. Therefore, it gives users greater freedom in sorting and provides a better user experience.

[0047] In one example, the preset area is located on the first side of the first tab area (as shown above), and the first side of the first tab area is close to the beginning of the navigation bar (as shown at the top of the navigation bar).

[0048] In the image display method provided in this application embodiment, the preset area is located closer to the beginning of the navigation bar than the first tab area. Thus, for the user, the preset area has a higher browsing priority than the first tab area, which displays all or most of the first-class albums. By moving the floating albums to the preset area, the user can prioritize browsing the secondary album tabs displayed in the preset area to more quickly find the albums corresponding to those secondary album tabs.

[0049] In some embodiments, prior to the aforementioned movement operation in response to moving the floating album to the first position of the navigation bar and the user releasing the floating album, before displaying the N1 secondary album tabs at least at the first position, in response to the operation of moving the floating album to the navigation bar, when it is detected that the floating album and the first position satisfy the first position condition, it is determined that the floating album has moved to the first position.

[0050] In this way, after the floating album is moved to the first position, the electronic device will only respond to the user's release operation and display the N1 secondary album labels corresponding to the floating album after the user releases the floating album.

[0051] In some embodiments, the first location condition is that the floating album overlaps with a location in the area of ​​the navigation bar that supports receiving albums, and the area that supports receiving albums is used to receive the floating album.

[0052] In some embodiments, in response to an operation of moving a floating album to a first position, the electronic device moves the content displayed at the first position and at least a portion of the content continuously displayed on either side of the first position along the length direction of the navigation bar (e.g., up or down) to display the floating album alone at the first position; in response to a release operation of the floating album, the electronic device displays at least N1 secondary album tabs at the first position.

[0053] In the image display method provided in this application embodiment, before the floating album moves to the first position, the first position originally displays content. After determining that the floating album has moved to the first position, in response to the operation of moving the floating album to the first position, in order to free up the first position, the electronic device moves the content originally displayed in the first position and at least a portion of the content continuously displayed on either side of the first position along the length direction of the navigation bar (such as moving it up or down), thereby displaying the floating album separately in the freed first position. In this way, the freed first position can promptly remind the user that the floating album has been successfully moved to the first position, so that the user can release the device in time to quickly display the N1 secondary album tabs corresponding to the floating album, improving the overall sorting speed and thus improving the user experience; furthermore, displaying the floating album separately in the freed first position can improve the user's visual experience.

[0054] In one example, in response to moving the floating album to a first position, the electronic device moves the content displayed at the first position, along with at least a portion of the content continuously displayed on a second side of the first position, toward the end of the navigation bar (downward movement), wherein the second side of the first position is near the end of the navigation bar. For example, if the navigation bar is a vertical navigation bar with its end at the bottom, moving the content at the first position moves the content at the bottom of the navigation bar, which can also be described as moving the content at the first position downward.

[0055] In some embodiments, the navigation bar includes a second tab area, which includes tabs for a second type of album (such as a smart album), and / or the second tab area includes multiple first-level tabs, including a first-level album tab, and the multiple first-level tabs also include at least one of the following: a photo tab, a memory tab, or a creation tab; the tabs for the second type of album include at least one second-level album tab; the tabs for the second type of album are located on a first side (such as above) of the tabs for the first type of album; the first side of the tabs for the first type of album is close to the beginning of the navigation bar (such as the top of the navigation bar); and the step of displaying the floating albums corresponding to the N1 albums in response to the floating operation of the N1 albums includes: displaying the floating albums corresponding to the N1 albums in response to the floating operation of the N1 albums, and switching the display mode in the navigation bar from a first display mode to a second display mode (such as a grayed-out display mode) to display the content in the second tab area, the second display mode being used to remind the user that it is not supported to move the floating albums into the second tab area.

[0056] In the image display method provided in this application embodiment, the second label area includes multiple primary labels, meaning that the order of these primary labels needs to be preserved to maintain the position of the entry points for multiple functional clusters of the gallery application and to retain the highest-level position of the primary labels. The second label area includes labels for second-type albums (such as smart albums), meaning that the order of the labels for these second-type albums needs to be preserved to maintain the consistency of the characteristics of the second-type albums (such as maintaining the consistency of the smart capabilities of smart albums), and to prevent the secondary album labels of the first-type albums (such as ordinary albums) from being sorted in the area where the labels of the second-type albums are located, thereby affecting the characteristics of the second-type albums, such as affecting the smart capabilities of smart albums.

[0057] In some embodiments, the navigation bar further includes an editing control, and the method further includes: in response to an operation on the editing control, displaying an editable navigation bar, the editable navigation bar including a first part of album labels and a third part of album labels, the third part of album labels including: album labels of each album in an album group corresponding to each second-level album label in the second part of album labels.

[0058] In the image display method provided in this application embodiment, in order to reduce the list length of the navigation bar and improve development performance in the normal (i.e. non-editing state) navigation bar, the navigation bar does not display the album tags of each album in an album group corresponding to each second-level album tag (such as other album tags) in the second part album tags, but only displays a second-level album tag corresponding to the album group. The corresponding album group can be quickly located through the second-level album tag to find each album in the album group. In the edit-mode navigation bar, the album tags for each album in an album group corresponding to each second-level album tag (such as other album tags) in the second part of the album tabs are added and displayed in the edit-mode, forming the third part of the album tabs in the edit-mode. Since the first type of album (such as ordinary albums) has added the third part of album tags that are not normally displayed, users can not only edit the existing first part of album tags in the first type of album (such as ordinary albums) in the edit-mode navigation bar (such as sorting, renaming, deleting, etc.), but also edit the third part of album tags that are not normally displayed. This allows for quick editing of the second-level album tags of the first type of album (such as ordinary albums) in the edit-mode navigation bar, thus achieving rapid album editing. Compared with the operation of searching and editing albums in the album interface, this is more convenient and provides a better user experience. Thus, the navigation bar in this embodiment can dynamically display the second part of the album tabs in both normal and edit states, providing flexible handling between quickly finding albums and quickly editing albums. It considers the actual needs of users from different perspectives and greatly improves the user experience.

[0059] In conjunction with the above embodiments, in some embodiments, the navigation bar further includes a label for a second type of album (such as a smart album), the label for the second type of album being located on the first side of the label for the first type of album (such as a regular album), the first side of the label for the first type of album being close to the beginning of the navigation bar, the label for the second type of album including at least one secondary album label; and, in the navigation bar of the first interface (i.e., the normal navigation bar), at least one secondary album label of the label for the second type of album is expanded, and in the navigation bar in edit mode, at least one secondary album label of the label for the second type of album is collapsed.

[0060] In the image display method provided in this application embodiment, the labels of the second type of album (such as a smart album) are expanded in the normal navigation bar, and the various secondary album labels within the second type of album label are automatically collapsed in the edit-mode navigation bar. Thus, the list length occupied by the second type of album label itself can be compensated for by the third part of the album labels of the first type of album (such as a regular album). This minimizes the list length of the navigation bar while still allowing the third part of the album labels to be displayed, facilitating user searching and editing. Furthermore, when the second type of album is a smart album, since a smart album is a virtual album generated by an electronic device through functional clustering based on specific category characteristics, user editing of the smart album labels can affect the display of the smart album's intelligent capabilities. Therefore, automatically collapsing the smart album labels in the navigation bar does not affect the editing of the regular album labels.

[0061] In some embodiments, the M secondary album tags are arranged in the navigation bar along a first direction (e.g., from top to bottom) according to the priority order of the albums corresponding to each secondary album tag in the M secondary album tags from high to low. The first direction is the direction that extends from the beginning of the navigation bar to the end of the navigation bar.

[0062] The image display method provided in this application arranges M secondary album tags along a first direction (e.g., from top to bottom) in the navigation bar according to the album priority order of each secondary album tag from high to low. This allows album tags of higher priority albums to be placed at the front of the navigation bar compared to album tags of lower priority albums. For users, album tags of higher priority albums in the first type of albums (e.g., ordinary albums) also have a higher browsing level. This ensures that users can browse and operate album tags of higher priority albums more conveniently, so as to find the content corresponding to higher priority album tags more quickly, thereby improving the efficiency of image material search and user experience in the gallery application.

[0063] In conjunction with the above embodiments, in some embodiments, the M secondary album tags include multiple tag groups, and each tag group includes at least one secondary album tag.

[0064] The image display method provided in this application embodiment groups the M secondary album tags in the first type of album tags to obtain multiple tag groups, which can display album tags in different groups, making it convenient to manage album tags.

[0065] In some embodiments, the navigation bar also includes labels for a second type of album, which include at least one secondary album label. The labels for the second type of album are located on a first side of the labels for the first type of album, which are close to the beginning of the navigation bar.

[0066] For example, the second type of album is a smart album, and the first type of album is a regular album.

[0067] In the image display method provided in this application embodiment, the navigation bar includes not only labels for ordinary albums, but also labels for smart albums. Thus, for smart albums, the smart album labels in the navigation bar can highlight the smart capabilities of the gallery application, thereby increasing the usage rate and exposure rate of smart albums.

[0068] In some embodiments, the navigation bar includes multiple primary tabs, including a primary album tab, and the multiple primary tabs also include at least one of the following: a photo tab, a memory tab, or a creation tab.

[0069] In some embodiments, multiple primary labels, labels for second-class albums, and labels for first-class albums are arranged in the navigation bar along a first direction, which is the direction extending from the beginning to the end of the navigation bar.

[0070] In the image display method provided in this application embodiment, the first-level tags have the highest browsing level for users, followed by the second-level tags. Therefore, it can ensure that users can prioritize browsing and operate the first-level tags more conveniently, so as to find the content corresponding to the first-level tags more quickly.

[0071] In a second aspect, an electronic device is provided for performing the method provided in the first aspect. Specifically, the electronic device may include modules for performing any possible implementation of the first aspect.

[0072] Thirdly, an electronic device is provided, including a processor. The processor is coupled to a memory and can be used to execute instructions in the memory to implement the methods in any possible implementation of the first aspect described above. Optionally, the electronic device further includes a memory. Optionally, the device further includes a communication interface, to which the processor is coupled.

[0073] Fourthly, a computer-readable storage medium is provided having a computer program stored thereon, which, when executed by a device, causes the device to implement the method in any possible implementation of the first aspect described above.

[0074] Fifthly, a computer program product comprising instructions, which, when executed by a computer, cause a device to implement the method in any of the possible implementations of the first aspect described above. Attached Figure Description

[0075] Figure 1 is a schematic diagram of the form of an electronic device (or folding device) with an outward-folding display screen provided in an embodiment of this application.

[0076] Figure 2 is a schematic diagram of the form of an electronic device (or folding device) with an inwardly folding display screen provided in an embodiment of this application.

[0077] Figure 3 is a schematic diagram of the interface of the electronic device in different states provided in the embodiments of this application.

[0078] Figure 4 is a schematic diagram of the interface of the electronic device provided in the embodiment of this application in the unfolded state for split-screen display.

[0079] Figure 5 is a schematic structural diagram of the electronic device provided in an embodiment of this application.

[0080] Figure 6 is a schematic diagram of the interface for sorting photo albums in the prior art.

[0081] Figure 7 is a schematic diagram of the interface of the gallery application provided in an embodiment of this application.

[0082] Figure 8 is a schematic diagram of the interface for the process of scrolling and displaying the navigation bar according to an embodiment of this application.

[0083] Figure 9 is a schematic diagram of the interface of the gallery application under different first-level tags provided in the embodiments of this application.

[0084] Figure 10 is another schematic diagram of the interface of the content area under the first-level album tab and the creation tab provided in the embodiment of this application.

[0085] Figure 11 is a schematic diagram of the electronic device provided in the embodiments of this application under different interface forms.

[0086] Figure 12 is a schematic diagram of the process of entering the interface under the first-level album tab and the second-level album tab, respectively, according to the embodiments of this application.

[0087] Figure 13 is another schematic diagram of the process of entering the interface under the first-level album tab and the second-level album tab, respectively, according to the embodiments of this application.

[0088] Figure 14 is a schematic diagram of the interface of the content area corresponding to other album tags provided in the embodiments of this application.

[0089] Figure 15 is another schematic diagram of the interface of the gallery application provided in the embodiments of this application.

[0090] Figure 16 is a schematic diagram of a set of interfaces of the image display method provided in the embodiments of this application.

[0091] Figure 17 is a schematic diagram of another set of interfaces of the image display method provided in the embodiments of this application.

[0092] Figure 18 is a schematic diagram of another set of interfaces of the image display method provided in the embodiments of this application.

[0093] Figure 19 is a schematic diagram of another set of interfaces of the image display method provided in the embodiments of this application.

[0094] Figure 20 is a set of interface diagrams showing the sorting status of the Meitu XiuXiu album after sorting the photos on the electronic device in a collapsed state, corresponding to Figure 19.

[0095] Figure 21 is a schematic diagram of another set of interfaces of the image display method provided in the application embodiment.

[0096] Figure 22 is a schematic flowchart of the image display method provided in an embodiment of this application.

[0097] Figure 23 is a schematic structural diagram of the electronic device provided in an embodiment of this application. Detailed Implementation

[0098] The technical solutions in this application will now be described with reference to the accompanying drawings.

[0099] The image display method of this application embodiment can be applied to various electronic devices capable of storing and displaying images, such as mobile phones, tablets, laptops, netbooks, personal digital assistants (PDAs), personal computers (PCs), in-vehicle devices, netbooks, and electronic devices with folding functions (hereinafter referred to as folding devices). This application embodiment does not impose any restrictions on the specific type of electronic device.

[0100] As an example, firstly, the morphological structure of the electronic device to which the embodiments of this application are applicable will be described with reference to Figures 1 to 4, and secondly, the functional modules of the embodiments of this application will be introduced with reference to Figure 5.

[0101] 1. Folding equipment

[0102] The folding device includes a foldable display screen. When folded, the foldable display screen forms at least two display units. For example, the foldable display screen can form a first display unit (as shown in screen A below) and a second display unit (as shown in screen B below) along the folding edge (or folding axis). There are two folding methods for the folding device: one is folding towards the outside of the foldable display screen (referred to as the outward folding direction), and the other is folding towards the inside of the foldable display screen (referred to as the inward folding direction). Based on this, a foldable display screen folded using the outward folding method is simply referred to as an outward folding display screen, and a foldable display screen folded using the inward folding method is simply referred to as an inward folding display screen. Taking the foldable display screen forming a first display unit and a second display unit after folding as an example, after the outward folding display screen is folded, the display directions of the first display unit and the second display unit are opposite to each other; after the inward folding display screen is folded, the display directions of the first display unit and the second display unit are opposite to each other.

[0103] The foldable display screen can be a single, integrally molded flexible display screen, or a spliced ​​display screen composed of multiple independent flexible display screens and hinges located between each pair of flexible display screens, or a spliced ​​display screen composed of multiple rigid screens and hinges located between each pair of rigid screens. This application does not limit the specific type of display screen.

[0104] Figure 1 is a schematic diagram of the form of an electronic device (or folding device) with an outward-folding display screen provided in an embodiment of this application.

[0105] Figure 1(a) shows the electronic device (or folding device) in its fully unfolded state. Figure 1(b) shows the electronic device (or folding device) in its semi-folded state. Figure 1(c) shows the electronic device (or folding device) in its fully folded state.

[0106] It should be understood that the electronic device 100 shown in Figure 1 is an example of a folding device.

[0107] Please refer to Figure 1(a). The electronic device 100 includes a first housing 101, a second housing 102, and a display screen 103a. The first housing 101 and the second housing 102 jointly support and accommodate the display screen 103a. The display screen 103a includes screen A and screen B. With the folding edge as a reference, one side of the folding edge is screen A, and the other side of the folding edge is screen B. When the electronic device 100 is in a fully unfolded state, the display screen 103a is also in a fully unfolded state. At this time, the angle between screen A and screen B is 180°, and the angle between the first housing 101 and the second housing 102 is also 180°. The display screen 103a is an outward-folding display screen. The electronic device 100 can be folded along the folding edge in the outward folding direction shown in the figure to form a semi-folded state as shown in Figure 1(b).

[0108] It should be understood that the folding edge can be the center of the folding hinge, or it can be the centerline of the display screen 103a in the first direction. It should also be understood that an included angle of 180° means that the included angle is close to 180°. This included angle can be 180° in an absolute sense, or it can have a certain margin from 180°, for example, a margin of 10° from 180°, with the included angle ranging from 170° to 190°. The explanation of included angles of various values ​​(e.g., 0°) in the following text is the same as here, and will not be repeated.

[0109] Referring to Figure 1(b), the electronic device 100 is in a semi-folded state, and the display screen 103a is also in a semi-folded state. At this time, the angle α between screen A and screen B is less than 180°, and the angle between the first housing 101 and the second housing 102 is also α. The display directions of screen A and screen B are opposite to each other, and both screen A and screen B are exposed. Based on the electronic device 100 in the semi-folded state, it continues to fold outward in the direction shown in the figure, forming the fully folded state shown in Figure 1(c).

[0110] Please refer to Figure 1(c). The electronic device 100 is in a fully folded state, and the display screen 103a is also in a fully folded state. At this time, the angle between screen A and screen B is 0°, and the angle between the first housing 101 and the second housing 102 is also 0°. In this state, when screen A faces the user, screen B faces away from the user; in other words, screen A is visible to the user, and screen B is not visible to the user. Conversely, when screen B faces the user, screen A faces away from the user; in other words, screen B is visible to the user, and screen A is not visible to the user.

[0111] Figure 2 is a schematic diagram of the electronic device (or folding device) with an inward-folding display screen provided in an embodiment of this application. Figure 2(a) is a schematic diagram of the front view of the electronic device (or folding device) when it is in a fully unfolded state. Figure 2(b) is a schematic diagram of the back view of the electronic device (or folding device) when it is in a fully unfolded state. Figure 2(c) is a schematic diagram of the electronic device (or folding device) when it is in a semi-folded state. Figure 2(d) is a schematic diagram of the electronic device (or folding device) when it is in a fully folded state.

[0112] It should be understood that the electronic device 100 shown in Figure 2 is another example of a folding device. It should also be understood that the front of the electronic device represents the side of the display screen facing the user when the electronic device is in the unfolded state, and the back of the electronic device represents the side of the display screen facing away from the user when the electronic device is in the unfolded state.

[0113] Please refer to Figures (a) and (b) in Figure 2. The electronic device 100 includes a first housing 101, a second housing 102, a display screen 103a, and a display screen 103b. The display screen 103a (i.e., the inward-folding display screen) can be referred to as the inner screen, and the display screen 103a (C-screen) can be referred to as the outer screen of the electronic device 100. The size of the outer screen is smaller than that of the inner screen. When the electronic device 100 is in a folded state, the inner screen is not visible to the user, while the outer screen is visible to the user.

[0114] Please refer to Figure 2(a) where the electronic device 100 is in a fully unfolded state, and the display screen 103a is also in a fully unfolded state. At this time, the angle between screen A and screen B is 180°, and the angle between the first housing 101 and the second housing 102 is also 180°. The display screen 103a faces the user from the front of the electronic device 100.

[0115] Please refer to Figure 2(b). The electronic device 100 is in a fully unfolded state. On the back of the electronic device 100, with the folding edge as the dividing line, a display screen 103b is provided on one side of the folding edge, and a back cover 104 is provided on the other side of the folding edge. A camera 105 (such as a rear camera) is provided on the back cover 104.

[0116] When the electronic device 100 is in the fully unfolded state, it can be folded along the folding edge in the inward folding direction shown in Figure 2 to form a semi-folded state as shown in Figure 2(c).

[0117] Referring to Figure 2(c), the electronic device 100 is in a semi-folded state, and the display screen 103a is also in a semi-folded state. At this time, the angle α between screen A and screen B is less than 180°, the display directions of screen A and screen B are opposite, and most of the area of ​​display screen 103b (screen C) faces the user. Based on the semi-folded state, the electronic device 100 continues to fold inward in the direction shown in the figure, forming the fully folded state shown in Figure 2(d). In one example (as shown in Figure 2), the second housing 102 together accommodates screen B and screen C, which are located on opposite sides of the thickness direction of the second housing 102. In another example (not shown in the figure), the first housing 101 together accommodates screen A and screen C, which are located on opposite sides of the thickness direction of the first housing 101.

[0118] Please refer to Figure 2(d). The electronic device 100 is in a fully folded state, and the display screen 103a is also in a fully folded state. At this time, the angle between screen A and screen B is 0°, and the angle between the first housing 101 and the second housing 102 is also 0°. Screen A and screen B are opposite each other and are not visible to the user, while the display screen 103b (screen C) is visible to the user.

[0119] As can be seen from Figures 1 and 2 above, in the electronic device 100 with a foldable display screen, the electronic device 100 can include three physical states: fully unfolded state, half-folded state and fully folded state. For ease of description, the fully folded state will be referred to as the folded state and the fully unfolded state will be referred to as the unfolded state. In addition, the half-folded state can also be referred to as the half-unfolded state.

[0120] In terms of display results, for the electronic device 100 with an outward-folding display screen, when the electronic device 100 is in the unfolded state, the outward-folding display screen (as shown in display screen 103a in Figure 1) is used to display the interface content in full screen. When the electronic device 100 is in the folded state, only a portion of the interface is displayed on the outward-folding display screen (as shown in display screen 103a in Figure 1), or the outward-folding display screen can display the entire interface. For example, in the folded state, screen A of the electronic device 100 is used to display the interface content, while screen B is in an off state. As another example, in the folded state, screen A of the electronic device 100 is used to display the interface content currently being viewed by the user, while screen B is used to display the date, time, desktop, etc. For the electronic device 100 with an inward-folding display screen, when the electronic device 100 is in the unfolded state, the inward-folding display screen (as shown in display screen 103a in Figure 2) is used to display the interface content in full screen. When in the folded state, the inward-folding display screen (as shown in display screen 103a in Figure 2) does not display the interface, and the outer screen (as shown in display screen 103b in Figure 2) is used to display the interface content.

[0121] In implementation, the physical state of an electronic device can be defined or determined by the angle α between screens A and B of the foldable display. If the angle α ∈ [0°, P1], the electronic device is in a folded state; if the angle α ∈ (P1, P2), the electronic device is in a semi-folded state; if the angle α ∈ (P2, 180°), the electronic device is in an unfolded state. Here, 0° < P1 < P2 < 180°. In one example, P1 and P2 can be preset angle thresholds, determined based on the usage habits of a large number of users of the foldable display. In another example, P1 and P2 can be set by the user within the electronic device. For example, the value range of P1 can be (0, 80°], and the value range of P2 can be [100°, 150°]. For example, P1 can be 75°, and P2 can be 130°. The above examples are merely for explaining multiple embodiments of this application and do not constitute any limitation.

[0122] Figure 3 is a schematic diagram of the interface of the electronic device in different states according to an embodiment of this application. Figure 3(a) shows the interface of the electronic device in the unfolded state, and Figure 3(b) shows the interface of the electronic device in the folded state. It should be understood that the two states shown in Figure 3 are applicable to electronic devices with inward-folding displays and electronic devices with outward-folding displays.

[0123] Please refer to Figure 3(a). When the electronic device is in the unfolded state, taking the gallery application as an example, in response to the user's selection operation on the album tab 301, the display screen (such as the display screen 103a mentioned above) displays the album interface 302 as a whole in full screen. When the electronic device switches from the unfolded state to the folded state, please refer to Figure 3(b). The display screen (such as screen A in Figure 1 or screen C in Figure 2) folds down to display the album interface 303 in the folded state, and the display size of the same interface content becomes smaller.

[0124] In the aforementioned folding devices, it is known that, whether it is an electronic device 100 with an inward-folding display screen or an electronic device 100 with an outward-folding display screen, for the same interface content, the display form of the electronic device 100 in the unfolded state and the electronic device 100 in the folded state are significantly different. These differences are not limited to differences in display size. In some embodiments, these differences are also reflected in differences in interface layout.

[0125] For electronic devices in their unfolded state, not only can the interface content be displayed in full screen, but different interface content can also be displayed in split screen.

[0126] Figure 4 is a schematic diagram of the interface of the electronic device provided in the embodiment of this application in the unfolded state for split-screen display.

[0127] Referring to Figure 4, the electronic device is in its unfolded state. The display screen (such as display screen 103a mentioned above) shows the interfaces of two applications, separated by a split line. The area on one side of the split line (such as screen B) displays the interface of one application (such as the gallery application), while the area on the other side of the split line (such as screen A) displays the interface of another application (such as the note-taking application). This allows two independent applications to be displayed and used simultaneously on the screen without interfering with each other; that is, user actions on one application will not affect the other.

[0128] Comparing Figure 3(a) and Figure 4, although the electronic devices are both in the unfolded state, for the split-screen display scenario shown in Figure 4, the interface of a certain application (such as the gallery application) displayed on the split screen is the same as the interface of the application (such as the gallery application) in the folded state shown in Figure 3(b).

[0129] Therefore, in the embodiments of this application, unless otherwise specified, for the same interface content, the interface displayed in split-screen mode when the electronic device is in unfolded mode is the same as the interface displayed in folded mode when the electronic device is in folded mode.

[0130] It should be understood that the folding devices illustrated above are merely illustrative and should not be construed as limiting the embodiments of this application. The folding devices illustrated above all fold from the middle of the foldable display screen horizontally. In other embodiments (not shown in the figures), the folding device may also fold vertically from the middle of the foldable display screen.

[0131] 2. Non-folding devices

[0132] For devices such as tablets, laptops, and PCs that do not have a folding function but have a large screen size (referred to as non-folding devices), not only can the interface content be displayed in full screen, but different interface content can also be displayed in split screen. For a detailed description of split screen display, please refer to the relevant description in Figure 4, which will not be repeated here. However, in this case, the GUI shown in Figure 3(a) and Figure 4 is the GUI of the display screen of the non-folding device.

[0133] Based on the above description of foldable and non-foldable devices, for the same interface content, this application defines two interface forms: a first interface form and a second interface form.

[0134] First interface form: The full-screen interface of a foldable device in its unfolded state, and the full-screen interface of a non-foldable device.

[0135] Second interface forms: the interface displayed when a foldable device is in a folded state, the interface displayed in split-screen mode when a foldable device is in an unfolded state, and the interface displayed in split-screen mode on a non-foldable device.

[0136] It should be understood that the folded display of a foldable device in its folded state uses either half of an outward-folding display screen or the outer screen of an inward-folding electronic device. Furthermore, compared to the first interface form, the second interface form has a smaller screen size; therefore, the first interface form can also be referred to as a large-screen display interface, and the second interface form as a small-screen display interface.

[0137] Figure 5 is a schematic structural diagram of the electronic device 100 provided in an embodiment of this application.

[0138] Referring to Figure 5, electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, antenna 1, antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, a headphone jack 170D, a sensor module 180, buttons 190, a motor 191, an indicator 192, a camera 193, a display screen 194, and a subscriber identification module (SIM) card interface 195, etc. The sensor module 180 may include pressure sensors, gyroscope sensors, barometric pressure sensors, magnetic sensors, accelerometers, distance sensors, proximity sensors, fingerprint sensors, temperature sensors, touch sensors, ambient light sensors, bone conduction sensors, etc.

[0139] It should be noted that the display screen 194 shown in Figure 5 includes at least the display screens 103a and 103b shown in Figures 1 and 2 above. The camera 193 includes at least the camera 105 shown in Figure 2 above and a front-facing camera (not shown).

[0140] It should also be noted that the structure shown in FIG1 does 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 those shown in FIG1, or the electronic device 100 may include a combination of some of the components shown in FIG1, or the electronic device 100 may include sub-components of some of the components shown in FIG1. ​​The components shown in FIG1 may be implemented in hardware, software, or a combination of software and hardware.

[0141] Processor 110 may include one or more processing units. For example, processor 110 may include at least one of the following processing units: application processor (AP), modem processor, graphics processing unit (GPU), image signal processor (ISP), controller, video codec, digital signal processor (DSP), baseband processor, and neural network processing unit (NPU). These different processing units may be independent devices or integrated devices.

[0142] The processor 110 may also include memory for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. The electronic device 100 can implement display functions through the processor 110 (such as a GPU, application processor) and the display screen 194. 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 for graphics rendering. The processor 110 may include one or more GPUs that execute program instructions to generate or modify display information.

[0143] The display screen 194 can be used to display images or videos. The display screen 194 includes a display panel. The display panel can 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 light-emitting diode (Mini LED), a micro light-emitting diode (Micro LED), a micro OLED, or a quantum dot light-emitting diode (QLED). In some embodiments, the electronic device 100 may include one or N displays 194, where N is a positive integer greater than 1.

[0144] When the display screen 194 is a foldable display screen (such as the display screen 103a described above), the display screen 194 can be a single integral flexible display screen, or it can be a spliced ​​display screen composed of multiple independent flexible display screens and hinges located between each pair of flexible display screens, or it can be a spliced ​​display screen composed of multiple rigid screens and hinges located between each pair of rigid screens. This application embodiment does not limit this.

[0145] In this embodiment, the processor 110 can control the display screen 194 to execute the image display method proposed in this embodiment. In some embodiments, depending on different situations, the processor 110 controls the display screen 194 to display different interface forms (a first interface form or a second interface form), and switches between the first interface form and the second interface form. For example, if the electronic device 100 is a foldable device, the processor 110 can control the display screen 194 to fold in a folded state, or control the display screen 194 to display in full screen in an unfolded state, or control the display screen 194 to display in split screen in an unfolded state. In some embodiments, based on user operations, the processor 110 controls the display screen 194 to display various interfaces of the gallery application to improve human-computer interaction efficiency. Exemplarily, the gallery application interface includes a navigation bar and a content area. The navigation bar includes multiple tabs, through which corresponding content (such as image materials, albums) can be quickly found. Exemplarily, the gallery application interface supports album sorting. The specific process of the processor 110 controlling the display screen 194 to execute the image display method of this embodiment can be referred to the relevant description below, and will not be repeated here.

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

[0147] 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 a standard red-green-blue (RGB), YUV, or other image signal format. In some embodiments, electronic device 100 may include one or N cameras 193, where N is a positive integer greater than 1. Camera 193 includes a front-facing camera and a rear-facing camera, and electronic device 100 may include one or more front-facing cameras and one or more rear-facing cameras.

[0148] 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.

[0149] Currently, images and videos (referred to as image materials) obtained by electronic devices through various means such as user photography, downloading from the internet, or receiving from contacts are stored in gallery applications (also known as photo albums) for viewing. To facilitate the management of image materials, albums can be used to categorize and manage them, and gallery applications support user sorting of albums.

[0150] Figure 6 is a schematic diagram of the interface for sorting photo albums in the prior art. It should be understood that Figure 6 illustrates the gallery application in the first interface form (i.e., the full-screen interface of a folded device in the unfolded state and the full-screen interface of a non-folded device).

[0151] Referring to Figure 6(a), the desktop of the electronic device includes an icon 601 for the gallery application. When the user clicks the gallery application icon 601, the electronic device responds to this operation and displays the interface shown in Figure 6(b). Referring to Figure 6(b), this interface is the gallery application interface. This interface includes a content area and labels such as photo tabs and album tabs 605 located below the content area. When album tab 605 is selected, the content area of ​​this interface displays the album interface, which includes multiple existing albums and more controls 602. In response to the user clicking the more controls 602, the electronic device displays the interface shown in Figure 6(c). Referring to Figure 6(c), the interface displays a menu bar 606, which includes multiple function options. In response to the user clicking the album sorting option 603, the electronic device displays the interface shown in Figure 6(d). Please refer to Figure 6(d). This interface is the album sorting interface, which is an editable interface for users to sort various albums. This interface includes sorting items for each album, such as sorting item 604 for Weibo album. After the user long-presses a sorting item, the sorting item is selected. The user can move the selected sorting item to achieve the purpose of sorting the album corresponding to the selected sorting item.

[0152] In the aforementioned technology, within the album interface, the user first needs to click "More Controls" to display sorting options. Only after selecting a sorting option will the album sorting editing interface appear, where the albums can be sorted. This process requires at least two steps to access the album sorting interface and then sort the albums. The album sorting process is cumbersome and has low human-computer interaction efficiency.

[0153] Based on this, this application provides an image display method. In the aforementioned first interface form (i.e., the full-screen display interface of a folded device in its unfolded state, and the full-screen display interface of a non-folded device), in response to the user's operation on the gallery application, the electronic device displays the gallery application interface. This interface includes a navigation bar and a content area. The navigation bar can guide the user to quickly find and manage the gallery. The navigation bar includes multiple album tabs, including primary album tabs (as described below) and tabs for first-class albums (such as regular albums). When a primary album tab is selected, the content area can display the corresponding first-class album. When each secondary album tab of the first-class album is selected, the content area can display each album in the corresponding album group or each image material in an album. More importantly, the navigation bar and the content area are linked; the order of each secondary album tab in the first-class album tab is consistent with the order of the albums corresponding to each secondary album tab in the first-class album. Based on this, the gallery application's interface allows users to move albums displayed in the content area to the navigation bar. Within the navigation bar, users can sort the secondary album tags of the moved albums to achieve album sorting. After sorting, the order of the moved albums changes. This allows for quick and easy album management with few steps, resulting in a superior user experience. This implementation is particularly suitable for scenarios where users are browsing albums in the content area and need to adjust their order, as well as scenarios where the navigation bar does not display album tags for some albums that the user has recently viewed frequently.

[0154] In the embodiments of this application, "image" can also be referred to as a photograph or picture; these three expressions can be used interchangeably.

[0155] It should be noted that the executing entity of the image display method provided in this application embodiment can be the aforementioned electronic device, or a functional module and / or functional entity within the electronic device capable of implementing the method. Furthermore, the solution of this application can be implemented through hardware and / or software, the specific implementation depending on actual usage requirements, and this application embodiment does not impose any limitations. For ease of description, the following will use a gallery application within an electronic device as an example. It is understood that the technical solution of this application is also applicable to other applications on electronic devices with image storage and display functions, and is not limited to gallery applications.

[0156] To facilitate understanding, the following section will use an electronic device as an example to provide a detailed description of the navigation bar and content area in the gallery application interface, along with accompanying diagrams.

[0157] Figure 7 is a schematic diagram of the interface of the gallery application provided in the embodiments of this application. Figure 7(a) is a schematic diagram of the interface of the gallery application including the navigation area and the content area, and Figure 7(b) is a schematic diagram of the navigation bar of the complete page in Figure (a).

[0158] In response to a user's interaction with the Gallery app icon on the desktop, the electronic device displays the Gallery app interface 7a as shown in Figure 7(a). Interface 7a includes a navigation bar 71 and a content area (the area displaying interface 721) located to one side of the navigation bar 71. The navigation bar 71 provides quick links for the user to access different content and includes multiple tabs. The content area displays the content corresponding to the selected tab within the navigation bar 71. For example, if the Photo tab 7111 is selected within the navigation bar 71, the content area displays the interface 721 corresponding to the Photo tab 7111 (i.e., the Photo interface), which includes thumbnails of multiple image assets.

[0159] A tab, also known as a tab page or tabbed interface, is a UI element in a webpage or application used to switch between multiple content areas. It can be used to organize and display information, such as grouping and displaying content at the same level. Each tab is typically associated with a content area (tab content), and clicking the tab allows you to switch to the corresponding content area. Tabs can include a name and / or icon, etc.

[0160] In some embodiments, the navigation bar 71 further includes multiple controls, such as a new album control 713 and an edit control 716. When triggered, the new album control 713 is used to create a new album for the selected image materials. When triggered, the edit control 716 is used to display the navigation bar in edit mode, allowing for the editing of at least some of the labels in the navigation bar 71.

[0161] In one example, referring to Figure 7(a), the navigation bar 71 and the content area are distributed along the width direction of the display screen (denoted as the x-direction), which is perpendicular to the folding edge (or folding axis). In this case, the navigation bar 71 is located on one side of the content area along the x-direction. Taking the orientation of Figure 7(a) as an example, the navigation bar 71 and the content area are distributed along the x-direction in a horizontal arrangement. For example, as shown in Figure 7(a), the navigation bar 71 is located on the left side of the content area; another example (not shown in the figure) is that the navigation bar 71 can also be located on the right side of the content area.

[0162] In another example (not shown in the figure), the navigation bar 71 and the content area can also be distributed along the length of the display screen (denoted as the y-direction), with the y-direction parallel to the folded edge. In this case, the navigation bar 71 is located on one side of the content area along the y-direction. Taking the orientation in Figure 7(a) as an example, the navigation bar 71 and the content area are distributed along the y-direction in a vertically distributed manner. The navigation bar 71 can be located below the content area, or it can be located above the content area.

[0163] It should be understood that the above-described distribution of the navigation bar 71 and content area is merely illustrative and should not be construed as limiting the embodiments of this application. Any interface capable of displaying the content area and navigation bar 71 of this application is within the protection scope of this application. Subsequently, for ease of description, the interface of the gallery application will be described using the distribution of the navigation bar 71 and content area along the x-direction, as shown in Figure 7(a), with the navigation bar 71 located to the left of the content area, as an example.

[0164] The electronic device can hierarchically manage multiple labels within the navigation bar 71, meaning these labels can be divided into multiple levels. In some embodiments, these multiple labels include multiple primary labels and multiple secondary labels, where secondary labels can be understood as sub-labels of primary labels. This allows for the organization and display of content (image materials or photo albums) at different levels, achieving a flattened hierarchy of related content. This facilitates users in quickly finding and managing the content they need, improving user efficiency.

[0165] In some embodiments, a plurality of primary labels and a plurality of secondary labels are arranged in the navigation bar 71 along a first direction, which is the direction extending from the beginning of the navigation bar to the end of the navigation bar. That is, the plurality of primary labels are closer to the beginning of the navigation bar than the plurality of secondary labels.

[0166] In this way, for users, the first-level tags have the highest browsing priority, followed by the second-level tags. Therefore, it can be ensured that users can prioritize browsing and operate the first-level tags more conveniently, so as to find the content corresponding to the first-level tags more quickly.

[0167] It should be understood that the beginning of a navigation bar typically displays the application's logo, application identifier, application name (such as a gallery name), or a "Home" link, serving as the starting point for users to enter the application. Correspondingly, the end of the navigation bar is the opposite end from the beginning.

[0168] Generally speaking, the start and end points of a navigation bar depend on its layout and orientation.

[0169] In embodiments where the navigation bar and content area are distributed along the x-direction, the navigation bar and content area are horizontally distributed. In this case, the navigation bar is distributed along the y-direction, and this type of navigation bar can also be called a vertical navigation bar. If the navigation bar is located on the left side of the content area, based on the usage habits of most users, the starting point can be the top of the navigation bar; if the navigation bar is located on the right side of the content area, the starting point can be the top or bottom of the navigation bar.

[0170] In an embodiment where the navigation bar and content area are distributed along the y-direction, the navigation bar and content area are vertically distributed. In this case, the navigation bar is distributed along the x-direction. This type of navigation bar can also be called a horizontal navigation bar. According to the reading habits of most users from left to right, the starting end is usually the leftmost end of the navigation bar, and correspondingly, the ending end is the rightmost end of the navigation bar.

[0171] For example, referring to Figure 7, the navigation bar 71 is distributed along the y-direction, is a vertical navigation bar, and is located on the left side of the content area. The starting end of the navigation bar 71 is also the top of the navigation bar 71, displaying content such as the application name "Gallery". Correspondingly, the ending end of the navigation bar 71 is also the bottom of the navigation bar 71, displaying content such as the recently deleted tab 714. The first direction extending from the starting end to the ending end of the navigation bar is the top-to-bottom direction. The navigation bar 71 includes a primary tab area 711 and multiple secondary tab areas (such as secondary tab areas 7121, 7122, and 7123). The primary tab area 711 includes multiple primary tabs, and each secondary tab area includes at least one secondary tab. The primary tab area 711 and the multiple secondary tab areas are distributed from top to bottom, that is, the primary tab area 711 is closest to the starting end of the navigation bar 71 (the top of the navigation bar 71), and the multiple secondary tab areas are arranged below the primary tab area 711.

[0172] When there are many labels in the navigation bar, the labels cannot all be displayed on the screen due to the height limitation of the electronic device's display. As shown in Figure 7, the complete page of the navigation bar 71 shown in Figure 7(b) cannot be fully displayed on the screen shown in Figure 7(a); the display only shows a portion of the content of the navigation bar 71. To avoid affecting the user experience due to the above problem, in one example, the electronic device can configure the navigation bar as a scrollable page. Users can slide along the length direction of the navigation bar (such as the y-direction) (e.g., slide up or down) to scroll and display the entire page of the navigation bar.

[0173] Figure 8 is a schematic diagram of the interface for the scrolling display of the navigation bar provided in this application embodiment. Referring to Figures 7 and 8, and continuing to refer to Figure 7(a), if the user wants to view the remaining content of the navigation bar 71, the user can slide the navigation bar 71 to the top of the display screen. In response to the user's sliding operation to the top (i.e., the upward sliding operation), the content of the current part of the navigation bar 71 displayed on the display screen is shifted away from the display screen, and the navigation bar 71 moves to the top accordingly, displaying the interface shown in Figure 8(a). Referring to Figure 8(a), the navigation bar 71 moves upward as a whole, such as the first-level tab area 711 being basically moved out of the display screen, and the display screen displays the content of the part of the navigation bar 71 that is not displayed, such as the content of the second-level tab area 7123. The user continues to slide the navigation bar 71 to the top of the display screen. When the navigation bar 71 moves to the limit position, the navigation bar 71 no longer moves to the top with the user's sliding operation to the top of the display screen, displaying the interface shown in Figure 8(b). The "New Album" control 713 is the limit position of the movable range of the navigation bar 71.

[0174] It should be understood that the distance or rate at which the navigation bar 71 moves upward depends on the speed at which the user swipes the screen upwards. The faster the user swipes the screen upwards, the greater the distance or rate at which the navigation bar 71 moves upwards.

[0175] The above only illustrates the process of scrolling the navigation bar 71 by swiping up. The process of scrolling the navigation bar 71 by swiping down is similar to the above, and will not be described again here.

[0176] Next, we will provide a detailed introduction to the first-level and second-level tabs in the navigation bar.

[0177] Level 1 tags

[0178] Please refer to Figure 7. The primary tag area 711 includes multiple primary tags, namely the Photo tag 7111, the Album tag 7112, the Memories tag 7113, and the Creation tag 7114. Each primary tag can be understood as an entry point for a functional cluster. Functional clustering is a data analysis tool that aims to group different functions, making functions within the same group similar to each other, while functions in different groups differ significantly. For example, the Photo tag 7111 corresponds to the aggregation of image materials in the Gallery app; the Album tag 7112 corresponds to the aggregation of various albums in the Gallery app; the Memories tag 7113 corresponds to the aggregation of various memory videos in the Gallery app; and the Creation tag 7114 corresponds to the aggregation of image editing functions provided by the Gallery app that allow users to edit image materials.

[0179] Photo tags

[0180] Photo tag 7111 corresponds to at least a portion of the image materials in the gallery application. This at least a portion of the image materials includes all or some of the image materials. When photo tag 7111 is selected, the content area can display at least the corresponding image materials from the gallery application; or, when photo tag 7111 is selected, the content area can switch to an interface that includes at least the image materials from the gallery application. For example, photo tag 7111 corresponds to image materials obtained through a specific operation in the gallery application. For instance, photo tag 7111 corresponds to image materials captured by a camera on an electronic device and image materials obtained through screenshot / screen recording operations in the gallery application. In other words, the image materials corresponding to photo tag 7111 include image materials from the camera album and the screenshot / screen recording album, which can be obtained by the electronic device aggregating image materials from the camera album and the screenshot / screen recording album.

[0181] Please refer to Figure 7. When photo tag 7111 is selected, it is highlighted, making it easier for users to focus on the currently selected content. The content area displays interface 721 under photo tag 7111. This interface is a photo grid interface, which can display thumbnails of all image materials (images and videos) corresponding to photo tag 7111. Users can click on any thumbnail to view the large image or original video of that image material.

[0182] It should be noted that when there are many photos, due to the size of the display screen, after photo tag 7111 is selected, the content area interface will only display a limited number of image materials corresponding to photo tag 71111 without other operations. The user needs to scroll up and down the content area interface to display all the content corresponding to photo tag 7111. Therefore, the description of "the content area can display at least part of the image materials of the corresponding gallery application" in this application embodiment means that after photo tag 7111 is selected, the content area is capable of displaying all the content (at least part of the corresponding image materials) corresponding to photo tag 7111, and does not mean that the current interface of the content area displays all the content corresponding to photo tag 7111. The following explanation of similar "the content area can display" is the same as here, and will not be repeated.

[0183] Level 1 album tags

[0184] Figure 9 is a schematic diagram of the interface of the gallery application under different first-level tags provided in the embodiments of this application.

[0185] In some embodiments, the primary album label 7112 corresponds to all albums in the gallery application. When the primary album label 7112 is selected, the content area can display all albums of the corresponding gallery application; or, when the primary album label 7112 is selected, the content area can switch to an interface that includes all albums of the gallery application. In this embodiment, all albums of the gallery application corresponding to the primary album label 7112 may include physical albums (such as the "Camera" album, the "Screenshot & Screen Recording" album, the "Meitu Xiu Xiu" album, etc.), or virtual albums displayed using electronic albums (such as the "All Photos" album, or various album groups under the Smart Album). A physical album is an album with a storage path stored locally on the electronic device. A virtual album is an electronic album that may include a virtual album obtained by aggregating image materials from multiple physical albums by the electronic device, and / or a virtual album obtained by classifying image materials of the gallery application according to specific category characteristics (such as portraits, locations, objects, etc.) (such as various album groups under the Smart Album). In addition, the album formed by the image materials corresponding to the aforementioned photo tag 7111 is also a virtual album. It is a virtual album obtained by aggregating the image materials from all or part of the physical albums of the photo library application. For example, it can be a virtual album obtained by aggregating the image materials from the camera album and the screenshot / screen recording album.

[0186] In some embodiments, all albums in the gallery application may include a first type of album and a second type of album. Therefore, from a user perspective, in some embodiments, all albums corresponding to the primary album label 7112 can be further divided into a first type of album and a second type of album. Accordingly, the primary album label 7112 can also be described as corresponding to the first type of album and the second type of album in the gallery application, and when the primary album label 7112 is selected, the content area can display the corresponding first type of album and the second type of album.

[0187] In one example, the first type of album is a regular album, and the second type is a smart album. Regular albums include all physical albums in the gallery application and one or more virtual albums. For example, these virtual albums might include an "All Photos" album, which aggregates image materials from all physical albums in the gallery application. In contrast to regular albums, smart albums are albums with intelligent capabilities, including multiple virtual albums. For example, these virtual albums might include a "Portraits" album, a "Locations" album, a "Things" album, and a "Media Type" album. These virtual albums are created by categorizing image materials in the gallery application based on specific category characteristics (such as portraits, locations, things, media types, etc.).

[0188] Unless otherwise specified, the embodiments of this application will be described below as follows: ordinary photo album as an example of the first type of photo album and smart photo album as an example of the second type of photo album.

[0189] Please refer to Figures 9(a) and (b). When the primary album tab 7112 is selected, it is highlighted. The content area displays the interface under the primary album tab 7112. This interface includes all albums of the gallery application, including regular albums and smart albums (virtual albums). The bottom of the interface includes options 722a for regular albums and 722b for smart albums. In Figure 9(a), when option 722a for regular albums is selected, interface 7221 is displayed. Interface 7221 is the album interface for regular albums, including all albums under regular albums, such as the "All Photos" album, the "Camera" album, the "Screenshot & Screen Recording" album, and the "Weibo" album. In Figure 9(b), when the Smart Album option 722b is selected, interface 7222 is displayed. Interface 7222 is the album interface of Smart Album, which includes various album groups under Smart Album, such as "Portrait" album, "Location" album, "Things" album, "Media Type" album, etc.

[0190] Memory Tags

[0191] The "Memory" tag 7113 corresponds to all Memory Videos in the Gallery app. These Memory Videos are generated from image materials in the Gallery app and have a specific theme. When Memory Tag 7113 is selected, the content area will display all Memory Videos; or, in other words, when Memory Tag 7113 is selected, the content area will switch to an interface that includes all Memory Videos from the Gallery app.

[0192] Please refer to Figure 9(c). When the memory tag 7113 is selected, it is highlighted. The content area displays the interface 723 under the memory tag 7113. The interface 723 includes all the memory videos in the gallery application, such as memory videos with the theme "Reunion of Old Friends".

[0193] Creative Tags

[0194] In some embodiments, the authoring tab 7114 corresponds to controls and / or options for image editing related functions. When the authoring tab 7114 is selected, the content area can display the image editing related functions and / or options; or, when the authoring tab 7114 is selected, the content area can switch to an interface that includes controls and / or options for image editing related functions.

[0195] Please refer to Figure 9(d). When the creation tag 7114 is selected, it is highlighted. The content area displays the interface 724 under the creation tag 7114. The interface 724 includes relevant functional controls for image editing (such as the "Smart Film" control, "Smart Image Retouching" control, "One-Click Blockbuster" control, "Editing" control, "Same Style" control, "Video Creation" control, "Collage" control, etc.) as well as options for image editing (such as various template options under Template Recommendation, etc.).

[0196] It should be understood that the multiple primary labels in the above examples are merely illustrative and should not be construed as limiting the embodiments of this application.

[0197] In other embodiments, all albums in the gallery application may include a first type of album and a second type of album. The first-level album label 7112 may correspond to the first type of album in the gallery application (such as a regular album). When the first-level album label 7112 is selected, the content area can display the corresponding first type of album. The creation label not only corresponds to some controls and / or options for image editing, but also corresponds to the second type of album in the gallery application (such as a smart album). When the creation label is selected, the content area can display controls and / or options for image editing, as well as the second type of album.

[0198] Figure 10 is another schematic diagram of the interface of the content area under the first-level album tab and the creation tab provided in the embodiment of this application.

[0199] Please refer to Figure 10(a). The primary album tab 7112 corresponds to the regular album (an example of the first type of album). When the primary album tab 7112 is selected, it is highlighted, and the content area displays the interface under the primary album tab 7112, which includes the regular album of the gallery application. It can be seen that, compared with the interface of the content area under the primary album tab 7112 shown in Figure 9(a), the regular album option 722a and the smart album option 722b are missing. In this case, the regular album is displayed by default.

[0200] Please refer to Figure 10(b). The Creation tab 7114 corresponds to controls and / or options for image editing functions, and also to the Smart Album (an example of the second type of album) in the gallery application. When Creation tab 7114 is selected, it is highlighted, and the content area displays the interface under Creation tab 7114. This interface includes controls for image editing functions (such as one-click blockbuster controls, editing controls, free creation controls, collage controls, etc.) as well as various album groups under Smart Album (such as "Portrait" album, "Location" album, "Things" album, "Media Type" album, etc.).

[0201] In other embodiments, from a user's perspective, the primary album label 7112 can correspond to the regular album and smart album of the gallery application, and the creation label 7114 can correspond not only to some controls and / or options for image editing functions, but also to the smart album of the gallery application, as shown in the combination of Figure (a) in Figure 9 and Figure (b) in Figure 10.

[0202] In addition, in other embodiments, the multiple primary tags may include other tags besides photo tags, primary album tags, memory tags and creation tags, or the multiple primary tags may include at least one of the above-mentioned photo tags, primary album tags, memory tags and creation tags. The specific tag type can be set according to actual needs, and this application embodiment does not limit it.

[0203] For the multiple primary labels in the example above, the multiple primary labels in the first interface form displayed by the electronic device can be mapped to the second interface form, thereby adapting to the user's usage habits and reducing the user's learning cost.

[0204] Taking a foldable electronic device as an example, when the foldable device is in its unfolded state, the full-screen gallery application interface displayed on the large screen (such as an outward-folding or inward-folding display) includes a navigation bar and a content area. This interface is the first interface form of the gallery application. However, when the foldable device is in its folded state, the gallery application interface still retains the traditional interface form, including the content area and multiple tabs at the bottom of the content area. This interface is the second interface form of the gallery application.

[0205] Figure 11 is a schematic diagram of the electronic device provided in the embodiments of this application under different interface forms.

[0206] Please refer to Figure 11. When the folded device is in the unfolded state, the gallery application interface 7a is a first interface form including the left navigation bar 71. When the device is in the folded state, the gallery application interface 7b is a second interface form including multiple tabs at the bottom. In the first interface form, the multiple primary tabs in the navigation bar 71 correspond one-to-one with the multiple tabs at the bottom of the content area in the second interface form. Continuing to refer to Figure 11, in the folded state, the bottom of the content area in the second interface form includes four tabs: Photo tab 7b1, Album tab 7b2, Memories tab 7b3, and Creation tab 7b4. In the unfolded state, the navigation bar 71 in the first interface form also includes four primary tabs corresponding to these four: Photo tab 7111, Album tab 7112, Memories tab 7113, and Creation tab 7114.

[0207] It should be understood that for the same gallery application interface, the split-screen display on a foldable device in the unfolded state and the split-screen display on a non-foldable device also present a second interface form.

[0208] Therefore, in the image display method provided in this application embodiment, when the electronic device switches between the first interface form and the second interface form, the functions of the gallery application interface displayed on the screen before and after the switch can be mapped one by one. That is, the multiple first-level tabs of the navigation bar in the first interface form are mapped one by one with the multiple tabs in the second interface form, ensuring that all these tabs are exposed and displayed. This can adapt to the user's usage habits, maintain the user's mental state between the folded state and the unfolded state as much as possible, reduce the user's learning cost, and improve the user experience.

[0209] Secondary tags

[0210] Please refer to Figure 7. Multiple secondary labels include multiple secondary album labels. Each secondary album label corresponds to an album group or a single album in the gallery application. When a secondary album label corresponds to an album group, the content area will display all the albums under that album group when the secondary album label is selected. When a secondary album label corresponds to a single album, the content area will display all the image materials under that album when the secondary album label is selected.

[0211] In embodiments where all albums in the gallery application include both first-type and second-type albums, the multiple secondary album tabs in the navigation bar may include tabs for the first-type albums and / or tabs for the second-type albums. In embodiments where the first-type album is a regular album and the second-type album is a smart album, the multiple secondary album tabs include tabs for regular albums (an example of tabs for the first-type albums) and / or tabs for smart albums (an example of tabs for the second-type albums).

[0212] In some embodiments, the multiple secondary album tags include tags for ordinary albums, and each secondary album tag in the ordinary album tags corresponds to an album group or an album in the ordinary album.

[0213] In other embodiments, the multiple secondary album tags may include not only tags for ordinary albums but also tags for smart albums. Each secondary album tag in the smart album category corresponds to an album group or an album within the smart album. Thus, for smart albums, the smart album tags in the navigation bar highlight the smart capabilities of the gallery application, increasing the usage and exposure rate of smart albums.

[0214] In some embodiments, the priority of smart albums is higher than that of regular albums. Correspondingly, in embodiments where multiple secondary album labels include labels for regular albums and labels for smart albums, the priority of smart album labels is higher than that of regular album labels. Based on this, within the navigation bar, the smart album label (an example of a label for a second type of album) is located on the first side of the regular album label (an example of a label for a first type of album), and the first side of the regular album label is closer to the start of the navigation bar. That is, the smart album label is arranged on the side of the regular album label closer to the start of the navigation bar. Alternatively, the smart album label and the regular album label are arranged sequentially within the navigation bar along a first direction (the direction extending from the start of the navigation bar to the end of the navigation bar), with the smart album label closer to the start of the navigation bar.

[0215] Please refer to Figure 7. The navigation bar 71 is distributed along the y-axis, is a vertical navigation bar located to the left of the content area, and its starting point is also its top. The first-level tab area 711 is closest to the top of the navigation bar 71, and multiple second-level tab areas are arranged below it. The second-level tab area 7121 is closest to the first-level tab area 711 and displays the "Smart Album" tab. Second-level tab areas 7122 and 7123 are arranged below the "Smart Album" tab in the second-level tab area 7121. Both second-level tab areas 7122 and 7123 display the "Regular Album" tab, with the "Smart Album" tab above the "Regular Album" tab, or in other words, the "Regular Album" tab below the "Smart Album" tab. Overall, in the navigation bar 71, the multiple first-level tabs, the "Smart Album" tab, and the "Regular Album" tab are arranged sequentially from top to bottom.

[0216] In this way, for users, among all the secondary album tags, the "Smart Album" tag has the highest browsing priority, followed by the "Regular Album" tag. Therefore, the "Smart Album" feature can be highlighted to maximize its usage and exposure, ensuring users prioritize browsing and easily operate the various secondary album tags within the higher-priority "Smart Album" tag. Furthermore, it makes it easier for users to learn how to use the Smart Album, thereby increasing its usage rate and ultimately improving the search efficiency of the photo library application.

[0217] In the above-mentioned embodiments of the ordinary album (an example of the label of the first type of album) and smart album (an example of the label of the second type of album) of the gallery application corresponding to the first-level album label, the multiple second-level album labels are all sub-album labels under the first-level album label, and each album group or album corresponding to each second-level album label can be found in the album corresponding to the first-level album label.

[0218] In the embodiments of the above-mentioned ordinary album (an example of the first type of album label) corresponding to the image library application of the first-level album label and the smart album (an example of the second type of album label) corresponding to the image library application of the creation label, each album group or album corresponding to each second-level album label in the ordinary album label can be found in the album corresponding to the first-level album label, and each album group or album corresponding to each second-level album label in the smart album label can be found in the smart album corresponding to the creation label.

[0219] Please continue referring to Figure 7. For example, multiple secondary album tags can include tags for smart albums and tags for regular albums. Secondary tag area 7121 displays tags for smart albums, such as four secondary album tags named "Smart Album": Portrait tag 7121a, Location tag 7121b, Object tag 7121c, and Media Type tag 7121d. Secondary tag areas 7122 and 7123 display tags for regular albums. For example, secondary tag area 7122 displays three secondary album tags named "Album": All Photos tag 7122a, Camera tag 7122b, and Screenshot / Screen Recording tag 7122c; secondary tag area 7123 displays three secondary album tags named "More": Weibo tag 7123a, Meitu Xiu Xiu tag 7123b, and Other Album tags 7123c. In addition, tags for regular albums also include a recently deleted tag 714, etc.

[0220] It should be understood that the multiple secondary album labels shown in Figure 7 are merely illustrative and do not constitute a limitation on the secondary album labels in the embodiments of this application. For example, as the number of image materials in the electronic device increases, the system will recreate or the user will recreate new albums. Based on these newly added albums, the secondary album labels in the navigation bar 71 will also increase with the increase in album type and quantity.

[0221] Taking the primary album tag corresponding to the ordinary album and smart album of the photo library application, and multiple secondary album tags being sub-album tags under the primary album tag as an example, the relationship between the primary album tag and the secondary album tag will be further introduced with reference to Figure 9.

[0222] Please refer to Figures 9(a) and 9(b). The content area displays the interface corresponding to the first-level album tab 7112. This interface can display all albums in the gallery application, including all albums under the regular album and all albums under the smart album. Taking the regular album as an example, please refer to Figure 9(a). The regular album interface 7221 includes the "All Photos" album, the "Album" album, the "Screenshot / Screen Recording" album, the "Weibo" album, the "Meitu Xiu Xiu" album, and other albums that need to be swiped up to show. The left navigation bar 71 includes all photo tabs, camera tabs, screen capture / screen recording tabs under "Albums", as well as the Weibo tab, Meitu Xiu Xiu tab, and other album tabs under "More" that need to be swiped up. Each second-level album tab in the regular album tabs corresponds to an album group or an album, which can be found in the album interface shown in Figure 9(a). Taking the Smart Album as an example, please continue to refer to Figure 9(b). The Smart Album's album interface 7222 includes four album groups: "Portrait" album, "Location" album, "Things" album, and "Media Type" album. The left navigation bar 71 includes Smart Album tags such as Portrait tag 7121a, Location tag 7121b, Things tag 7121c, and Media Type tag 7121d. Each second-level album tag of the Smart Album can be found in the album interface shown in Figure 9(b).

[0223] Figure 12 is a schematic diagram illustrating the process of entering the interface under the first-level album tab and the second-level album tab, respectively, according to an embodiment of this application. As an example, the process is explained using the example of a user wanting to view the "All Photos" album.

[0224] Please refer to Figure 12(a). The primary album label 7112 is selected and highlighted. The content area displays the interface corresponding to the primary album label 7112. When the normal album option 722a is selected on this interface, interface 7221 is displayed. Interface 7221 is the normal album interface, which can display all albums under the normal album. When the user clicks the "All Photos" album, in response to the user's operation, the interface shown in Figure 12(b) is displayed. The content area displays interface 731, which is the interface of the "All Photos" album, including all images under the "All Photos" album.

[0225] Please refer to Figure 12(c). Under the "Album" section of the navigation bar 71, there are three secondary album tabs: All Photos 7122a, Camera, and Screenshot / Screen Recording. When the user selects the All Photos 7122a tab, in response to the user's operation, the content area displays the interface 732 under the All Photos 7122a tab. Interface 732 is the interface of the "All Photos" album, which includes various image materials under the "All Photos" album.

[0226] Comparing Figure 12(c) with Figures 12(a) and (b), it can be seen that, compared to the process of finding albums through primary album tags, the content area can directly display the corresponding content (such as all image materials under an album) after a secondary album tag (such as the "All Photos" tag) is selected. Users only need to select the content area of ​​the secondary album tag in the navigation bar to directly display the corresponding content. In this way, users can quickly locate the image materials under the associated album through the secondary album tag. The operation steps are fewer and more convenient, improving the efficiency of human-computer interaction.

[0227] Figure 13 is another schematic diagram illustrating the process of entering the interface under the first-level album tab and the second-level album tab, respectively, according to an embodiment of this application. As an example, the process is explained by taking the example of a user wanting to view the "Portrait" album under the Smart Album.

[0228] Please refer to Figure 13(a). The primary album tab 7112 is selected and highlighted. The content area displays the interface under the primary album tab 7112. When the ordinary album option 722a is selected on this interface, interface 7221 is displayed. Interface 7221 is the ordinary album interface, which can display all albums under the ordinary album. When the user clicks the smart album option 722b, in response to the user's operation, the interface shown in Figure 13(b) is displayed. The content area displays interface 7222. This interface 7222 is the interface of "Smart Album". It can be used to access the various album groups of "Smart Album", such as the four album groups of "Portrait", "Location", "Things", and "Media Type". Each album group includes multiple albums. For example, the "Portrait" album includes albums of portraits such as "Pingping", "An'an", and "Lingling". Additionally, if there are many albums under each album group, interface 7222 may not be able to display them all. Therefore, interface 7222 can only display a portion of the albums under each album group and the corresponding "more" options. The "more" options are used to trigger the content area to display all albums under each corresponding album group. For example, if a user clicks the "more" option corresponding to the "Portrait" album, in response to the user's operation, the interface shown in Figure 13(c) is displayed. The content area displays interface 7223, which is the interface for the "Portrait" album and includes albums of multiple portraits under the "Portrait" album.

[0229] Please refer to Figure 13(d). The primary album tab 7112 is selected and highlighted. The content area displays the interface under primary album tab 7112. When the "Normal Album" option 722a is selected on this interface, interface 7221 is displayed. Interface 7221 is the normal album interface, displaying all albums under the normal album. Furthermore, the smart album tabs in the navigation bar 71 include four secondary album tabs: portrait tab 7121a, location tab, object tab, and media type tab. If a user wants to view the "Portrait" album in the smart album, they can click the portrait tab 7121a. Responding to the user's action, the interface shown in Figure 13(e) is displayed. The content area displays interface 741, which is the interface for the "Portrait" album, including albums with multiple portraits under the "Portrait" album.

[0230] Comparing Figures (d) and (e) in Figure 13 with Figures (a) to (c) in Figure 13, it can be seen that, compared to the process of finding the "Portrait" album through the primary album label, the content area can directly display the corresponding content (such as the albums in the "Portrait" album) after the secondary album label (such as the "Portrait" label) of the smart album is selected. Users only need to select the secondary album label in the navigation bar, and the content area can directly display the corresponding content. In this way, users can quickly locate a related album group through the secondary album label. The operation steps are fewer and more convenient and simple, improving the efficiency of human-computer interaction.

[0231] In summary, this embodiment of the application, by setting a primary album label and multiple secondary album labels in the navigation bar, can organize and display albums at different levels, achieving a flat management of album hierarchy. More importantly, compared to the process of searching for albums through primary album labels, when a secondary album label (such as the "All Photos" label or the "Portrait" label) is selected, the content area can directly display the corresponding content (each image material in an album or each album in an album group). Users only need to select the secondary album label in the navigation bar, and the content area will directly display the corresponding content. Thus, secondary album labels facilitate users to quickly find and manage the required content, with fewer operation steps and greater convenience, improving human-computer interaction efficiency and user experience.

[0232] The following examples will further illustrate the various sub-album tags of the Smart Album and the various sub-album tags of the Regular Album.

[0233] For the Smart Album tag, each second-level album tag corresponds to an album group, which includes one or more albums. Each album group corresponding to a second-level album tag is a virtual album obtained by classifying the image materials of the gallery application according to specific category characteristics. For example, specific category characteristics may include features such as portraits, locations, objects, or media types.

[0234] Please continue referring to Figure 7. For example, the secondary album tags in the Smart Album include a portrait tag 7121a, a location tag 7121b, an object tag 7121c, and a media type tag 7121d. Please continue referring to Figure 9(b). The portrait tag 7121a corresponds to the "Portrait" album in the Smart Album, which includes albums of different portraits obtained by classifying image materials from the image library application according to different personal characteristics, such as albums of "Pingping," "An'an," and "Lingling," etc. Each portrait album includes image materials of the corresponding portrait. The location tag 7121b corresponds to the "Location" album in the Smart Album, which includes albums of different locations obtained by classifying image materials from the image library application according to location characteristics, such as albums of Shanghai, Xi'an, and Beijing, etc. Each location album includes image materials taken at the corresponding location. The "Things" tag 7121c corresponds to the "Things" album in Smart Album. This includes albums categorized by image materials from the gallery application based on the characteristics of the things, such as food, scenery, flowers, architecture, and night scenes. Each album contains image materials of the things that possess the corresponding characteristics. The "Media Type" tag 7121d corresponds to the "Media Type" album in Smart Album. This includes albums categorized by image materials from the gallery application based on media type characteristics, such as live photos, large aperture, documents, and burst shots. Each album contains image materials of the corresponding media type.

[0235] In the above embodiments, the previously deeply hierarchical album groups under the Smart Album are displayed in the navigation bar through secondary album tags within the Smart Album's tabs. This highlights the smart capabilities of the gallery application and improves the usage and exposure rate of the Smart Album. Furthermore, each secondary album tag within the Smart Album's tabs corresponds to an album group that includes a large number of albums. Multiple albums of the same type are grouped into one album group (e.g., the "Portrait" album), and this album group is displayed through a single secondary album tag. This effectively reduces the length of the navigation bar list and improves search efficiency when there are many albums. In addition, from a development perspective, the secondary album tags corresponding to an album group effectively reduce the number of secondary album tags corresponding to a single album. This reduces the performance impact caused by reading information such as name, number of images, and cover images from album tags, improving development performance and thus effectively enhancing the overall user experience.

[0236] For the tags in a regular album, please continue to refer to Figure 7. For example, the tags in a regular album include: all photos under "Album" 7122a, camera 7122b, screenshot / screen recording 7122c, Weibo 7123a, Meitu XiuXiu 7123b, other albums 7123c, and recently deleted 714. Among these, the other albums 7123c corresponds to an album group in the gallery application; when selected, the content area displays all albums within that album group. The other secondary album tags in the regular album category, excluding the other albums 7123c, correspond to an album in the gallery application; when selected, the content area displays all image materials within that album.

[0237] For the remaining secondary album tags, for example, the "All Photos" tag 7122a corresponds to the "All Photos" album in the Gallery app; the "Camera" tag 7122b corresponds to the "Camera" album in the Gallery app, which contains images captured by the camera; the "Screenshot & Screen Recording" tag 7122c corresponds to the "Screenshot & Screen Recording" album in the Gallery app, which contains images captured by screenshots and / or screen recordings; and the tags for third-party applications, such as the "Weibo" tag 7123a and the "Meitu" tag 7123b, correspond to third-party application albums containing images downloaded through the corresponding application and / or cached during the application's operation. Specifically, the "Weibo" tag 7123a corresponds to the "Weibo" album, and the "Meitu" tag 7123b corresponds to the "Meitu" album. The "Recently Deleted" tag 714 corresponds to the "Recently Deleted" album in the Gallery app, which contains images deleted by the user within a specified period (e.g., the last month).

[0238] For the "Other Albums" tab 7123c, the corresponding album group can be a regular album group, such as one named "Other Albums." When the "Other Albums" tab 7123c is selected, the content area can display the albums within that "Other Albums" group. In practice, when there are many albums in a gallery application, displaying all albums in the content area would not only impact performance (e.g., slow response time) but also cause the long navigation bar list to affect user search efficiency. Therefore, electronic devices can group some albums into an album group (e.g., an album group named "Other Albums") and not display them directly. The albums within the group are only displayed when the user clicks on it. In some embodiments, the album group corresponding to the "Other Albums" tab 7123c can be a group of albums with low usage rates, which users rarely actively view. Therefore, hiding this group of albums reduces the navigation bar list length and improves performance with minimal impact on user experience. For example, from a business scenario perspective, the album groups corresponding to other album tags 7123c may include various third-party application albums (such as "Alipay" album, "Honor Browser" album, etc.) formed by image materials downloaded or cached by third-party applications, and the usage rate of these third-party application albums is low.

[0239] Figure 14 is a schematic diagram of the interface of the content area corresponding to other album tags provided in the embodiments of this application. Among them, Figure 14(a) is a schematic diagram of the interface of the gallery application including the navigation area and the content area, and Figure 14(b) is a schematic diagram of the navigation bar of the complete page in Figure (a).

[0240] Referring to Figure 14, the "Other Albums" tab 7123c is selected and highlighted. The content area displays the "Other Albums" interface 751, which includes various albums under "Other Albums," such as the "Honor Browser" album, the "Alipay" album, the "Toutiao" album, the "Album 1" album, the "Album 2" album, and the "Album 3" album. If the user wants to view the "Alipay" album, they can click on the "Alipay" album in interface 751, and the content area will display various image materials under the "Alipay" album (not shown in the figure).

[0241] As can be seen, this embodiment of the application organizes a portion of albums (such as those with low usage rates) into an album group, for example, named "Other Albums," and displays the album group through a secondary album tag, such as "Other Albums." In this way, when there are many albums, the length of the navigation bar list can be effectively reduced and the search efficiency can be improved with minimal impact on the user experience. Moreover, from a development perspective, the secondary album tag corresponding to an album group is equivalent to reducing the number of secondary album tags corresponding to a single album. This can reduce the performance impact caused by reading information such as name, number of images, and cover from album tags, such as latency, and improve development performance. Thus, the overall user experience is also effectively improved.

[0242] As described above, in some embodiments, the tags of a regular album in this application embodiment may include two parts. One part consists of secondary album tags (denoted as the first part of the album tags), where each secondary album tag corresponds to one album. When each secondary album tag in the first part of the album tags is selected, the content area can display the various image materials in the corresponding album. The other part consists of secondary album tags (denoted as the second part of the album tags), where each secondary album tag corresponds to one album group. When each secondary album tag in the second part of the album tags is selected, the content area can display the various albums in the corresponding album group. That is, for the second part of the album tags, the navigation bar does not include (or does not display) the album tags of the various albums in the album group corresponding to each secondary album tag in the second part of the album tags.

[0243] In other words, each second-level album tag in the second part of the album tags corresponds to an album group that includes one or more albums. This album group can be regarded as the upper level album of each album below it. Conversely, each album can be regarded as the lower level album of its respective album group. Thus, each second-level album tag in the first part of the album tags corresponds to one album and has no lower level albums. Each second-level album tag in the second part of the album tags corresponds to an album group that has lower level albums. The album tag of the lower level album is not displayed in the navigation bar.

[0244] Referring to the above embodiments, and exemplarily further to Figure 14, the second part of the album labels in a regular album includes the "Other Albums" label 7123c. The "Other Albums" label 7123c corresponds to the "Other Albums" album group. When the "Other Albums" label 7123c is selected, the content area displays the interface of the "Other Albums" album group. This interface includes all the albums within "Other Albums." The navigation bar does not display the album labels for each individual album; only the "Other Albums" label 7123c is displayed. The first part of the album labels refers to the album labels in a regular album excluding the second part, such as the "All Photos" label, "Camera" label, "Screenshot / Screen Recording" label, "Weibo" label, "Meitu Xiu Xiu" label, etc.

[0245] In this embodiment, the tags of a regular album include a first part of album tags and a second part of album tags. Each second-level album tag in the first part of album tags corresponds to an album in the gallery application, and each second-level album tag in the second part of album tags corresponds to an album group in the gallery application. Thus, for each second-level album tag in the second part of album tags, it is equivalent to including all albums in the album group corresponding to each second-level album tag into that album group. The album group is displayed through a second-level album tag to find the individual albums in the album group, without displaying the album tags of the individual albums in the album group. In this way, when there are many albums, the list length of the navigation bar can be effectively reduced, and the search efficiency can be improved. Moreover, from a development perspective, since the second part of album tags reduces the number of album tags for each album in the album group corresponding to each second-level album tag, it can reduce the performance impact such as latency caused by reading information such as name, number of images, and cover of the album tags, improve development performance, and thus effectively improve the user experience overall.

[0246] Of course, in other embodiments, each secondary album label in the tabs of the ordinary album corresponds to an album. When selected, the content area displays the album in the corresponding album. That is, in this embodiment, it is not necessary to hide some album labels and not display them. Instead, the secondary album labels of all albums in the ordinary album are displayed in the navigation bar.

[0247] In the embodiments described above where the tags of a typical album include a first part album tag and a second part album tag, in some embodiments, the album corresponding to the second part album tag has a lower priority than at least some albums within the album corresponding to the first part album tag. It should be understood that the album corresponding to the second part album tag here refers to all albums corresponding to the second part album tag, which is the sum of albums corresponding to each second-level album tag within the second part album tag. Similarly, the album corresponding to the first part album tag refers to all albums corresponding to the first part album tag, which is the sum of albums corresponding to each second-level album tag within the first part album tag. The albums in the albums corresponding to the first part album tag refer to either some albums or all albums. When the albums in the first part album tag are some albums, they do not include the recently deleted albums in the albums corresponding to the first part album tag. In other words, the albums in the albums corresponding to the first part album tag are all albums except for the recently deleted albums. Thus, it can be understood that even if the albums in the first part album tag refer to some albums, they are still most of the albums in the albums corresponding to the first part album tag.

[0248] In this embodiment, since the albums corresponding to the second set of album tags have a lower priority than at least some (all or most) of the albums corresponding to the first set of album tags, for each album group corresponding to a second-level album tag in the second set of album tags, it's equivalent to hiding the album tags of each album in the lower-priority album group and not displaying them. Instead, only a single second-level album tag is used to view the album group. For users, the frequency of viewing lower-priority album groups is low, or in other words, the usage rate of lower-priority album groups is low. Therefore, hiding the album tags of these lower-priority albums based on user habits can effectively reduce the length of the navigation bar list and improve development performance with minimal impact on user experience. Overall, this improves the user experience.

[0249] In embodiments where the albums corresponding to the second set of album tags have a lower priority than at least some albums in the albums corresponding to the first set of album tags, in some embodiments, at least some album tags of the first set of album tags are arranged on a first side of the second set of album tags, with the first side of the second set of album tags close to the beginning of the navigation bar. Wherein, when at least some album tags are partial album tags, these partial album tags do not include the recently deleted tag of the first set of album tags; in other words, these partial album tags are the tags in the first set of album tags excluding the recently deleted tag. Thus, it can be understood that even if at least some album tags represent partial album tags, they still represent most of the album tags in the first set of album tags.

[0250] In other words, at least some (all or most) of the album tabs in the first section are arranged on one side of the second section of album tabs, closer to the beginning of the navigation bar. Alternatively, at least some (all or most) of the album tabs in the first section and the second section of album tabs are arranged sequentially within the navigation bar along a first direction (the direction extending from the beginning of the navigation bar to the end of the navigation bar), with the first section of album tabs closer to the beginning of the navigation bar.

[0251] Please continue to refer to Figure 14. The second part of the album tabs includes other album tabs 7123c. All the tabs in the first part of the album tabs, except for the recently deleted tab 714, are arranged above the other album tabs 7123c (i.e., an example of the first side of the second part of the album tabs). All the tabs in the first part of the album tabs, except for the recently deleted tab 714, are closer to the beginning of the navigation bar 71.

[0252] In this embodiment, at least some album tabs (all album tabs or most album tabs) of the first part of the album tabs are arranged on one side of the second part of the album tabs near the beginning of the navigation bar. For the user, the browsing level of at least some album tabs (all album tabs or most album tabs) of the first part of the album tabs is higher than that of the second part of the album tabs. Therefore, the sorting of the browsing level of at least some album tabs (all album tabs or most album tabs) of the first part of the album tabs being higher than that of the second part of the album tabs follows the priority sorting of albums. This can ensure that the user can browse the first part of the album tabs corresponding to albums with higher priority more conveniently, so as to find the content corresponding to each second-level album tab in the first part of the album tabs more quickly.

[0253] In some embodiments, in response to operations on the editing controls of the navigation bar, an editable navigation bar is displayed. In this way, the labels of the ordinary albums are displayed (or shown) in the navigation bar in an editable state. The labels of the ordinary albums in the editable state have functions such as sorting, renaming, and deleting, so that users can quickly edit the secondary album labels of the ordinary albums in the editable navigation bar, thereby realizing rapid editing of the albums.

[0254] Specifically, the editable navigation bar now displays a third section of album tabs. In other words, the editable navigation bar includes both the first and third sections of album tabs. The third section includes the album tabs for each album within a group corresponding to each second-level album tab in the second section. In other words, the album tabs for each album within a group corresponding to each second-level album tab (such as other album tabs) in the second section (the third section of album tabs) are added and displayed in the navigation bar in editable mode.

[0255] For ease of description, and for contrast, the non-editing state will be referred to as the normal state below.

[0256] Comparing the normal (non-editable) and editable navigation bars, in the normal navigation bar, to reduce the list length and improve development performance, the navigation bar does not display the album tags of each album in an album group corresponding to each second-level album tag (such as other album tags) in the second part of the album tags. Only the second-level album tag corresponding to the album group is displayed. The corresponding album group can be quickly located through the second-level album tag to find the albums in the album group. In the edit-mode navigation bar, the album tags of each album in an album group corresponding to each second-level album tag (such as other album tags) in the second part of the album tags are added and displayed in the navigation bar in edit mode, forming the third part of the album tags in edit mode. Since the third part of the album tags, which is not normally displayed, is added to the tags of ordinary albums, users can not only edit the first part of the album tags that were originally in the tags of ordinary albums (such as sorting, renaming, deleting, etc.), but also edit the third part of the album tags that are not normally displayed. This allows for quick editing of the second-level album tags of ordinary albums in the edit-mode navigation bar, thereby realizing quick editing of albums. Compared with the operation of searching and editing albums in the album interface, it is more convenient and provides a better user experience. Thus, the navigation bar of this embodiment can dynamically display the second part of the album tags in both normal and edit modes, providing flexible handling between quick album search and quick album editing, considering the actual needs of users from different perspectives, and greatly improving the user experience.

[0257] In the above embodiment where the navigation bar in edit mode displays a third set of album tabs, combined with the embodiment where the smart album tab (an example of a second type of album tab) is located on the first side (the side closest to the start of the navigation bar) of the normal album (an example of a first type of album tab), in the normal navigation bar, the smart album tab includes at least one expanded secondary album tab. In some embodiments, in the navigation bar in edit mode, at least one secondary album tab of the smart album tab is collapsed.

[0258] In this embodiment, since the smart album is a virtual album generated by electronic devices through functional clustering based on specific category characteristics, the user's editing of the smart album's tags will affect the display of the smart album's intelligent capabilities. Therefore, automatically collapsing the smart album's tags in the navigation bar does not affect the editing of the tags for ordinary albums. Furthermore, the list length occupied by the smart album's tags can be compensated for by the third part of the album tags for ordinary albums. While allowing the third part of the album tags to be displayed, the list length of the navigation bar is minimized to facilitate user searching and editing.

[0259] In the above embodiment where the navigation bar in edit mode displays the third part of the album tabs, in some embodiments, the navigation bar in edit mode does not display the second part of the album tabs that are normally displayed. That is, the second part of the album tabs disappears (such as other album tabs). Furthermore, for each album group corresponding to each second-level album tab in the second part of the album tabs, the album tabs of each album in an album group ("Other Albums" album group) are displayed in the navigation bar in the form of a tab group (such as "Other Albums" tab group). The tab group includes the tab group name (such as "Other Albums") and the album tabs of each album. The tab group name is the tab name of the second-level album tab of the corresponding second part of the album tab (such as "Other Albums").

[0260] To illustrate this more clearly, let's continue with the example of a regular album in the edit-mode navigation bar containing M secondary album tags. In contrast, let's take the example of a regular album in the normal navigation bar containing N secondary album tags, where N is less than or equal to M. The N secondary album tags in the normal navigation bar and the M secondary album tags in the edit-mode navigation bar can be completely identical (N = M) or partially identical (N ≠ M).

[0261] When N is less than M, the N secondary album labels in the normal navigation bar include a first part album label and a second part album label. The first part album label includes N² secondary album labels, and the second part album label includes N³ secondary album labels. The M secondary album labels in the edit-mode navigation bar include a first part album label (N² secondary album labels) and a third part album label. The third part album label includes N³ label groups. The N³ label groups in the edit-mode navigation bar correspond one-to-one with the N³ secondary album labels in the normal navigation bar. One label group corresponds to one secondary album label. That is to say, the album labels of each album in the album group corresponding to each of the N³ secondary album labels in the normal navigation bar are displayed in the edit-mode navigation bar as a label group. This label group includes each secondary album label in the corresponding album group. For example, when N3 = 2, the second part of the album tabs in the normal navigation bar includes two secondary album tabs, denoted as Secondary Album Tab 1 and Secondary Album Tab 2, corresponding to Album Group 1 and Album Group 2 respectively. In the edit mode navigation bar, Secondary Album Tab 1 and Secondary Album Tab 2 disappear, and the labels of the normal albums in the edit mode navigation bar are increased by two tab groups, Tab Group 1 and Tab Group 2. Tab Group 1 corresponds to Secondary Album Tab 1 and includes the album tabs of each album in Album Group 1 corresponding to Secondary Album Tab 1. Tab Group 2 corresponds to Secondary Album Tab 2 and includes the album tabs of each album in Album Group 2 corresponding to Secondary Album Tab 2.

[0262] Since each second-level album tag in the third part of the edit mode corresponds to an album, displaying them in the navigation bar facilitates editing of each second-level album tag and the corresponding album. Therefore, the second part of the album tags is not displayed in the navigation bar during edit mode. This ensures that all second-level album tags displayed in the navigation bar correspond to a single album, allowing users to edit each second-level album tag and the corresponding album. Furthermore, for each album group corresponding to a second-level album tag in the second part of the album tags, the album tags of each album in an album group ("Other Albums" album group) are displayed in the navigation bar as a tag group (such as "Other Albums" tag group). This maintains consistency in the navigation bar display between normal and edit modes as much as possible, allowing users to quickly understand the relationship between the second-level album tags in a tag group during edit mode and the second-level album tags during normal mode, resulting in a better user experience.

[0263] Figure 15 is another schematic diagram of the interface of the gallery application provided in the embodiments of this application. In Figure 15(a), the interface includes a content area and a navigation bar in an editing state. Figure 15(b) is a schematic diagram of the navigation bar of the complete page in Figure (a).

[0264] Please continue referring to Figure 14. In the normal navigation bar 71, the second part of the album tabs includes the "Other Albums" tab 7123c in the navigation bar 71. The "Other Albums" tab 7123c is selected and highlighted, and the content area displays the interface 751 with "Other Albums". The various second-level album tabs in the Smart Albums tab in the second-level tab area 7121 are expanded. The navigation bar 71 also includes an editing control 716. When the user clicks the editing control 716, the interface shown in Figure 15 is displayed in response to the operation on the editing control 716.

[0265] Please refer to Figure 15. In this interface, the navigation bar 71 is in edit mode, and the content area remains unchanged. For the navigation bar 71 in edit mode, the various secondary album tags in the Smart Album tab in the secondary tab area 7121 are automatically collapsed. The tags of the regular albums are displayed in the navigation bar in edit mode. The tags of the regular albums include not only the various secondary album tags in the secondary tab areas 7122 and 7123 that are normally present (an example of the album tags in the first part), but also the album tags of the various albums in "Other Albums" that are not normally displayed (an example of the album tags in the third part), that is, the various secondary album tags in the secondary tab area 7124, such as the Honor Browser album tag, Alipay album tag, Toutiao album tag, album 1 album tag, album 2 album tag, and album 3 album tag. Furthermore, other album tabs (an example of album tabs in the second part) are not displayed in the navigation bar 71 in the edit state. In other words, other album tabs disappear. The album tabs of each album in "Other Albums" are displayed in the navigation bar 71 in the form of a tab group "Other Albums" 7171. The tab group "Other Albums" 7171 includes each second-level album tab in the edit state and is configured with a corresponding collapse control 7172 to collapse each second-level album tab in the tab group "Other Albums" 7171.

[0266] As can be seen, the navigation bar in edit mode displays the album tags for each album under "Other Albums," allowing users to edit albums by editing these tags. However, in the normal navigation bar, to reduce list length and improve development performance, the album tags for each album under "Other Albums" are not displayed; only the "Other Albums" tag 7123c is shown, allowing users to quickly navigate to "Other Albums" using this tag.

[0267] In this embodiment, a portion of the secondary album tabs in the navigation bar during edit mode can support at least one of sorting, renaming, and deletion functions. Referring to Figure 15, in one example, taking the Weibo tab in the navigation bar during edit mode as an example, the Weibo tab supports sorting, renaming, and deletion functions. The interface displays a sorting control 7181a for the Weibo tabs, a tab name 7182a that supports renaming, and a deletion control 7183a. For the sorting function, exemplarily, in response to a user's long-press operation on the sorting control 7181a, it is shown that the Weibo tab is selected. The user can move the selected Weibo tab up or down to a new position to adjust the sorting of the Weibo tabs. For the tab name 7182a that supports renaming, the user can rename the tab name 7182a after clicking on it. For the deletion control 7183a, the user can delete the Weibo tab after clicking on it, and correspondingly, the Weibo album in the content area is also deleted. For example, taking the "All Photo Tags" tag as an example, the "All Photo Tags" tag only supports sorting. In the implementation, the interface will display the sorting control 7181b for all photo tags.

[0268] In this embodiment of the application, in order to facilitate the management of multiple secondary album tags, the multiple secondary album tags can be grouped and displayed in the navigation bar in the form of tag groups.

[0269] For the tags of Smart Album, the tags of Smart Album can be treated as a tag group.

[0270] For tags in a regular album, tags can include multiple tag groups, with one tag group corresponding to one or more albums within a regular album. Multiple tag groups can be determined based on at least one of the following album information: album type and usage frequency. Album type can include smart albums and regular albums, or albums created by the system (system-created albums), user-created albums, and albums created by third-party applications, etc., all based on different objects. Usage frequency can be understood as the number of times a user views the album.

[0271] In some embodiments, albums whose usage frequency meets preset condition 1 in the system album, user-created albums, and third-party application albums are grouped together as album group 1. For example, the "All Photos," "Camera," and "Screenshot / Screen Recording" albums in Figure 9(a) form album group 1, which has the highest priority. Albums whose usage frequency meets preset condition 2 in the user-created albums and third-party application albums are grouped together as album group 2. For example, the "Weibo" and "Meitu Xiu Xiu" albums in Figure 9(a) form album group 2, which is titled "More Albums" and has the next highest priority. Albums in the regular albums other than the above two album groups can be grouped together as album group 3. For example, the album group titled "Other Albums" in Figure 9(a) has the lowest priority, which is lower than that of album group 2. Preset conditions 1 and 2 can be preset. For example, preset condition 1 can be an album whose usage frequency is greater than or equal to frequency threshold 1, or an album whose usage frequency is ranked in the top P1. Preset condition 2 can be an album whose usage frequency is greater than or equal to frequency threshold 2 and less than frequency threshold 1, or an album whose usage frequency is ranked in the top P2 excluding the top P1. Here, frequency threshold 1 is greater than frequency threshold 2, P1 and P2 are both positive integers, and P2 is greater than P1.

[0272] Based on the three groups of the regular albums described above, please continue to refer to Figure 7 or Figure 14. In the normal navigation bar, the labels for regular albums can include label group 1 (such as the "Albums" label group located in the secondary label area 7122) and label group 2 (such as the "More" label group located in the secondary label area 7123). Since the album labels of each album in album group 3 (such as "Other Albums") are normally collapsed and not displayed in the navigation bar, album group 3 (such as "Other Albums") is displayed in the navigation bar through a secondary album label (such as the Other Albums label 7123c), and this secondary album label is categorized within label group 2. Users can find the corresponding album group through a secondary album label (such as the Other Albums label 7123c).

[0273] Please continue to refer to Figure 15. In the navigation bar of the edit mode, since the album tabs of each album in album group 3 (such as "Other Albums") are expanded, the tabs of ordinary albums can include tab group 1 (such as the "Album" tab group located in the secondary tab area 7122), tab group 2 (such as the "More" tab group located in the secondary tab area 7123), and tab group 3 (such as the "Other Albums" tab group located in the secondary tab area 7124).

[0274] In addition, for the recently deleted album and its corresponding recently deleted tag 714 that exist in the ordinary album, for example, the recently deleted album has the lowest priority and the corresponding recently deleted tag 714 also has the lowest priority. The recently deleted album can be treated as a separate album group and the recently deleted tag can be treated as a separate tag group.

[0275] In the embodiment where the navigation bar includes multiple tab groups, to facilitate the management of each tab group, a corresponding management control can be configured for each tab group. This management control has two states: expanded and collapsed. The management control in the expanded state is called the expanded control, and the management control in the collapsed state is called the collapsed control. The expanded and collapsed controls are used to expand or collapse the secondary album tabs within the tab group, respectively. For example, if the secondary album tabs of a certain tab group are expanded (or displayed), that tab group has a corresponding collapsed control. If the user wants to collapse the tab group, they can click the collapsed control. In response to the user's click, the secondary album tabs of that tab group in the navigation bar will collapse (or be hidden). Alternatively, if the navigation bar changes from a normal state to an edit state, the secondary album tabs of certain tab groups (such as the smart album tabs) will be automatically collapsed by the electronic device. Conversely, when the secondary album tabs of a certain tab group are collapsed, there is an expansion control for that tab group. If the user wants to view the secondary album tabs under that tab group, they can click the expansion control. In response to the user's click, the secondary album tabs under that tab group will expand in the navigation bar. Alternatively, if the navigation bar changes from edit mode to normal mode, the secondary album tabs of certain tab groups (such as the tabs of the smart album) will be automatically expanded again.

[0276] Please refer to Figure 14. The multiple secondary album tabs include three tab groups: the "Smart Album" tab in secondary tab area 7121 (one tab group), the "Album" tab group in secondary tab area 7122, and the "More" tab group in secondary tab area 7123. When the secondary album tabs under the "Smart Album" tab in secondary tab area 7121 are expanded, secondary tab area 7121 also includes a collapse control 7151 corresponding to the "Smart Album" tab. Clicking the collapse control 7151 will cause all secondary album tabs under the "Smart Album" tab to collapse. Similarly, when the secondary album tabs under the "Album" tab group in secondary tab area 7122 are expanded, secondary tab area 7122 also includes a collapse control 7152 corresponding to the "Album" tab group. Clicking the collapse control 7151 will cause all secondary album tabs under the "Album" tab group to collapse. When the various secondary album tabs under the "More" tab group in the secondary tab area 7123 have been expanded, the secondary tab area 7123 also includes a collapse control 7153 corresponding to the "More" tab group. Clicking the collapse control 7153 can trigger the collapse of the various album tabs under the "More" tab group.

[0277] Taking the Smart Album tabs as an example, please refer to Figure 15. In edit mode, the various secondary album tabs under the Smart Album tab in the navigation bar 71 are collapsed. After the tabs are collapsed, the management control corresponding to the Smart Album tabs changes from the collapse control 7151 in Figure 14 to the expand control 7161 shown in Figure 15. The expand control 7161 is used to re-expand the various secondary album tabs in the collapsed Smart Album tabs. It should be understood that, under the normal conditions shown in Figure 14, users can also manually click the collapse control 7151 of the Smart Album tabs as needed to collapse the Smart Album tabs, and the collapse control 7151 will change to the expand control 7151 shown in Figure 15.

[0278] Comparing Figures 14 and 15, it can be seen that after the various secondary album tabs in the Smart Album tab are collapsed, the Smart Album tab is hidden, while the album tabs located below the Smart Album tab move up simultaneously, which can display content not currently displayed on the interface (such as album tabs under other albums), allowing the navigation bar to display more other content.

[0279] It should be understood that the above-described display styles of the collapse and expand controls are merely illustrative. The collapse and expand controls can also have other display styles, and this application embodiment does not limit them.

[0280] In this embodiment, by providing users with collapse and expand controls, users can easily collapse and expand the secondary album tabs they need as needed, improving search efficiency. For example, by providing users with a collapse control, they can easily collapse some less frequently used secondary album tabs, avoiding their interference. At the same time, more space can be freed up in the navigation bar to display other secondary album tabs that users are more interested in, allowing users to prioritize browsing and more easily operate the secondary album tabs they are more interested in, thus finding the content they need more quickly.

[0281] In the gallery application interface, the navigation bar and the content area are linked. For the tags of the regular albums in the navigation bar and the regular albums in the content area, the order of each second-level album tag in the regular album tags (an example of the tags of the first type of album) is consistent with the order of the albums corresponding to each second-level album tag in the regular album (an example of the tags of the first type of album).

[0282] Please refer back to Figure 9(a). Following the top-to-bottom arrangement, the albums in the regular album are: "All Photos," "Camera," "Screenshots / Screen Recordings," "Weibo," "Meitu Xiu Xiu," "Other Albums," and "Recently Deleted." Correspondingly, in the navigation bar, following the top-to-bottom arrangement, the sub-album tags within the regular album's tabs are: All Photos, Camera, Screenshots / Screen Recordings, Weibo, Meitu Xiu Xiu, Other Albums, and Recently Deleted. It can be seen that the sub-album tags corresponding to the albums listed earlier are also listed earlier, and vice versa, with consistent order. For example, the "All Photos" album is placed at the top of the regular albums, and correspondingly, the "All Photos" tag is placed at the top of the regular albums' tags. The "Camera" album is placed in the second position of the regular albums, and correspondingly, the "Camera" tag is placed in the second position of the regular albums' tags. And so on. The order of the other albums in the regular albums is consistent with the order of the corresponding secondary album tags in the regular albums' tags.

[0283] In this embodiment, regular albums and their tags can be displayed in the content area according to their priority from highest to lowest. That is, the order of albums within a regular album corresponds to their priority order, and the order of the sub-album tags within a regular album corresponds to the priority order of the albums corresponding to those sub-album tags. Albums with higher priority are also listed first in their order, as are their sub-album tags.

[0284] For each album in a regular album, the albums are arranged from top to bottom in the content area according to their priority from high to low.

[0285] For each secondary album tag of a regular album, the secondary album tags are arranged in the navigation bar along a first direction (the direction extending from the beginning to the end of the navigation bar) according to the priority order of the albums corresponding to each secondary album tag from high to low.

[0286] This allows album tags for higher-priority albums to be displayed more prominently in the navigation bar compared to those for lower-priority albums. For users, album tags for higher-priority albums also have a higher browsing priority within the regular albums. This ensures users can easily browse and navigate these higher-priority album tags, enabling them to quickly find the content associated with those tags and thus improving the efficiency of image retrieval and the user experience in the gallery application.

[0287] In this embodiment, the priority of a photo album can be determined based on at least one of the album information, such as the album type and usage frequency. For ordinary photo albums, album types include system albums, user-created albums, and albums from third-party applications, etc., formed based on different objects.

[0288] In some embodiments, the system album has the highest priority. When there are multiple system albums, their priority can be further defined in descending order of usage frequency. Secondly, exemplarily, the priority order of user-created albums and third-party application albums can be defined in descending order of usage frequency. For example, the "All Photos" album, "Camera" album, and "Screenshot / Screen Recording" album are all system albums, and the overall priority of these three albums is the highest. However, in descending order of usage frequency, the "All Photos" album has the highest usage frequency, followed by the "Camera" album, and the "Screenshot / Screen Recording" album has the lowest usage frequency. The "Weibo" album and the "Meitu Xiu Xiu" album are third-party application albums, with the "Weibo" album having a higher usage frequency than the "Meitu Xiu Xiu" album.

[0289] In the above embodiment where a regular album includes multiple album groups and the tags of a regular album include multiple tag groups, one tag group corresponds to one album group of a regular album.

[0290] For regular albums, album groups can be arranged in descending order of priority, with each album group appearing from top to bottom in the content area. For example, album group 1 (“Album” in Figure 9(a)), album group 2 (“More Albums” in Figure 9(a)), and album group 3 (“Other Albums” in Figure 9(a)) are defined above. Album group 1 has the highest priority, followed by album group 2, and album group 3 has a lower priority than album group 2. Album groups 1, 2, and 3 are arranged sequentially from top to bottom in the content area.

[0291] For the tags of ordinary albums, they can be arranged in the navigation bar according to the priority order of the albums corresponding to each tag group from high to low, with multiple tag groups arranged along the first direction (the direction extending from the beginning to the end of the navigation bar). Continuing with the above three album groups as an example, in the normal navigation bar (as shown in Figure 7 or Figure 14), the tags of ordinary albums can include the tag group 1 defined above (such as the "Album" tag group located in the secondary tag area 7122), and tag group 2 (such as the "More" tag group located in the secondary tag area 7123), with tag group 1 and tag group 2 arranged from top to bottom (an example of the first direction). In the navigation bar in edit mode (as shown in Figure 15), the tags of a regular album can include the aforementioned defined tag group 1 (such as the "Album" tag group located in the secondary tag area 7122), tag group 2 (such as the "More" tag group located in the secondary tag area 7123), and tag group 3 (such as the "Other Albums" tag group located in the secondary tag area 7124). Tag group 1, tag group 2, and tag group 3 are arranged from top to bottom (an example of the first direction).

[0292] Taking a standard navigation bar as an example, please refer to Figure 7. The labels for a standard album can include the "Albums" label group (an example of label group 1) located in the secondary label area 7122, and the "More" label group (an example of label group 2) located in the secondary label area 7123. The "Albums" label group is closer to the top of the navigation bar 71. For example, the highest priority "Albums" label group in a standard album includes all photo labels, camera labels, and screenshot / screen recording labels. The albums corresponding to these secondary album labels are all system albums, and these albums have the highest priority. Additionally, the "Albums" label group can also include album labels for user-created albums and albums from third-party applications with high priority (such as albums whose usage frequency meets preset condition 1), such as the album labels for WeChat albums (not shown in Figure 7). As another example, the next highest priority "More" label group in a standard album includes: Weibo labels, Meitu Xiu Xiu labels, and other album labels. The Weibo tag and Meitu XiuXiu tag are the next highest priority albums in the third-party application's albums (such as albums whose usage frequency meets preset condition 2). Other album tags correspond to the "Other Albums" album group, which has a lower priority than the "More" album group. In addition, the "More" tag group can also include album tags of the next highest priority albums created by users (such as albums whose usage frequency meets preset condition 2) (not shown in Figure 7).

[0293] The above provides a detailed introduction to the interface of the gallery application.

[0294] Based on the above introduction, let's summarize some technical terms used in the embodiments of this application. For explanations of each term, please refer to the relevant descriptions above. These terms include: smart album, smart album tag, ordinary album, multiple album groups of an ordinary album, ordinary album tag, first part of an album tag in an ordinary album tag, second part of an album tag in an ordinary album tag, third part of an album tag in an editable ordinary album tag (such as album tags in other albums), multiple tag groups of ordinary album tags, management control, collapse control, expand control, and edit control.

[0295] Based on the aforementioned gallery application interface, this application embodiment provides an image display method. The gallery application interface allows users to move albums displayed in the content area to the navigation bar. Within the navigation bar, the secondary album tags of the moved albums are sorted to achieve the purpose of sorting the albums. After sorting, the order of the moved albums changes. This allows for quick and easy management of album sorting with few steps. This embodiment is particularly suitable for scenarios where users are browsing albums in the content area and need to adjust the album sorting, as well as scenarios where the navigation bar does not display album tags for some albums, but the user has recently viewed these albums frequently.

[0296] During the process of moving albums from the content area, the user selects N1 albums in the content area, and then moves the N1 albums to the navigation bar for sorting. N1 is an integer greater than or equal to 1.

[0297] In some embodiments, to facilitate user operation, for N1 albums already selected by the user, in response to the user's selection operation of the N1 albums, the N1 albums can be displayed in a floating state to facilitate the user's movement of the N1 albums. Here, the floating state of the N1 albums can also be referred to as the floating albums corresponding to the N1 albums; hereinafter, floating albums can be used as an alternative description of the floating state. In response to the operation of moving the floating albums to the navigation bar, the N1 secondary album tabs corresponding to the floating albums are updated and displayed in the navigation bar.

[0298] In one example, for N1 albums already selected by the user, the user can perform a floating operation on the N1 albums. In response to the user's floating operation on the N1 albums, the electronic device displays the floating albums corresponding to the N1 albums. The user moves the floating album to the navigation bar, and in response to the user's move operation on the navigation bar, the navigation bar updates and displays N1 secondary album tabs.

[0299] For example, a floating operation can be a long press on any of the N1 selected albums. Another example is a swipe operation (such as an up swipe, a down swipe, a swipe along a preset direction, etc.) or other preset operations on any of the N1 selected albums. This application embodiment does not impose any limitations on these operations.

[0300] The floating album corresponds to the N1 albums selected by the user. For example, the floating album corresponds to Alipay album 831 (N=1) in Figure 16 below, or to Alipay album 1131 and Toutiao album 1132 (N=2) in Figure 20 below. The floating album is generated based on user operations and aims to facilitate user operations such as dragging or swiping the selected N1 albums.

[0301] The cover content of the floating album corresponding to N1 albums can include the cover content of any one of the N1 albums. This application embodiment does not make any limitation. The cover content can include at least one of the album name, cover material and material quantity.

[0302] When N1=1, the floating album corresponds to an album. The cover content of the floating album includes the cover content of the corresponding album. As shown in Figure 16, the floating album 832 corresponds to Alipay album 831, including the name of Alipay album 831 (Alipay), cover material and the number of materials (23).

[0303] When N1 is greater than 1, a floating album corresponds to multiple albums. This floating album can include floating albums from various albums, which are displayed overlay. The topmost floating album is visible to the user; therefore, the cover content of the topmost floating album is the content of that album. The topmost floating album can be any of the N1 albums. For example, the album corresponding to the topmost floating album could be an album that the user long-pressed, or the album that is first in the N1 albums, or the album that the user selected first. This application embodiment does not limit this. Furthermore, the floating album corresponding to the N1 albums may also include a quantity marker N1 for the corresponding N1 albums. As shown in Figure 20, in the floating album 1133, the user has selected Alipay album 1131 and Toutiao album 1132. Alipay album 1131 is listed first among the two albums. Therefore, the floating album of Alipay album 1131 is displayed on the top layer. The user can see the floating album of Alipay album 1131 displayed on the top layer. The floating album 1133 also includes the corresponding album number 2.

[0304] The floating album can be displayed in any area of ​​the current interface, and this application embodiment does not impose any limitations. In one example, the floating album can be superimposed on top of the corresponding N1 albums to visually highlight the relationship between the floating album and the N1 albums.

[0305] It should be understood that the above-described process of displaying and moving floating albums is merely illustrative. In other embodiments, for N1 albums selected by the user, in response to the user's selection operation of the N1 albums, the floating albums corresponding to the N1 albums may not be displayed. Instead, the N1 albums may be configured as movable, so that the user can move the N1 albums. This application embodiment does not impose any limitations.

[0306] Below, based on the above description, and as a specific example, the process of a user moving the floating albums corresponding to N1 albums to the navigation bar will be used to describe the image display method in detail from five scenarios. Furthermore, the process will be illustrated using all albums in the gallery application corresponding to the first-level album tab, including smart albums and regular albums (as shown in Figures (a) and (b) of Figure 9).

[0307] Scene 1

[0308] Figure 16 is a schematic diagram of a set of interfaces of the image display method provided in the embodiments of this application.

[0309] In the embodiment where the labels of a regular album include a first part of album labels and a second part of album labels, the navigation bar does not display the album labels of each album in an album group corresponding to each second-level album label in the second part of album labels. Based on this, the scenario corresponding to Figure 16 is that a second-level album label (such as other album labels) in the second part of album labels is selected, and the content area displays at least some albums in an album group corresponding to the selected second-level album label. In response to the user's operation, the electronic device moves one album from that album group to the navigation bar and adds a second-level album label for that album to the navigation bar, updating the labels of the regular album and also updating the album's order within the regular album. Thus, the album sorting is completed, and after the update, the order of the second-level album labels in the labels of the regular album is consistent with the order of the album itself within the regular album.

[0310] The following will explain the above process in detail using the other album tags in Part 2, N1=1, and moving the Alipay album in "Other Albums" to the navigation bar for sorting as examples.

[0311] When a user clicks the Gallery app icon on the desktop, the electronic device displays the Gallery app interface in response to the user's click. When the user selects another album tab 811 in the navigation bar 81 (an example of a second-level album tab in the second part of the album tabs), the interface shown in Figure 16(a) is displayed in response to the user's selection of another album tab 811. In Figure 16(b), the navigation bar of the complete page of Figure (a) is displayed.

[0312] Please refer to Figure 16(a). The content area interface 821 is the interface of "Other Albums". The Other Albums tab 811 is selected and highlighted. The content area interface 821 includes each album in "Other Albums" (an example of N albums). The interface 821 can also be called the album grid interface.

[0313] Although Alipay Album 831 has been added to other albums, the user has been using Alipay frequently recently, caching or downloading images during the process. These images are now stored in Alipay Album 831, leading to increased usage. However, because Alipay Album 831 is located low in the order and has a deep hierarchy, it's inconvenient for the user to view. Therefore, the user wants to move Alipay Album 831 to a higher position and reduce the album's hierarchy for easier and faster access.

[0314] Based on this, users can perform a long press operation on any album in the content area (such as Alipay album 831). In response to the user's long press operation on any album, the content area displays the interface 822 shown in Figure (c) of Figure 16.

[0315] Please refer to Figure 16(c). The content area displays interface 822, which can also be understood as a material selection interface. It is an editing interface that includes multiple albums for the user to select. The user can select any album. Among them, Alipay Album 831 is selected. For example, the lower right corner of Alipay Album 831 displays a selection mark "√".

[0316] It should be noted that in Figure 16(a), if a user performs a long-press operation on a certain album (such as Alipay Album 831), the album will be selected by default in the content selection interface displayed in the content area, as shown in Figure 16(c). Therefore, if a user wants to select another album, they need to click on the selected album to deselect it, and then click on the other album they want to select.

[0317] Please continue to refer to Figure 16(c). When the user performs a floating operation (such as a long press) on the selected Alipay album 831 (an example of N1 albums), the content area displays the interface 823 shown in Figure 16(d).

[0318] Please refer to Figure 16(d). When the interface 823 switches from the edit state to the normal state, it includes all albums in "Other Albums". In response to the user's floating operation on Alipay Album 831, the floating state of Alipay Album 831 is displayed, that is, the floating album 832 corresponding to Alipay Album 831 is displayed, so as to facilitate the movement of Alipay Album 831.

[0319] In one example, the floating album 832 of Alipay Album 831 can be superimposed on top of Alipay Album 831. That is, the floating album of one album can be superimposed on top of the corresponding album. In other examples, the floating album 832 can also be displayed in any area of ​​the content area, and this application embodiment does not impose any limitations. It should be noted that since the size of the floating album 832 is different from the size of the corresponding Alipay Album 831, the floating album 832 may also be superimposed on top of other adjacent albums. For example, the floating album 832 may not only be superimposed on top of Alipay Album 831, but also on top of the adjacent Toutiao Album.

[0320] During the movement of the floating album, the floating album can be moved to any position in the area of ​​the navigation bar that supports receiving albums. The area that supports receiving albums is used to receive floating albums. In the area that supports receiving albums, the floating album can be successfully moved to any position in that area, and after the user releases the button, the corresponding N1 secondary album tabs of the floating album will be displayed.

[0321] In some embodiments, the area in the navigation bar that supports receiving albums includes a first tab area, which includes at least some of the album tags from the M secondary album tags in the regular album's tabs. Where at least some album tags are partial album tags, these partial album tags do not include the recently deleted tag from the regular album's tabs; that is, in this case, the location of the recently deleted tag does not support receiving albums. It can be understood that the first tab area is the area containing all or most of the tags in the regular album's tabs. For example, the first tab area includes all the tags in the regular album's tabs except for the recently deleted tag. Correspondingly, referring back to Figure 14, the first tab area includes secondary tab areas 7122 and 7123, which display the secondary album tags in the regular album's tabs except for the recently deleted tag.

[0322] The first tab area includes multiple pieces of content, which can be of various types.

[0323] In one example, the content in the first tab area includes at least some of the album tags from M secondary album tags. In this case, the content in the first tab area can be of type only tags.

[0324] In another example, in an embodiment where the tags of a regular album include multiple tag groups, the multiple contents of the first tag area not only include at least some of the album tags of the M secondary album tags, but may also include other types of content, such as tag group names. In this case, the types of the multiple contents of the first tag area include tags and tag group names. Referring back to Figure 14, the tags of a regular album include multiple tag groups, and the multiple contents of the first tag area include not only multiple secondary album tags such as "All Photos," "Camera," and "Screenshot / Screen Recording," but also tag group names such as "Albums" and "More."

[0325] As the floating album is moved toward the navigation bar, the electronic device detects the position of the floating album in real time to determine whether the floating album has been successfully moved to a position in the area that supports receiving albums.

[0326] In some embodiments, in response to the operation of moving the floating album to the navigation bar, if it is detected that the position of the floating album and the position of the navigation bar where the floating album is currently located (denoted as the first position) meet the first position condition, it is determined that the floating album is moved to the first position.

[0327] It should be understood that "determining that the floating album has moved to the first position" as described in the embodiments of this application means that the floating album has been successfully moved to the first position.

[0328] In some embodiments, the first location condition is that the floating album overlaps with a location in the area of ​​the navigation bar that supports receiving albums. That is, the floating album overlaps with a location in the area that supports receiving albums; "overlap" means that the floating album is within the range of a location in the area that supports receiving albums. Based on this, if the floating album is detected to overlap with the first location, it is determined that the floating album moves to the first location.

[0329] In one example, the overlap between the floating album and a location in the area supporting receiving albums can be represented by the positional relationship between the floating album and that location. For example, the default location of the floating album overlaps with a location in the area supporting receiving albums, that is, the default location of the floating album is within the range of that location.

[0330] For example, the default position of the floating album can be the center of the bounding box of the floating album. The center position can be the center point or the center line of the bounding box. If the default position of the floating album is the center line of the bounding box, the center line is the vertical center line of the bounding box.

[0331] In another example, the overlap between the floating album and a location within the area supporting receiving albums can be represented by the overlapping area of ​​the floating album and that location. For example, the ratio of the area of ​​the overlapping portion of the floating album's bounding box and that location to the floating album's bounding box is greater than a preset ratio, or the ratio of the area of ​​the overlapping portion of the floating album's bounding box and that location to the location is greater than a preset ratio. The preset ratio can be set according to actual needs; for example, it can be 50% or 60%, etc., and this embodiment does not impose any limitations.

[0332] In other embodiments, the first position condition can also be other preset conditions. For example, the first position condition can be: the floating album and a position in the area supporting receiving albums do not overlap, but the distance between them is less than a preset distance. The smaller the value of the preset distance, the better, and it can be flexibly set based on the actual situation. Based on this, when it is detected that the floating album and the first position meet the first position condition, it can also be determined that the floating album has moved to the first position.

[0333] The following example illustrates the process of moving the floating album to the navigation bar, with the first position being any one of the multiple contents in the first tab area and the first position condition being a floating album.

[0334] Following Figure 16(d), after the floating album 832 is displayed, in response to the user's movement operation of moving the floating album 832 towards the navigation bar 81, the electronic device moves the floating album 832 into the navigation bar 81. Referring to Figure 16(e), when the electronic device detects that the floating album 832 satisfies a first position condition with a position (denoted as position 1, an example of the first position), it determines that the floating album 832 has been successfully moved to position 1. In a specific example, the first position condition is: the center point of the bounding box of the floating album overlaps with the first position. Therefore, when the electronic device detects that the center point of the bounding box of the floating album 832 overlaps with position 1, it determines that the floating album 832 has been successfully moved to position 1. To remind users and improve their visual experience, for example, the electronic device will synchronously move down the Meitu Xiu Xiu label 812 originally displayed at position 1, as well as some content below Meitu Xiu Xiu 812 (such as other album labels 811, new album control, excluding recently deleted labels), for example, synchronously move down by a distance of one position, and display the floating album 832 separately at position 1.

[0335] It should be understood that, please continue to refer to Figure (e) in Figure 16, if when a part of the floating album 832 moves to the navigation bar 81, it is detected that the floating album 832 and position 1 satisfy the first position condition, then a part of the floating album 832 is displayed at position 1, and the other part is displayed in the content area.

[0336] Referring to Figure 16(e), in this case, the user can release their finger. In response to the user's release, the electronic device will display the Alipay label 813 corresponding to the floating album 832 at position 1, thereby adding the Alipay label 813 to position 1 of the navigation bar, displaying the interface shown in Figure 16(g). Alternatively, referring to Figure 16(f), the user can continue to move the floating album 832 into the navigation bar 81, and release their finger after the floating album 832 has completely moved to position 1 of the navigation bar 81. In response to the user's release, the interface shown in Figure 16(g) will be displayed.

[0337] Please refer to Figure 16(g). This interface indicates that the album sorting is complete. The floating album 832 is no longer displayed in the navigation bar 81; that is, the floating album 832 disappears. The Alipay tab 813 corresponding to the floating album 832 is displayed in position 1 where the Meitu XiuXiu tab 812 was originally displayed. The Alipay tab 813 is arranged above the Meitu XiuXiu tab 812 and below the Weibo tab, in the fifth position of the regular album tabs, following a top-down arrangement. Thus, the Alipay tab 813 is added to the navigation bar 81 as a second-level album tab, completing the sorting of the Alipay tab 813 within the navigation bar 81. The Alipay tab 813 is located under the "More" tab group. The content area is linked to the navigation bar 81. Correspondingly, in the content area, Alipay Album 831 is no longer displayed in the "Other Albums" interface 823. Alipay Album 831 is removed from "Other Albums" and moved to "More Albums" as shown in Figure 9(a), arranged before Meitu Xiu Xiu Albums and after Weibo Albums. According to the top-to-bottom arrangement, Alipay Album is placed in the 5th position of the regular albums, and its order has been adjusted to be earlier. In addition, since Alipay Album has been removed from "Other Albums," the number of albums in "Other Albums" has changed from 6 to 5. Therefore, please refer to Figure 16(h), the number of albums displayed in the Other Albums tab 811 has changed from 6 to 5. Thus, after the sorting is completed, the Alipay tab 813 is in the same order as the Alipay Album in the regular albums, both being placed in the 5th position.

[0338] Compared to existing technologies, the sorting process in existing technologies requires users to specifically go to the album interface, click on "more controls," and then select a sorting option after entering the gallery application interface before they can access the interface that supports album sorting. In contrast, in this embodiment, after entering the gallery application interface, the interface itself supports moving albums from the content area to the navigation bar for sorting. Therefore, once the gallery application interface is accessed, no additional operations are required; users can directly move albums from the content area to the navigation bar and sort the album tags to achieve album sorting. Clearly, the sorting process in this embodiment has fewer and more convenient steps, resulting in a better user experience.

[0339] Continuing the comparison, please refer back to Figure 16(a). When the Alipay tab is not displayed in the navigation bar 81, the Alipay album corresponding to the Alipay tab is in a deeper hierarchy. After the user selects the other album tab 811, the content area displays the various albums in "Other Albums," and the user needs to click on Alipay album 831 again to view the individual images within the Alipay album. This process requires at least two steps. In contrast, based on the sorted navigation bar 81, please refer to Figure 16(i). The Alipay tab 813 is selected and highlighted, and the content area directly displays the individual images in the Alipay album, reducing at least one step compared to the above process. It can be seen that, based on the sorted interface, because the Alipay tab 813 is added to the navigation bar 81, it is equivalent to reducing the hierarchy of the Alipay album. In this way, users can directly view the corresponding Alipay album based on the shallower Alipay tab, with fewer and more convenient steps, resulting in a better user experience.

[0340] The image display method provided in this application embodiment allows users to move albums from the content area to the navigation bar. The album's tags are then sorted within the navigation bar to achieve album sorting. Secondary album tags for the album are added to the navigation bar, and the tags of regular albums are updated, along with the album's sorting order within the regular albums. This completes the album sorting, and the updated order of the album's secondary album tags within the regular album tags matches the album's overall sorting order within the regular album. Compared to the relatively cumbersome sorting process of existing technologies, the above sorting process involves fewer steps and is more convenient, resulting in a better user experience. Furthermore, for each second-level album tag (such as other album tags) in the second part of the album tabs, the hierarchy of albums within the corresponding album group is quite deep. Users typically need to select the second-level album tag to display the corresponding album group and then click on a specific album to view it. This is detrimental to user experience when users frequently need to view one or more albums within the same album group. The aforementioned sorting process adds the album tags of the albums within the album group to the navigation bar as second-level album tags, effectively reducing the album hierarchy. This allows users to directly view the corresponding albums based on the shallower second-level album tags, resulting in fewer and more convenient steps and a better user experience. In addition, the navigation bar and content area are linked; the sorting of album tags in the navigation bar after sorting is consistent with the sorting of albums in the content area. Users can easily perceive the consistency of changes in the navigation bar and content area for the same event, avoiding confusion and improving the user experience.

[0341] In this embodiment of the application, in order to maintain the unique characteristics of some tags, we do not want the order of these tags to change. Therefore, the electronic device will set the area where these tags are located as an area that does not support receiving albums. In this way, the user cannot move the floating album to an area that does not support receiving albums, or in other words, the area that does not support receiving albums cannot respond to the user's operation of moving the floating album to this area.

[0342] In some embodiments, the area that does not support receiving albums includes a second tab area, which includes multiple primary tabs. For example, referring back to Figure 7 or Figure 14, the second tab area is the primary tab area 711 containing multiple primary tabs.

[0343] In other embodiments, the second label area includes not only multiple primary album labels but also labels for the smart album. For example, referring back to Figure 7 or Figure 14, the second label area includes a primary label area 711 containing multiple primary labels and a secondary label area 7121 containing labels for the smart album.

[0344] It's understandable that the second tag area includes multiple primary tags, meaning that the order of these primary tags needs to be preserved to maintain the entry points for multiple functional clusters within the gallery application and to retain the highest-level position of the primary tags. The second tag area also includes tags for the Smart Album, meaning that the order of these Smart Album tags needs to be preserved to maintain the consistency of the Smart Album's smart capabilities and prevent secondary album tags from being placed in the same area as the Smart Album's tags, thus affecting the Smart Album's smart capabilities.

[0345] When a user moves the floating album to the second tab area, the second tab area does not respond to the user's action, resulting in a poor user experience due to accidental operation. Therefore, to guide (or prompt) the user, the electronic device can use a new display method (denoted as the second display method) to display the content in the second tab area. This second display method is different from the display method of the area that supports receiving albums (denoted as the first display method), used to remind the user that moving the floating album to the second tab area is not supported. In this way, the user can quickly understand visually that the area displayed using the second display method is the area that does not support receiving albums, thus avoiding accidental operation and improving the user experience.

[0346] The second display mode and the first display mode can be distinguished from each other in any way, such as color, font, font size, etc., and the embodiments of this application do not impose any limitations. In one example, the second display mode has a different color than the first display mode. For example, the font color of the second display mode is gray, and this display mode can be called grayscale display. The font color of the first display mode is consistent with the previous one, such as black display.

[0347] In some embodiments, please continue to refer to Figure (d) in Figure 16. The second label area includes multiple primary album labels and various secondary album labels under the smart album label. Therefore, the multiple primary labels and the smart album label are displayed in gray (an example of the second display mode), while the various secondary album labels of the ordinary album label are still displayed using the first display mode previously shown.

[0348] In implementation, referring to Figure 16(d), in response to the user's floating operation on Alipay Album 831, the electronic device floats Alipay Album 831, displaying the corresponding floating album 832. The content in the second tab area (multiple primary tabs and the various secondary album tabs of the Smart Album tab) is grayed out to inform the user that the second tab area does not support receiving albums and does not support moving albums from the content area to the second tab area for sorting. After sorting is complete, in response to the user's release operation, in Figure 16(g), the previously grayed-out primary tabs and Smart Album tabs in the second tab area are displayed normally.

[0349] Scene 2

[0350] Figure 17 is a schematic diagram of another set of interfaces of the image display method provided in the embodiments of this application.

[0351] For each album group corresponding to the secondary album tags in the second part of the album tabs, each album group contains its individual albums in the form of a folder. Based on this, unlike Figure 16, the scenario in Figure 17 is as follows: when a primary album tag is selected, the content area displays the regular album corresponding to that selected primary album tag. When the user opens an album group in folder form (such as other albums), the content area displays at least some of the albums in that album group. In response to the user's operation, the electronic device moves one album from that album group to the navigation bar, adds a secondary album tag for that album to the navigation bar, updates the tags of the regular albums, and also updates the album's order within the regular albums. Thus, the album sorting is completed, and after the update, the order of the secondary album tags of that album in the tags of the regular albums is consistent with the order of the album itself within the regular albums.

[0352] In other words, the main difference between Figure 17 and Figure 16 is that the way each album in the album group is displayed is different. After displaying each album in the album group, the album can be moved in the way described in Figure 16, and a secondary album label corresponding to the album can be added to the navigation bar.

[0353] The following section focuses on describing the differences between Figure 17 and Figure 16, while the similarities and similarities between the two are described in a simplified manner.

[0354] When a user clicks the Gallery app icon on the desktop, the electronic device displays the Gallery app interface in response to the user's click on the Gallery app icon. When the user selects the Album tab 815 (an example of a primary album tab) in the navigation bar 81, the interface shown in Figure 17(a) is displayed in response to the user's selection of Album tab 815.

[0355] Please refer to Figure 17(a). The content area interface 841 is the album interface. The album tab 815 is selected and highlighted. The "Normal Album" option at the bottom of the interface is selected. The content area interface 841 is the normal album interface, including all albums under the normal album, such as the "All Photos" album, the "Camera" album, the "Screenshot & Screen Recording" album, the "Weibo" album, and "Other Albums" 851, etc. When the user clicks "Other Albums" 851, the interface shown in Figure 17(b) is displayed in response to the user's operation.

[0356] Please refer to Figure 17(b). The content area interface 842 is the interface for "Other Albums," which includes all the albums within "Other Albums." Users may want to rearrange the Alipay albums 852 to be more prominent and reduce the number of album levels for easier viewing. Therefore, users can long-press any album in the content area (such as Alipay album 852). In response to this long-press, the content area displays the interface 843 shown in Figure 17(c). Furthermore, users can swipe up on the navigation bar 81 with another finger. In response to this swipe, other parts of the navigation bar 81 not currently displayed on the page are shown in Figure 17(c).

[0357] Please refer to Figure 17(c). The content area displays interface 843, which can also be understood as a material selection interface. It is an editing interface. Alipay Album 852 is selected. For example, a selection mark "√" is displayed in the lower right corner of Alipay Album 852. When the user performs a floating operation (such as a long press) on the selected Alipay Album 852, in response to the user's floating operation on the selected Alipay Album 852, the content area displays interface 844 as shown in Figure 17(d).

[0358] Please refer to Figure 17(d). When the interface 844 switches from the edit state to the normal state, it includes all albums in "Other Albums". In response to the user's floating operation on Alipay Album 852, the floating state of Alipay Album 852 is displayed, that is, the floating album 853 corresponding to Alipay Album 852 is displayed, so as to facilitate the movement of Alipay Album 852.

[0359] During the process of moving the floating album 853, in response to the operation of moving the floating album 853 to the navigation bar 81, the Alipay tab 816 corresponding to the floating album 853 is displayed. This process can be referred to the relevant descriptions in Figures (e) to (h) of Figure 16, which will not be repeated here. Finally, the interface shown in Figure (e) of Figure 17 is displayed.

[0360] Scene 3

[0361] Figure 18 is a schematic diagram of another set of interfaces of the image display method provided in the embodiments of this application.

[0362] For the tags in a regular album, in an embodiment where the tags include a first part of album tags and a second part of album tags, the navigation bar displays each of the second-level album tags within the first part of album tags. Based on this, unlike Figures 16 and 17, the scenario corresponding to Figure 18 is that, based on user operation, the electronic device adjusts the order of a certain second-level album tag within the first part of album tags. For example, when a first-level album tag in the navigation bar is selected, the content area displays the regular album corresponding to the first-level album tag. In response to the user's operation, the electronic device moves one album from the regular album to the navigation bar and updates the order of the second-level album tags for that album within the navigation bar, also updating the album's order within the regular album. Before the order update, the second-level album tags for that album are displayed in the navigation bar and belong to the first part of album tags. In this way, the album sorting is completed. After the update, the order of the album's secondary album tags in the regular album tags is consistent with the order of the album itself in the regular album. However, the order of the album's secondary album tags in the regular album tags after the update is different from the order of the album's secondary album tags in the regular album tags before the update. For example, before the update, the album's secondary album tags were arranged in the L1 position of the regular album tags in the navigation bar, and after the update, the album's secondary album tags are arranged in the L2 position of the regular album tags in the navigation bar. The order of the album's secondary album tags has changed.

[0363] It should be understood that this scenario also applies to situations where the labels of ordinary albums do not include the second part of the album labels. That is, the labels of ordinary albums are all the first part of the album labels, and when each second-level album label is selected, the content area can display the image materials of the corresponding album.

[0364] The following section focuses on describing the differences between Figure 18 and Figure 16, while the similarities and similarities between the two are described in a simplified manner.

[0365] When a user clicks the Gallery app icon on the desktop, the electronic device displays the Gallery app interface in response to the user's click on the Gallery app icon. When the user selects the Album tab 911 (an example of a primary album tab) in the navigation bar 91, the interface shown in Figure 18(a) is displayed in response to the user's selection of Album tab 911.

[0366] Please refer to Figure 18(a). The content area interface 921 is the album interface. The album tab 911 is selected and highlighted. The "Normal Album" option at the bottom of the interface is selected. The content area interface 921 is the normal album interface, including all albums under the normal album, such as the "All Photos" album, the "Camera" album, the "Screenshot & Screen Recording" album, the "Weibo" album, etc. The user is browsing the content area interface and feels that the frequency of using Meitu XiuXiu album 931 has increased recently. The user wants to adjust the order of Meitu XiuXiu album 931 to be higher.

[0367] Based on this, when a user performs a long press operation on any album in the content area (such as Meitu Xiu Xiu album 931), in response to the user's long press operation on any album (such as Meitu Xiu Xiu album 931), the content area displays the interface 922 shown in Figure (b) of Figure 18.

[0368] Please refer to Figure 18(b). The content area displays interface 922, which can also be understood as a material selection interface. It is an editing interface that includes multiple albums that the user can select. Among them, Meitu XiuXiu album 931 is selected. For example, a selection mark "√" is displayed in the lower right corner of Meitu XiuXiu album 931. When the user performs a floating operation (such as a long press) on the selected Meitu XiuXiu album 931, the content area interface 923 is displayed in Figure 18(c). In addition, when the user swipes up on the navigation bar 91 with another finger, in response to the user's swipe operation on the navigation bar 91, other parts of the navigation bar 91 that are not currently displayed on the page are displayed in Figure 18(c).

[0369] Please refer to Figure 18(c). Interface 923 switches from edit mode to normal mode, including all albums under the album interface. In response to the user's floating operation of Meitu XiuXiu album 931, the floating album 932 of Meitu XiuXiu album 931 is displayed. Please note that the Meitu XiuXiu tag 912 corresponding to Meitu XiuXiu album 931 is also displayed in the navigation bar 91, at position 2 of the navigation bar 91. According to the top-to-bottom arrangement, Meitu XiuXiu tag 912 is arranged in the 5th position of the tags of the normal album: All Photos tag, Camera tag, Screenshot / Screen Recording tag 915, Weibo tag 914, Meitu XiuXiu tag 912, Other Album tags 913.

[0370] After the floating album is displayed based on user operation, the user performs a movement operation (such as dragging, swiping, etc.) to move the floating album into the navigation bar. In response to the user's movement operation, the electronic device moves the floating album into the navigation bar.

[0371] In scenarios where the navigation bar displays a secondary album tab for a moved album (such as Meitu Xiu Xiu album), when the floating album corresponding to the secondary album tab moves to the navigation bar, as an example, there are two display formats in the navigation bar, referred to as Method 1.1 and Method 1.2. The main difference is whether the secondary album tab for the moved album (such as Meitu Xiu Xiu album) continues to be displayed in the navigation bar.

[0372] Method 1.1

[0373] In response to a user's movement operation of moving the floating album 932 towards the navigation bar 91, the electronic device moves the floating album 932 into the navigation bar 91. Referring to Figure (d1) in Figure 18 and comparing it with Figure (c) in Figure 18, when the floating album 932 and, for example, position 3 satisfy the first position condition, the electronic device determines that the floating album 932 has been successfully moved to position 3. In this case, the electronic device no longer displays the previously displayed Meitu XiuXiu label 912; that is, position 2, where the Meitu XiuXiu label 912 was originally displayed, no longer displays the Meitu XiuXiu label 912. To remind the user and improve the user's visual experience, for example, the screenshot / screen recording label 915 originally displayed at position 3, as well as the content located between position 3 and position 2 (such as "More" and its corresponding collapse control, Weibo label 914), are simultaneously moved down, for example, by a distance of one position, and the floating album 932 is displayed separately at position 3, displaying the navigation bar 91 as shown in Figure (d1) of Figure 18.

[0374] In Figure 18(d1), the user can release their finger, and in response to this action, the interface shown in Figure 18(e) will be displayed. Alternatively, following Figure 18(d1), the user can continue to move the floating album 932 into the navigation bar 91. After the floating album 932 has been fully moved to position 3 of the navigation bar 91, the user can release their finger, and in response, the interface shown in Figure 18(d1) will also be displayed.

[0375] Please refer to Figure 18(e). This interface indicates that the sorting is complete. The floating album 932 is no longer displayed in the navigation bar 91; that is, the floating album 932 has disappeared. The Meitu XiuXiu tag 912a corresponding to the floating album 932 is displayed at position 3 where the screenshot / screen recording 915 was originally displayed. The sorted Meitu XiuXiu tag 912a is located under the "Album" tag group. Following the top-to-bottom arrangement, the sorted Meitu XiuXiu tag 912a is placed in the 3rd position of the regular album tags. Compared to the previous situation where the Meitu XiuXiu tag 912 was displayed at position 2 in the navigation bar 91 and in the 5th position of the regular album tags, the sorted Meitu XiuXiu tag 912a's position (position 3) is now forward. This forward placement adjusts the order of the Meitu XiuXiu tag 912. The content area is linked to the navigation bar. Correspondingly, Meitu XiuXiu Album 931 will no longer be displayed in the "More Albums" section of the content area. Meitu XiuXiu Album 931 has been removed from "More Albums" and moved to a new location under "Albums," arranged between the Camera Album and the Screenshot / Screen Recording Album. Following the top-to-bottom arrangement, Meitu XiuXiu Album 931 is now the third album in the regular album. Thus, after sorting, the order of Meitu XiuXiu tag 912a in the regular album is consistent with the order of Meitu XiuXiu Album 931, both being the third album.

[0376] Method 1.2

[0377] In response to a user's movement operation of moving the floating album 932 towards the navigation bar 91, the electronic device moves the floating album 932 into the navigation bar 91. Referring to Figure (d2) in Figure 18 and comparing it with Figure (c) in Figure 18, when the floating album 932 and, for example, position 3 satisfy the first position condition, the electronic device determines that the floating album 932 has been successfully moved to position 3. In this case, the electronic device still displays the Meitu XiuXiu tab 912. To remind the user and improve their visual experience, for example, the screenshot / screen recording tab 915 originally displayed at position 3, along with the content below the screenshot / screen recording tab 915 (such as "More" and its corresponding collapse control, Weibo tab 914, Meitu XiuXiu tab 912, other album tabs 913, new album control, etc.), are simultaneously moved down, for example, by a distance of one position, and the floating album 932 is displayed separately at position 3, displaying the navigation bar 91 as shown in Figure (d2) of Figure 18.

[0378] In Figure 18(d2), the user can release their finger, and in response to this action, the interface shown in Figure 18(e) will be displayed. Alternatively, following Figure 18(d2), the user can continue to move the floating album 932 into the navigation bar 91. After the floating album 932 has been fully moved to position 3 of the navigation bar 91, the user can release their finger, and in response, the interface shown in Figure 18(e) will be displayed.

[0379] Please refer to Figure 18(e). This interface indicates that the sorting is complete. Within the navigation bar 91, the floating album 932 is no longer displayed; that is, the floating album 932 disappears. The Meitu XiuXiu tag 912a corresponding to the floating album 932 is displayed at position 3, and the Meitu XiuXiu tag 912 located below position 2 is no longer displayed. The Meitu XiuXiu tag 912 and the content below it (such as other album tags 913 and the new album control) move upwards synchronously, for example, by one position. Thus, the sorting is complete, and the sorted Meitu XiuXiu tag 912a is located under the "Album" tag group. Following the top-to-bottom arrangement, the sorted Meitu XiuXiu tag 912a is now positioned third among the tags in the regular album. Compared to its previous placement in position 2 of the navigation bar (91) and fifth among the tags in the regular album, the sorted Meitu XiuXiu tag 912a is now positioned earlier, thus adjusting its order. The content area is linked to the navigation bar; correspondingly, Meitu XiuXiu album 931 is no longer displayed in the "More Albums" section. It has been removed from "More Albums" and moved to a new section under "Albums," positioned between the camera album and the screenshot / screen recording album. Following the top-to-bottom arrangement, Meitu XiuXiu album 931 is placed in the third position of the regular album. Thus, after sorting, the order of Meitu XiuXiu tag 912a in the regular album is consistent with the order of Meitu XiuXiu album 931 in the regular album, both being placed in the third position.

[0380] Comparing methods 1.1 and 1.2 above, when the floating album 932 is detected to meet the first position condition with, for example, position 3, in method 1.1, the electronic device no longer displays the already displayed Meitu Xiu Xiu tag 912. After the user releases their hand, the sorted Meitu Xiu Xiu tag 912a is displayed at position 3. In method 1.2, the electronic device continues to display the already displayed Meitu Xiu Xiu tag 912 until the user releases their hand. At that point, the already displayed Meitu Xiu Xiu tag 912 is no longer displayed, and instead, the Meitu Xiu Xiu tag 912a is displayed at position 3, thus completing the sorting of the Meitu Xiu Xiu tags.

[0381] In this way, the sorted Meitu XiuXiu tags appear higher, which improves the browsing experience for users. This allows users to prioritize browsing and operate the sorted Meitu XiuXiu tags more easily, enabling them to find the content corresponding to the tags more quickly and improving the user experience.

[0382] It should be understood that the above only illustrates the scenario of adjusting the order of secondary album tags to the front. The specific process for adjusting the order of secondary album tags to the back is similar to the above process and will not be repeated here.

[0383] In the above embodiments, the gallery application interface allows users to move albums from the content area to the navigation bar. The album's album tags are then sorted within the navigation bar to achieve album sorting. The sorting of the album's secondary album tags is updated in the navigation bar, which also updates the album's sorting within the regular albums. Before the sorting update, the album's secondary album tags are displayed in the navigation bar. This completes the album sorting. After the update, the order of the album's secondary album tags within the regular album's tags is consistent with the album's overall sorting within the regular album. However, the order of the album's secondary album tags within the regular album's tags after the update differs from the order before the update. Compared to the relatively cumbersome sorting process of existing technologies, the above sorting process has fewer steps and is more convenient, providing a better user experience. Especially for scenarios where users are viewing albums located in the content area, particularly towards the end, and want to move those albums to the front of the list, the user experience of the above embodiments is even better. In addition, the navigation bar and content area are linked. After sorting, the sorting of the album tabs in the navigation bar is consistent with the sorting of the albums in the content area. Users can perceive the consistency of the same event changing in the navigation bar and content area in a friendly way, avoiding confusion in event perception and providing a good user experience.

[0384] In the methods shown in Figures 16 to 18 above, it is illustrated that the area of ​​the navigation bar that supports receiving albums includes a first tab area for displaying labels for ordinary albums, and supports moving albums from the content area to the first tab area in the navigation bar for sorting. In other embodiments, the area of ​​the navigation bar that supports receiving albums also includes a preset area, and supports moving albums from the content area to the preset area for sorting. The preset area can be any area in the navigation bar other than the label area for ordinary albums, and this application embodiment does not impose any limitations.

[0385] The following, referring to Figure 19, uses the example of adjusting the sorting of a second-level album label within the first part of a regular album's tags to illustrate the scenario of moving albums in the content area to a preset area in the navigation bar for sorting. It should be understood that the process of moving an album (such as the Alipay album) from a second-level album label (such as other album labels) within a group (such as other albums) to the preset area for sorting is similar and can be implemented using this method.

[0386] Scene 4

[0387] Figure 19 is a schematic diagram of another set of interfaces of the image display method provided in the embodiments of this application.

[0388] In the scenario corresponding to Figure 19, a preset area is provided within the navigation bar. This preset area supports receiving albums moved from the content area, allowing the display of the album's secondary album tags within this preset area. In other words, the area of ​​the navigation bar that supports receiving albums includes this preset area. This preset area is any area in the navigation bar other than the first tag area containing at least some of the album tags of ordinary albums. The specific area is determined based on actual conditions, and this application embodiment does not impose any limitations. For example, if the preset area is used to display the secondary album tags of frequently used albums in ordinary albums, then the preset area can be positioned earlier. As another example, if the preset area is used to display the secondary album tags of infrequently used albums in ordinary albums, then the preset area can be positioned later. Here, "at least some album tags" in the tags of ordinary albums refers to some or all of the album tags in the tags of ordinary albums. For example, if "at least some album tags" refers to some album tags, these some album tags can be tags in ordinary albums other than the recently deleted tag.

[0389] In this way, the preset area set in the navigation bar outside the first tab area of ​​the regular album tabs can support moving albums from the content area for sorting. This achieves the effect of sorting and displaying second-level album tabs in an area outside the regular album tabs, no longer limited to sorting in the area of ​​the regular album tabs. Therefore, it gives users greater freedom in sorting and provides a better user experience.

[0390] In some embodiments, the preset area is located on the first side of the first tab area, which is close to the beginning of the navigation bar.

[0391] In other words, compared to the first tab area, this preset area is located closer to the beginning of the navigation bar. Therefore, for users, the preset area has a higher browsing priority than the first tab area, which displays regular albums. By moving the floating album to the preset area, users can prioritize browsing the secondary album tabs displayed in this preset area to more quickly find the albums corresponding to those secondary album tabs.

[0392] In embodiments where the navigation bar includes a smart album label, in some embodiments, the smart album label is located on the first side of the first label area, and the preset area is located between multiple primary labels and the smart album label. Thus, for the user, the browsing priority of this preset area is second only to the primary labels, and the secondary album labels displayed here have the highest browsing priority among all secondary album labels. Therefore, secondary album labels for albums that the user considers frequently used in ordinary albums can be displayed here. This allows the user to prioritize browsing the secondary album labels displayed in this preset location to more quickly find the albums corresponding to those labels.

[0393] In the above embodiments, the preset area is located between multiple primary tags and smart album tags. The secondary album tags displayed in the preset area serve two purposes: first, they maximize the browsing level of the secondary album tags in the preset area, enabling users to find the albums corresponding to the secondary album tags in the preset area as quickly as possible; second, they change the order of the secondary album tags in the preset area within the tags of the ordinary album. The secondary album tags are ranked first in the tags of the ordinary album, and correspondingly, the albums corresponding to the secondary album tags are ranked first in the ordinary album.

[0394] It should be understood that one or more albums in the content area can be moved to a preset area for sorting. After sorting, one or more secondary album tags will be displayed in the preset area. If the preset area includes one secondary album tag, the secondary album tag will be ranked first among the tags of the ordinary album. If the preset area includes multiple (e.g., m2) secondary album tags, the m2 secondary album tags will be ranked first among the tags of the ordinary album as a whole, and will be continuously ranked from the 1st to the m2th position.

[0395] In other embodiments, the smart album's labels are located on the first side of the first label area, and the preset area can be located between the smart album's labels and the first label area. For users, the browsing priority of this preset area is second only to the smart album's labels and higher than the first label area used to display labels for ordinary albums. Secondary album labels for frequently used albums in ordinary albums can be displayed here. Thus, users can prioritize browsing the secondary album labels displayed in this preset location to quickly find the album corresponding to the secondary album label displayed in this preset location. This significantly improves the browsing priority of the secondary album labels displayed in this preset area and changes the order of the secondary album labels displayed in this preset area within the labels of ordinary albums. The secondary album labels are also ranked first among the labels of ordinary albums, and correspondingly, the albums corresponding to the secondary album labels are ranked first among the labels of ordinary albums.

[0396] For preset areas, to remind (or guide) users, a reminder message can be displayed in that area, prompting them to move albums there. For example, the reminder message could be "Frequently used albums can be dragged here," allowing users to quickly understand that albums can be moved here for sorting, facilitating rapid sorting and improving the user experience.

[0397] In addition, since the areas where multiple primary labels are located and the areas where the smart album labels are located are areas that do not support receiving albums, as mentioned earlier, when these areas that do not support receiving albums are displayed using a second display method such as graying out, in order to maintain the visual consistency of the overall area, the display method of the reminder information can also be set to the second display method such as graying out.

[0398] The following explanation uses an example where the preset area is located between multiple primary labels and the labels of the Smart Album. Furthermore, simplified descriptions are provided for content that is the same as or similar to Figures 16 to 18.

[0399] When a user clicks the Gallery app icon on the desktop, the electronic device displays the Gallery app interface in response to the user's click on the Gallery app icon. When the user selects the Album tab 1011 (an example of a primary album tab) in the navigation bar 101, the interface shown in Figure 19(a) is displayed in response to the user's selection of Album tab 1011.

[0400] Please refer to Figure 19(a). The content area interface 1021 is the album interface. The album tab 1011 is selected and highlighted. The "Normal Album" option at the bottom of the interface is selected. The content area interface 1021 is the normal album interface, including all albums under the normal album. The user is browsing the content area interface and thinks that they have been using Meitu XiuXiu album 1031 very frequently recently. They want to adjust the order of Meitu XiuXiu album 1031 to be higher.

[0401] Based on this, when a user performs a long press on any album in the content area (such as Meitu Xiu Xiu album 1031), in response to the user's long press on any album, the content area displays the interface 1022 shown in Figure (b) of Figure 19.

[0402] Please refer to Figure 19(b). The content area displays interface 1022, which can also be understood as a material selection interface. It is an editing interface that includes multiple albums that the user can select. Among them, Meitu XiuXiu album 1031 is selected. For example, a selection mark "√" is displayed in the lower right corner of Meitu XiuXiu album 1031. When the user performs a floating operation (such as a long press) on the selected Meitu XiuXiu album 1031, the content area interface 1023 is displayed in Figure 19(c). In addition, after selecting Meitu XiuXiu album 1031, the user can swipe up on the navigation bar 101. In response to the user's swipe up operation on the navigation bar 101, other parts of the navigation bar 101 that are not currently displayed on the page are displayed in Figure 19(c). Alternatively, the user can simultaneously perform a long press operation on Meitu XiuXiu album 1031 and swipe up on the navigation bar 101, operating the content area with one hand and the navigation bar with the other.

[0403] Please refer to Figure 19(c). Interface 1023 switches from edit mode to normal mode, including all albums under the album interface. In response to the user's floating operation of Meitu XiuXiu album 1031, the floating album 1032 of Meitu XiuXiu album 1031 is displayed, along with a pre-defined area. Within the navigation bar 101, referring to Figure 19(d), a pre-defined area is displayed between multiple primary tabs and the Smart Album tabs. That is, a pre-defined area is displayed between the primary tab area 101a and the secondary tab area 101b. This pre-defined area is an empty area. In one example, a reminder message can be displayed in this pre-defined area to remind the user to move the album here. For example, the reminder message could be "Frequently used albums can be dragged here," so that the user can quickly understand that albums can be moved here for sorting. Furthermore, when the areas containing multiple primary tags and the areas containing the Smart Album tags are configured as areas that do not support receiving albums and are therefore grayed out, in order to maintain visual consistency across the entire area, the display method for reminder information can also be set to grayed out, i.e., grayed-out reminder information. Please note that within the navigation bar 101, the Meitu XiuXiu tag 1012 corresponding to the Meitu XiuXiu album 1031 is also displayed within the navigation bar 101. Arranged from top to bottom, the Meitu XiuXiu tag 1012 is the 5th tag in the regular album category: All Photos, Camera, Screenshot / Screen Recording, Weibo (1014), Meitu XiuXiu (1012), and Other Albums (1013).

[0404] After the floating album is displayed based on user operation, the user performs a movement operation (such as dragging, swiping, etc.) to move the floating album into the navigation bar. In response to the user's movement operation, the electronic device moves the floating album into the navigation bar.

[0405] In scenarios where the navigation bar displays a secondary album tab for a moved album (such as Meitu Xiu Xiu Album 1031), when the floating album corresponding to the secondary album tab moves to the navigation bar, as an example, there are two display formats in the navigation bar, referred to as Method 2.1 and Method 2.2. The main difference is whether the secondary album tab for the moved album (such as Meitu Xiu Xiu Album) continues to be displayed in the navigation bar.

[0406] Method 2.1

[0407] In response to a user's movement operation of moving the floating album 1032 towards the navigation bar 101, the electronic device moves the floating album 1032 into the navigation bar 101. Referring to Figure (e1) in Figure 19 and comparing it with Figure (c) in Figure 19, when the floating album 1032 is detected to meet a first position condition with a position in the preset area, the electronic device determines that the floating album 1032 has been successfully moved to a position in the preset area. In this case, the electronic device no longer displays the previously displayed Meitu XiuXiu tab 1012. To remind the user and improve the user's visual experience, for example, the content below the Meitu XiuXiu tab 1012 (such as other album tabs 1013, the new album control) is synchronously moved upwards, for example, by a distance of one position, and the floating album 932 is displayed separately at the position in the preset area, displaying the navigation bar 101 as shown in Figure (e1) of Figure 19.

[0408] In the embodiment where a reminder message is displayed in the preset area, when the floating album 1032 is detected to meet a first position condition with a position in the preset area, since the floating album 1032 has been successfully moved to a position in the preset area, in one example, the reminder message may no longer be displayed in the preset area. For the user, the disappearing reminder message serves as a notification that the floating album 1032 has been successfully moved to the preset area, allowing them to complete the sorting process after releasing the button, resulting in a good user experience. Of course, in other examples, the reminder message can also be displayed continuously to constantly remind the user without affecting their operation.

[0409] In Figure 19(e1), the user can release their finger, and in response to this release, the interface shown in Figure 19(f) will be displayed. Alternatively, following Figure 19(e1), the user can continue to move the floating album 1032 into the navigation bar 101. After the floating album 1032 has been completely moved to the preset position of the navigation bar 101, the user can release their finger, and in response to this release, the interface shown in Figure 19(f) will also be displayed.

[0410] Please refer to Figure 19(f), which indicates that the sorting is complete. Within the navigation bar 101, the floating album 1032 disappears, and the corresponding Meitu XiuXiu tag 1012a is displayed in a preset position. The sorted Meitu XiuXiu tag 1012a has the highest browsing priority. Following the top-to-bottom arrangement, the sorted Meitu XiuXiu tag 1012a is placed in the first position among the tags of the regular albums. Compared to the previous situation where the Meitu XiuXiu tag 1012 was placed in the fifth position, the sorted Meitu XiuXiu tag 1012a is now at the very beginning, thus achieving the highest level of sorting for the Meitu XiuXiu tags. The content area is linked to the navigation bar; correspondingly, Meitu XiuXiu album 1031 is no longer displayed in the "More Albums" section of the content area. Meitu XiuXiu album 1031 has been removed from "More Albums" and is now ranked first among the regular albums. Thus, after sorting, the order of Meitu Xiu Xiu tag 1012a in the regular album is consistent with the order of Meitu Xiu Xiu album 1031 in the regular album, both being ranked first.

[0411] Method 2.2

[0412] In response to a user's movement operation of moving the floating album 1032 towards the navigation bar 101, the electronic device moves the floating album 1032 into the navigation bar 101. Referring to Figure (e2) in Figure 19 and comparing it with Figure (c) in Figure 19, when the floating album 1032 is detected to meet a first position condition with a position in the preset area, the electronic device determines that the floating album 1032 has been successfully moved to a position in the preset area. In this case, the electronic device still displays the Meitu XiuXiu tab 1012 and displays a portion of the floating album 1032 at a position in the preset area, displaying the navigation bar 101 as shown in Figure (e2) of Figure 19.

[0413] Similar to method 2.1, in the embodiment where a reminder message is displayed in the preset area, when it is detected that the floating album 1032 and a position in the preset area meet the first position condition, the reminder message may no longer be displayed, or the reminder message may be displayed continuously.

[0414] In Figure 19(e2), the user can release their finger, and in response to this action, the interface shown in Figure 18(f) is displayed. Alternatively, following Figure 19(e2), the user can continue to move the floating album 1032 into the navigation bar 101. After the floating album 1032 has been completely moved to the preset position of the navigation bar 101, the user can release their finger, and in response, the interface shown in Figure 19(f) is displayed.

[0415] Please refer to Figure 19(f) and Figure 19(g). This interface indicates that the sorting is complete. Within the navigation bar 101, the Meitu XiuXiu tag 1012a corresponding to the floating album 1032 is displayed in the preset position, and the Meitu XiuXiu tag 1012, originally located below the Weibo tag 1014, is no longer displayed. The Meitu XiuXiu tag 1012 and the content below it (such as other album tags 1013 and the new album control) are moved upwards synchronously, for example, by one position. This completes the sorting. Following the top-to-bottom arrangement, the sorted Meitu XiuXiu tag 1012a is placed in the first position of the ordinary album tags. Compared to the previous situation where the Meitu XiuXiu tag 1012 was placed in the fifth position of the ordinary album tags, the sorted Meitu XiuXiu tag 1012a is now at the very beginning. Thus, the sorting of the Meitu XiuXiu tags has been adjusted to the highest level. The content area and navigation bar are linked. Correspondingly, Meitu XiuXiu Album 1031 will no longer be displayed in the "More Albums" section of the content area. Meitu XiuXiu Album 1031 has been removed from "More Albums" and will be ranked first among the regular albums. Thus, after sorting, the order of Meitu XiuXiu tag 1012a in the regular albums will be consistent with the order of Meitu XiuXiu Album 1031 in the regular albums, both being ranked first.

[0416] Based on the above method, secondary album tags already exist in the preset area. Subsequently, users can continue to move albums from the content area to the preset area, dynamically expanding the list length of the preset area.

[0417] It should be noted that in the above embodiments, if there are no secondary album labels in the preset area, as shown in Figure 19(a), the preset area is not displayed in the navigation bar before the user performs a floating operation on the selected album, as shown in Figure 19(c). After the user performs a floating operation on the selected album and the floating album is displayed, the preset area in the navigation bar becomes empty; this preset area is actually an empty space. It can be understood that since the preset area is different from the first label area associated with ordinary album labels in the conventional layout, the user may not know that album labels can be moved to areas outside the first label area. Therefore, when there are no secondary album labels in the preset area, this empty space can remind the user to move albums from the content area to this location.

[0418] For the Meitu Xiu Xiu tag 1012a located in the aforementioned preset area after sorting, in some embodiments, since the sorted Meitu Xiu Xiu tag 1012a is arranged in the first position of the tags in the ordinary album, and since the "Album" tag group has the highest priority among the multiple tag groups in the ordinary album, the Meitu Xiu Xiu tag 1012 can actually be a tag in the "Album" tag group, only displayed in a more prominent position. Correspondingly, the sorted Meitu Xiu Xiu album is also classified into the highest priority "Album" group, as shown in Figure 19(f). Hereinafter, in order to more intuitively represent the sorted Meitu Xiu Xiu album and the grouping of Meitu Xiu Xiu tags, the sorting state of the album in the folded state shown in Figure 20 will be used for explanation.

[0419] Figure 20 is a set of interface diagrams showing the sorting status of the Meitu XiuXiu album after sorting the photos on the electronic device in a collapsed state, corresponding to Figure 19.

[0420] Please refer to Figure 20(a). This interface is the album interface, which includes more controls 1041. In response to the user clicking on more controls 1041, the interface shown in Figure 20(b) is displayed. This interface includes a menu list, which includes album sorting options 1042. In response to the user selecting album sorting options 1042, the interface shown in Figure 20(c) is displayed. Please refer to Figure 20(c). Interface 105 is the album sorting interface, which is an editable interface. It includes sorting items for each album in the regular album. The sorting of the sorting items for each album indicates the sorting of each album. It can be seen that the sorting item 1051 of Meitu XiuXiu album is at the top of the sorting items of the regular album and is classified into the "Album" option group. Therefore, for the navigation bar that is unique in the expanded state, the Meitu XiuXiu tab can also be classified into the "Album" tab group in the navigation bar.

[0421] In other embodiments, the Meitu Xiu Xiu tag 1012a can be independently a tag under a highest priority tag group, which has a higher priority than the "Album" tag group. Correspondingly, the Meitu Xiu Xiu album in the content area can also be independently an album under a highest priority album group (such as the frequently used album group), which has a higher priority than the "Album" album group.

[0422] In the above embodiments, the gallery application interface allows users to move albums from the content area to the navigation bar. The album's album tags are then sorted within the navigation bar to achieve album sorting. The sorting of the album's secondary album tags is updated in the navigation bar, which also updates the album's overall sorting within the regular albums. Before the sorting update, the album's secondary album tags are displayed in the navigation bar. This completes the album sorting. After the update, the order of the album's secondary album tags within the regular album's tags is consistent with the album's overall sorting within the regular album. However, the order of the album's secondary album tags within the regular album's tags after the update differs from the order before the update. Compared to the relatively cumbersome sorting process of existing technologies, the above sorting process has fewer and more convenient steps, resulting in a better user experience. Furthermore, the navigation bar has a preset area outside the tab area of ​​the regular albums (first tab area). This preset area can receive albums moved from the content area, achieving the effect of sorting and displaying secondary album tabs in an area outside the tabs of the regular albums. It is no longer limited to sorting in the tab area of ​​the regular albums, thus giving users greater freedom in sorting and a better user experience.

[0423] The above details the process of moving albums from the content area to the first tab area of ​​the navigation bar's regular album tabs for sorting (hereinafter referred to as sorting in the first tab area), and the process of moving albums from the content area to a preset area of ​​the navigation bar for sorting (hereinafter referred to as sorting in the preset area). In implementation, the above-mentioned methods of sorting in the preset area and sorting in the first tab area can be used in combination or individually, and this application embodiment does not impose any limitations.

[0424] Scene 5

[0425] The image display method in this application embodiment not only supports moving one album from the content area to the navigation bar for sorting at a time, but also supports moving multiple albums from the content area to the navigation bar for sorting at a time. In this way, compared with moving one album to the navigation bar at a time, the number of operations for the user is greatly reduced, and the operation is more convenient.

[0426] The following, referring to Figure 21 and comparing it with the scenario corresponding to Figure 16, uses multiple albums in the "Other Albums" tab corresponding to other albums as an example to describe in detail the process of moving multiple albums from the content area to the navigation bar for sorting. It should be understood that the following focuses on the differences from other embodiments described above, while the similarities or similarities with the embodiments described above are simplified.

[0427] Figure 21 is a schematic diagram of another set of interfaces of the image display method provided in the application embodiment.

[0428] Please refer to Figure 21(a). The content area interface 1121 is the interface for "Other Albums". The "Other Albums" tab 1111 is selected and highlighted. The content area interface 1121 includes all the albums in "Other Albums". The user has recently viewed Alipay Album 1131 and Toutiao Album 1132 more frequently, but these two albums are ranked lower and have a deeper hierarchy, making them inconvenient for the user to view. Therefore, the user wants to adjust the ranking of these two albums to be more prominent and reduce the album hierarchy.

[0429] Based on this, when a user performs a long press on any album in the content area (such as Alipay album 1131), the content area displays the interface 1122 shown in Figure 21(b).

[0430] Please refer to Figure 21(b). The content area displays interface 1122, which can also be understood as a material selection interface. It is an editable interface that includes multiple albums for the user to select. Among them, Alipay Album 1131 and Toutiao Album 1132 are selected. For example, the lower right corner of Alipay Album 1131 and Toutiao Album 1132 displays a selection mark "√". When the user performs a floating operation (such as a long press) on any of the selected albums (e.g., Alipay Album 1131), the content area displays interface 1123 as shown in Figure 21(c).

[0431] Please refer to Figure 21(c). Interface 1122 switches from edit mode to normal mode interface 1123, which includes various albums in "Other Albums". In response to the user's floating operation on any of the selected Alipay album 1131 and Toutiao album 1132 (such as Alipay album 1131), the floating state of the selected Alipay album 1131 and Toutiao album 1132 is displayed, that is, the floating album 1133 corresponding to the selected Alipay album 1131 and Toutiao album 1132 is displayed.

[0432] The floating album 1133 includes the floating albums of Alipay Album 1131 and Toutiao Album 1132, which are displayed on top of each other. Additionally, the floating album 1133 includes the number 2 corresponding albums. For example, the floating albums can be displayed in ascending order, with the topmost floating album corresponding to the first album in the sequence, and so on, with the bottommost floating album corresponding to the last album in the sequence. In the case of floating album 1133, Alipay Album 1131 is listed first in the sequence of Alipay Album 1131 and Toutiao Album 1132; therefore, the topmost floating album is the Alipay Album 1131, which is visible to the user. In this way, the floating albums are displayed in a top-to-bottom stacked order according to the order of each album. Users can quickly understand the order of the multiple albums corresponding to the floating albums. More importantly, when the floating album is moved to the navigation bar, the electronic device only needs to arrange the floating albums in the navigation bar in the order of stacking from top to bottom. Without affecting the order between the albums, the logic is simple and easy to operate, which can improve the response speed of the sorting process.

[0433] For example, the floating album 1133 can be overlaid on top of at least one of the corresponding Alipay album 1131 and Toutiao album 1132. In other examples, the floating album 1133 can also be displayed in any area of ​​the content area, and this application embodiment does not impose any limitations.

[0434] Following Figure 21(c), after the floating album 1133 is displayed, in response to the user's movement operation of moving the floating album 1133 towards the navigation bar 111, the electronic device moves the floating album 1133 into the navigation bar 111. Referring to Figure 21(d), when it is detected that the floating album 1133 meets the first position condition with a certain position (denoted as position 5), the electronic device determines that the floating album 1133 has been successfully moved to position 5. Therefore, in order to remind the user and improve the user's visual experience, for example, the electronic device synchronously moves the Meitu Xiu Xiu label 1114 originally displayed at position 5 and the content below the Meitu Xiu Xiu label 1114 (such as other album labels 1111, new album control) down, for example, temporarily moving them down by a distance of one position, and displaying the floating album 1132 separately at position 5.

[0435] Following Figure 21(d), in this case, the user can release their finger. In response to this release, two album labels corresponding to the floating album 1133 are added to the navigation bar 111: Alipay label 1112 and Toutiao label 1113, displaying the interface shown in Figure 21(e). Alternatively, the user can continue moving the floating album 1133 into the navigation bar 111. Once the floating album 1133 has completely moved to label position 5 on the navigation bar 111, the user can release their finger, displaying the interface shown in Figure 21(e).

[0436] Please refer to Figure (e) in Figure 21, which indicates that the sorting is complete. Comparing with Figure 21(d), within the navigation bar 111, the floating album 1133 displayed at position 5 disappears. Starting from position 5, following the top-to-bottom stacking order of the floating album 1133, the album tags of the two albums corresponding to the floating album 1133 are arranged sequentially from top to bottom in two positions of the navigation bar 111. These two positions include position 5 and position 6, which is consecutively distributed with position 5. One album tag is displayed in each position. Thus, position 5, which is at the front, displays the Alipay tag 1112 of the Alipay album, which is at the front of the sorting, while position 6, which is below position 5, displays the Toutiao tag 1113 of the Toutiao album, which is at the back of the sorting. This ensures that the sorting between Alipay tag 1112 and Toutiao tag 1113 is the same as the sorting between Alipay album and Toutiao album before the sorting. In this way, the sorting between Alipay album and Toutiao album remains unchanged before and after the sorting, that is, Alipay album is sorted first and Toutiao album is sorted last.

[0437] It should be understood that in Figure 21(d), because the album 1133 is floating, the Meitu Xiu Xiu label 1114 originally displayed at position 5 and the content below Meitu Xiu Xiu 114 are moved down synchronously. In Figure 21(e), because two album labels need to be added in the navigation bar 111, and these two album labels need to be displayed in two positions, the electronic device will continue to move the previously moved content down synchronously, for example, by moving it down by one position. In this way, empty space can be left for the two album labels that need to be displayed, leaving positions 5 and 6.

[0438] Please continue referring to Figure 21(e). After sorting, Alipay tag 1112 and Toutiao tag 1113 are arranged above Meitu XiuXiu tag 1114 and below Weibo tag, respectively, in the 5th and 6th positions of the tags in the regular album, following the top-to-bottom arrangement. Thus, Alipay tag 1112 and Toutiao tag 1113 are added as two secondary album tags in the navigation bar 111, completing their sorting within the navigation bar 111. Alipay tag 1112 and Toutiao tag 1113 are located under the "More" tag group. The content area is linked to the navigation bar. Correspondingly, in the content area, Alipay Album 1131 and Toutiao Album 1132 are no longer displayed in the "Other Albums" interface 1123. Alipay Album 1131 and Toutiao Album 1132 are removed from "Other Albums" and placed under "More Albums" as shown in Figure 9(a), arranged before Meitu Xiu Xiu Album and after Weibo Album. According to the top-down arrangement order, Alipay Album and Toutiao Album are arranged in the 5th and 6th positions of the ordinary albums, respectively. In addition, since Alipay Album 1131 and Toutiao Album 1132 are removed from "Other Albums", the number of albums in "Other Albums" changes from 6 to 4. Therefore, please refer to Figure 21(f), the number of albums displayed in the Other Albums tab 1111 changes from 6 to 4. Thus, after sorting, the Alipay tag 1112 and the Toutiao tag 1113 are sorted in the same order as the Alipay album and the Toutiao album in the same order, both in the 5th and 6th positions respectively.

[0439] Thus, by moving the Alipay Album and Toutiao Album from the content area to the navigation bar, and sorting the album tags of Alipay Album and Toutiao Album, the sorting of Alipay Album and Toutiao Album in the photo library application can be achieved.

[0440] Figure 22 is a schematic flowchart of the image display method provided in an embodiment of this application.

[0441] In step S221, in response to an operation on the gallery application, the electronic device displays a first interface. The first interface includes a navigation bar and a content area. The navigation bar includes primary album labels (e.g., album tags) and labels for first-category albums (e.g., regular albums). The labels for first-category albums include M secondary album labels under the primary album labels. Each primary album label corresponds to at least one first-category album. When a primary album label is selected, the content area can display each album in the corresponding first-category album. Each secondary album label corresponds to an album group or an album in the first-category album. When an album tag is selected, the content area can display each album in the corresponding album group or each image material in an album. The order of each secondary album tag in the navigation bar in the first category of album tags is consistent with the order of the albums corresponding to each secondary album tag in the content area in the first category of albums. Image materials include images and / or videos, and M is an integer greater than or equal to 1. The content area displays at least some of the albums in all albums corresponding to the selected album tag. The selected album tag is one of the primary album tag and M secondary album tags.

[0442] For example, the first interface may be the interface shown in Figure 16(a), Figure 17(b), Figure 18(a), or Figure 20(a).

[0443] In some embodiments, when a user clicks the icon of the Gallery app on the desktop, the electronic device displays the Gallery app interface in response to the user's click. The interface includes a navigation bar and a content area. When the user selects an album tab (such as an album tag or other album tags) in the navigation bar, a first interface is displayed in response to the user's selection of the album tag. In the first interface, the selected album tag in the navigation bar can be highlighted to facilitate the user's focus on the currently selected content. The content area displays at least a portion of the albums corresponding to the selected album tag.

[0444] In other embodiments, when a user clicks the Gallery app icon on the desktop, the electronic device displays the Gallery app interface in response to the user's click. This interface is the first interface, in which an album tab in the navigation bar is selected, and the content area displays at least a portion of the albums corresponding to the selected album tab. It should be understood that the first interface displayed in this case could be the interface displayed by the Gallery app before the user opened the Gallery app this time.

[0445] For example, the first type of album can be a regular album, and the tags of the first type of album can be the tags of a regular album.

[0446] A primary album tag must correspond to at least the first type of album. This means that a primary album tag can correspond to a first-type album, or it can correspond to other types of albums, such as a second-type album, which could be a smart album. For example, please refer back to Figure 9(a), where the primary album tag corresponds to both a regular album (an example of a first-type album) and a smart album (an example of a second-type album). As another example, please refer back to Figure 10(a), where the primary album tag corresponds to a regular album (an example of a first-type album).

[0447] The phrase "at least some albums among all albums corresponding to the selected album tag" refers to either some or all albums within all albums. It's understandable that, due to screen size limitations, when there are many albums corresponding to the selected album tag, the content area will display a portion of all albums, and the user will see all albums by scrolling up and down. When the selected album tag is a first-level album tag, all albums refer to the first category of albums corresponding to that first-level album tag. When the selected album tag is one of M second-level album tags, all albums refer to the albums within the album group corresponding to that second-level album tag.

[0448] The order of the secondary album tags in the navigation bar within the first category of album tags is consistent with the order of the albums corresponding to the secondary album tags in the content area within the first category of album tags. This means that the order of the same album in the content area within the first category of album tags is consistent with the order of the secondary album tags corresponding to the same album in the navigation bar within the first category of album tags. For a detailed description of this, please refer to the relevant description above in conjunction with Figure 9, which will not be repeated here.

[0449] In step S222, in response to the movement operation of moving the N1 albums selected from all albums to the navigation bar, the electronic device updates the display of the N1 secondary album labels corresponding to each of the N1 albums in the navigation bar, thereby updating the sorting of the N1 albums in the first category of albums. After the update, the sorting of the N1 secondary album labels in the navigation bar within the labels of the first category of albums is consistent with the sorting of the N1 albums in the content area within the first category of albums. Thus, the purpose of sorting the albums is achieved.

[0450] For example, a move operation can be any operation that can move the position of the object being acted on, such as dragging or sliding.

[0451] The "updating and displaying N1 secondary album tabs in the navigation bar" described in this application embodiment can have multiple forms.

[0452] In one scenario (denoted as Scenario 1), updating the display of N1 secondary album labels in the navigation bar means adding N1 secondary album labels to the navigation bar, thereby updating the first-class album labels in the navigation bar and updating the order of the N1 albums in the content area. In this case, the updated first-class album (such as a regular album) labels include M secondary album labels and N1 secondary album labels, as shown in the scenarios corresponding to Figures 16, 17, and 21 above.

[0453] In another scenario (denoted as Scenario 2), updating the display of N1 secondary album labels in the navigation bar means updating the order of the existing N1 secondary album labels in the navigation bar, thereby updating the first-type album labels in the navigation bar, and also updating the order of the N1 albums in the content area. In this case, the updated first-type album (such as a regular album) still has M secondary album labels, but the order of the N1 secondary album labels among the M secondary album labels has changed, as shown in the scenarios corresponding to Figures 18 and 19 above.

[0454] In some embodiments, the M secondary album tags include a first set of album tags and a second set of album tags. Each secondary album tag in the first set of album tags corresponds to an album in a certain type of album. When each secondary album tag in the first set of album tags is selected, the content area can display the various image materials in the corresponding album. Each secondary album tag in the second set of album tags corresponds to an album group in the first type of album. When each secondary album tag in the second set of album tags is selected, the content area can display the various albums in the corresponding album group. The navigation bar does not include the album tags of the various albums in the album group corresponding to each secondary album tag in the second set of album tags.

[0455] For a detailed description of the first and second album tags, please refer to the relevant descriptions above, which will not be repeated here.

[0456] In the embodiments where the above M secondary album labels include a first part album label and a second part album label, corresponding to the above situation 1, in some embodiments, the selected album label is the first album label in the second part album label (such as other album labels), the content area displays at least some albums in the first album group (such as the "other albums" album group) corresponding to the first album label, and the labels of the first type of albums in the navigation bar before the update (such as the labels of ordinary albums) do not include the album labels of each album in the first album group; and, in the above step of updating and displaying N1 secondary album labels corresponding to N1 albums in the navigation bar in response to the movement operation of moving N1 albums selected from all albums to the navigation bar, for example, in response to the movement operation of moving N1 albums selected from the first album group to the navigation bar, the electronic device adds N1 secondary album labels to the navigation bar, and the labels of the first type of albums in the navigation bar after the update include N1 secondary album labels and M secondary album labels.

[0457] This embodiment corresponds to the scenarios shown in Figures 16 and 21 above. The first album tab selected in the navigation bar is the "Other Albums" tab, and the first album group displayed in the content area is the "Other Albums" album group. In Figure 16, the tabs of the ordinary albums before the update (an example of the tabs of the first type of album) do not include the Alipay tab shown in Figure 16. After sorting, the electronic device adds the Alipay tab shown in Figure 16 to the navigation bar. The tabs of the ordinary albums after the update (an example of the tabs of the first type of album) include the Alipay tab and the original multiple (e.g., M) secondary album tabs. After the update, the Alipay album is ranked higher in the ordinary albums, and the Alipay tab in the ordinary albums is ranked in the same order as the Alipay album in the ordinary albums, both being ranked in the 5th position. Similarly, in Figure 21, the labels of the ordinary album before the update (an example of the labels of the first type of album) do not include the Alipay label and the Toutiao label shown in Figure 21. After sorting, the electronic device adds the Alipay label and the Toutiao label shown in Figure 21 to the navigation bar. The labels of the ordinary album after the update (an example of the labels of the first type of album) include the Alipay label, the Toutiao label, and multiple (e.g., M) secondary album labels that were originally present. After the update, the Alipay album and the Toutiao album are sorted more prominently in the ordinary album. The order of the Alipay label and the Toutiao label in the ordinary album is consistent with the order of the Alipay album and the Toutiao album in the ordinary album, and they are sorted in the 5th and 6th positions respectively.

[0458] In the embodiment where the above M secondary album labels include a first part album label and a second part album label, corresponding to case 1 above, in other embodiments, the selected album label is a primary album label, and the content area displays at least some albums in the first album group of the first type of albums corresponding to the primary album label. The first album group (such as the "Other Albums" album group) contains each album in the first album group in the form of a folder. Before the update, the labels of the first type of albums do not include the album labels of each album in the first album group. In addition, in the above step of updating and displaying N1 secondary album labels corresponding to N1 albums in the navigation bar in response to the movement operation of moving N1 albums selected from all albums to the navigation bar, for example, in response to the movement operation of moving N1 albums selected from the first album group to the navigation bar, the electronic device adds N1 secondary album labels to the navigation bar. After the update, the labels of the first type of albums include N1 secondary album labels and M secondary album labels.

[0459] This embodiment corresponds to the scenario shown in Figure 17 above. The selected album tab in the navigation bar is an album tab (an example of a first-level album tab). The albums in the "Other Albums" album group (an example of the first album group) are stored in "Other Albums" as folders. When the user clicks "Other Albums", the various albums in "Other Albums" are displayed in response to the user's operation. Before the update, the tabs of ordinary albums (an example of the tabs of the first type of album) did not include the Alipay tab shown in Figure 17. After the update, the electronic device adds the Alipay tab shown in Figure 17(e) to the navigation bar. After the update, the tabs of ordinary albums include the Alipay tab and the original multiple (e.g., M) second-level album tabs. After the update, the Alipay album is ranked higher in the ordinary albums. The ranking of the Alipay tab in the ordinary albums is the same as the ranking of the Alipay album in the ordinary albums, both ranked in the 5th position.

[0460] Corresponding to situation 2 above, in some embodiments, the selected album tag is a first-level album tag, the content area displays at least some albums in the first type of albums corresponding to the first-level album tag, and the first type of album tags in the navigation bar before the update include N1 second-level album tags; and, in response to the move operation of moving the N1 albums selected from all albums to the navigation bar, updating the display of the N1 second-level album tags corresponding to the N1 albums in the navigation bar includes: in response to the move operation of moving the N1 albums selected from the first type of albums to the navigation bar, updating the sorting of the N1 second-level album tags in the navigation bar, and the sorting of the N1 second-level album tags in the first type of album tags in the updated navigation bar is different from the sorting of the N1 second-level album tags in the first type of album tags in the navigation bar before the update.

[0461] This embodiment corresponds to the scenarios shown in Figures 18 and 19 above. Taking Figure 18 as an example, the selected album tab in the navigation bar is an album tab (an example of a first-level album tab). The content area displays at least some albums in the ordinary albums (an example of a first-class album) corresponding to the album tab. The adjustment is to the sorting of Meitu Xiu Xiu albums (an example of N1 albums, N1=1). Before the update, the tags of ordinary albums included Meitu Xiu Xiu tags. After the update, the sorting of Meitu Xiu Xiu tags in ordinary albums is different from the sorting of Meitu Xiu Xiu tags in ordinary albums before the update.

[0462] Prior to step S222 above, in some embodiments, in response to the floating operation of N1 albums, the electronic device displays the floating albums corresponding to the N1 albums; and in step S222, in response to the move operation of moving the floating albums to the navigation bar, the electronic device updates and displays the N1 secondary album tags corresponding to the floating albums in the navigation bar.

[0463] For example, the floating operation is a long press operation on any of the N1 selected albums. For example, the floating operation can also be a swipe operation (such as a swipe up, a swipe down, a swipe along a preset direction, etc.) or other preset operations on any of the N1 selected albums, and this application embodiment does not make any limitation.

[0464] For a detailed description of the floating album, please refer to the relevant description above, which will not be repeated here.

[0465] In other embodiments, for N1 albums selected by the user, in response to the user's selection operation of the N1 albums, the electronic device may not display the floating albums corresponding to the N1 albums, but instead configure the N1 albums to be movable, so that the user can move the N1 albums. This application embodiment does not make any limitation.

[0466] In the above-described step of updating and displaying N1 secondary album tabs in the navigation bar in response to a user's movement operation of moving the floating album to the navigation bar, in some embodiments, in response to a movement operation of moving the floating album to a first position in the navigation bar and a user's release operation of the floating album, the N1 secondary album tabs are displayed at least at the first position.

[0467] It should be understood that the above-mentioned first position refers to the position where the floating album has been successfully moved. When the floating album is successfully moved to the first position, after the user releases the floating album, the electronic device can display at least N1 secondary album tags corresponding to the floating album in response to the user's release operation.

[0468] It should also be understood that the phrase "displaying the N1 secondary album tags at least in the first position" described in the embodiments of this application means that not only can the N1 secondary album tags be displayed in the first position, but the N1 secondary album tags can also be displayed in multiple positions including the first position.

[0469] In one example, N1 = 1, and the electronic device displays N1 secondary album tabs in the first position. This can be seen in the descriptions in Figures 16 to 20.

[0470] In another example, N1 is greater than 1, and the electronic device displays N1 secondary album tabs in N1 locations, including the first location, which are continuously distributed within the navigation bar. This can be seen in the description of Figure 21, where the first location corresponds to location 5, and the N1 locations correspond to locations 5 and 6 in Figure 21.

[0471] For example, if N1 is greater than 1, the order of the N1 secondary album tabs in the navigation bar is the same as the order of the N1 albums in the content area before the update.

[0472] In other words, the update changes the order of the N1 albums in the first category of albums, but does not change the order among the N1 albums themselves. In implementation, the electronic device displays the N1 secondary album labels in N1 corresponding positions along the first direction, according to the order of the N1 albums from front to back.

[0473] For example, consider N1 albums, including Album 1 and Album 2. Before the update, Album 1 and Album 2 are adjacent, and Album 1 is ranked before Album 2. Album 1 is ranked 5th in the first category of albums, and Album 2 is ranked 6th in the first category of albums. After the update, Album 1 and Album 2 are still adjacent, and Album 1 is ranked before Album 2, but the order of both albums has been adjusted. Album 1 is now ranked 3rd in the first category of albums, and Album 2 is now ranked 4th in the first category of albums. Further comparing Figure 21, before and after the update, Alipay Album was always ranked before Toutiao Album, but after the update, the overall order of Alipay Album and Toutiao Album has been adjusted to be higher.

[0474] For example, N1 is greater than 1, and the first position along the first direction is the first of the N1 positions. The first direction is the direction that extends from the beginning of the navigation bar to the end of the navigation bar.

[0475] In other words, although the floating album only occupies the first position, N1 positions need to be left empty to display N1 secondary album labels. In the implementation, N1 secondary album labels are displayed sequentially along the first direction starting from the first position.

[0476] In this embodiment, the floating album can be moved to any position in the area of ​​the navigation bar that supports receiving albums, with the first position being any position within that area. Specifically, within the area that supports receiving albums, the floating album can successfully move to any position within that area and, after the user releases their finger, display N1 corresponding secondary album tabs. In other words, the area that supports receiving albums is used to receive the floating album.

[0477] In some embodiments, the area supporting receiving albums includes a first tab area, which includes multiple contents including at least some of the album tabs among M secondary album tabs, and the first position is the position of any one of the multiple contents.

[0478] This embodiment corresponds to the scenarios in Figures 16 to 18, in which the floating album is moved to the position of the first tab area. For a detailed description of the first tab area, please refer to the relevant description above, which will not be repeated here.

[0479] In other embodiments, the area supporting receiving the album includes a preset area located on either side of the first tab area, and the first position is a position within the preset area.

[0480] It should be understood that either side of the first tab area refers to the side closer to the start of the navigation bar or the side farther from the end of the navigation bar. The side of the first tab area closer to the start of the navigation bar can be referred to as the first side of the first tab area, and the side of the first tab area farther from the start of the navigation bar can be referred to as the second side of the first tab area.

[0481] In one example, the preset area is located on the first side of the first tab area, which is close to the beginning of the navigation bar. For instance, the Smart Album tabs are located on the first side of the first tab area, and the preset area is situated between multiple primary tabs and the Smart Album tabs.

[0482] This embodiment corresponds to the scenario in Figure 19, which describes the scenario of moving the floating album to a preset area. For a detailed description of the preset area, please refer to the relevant description above, which will not be repeated here.

[0483] As the floating album is moved toward the navigation bar, the electronic device will detect the position of the floating album in real time to determine whether the floating album has moved to a position in the navigation bar that supports receiving albums.

[0484] In some embodiments, prior to the aforementioned movement operation in response to moving the floating album to the first position of the navigation bar and the user releasing the floating album, before displaying the N1 secondary album tabs at least at the first position, in response to the operation of moving the floating album to the navigation bar, when it is detected that the floating album and the first position satisfy the first position condition, it is determined that the floating album has moved to the first position.

[0485] In this way, after the floating album is moved to the first position, the electronic device will only respond to the user's release operation and display the N1 secondary album labels corresponding to the floating album after the user releases the floating album.

[0486] It should be understood that "determining that the floating album has moved to the first position" as described in the embodiments of this application means that the floating album has been successfully moved to the first position.

[0487] In some embodiments, the first location condition is that the floating album overlaps with a location in the area of ​​the navigation bar that supports receiving albums, and the area that supports receiving albums is used to receive the floating album.

[0488] In other embodiments, the first position condition can also be other preset conditions. For example, the first position condition can be: the floating album and the first position do not overlap, but the distance between them is less than a preset distance. In this case, it can also be determined that the floating album moves to the first position. The preset distance is a small value and can be flexibly set based on the actual situation.

[0489] For a detailed description of the first position condition, please refer to the relevant description in Figure 16 above, which will not be repeated here.

[0490] During the process of moving the floating album to the navigation bar, although the floating album has been successfully moved to the first position, the user may not be able to accurately perceive it, nor may they release it in time, which will affect the sorting speed and the user experience to some extent.

[0491] Based on this, embodiments of this application further propose that, in some embodiments, in response to the operation of moving the floating album to a first position, the electronic device moves the content displayed at the first position and at least a portion of the content continuously displayed on either side of the first position along the length direction of the navigation bar (e.g., moving it up or down) to display the floating album separately at the first position; in response to the release operation of the floating album, the electronic device displays at least N1 secondary album tabs at the first position.

[0492] In other words, before the floating album moves to the first position, the first position originally displays content. After it is determined that the floating album has moved to the first position, in response to the operation of moving the floating album to the first position, in order to free up the first position, the electronic device will move the content originally displayed in the first position and at least a portion of the content continuously displayed on either side of the first position along the length direction of the navigation bar (such as moving it up or down), so that the floating album is displayed alone in the freed first position.

[0493] In this way, the empty first position can promptly notify the user that the floating album has been successfully moved to the first position, so that the user can release the button in time to quickly display the N1 secondary album tags corresponding to the floating album, improving the overall sorting speed and thus improving the user experience; in addition, displaying the floating album separately in the empty first position can improve the user's visual experience.

[0494] It should be understood that multiple pieces of content are displayed on either side of the first position (such as multiple secondary album tabs, a new album control, a recently deleted tab, etc., on the side of the first position near the end of the navigation bar). The phrase "at least a portion of the content continuously displayed on either side of the first position" refers to a portion or all of the multiple pieces of content continuously displayed on either side of the first position. When moving content in the first position, the movement of either portion or all of the continuously displayed content on either side of the first position can be flexibly set according to the actual situation. If the electronic device can move a portion of the continuously displayed content on either side of the first position, it means that another portion of the content is set to be immovable, such as the recently deleted tab located at the end of the navigation bar (e.g., at the bottom) being set to be immovable.

[0495] It should also be understood that "displaying the floating album separately at a first position" as described in the embodiments of this application means that only the floating album is displayed at the first position, and no other content is displayed. In addition, displaying the floating album separately at the first position can be displaying a part of the floating album or displaying the entire area of ​​the floating album, and there is no limitation here.

[0496] For ease of description, the content displayed in the first position and at least a portion of the content continuously displayed on either side of the first position will be referred to as the relevant content of the first position.

[0497] For example, when moving the first relevant content, the electronic device can move the relevant content at the first position a distance along the length of the navigation bar. In this way, the overall layout of the navigation bar can be kept consistent before and after the movement.

[0498] In one example of the steps described above for moving the content at the first position, in response to the operation of moving the floating album to the first position, the electronic device moves the content displayed at the first position and at least a portion of the content continuously displayed on the second side of the first position toward the end of the navigation bar (downward movement), wherein the second side of the first position is near the end of the navigation bar. For example, if the navigation bar is a vertical navigation bar and its end is the bottom of the navigation bar, moving the content at the first position moves the content at the first position toward the bottom of the navigation bar, which can also be described as moving the content at the first position downward.

[0499] For a detailed description of the above embodiments, please refer to the relevant descriptions in Figures 16 to 21 above. Taking Figure 16 as an example, when the floating album corresponding to Alipay Album is detected to have moved to position 1 (an example of the first position), the electronic device will synchronously move down the Meitu Xiu Xiu label 812 displayed at position 1 and some content below Meitu Xiu Xiu 812 (such as other album labels 811, new album control, excluding recently deleted labels), for example, synchronously move down by a distance of one position, and display the floating album 832 separately at position 1.

[0500] In another example, in response to the operation of moving the floating album to a first position, the electronic device moves the content displayed at the first position, as well as at least a portion of the content continuously displayed on a first side of the first position, toward the beginning of the navigation bar (as below), wherein the first side of the first position is close to the beginning of the navigation bar. For example, in an embodiment where the navigation bar is a vertical navigation bar, when moving the relevant content at the first position, the electronic device moves the relevant content at the first position toward the top of the navigation bar, which can also be described as moving the relevant content at the first position upwards.

[0501] In practice, the direction of the content moving the electronic device to the first position can be flexibly set based on the design of the navigation bar and the actual situation (near the beginning or end of the navigation bar). This application embodiment does not impose any limitations.

[0502] It should be noted that during the process of moving the floating album into the navigation bar, the user can move the floating album multiple times along the length of the navigation bar (such as up or down). The electronic device will detect multiple times that the floating album meets the first position condition with multiple positions. Each time the floating album meets the first position condition with a certain position, the electronic device will move the relevant content of that position along the length of the navigation bar until the user releases the button. The electronic device will then display the N1 secondary album label corresponding to the floating album.

[0503] It should be understood that the above example of moving the relevant content in the first position is merely illustrative and should not constitute a limitation on the embodiments of this application. In other embodiments, when moving the floating album to the first position, the electronic device may not need to move the relevant content in the first position. Instead, the electronic device will move the relevant content in the first position only after the user releases their hand. In this way, after releasing the hand, the first position or N1 (N1 greater than 1) positions including the first position will be vacated to display N1 secondary album tabs.

[0504] In some embodiments, the navigation bar includes a second tab area, the second tab area includes tabs for a second type of album, and / or the second tab area includes multiple first-level tabs including first-level album tabs, the multiple first-level tabs further including at least one of the following: photo tab, memory tab, or creation tab, the second type of album tabs include at least one second-level album tab, the second type of album tabs are located on a first side of the first type of album tabs, the first side of the first type of album tabs is close to the start end of the navigation bar; and the above-described step of displaying the floating albums corresponding to the N1 albums in response to the floating operation of the N1 albums includes:

[0505] In response to the floating operation of N1 albums, the floating albums corresponding to N1 albums are displayed, and the content in the second tab area is displayed in the navigation bar by switching from the first display mode to the second display mode. The second display mode is used to remind the user that it is not supported to move the floating albums to the second tab area.

[0506] For example, the second type of album is a smart album.

[0507] For example, the second display mode is a grayed-out display mode.

[0508] For a detailed description of the second label area displayed using the second display method, please refer to the relevant descriptions of the two display methods in Figure 16 above, which will not be repeated here.

[0509] The image display method has been described in detail above. It should be understood that the way the navigation bar sorts the album when it is in normal state, as shown in the above example, is only illustrative and should not be construed as limiting the embodiments of this application.

[0510] It should be understood that the sequence number of each process in the above embodiments does not imply the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of the present invention.

[0511] Figure 23 is a schematic structural diagram of the electronic device 2300 provided in an embodiment of this application. The electronic device 2300 is used to execute the corresponding steps and / or processes in any of the above method embodiments. The electronic device 2300 shown in Figure 23 can correspond to the electronic device 100 shown in Figure 5.

[0512] Electronic device 2300 includes a processor 2310, a transceiver 2320, and a memory 2330. The processor 2310, transceiver 2320, and memory 2330 communicate with each other via internal interconnection. The processor 2310 can implement the functions of the processor 2310 in various possible implementations of electronic device 2300. The memory 2330 is used to store instructions, and the processor 2310 is used to execute the instructions stored in the memory 2330. In other words, the processor 2310 can call these stored instructions to implement the functions of the processor 2310 in electronic device 2300.

[0513] Optionally, the memory 2330 may include read-only memory and random access memory, and provide instructions and data to the processor. A portion of the memory may also include non-volatile random access memory. For example, the memory may also store device type information. The processor 2310 may be used to execute instructions stored in the memory, and when the processor 2310 executes instructions stored in the memory, the processor 2310 is used to perform various steps and / or processes of the method embodiments corresponding to the above-described electronic device.

[0514] Electronic device 2300 is used to execute the various processes and steps corresponding to the electronic device in any of the above methods. For a detailed description, please refer to the description above, which will not be repeated here.

[0515] It should be understood that, in the embodiments of this application, the processor of the above-described device can be a central processing unit (CPU), which can also be other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor can be a microprocessor or any conventional processor, etc.

[0516] In implementation, each step of the above method can be completed by integrated logic circuits in the processor's hardware or by instructions in software. The steps of the method disclosed in the embodiments of this application can be directly manifested as execution by a hardware processor, or as a combination of hardware and software units within the processor. The software units can reside in random access memory, flash memory, read-only memory, programmable read-only memory, electrically erasable programmable memory, registers, or other mature storage media in the art. This storage medium is located in memory, and the processor executes the instructions in the memory, combining them with its hardware to complete the steps of the above method. To avoid repetition, detailed descriptions are omitted here.

[0517] This application provides a computer program product that, when run on a terminal device, causes the terminal device to execute the technical solutions described in the above embodiments. Its implementation principle and technical effects are similar to those of the related embodiments described above, and will not be repeated here.

[0518] This application provides a readable storage medium containing instructions that, when executed by a terminal device, cause the terminal device to perform the technical solution described in the above embodiments. The implementation principle and technical effects are similar and will not be repeated here.

[0519] In the above embodiments, implementation can be achieved, in whole or in part, through software, hardware, firmware, or any combination thereof. When implemented in software, it can be implemented, in whole or in part, as a computer program product. The computer program product includes one or more computer instructions. When the computer 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 via wired (e.g., coaxial cable, fiber optic, digital subscriber line (DSL)) or wireless (e.g., infrared, wireless, microwave, etc.) means. The computer-readable storage medium can be any available medium accessible to a computer or a data storage device such as a server or data center that integrates one or more available media. The available media may be magnetic media (e.g., floppy disks, hard disks, magnetic tapes), optical media (e.g., high-density digital video discs (DVDs)), or semiconductor media (e.g., solid-state disks (SSDs)).

[0520] It should be understood that the term "embodiment" used throughout the specification means that a specific feature, structure, or characteristic related to an embodiment is included in at least one embodiment of this application. Therefore, various embodiments throughout the specification do not necessarily refer to the same embodiment. Furthermore, these specific features, structures, or characteristics can be combined in any suitable manner in one or more embodiments. It should be understood that in the various embodiments of this application, the sequence numbers of the above processes do not imply a sequential order of execution; the execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of this application.

[0521] It should also be understood that in this application, “when…”, “if” and “if” all refer to the UE or base station taking corresponding actions under certain objective circumstances, and are not time-limited, nor do they require the UE or base station to perform a judgment action, nor do they imply any other limitations.

[0522] Those skilled in the art will understand that the various numerical designations such as "first," "second," etc., involved in this application are merely for the convenience of description and are not intended to limit the scope of the embodiments of this application, nor do they indicate the order of sequence.

[0523] In this application, the use of singular pronouns to denote "one or more" rather than "one and only one," unless otherwise specified. In this application, unless otherwise specified, "at least one" is intended to mean "one or more," and "more than" is intended to mean "two or more."

[0524] In this article, the term "and / or" is merely a description of the relationship between related objects, indicating that there can be three relationships. For example, A and / or B can represent three cases: A exists alone, A and B exist simultaneously, and B exists alone. Here, A can be singular or plural, and B can be singular or plural.

[0525] In this document, the terms "at least one of..." or "at least one of..." refer to all or any combination of the listed items. For example, "at least one of A, B, and C" can mean: A exists alone, B exists alone, C exists alone, A and B exist simultaneously, B and C exist simultaneously, and A, B, and C exist simultaneously. A can be singular or plural, B can be singular or plural, and C can be singular or plural.

[0526] Those skilled in the art will recognize that the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, or a combination of computer software and electronic hardware. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of this application.

[0527] Those skilled in the art will understand that, for the sake of convenience and brevity, the specific working processes of the systems, devices, and units described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here.

[0528] In the several embodiments provided in this application, it should be understood that the disclosed systems, apparatuses, and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between apparatuses or units may be electrical, mechanical, or other forms.

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

[0530] In addition, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit.

[0531] If the aforementioned functions are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or a portion of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0532] The same or s...

Claims

1. An image display method, characterized in that, The method includes: In response to an operation on the gallery application, a first interface is displayed. The first interface includes a navigation bar and a content area. The navigation bar includes primary album tabs and tabs for a first category of albums. Each first category of album tab includes M secondary album tabs under the primary album tabs. Each primary album tab corresponds to at least one album within the first category. When a primary album tab is selected, the content area displays the corresponding albums within the first category. Each secondary album tab corresponds to an album group or an album within the first category. When each secondary album tab is selected, the content area can... The content displays each album in a corresponding album group or each image material in an album. The order of each secondary album tag in the navigation bar within the tags of the first type of album is consistent with the order of the albums corresponding to each secondary album tag in the content area within the first type of album. The image materials include images and / or videos, and M is an integer greater than or equal to 1. The content area displays at least a portion of all albums corresponding to the selected album tag. The selected album tag is one of the primary album tag and the M secondary album tags. In response to a move operation that moves N1 albums selected from all albums to the navigation bar, the navigation bar updates and displays N1 secondary album tags corresponding to each of the N1 albums, thereby updating the sorting of the N1 albums in the content area within the first type of albums. After the update, the sorting of the N1 secondary album tags in the navigation bar within the tags of the first type of albums is consistent with the sorting of the N1 albums in the content area within the first type of albums.

2. The image display method according to claim 1, characterized in that, The M secondary album tags include a first set of album tags and a second set of album tags. Each secondary album tag in the first set of album tags corresponds to an album in the first type of album. When each secondary album tag in the first set of album tags is selected, the content area can display the various image materials in the corresponding album. Each secondary album tag in the second set of album tags corresponds to an album group in the first type of album. When each secondary album tag in the second set of album tags is selected, the content area can display the various albums in the corresponding album group. The navigation bar does not include the album tags of the various albums in the album group corresponding to each secondary album tag in the second set of album tags.

3. The image display method according to claim 2, characterized in that, The selected album tag is the first album tag in the second part of album tags. The content area displays at least some albums in the first album group corresponding to the first album tag. Before the update, the tags of the first type of albums did not include the album tags of each album in the first album group. as well as, The action of moving N1 albums selected from all albums to the navigation bar, updating and displaying N1 secondary album tags corresponding to each of the N1 albums in the navigation bar, includes: In response to a move operation that moves N1 albums selected from the first album group to the navigation bar, the navigation bar adds and displays the N1 secondary album labels. After the update, the labels of the first type of albums in the navigation bar include the N1 secondary album labels and the M secondary album labels.

4. The image display method according to claim 3, characterized in that, After the update, the N1 secondary album tabs are arranged on the first side of the first album tab, and the first side of the first album tab is close to the beginning of the navigation bar.

5. The image display method according to any one of claims 2 to 4, characterized in that, The albums corresponding to the second part of the album tags have a lower priority than at least some of the albums corresponding to the first part of the album tags.

6. The image display method according to claim 5, characterized in that, At least some of the album labels of the first part are arranged on the first side of the second part of the album labels, and the first side of the second part of the album labels is close to the beginning of the navigation bar.

7. The image display method according to claim 1 or 2, characterized in that, The selected album tag is the first-level album tag, and the content area displays at least some albums in the first type of albums corresponding to the first-level album tag. Before the update, the tags of the first type of albums include the N1 second-level album tags. as well as, The action of moving N1 albums selected from all albums to the navigation bar, updating and displaying N1 secondary album tags corresponding to each of the N1 albums in the navigation bar, includes: In response to a move operation that moves the N1 albums selected from the first type of albums to the navigation bar, the sorting of the N1 secondary album tags in the navigation bar is updated. The sorting of the N1 secondary album tags in the navigation bar in the first type of albums after the update is different from the sorting of the N1 album tags in the navigation bar in the first type of albums before the update.

8. The image display method according to any one of claims 1 to 7, characterized in that, In response to the move operation of moving N1 albums selected from all albums to the navigation bar, before updating and displaying the N1 secondary album labels corresponding to the N1 albums in the navigation bar, the method further includes: In response to the floating operation of the N1 albums, display the floating albums corresponding to the N1 albums; and, The action of moving N1 albums selected from all albums to the navigation bar, updating and displaying N1 secondary album tags corresponding to each of the N1 albums in the navigation bar, includes: In response to a move operation that moves the floating album to the navigation bar, the N1 secondary album tabs corresponding to the floating album are updated and displayed in the navigation bar.

9. The image display method according to claim 8, characterized in that, The step of responding to a movement operation that moves the floating album to the navigation bar, and updating the display of the N1 secondary album tabs corresponding to the floating album in the navigation bar, includes: In response to a movement operation that moves the floating album to a first position in the navigation bar and a user releases the floating album, at least the N1 secondary album tabs are displayed at the first position.

10. The image display method according to claim 9, characterized in that, The response to a movement operation that moves the floating album to a first position in the navigation bar and a user releases the floating album, displaying at least the N1 secondary album tabs at the first position, includes: When N1 = 1, in response to a movement operation that moves the floating album to a first position in the navigation bar and the user releases the floating album, the N1 secondary album tabs are displayed at the first position; or, When N1 is greater than 1, in response to a movement operation that moves the floating album to the first position of the navigation bar and a user releases the floating album, the N1 secondary album labels are displayed one-to-one at N1 positions, including the first position, and the N1 positions are continuously distributed within the navigation bar.

11. The image display method according to claim 10, characterized in that, If N1 is greater than 1, the order of the N1 secondary album tags in the navigation bar is the same as the order of the N1 albums in the content area before the update.

12. The image display method according to any one of claims 9 to 11, characterized in that, The response to a movement operation that moves the floating album to a first position in the navigation bar and a user releases the floating album, displaying at least the N1 secondary album tabs at the first position, includes: In response to the operation of moving the floating album to the first position of the navigation bar, the content displayed at the first position and at least a portion of the content continuously displayed on either side of the first position are moved along the length direction of the navigation bar so as to display the floating album separately at the first position; In response to a release operation on the floating album, the N1 secondary album tabs are displayed at least in the first position.

13. The image display method according to claim 12, characterized in that, The step of responding to the operation of moving the floating album to the first position of the navigation bar, moving the content displayed at the first position and at least a portion of the content continuously displayed on either side of the first position along the length direction of the navigation bar, so as to display the floating album separately at the first position, includes: In response to the operation of moving the floating album to the first position of the navigation bar, the content displayed at the first position and at least a portion of the content continuously displayed on the second side of the first position are moved toward the end of the navigation bar so as to display the floating album alone at the first position, the second side of the first position being close to the end of the navigation bar.

14. The image display method according to any one of claims 9 to 13, characterized in that, The navigation bar includes an area for receiving photo albums, which is used to receive the floating photo album. The area supporting the reception of photo albums includes a first tag area, which includes multiple contents, including at least some of the M secondary album tags, and the first position is the location of any one of the multiple contents; and / or The area supporting receiving photo albums includes a preset area located on either side of the first tab area, and the first position is a position within the preset area.

15. The image display method according to claim 14, characterized in that, The preset area is located on the first side of the first label area, and the first side of the first label area is close to the starting end of the navigation bar.

16. The image display method according to any one of claims 9 to 15, characterized in that, In response to a movement operation that moves the floating album to a first position in the navigation bar and a user releases the floating album, the method further includes, at least before the N1 secondary album tabs are displayed at the first position: In response to the operation of moving the floating album to the navigation bar, if it is detected that the floating album and the first position satisfy the first position condition, it is determined that the floating album has moved to the first position.

17. The image display method according to claim 16, characterized in that, The first location condition is that the floating album overlaps with one of the areas in the navigation bar that support receiving albums, and the area that supports receiving albums is used to receive the floating album.

18. The image display method according to any one of claims 8 to 17, characterized in that, The navigation bar includes a second tab area, which includes tabs for a second type of album, and / or the second tab area includes multiple first-level tabs, including the first-level album tabs. The multiple first-level tabs also include at least one of the following: photo tabs, memory tabs, or creation tabs. The tabs for the second type of album include at least one second-level album tab. The tabs for the second type of album are located on the first side of the tabs for the first type of album, and the first side of the tabs for the first type of album is close to the start end of the navigation bar. And, in response to the floating operation of the N1 albums, displaying the floating albums corresponding to the N1 albums, including: In response to the floating operation of the N1 albums, the floating albums corresponding to the N1 albums are displayed, and in the... The navigation bar switches from the first display mode to the second display mode to display the content in the second tab area. The second display mode is used to remind the user that it is not supported to move the floating album into the second tab area.

19. The image display method according to claim 18, characterized in that, The second display method is a grayed-out display method.

20. The image display method according to any one of claims 8 to 19, characterized in that, The floating operation is a long press operation on any one of the N1 albums.

21. The image display method according to any one of claims 2 to 6, characterized in that, The navigation bar also includes editing controls, and the method further includes: In response to an operation on the editing control, the navigation bar in edit mode is displayed. The navigation bar in edit mode includes a first part of album labels and a third part of album labels. The third part of album labels includes the album labels of each album in an album group corresponding to each second-level album label in the second part of album labels.

22. The image display method according to claim 21, characterized in that, The navigation bar also includes labels for a second type of album, which are located on the first side of the labels for the first type of album. The first side of the labels for the first type of album is close to the beginning of the navigation bar. The labels for the second type of album include at least one secondary album label. Furthermore, in the navigation bar of the first interface, at least one secondary album tab of the second type of album is expanded, and in the navigation bar of the edit state, at least one secondary album tab of the second type of album is collapsed.

23. The image display method according to any one of claims 1 to 22, characterized in that, According to the M secondary album tags, the albums corresponding to each secondary album tag are arranged in descending order of priority. The M secondary album tags are arranged in the navigation bar along a first direction, which is the direction extending from the beginning to the end of the navigation bar.

24. The image display method according to claim 23, characterized in that, The M secondary album tags include multiple tag groups, and each tag group includes at least one secondary album tag.

25. The image display method according to any one of claims 1 to 24, characterized in that, The navigation bar also includes labels for a second type of album, which include at least one secondary album label. The labels for the second type of album are located on the first side of the labels for the first type of album, and the first side of the labels for the first type of album is close to the beginning of the navigation bar.

26. The image display method according to claim 25, characterized in that, The second type of album is the smart album, and the first type of album is the ordinary album.

27. The image display method according to claim 25 or 26, characterized in that, The navigation bar includes multiple first-level tags, including the first-level album tag, and the multiple first-level tags also include at least one of the following: photo tag, memory tag, or creation tag.

28. The image display method according to claim 27, characterized in that, The multiple primary tags, the tags of the second type of album, and the tags of the first type of album are arranged in the navigation bar along a first direction, which is the direction extending from the beginning of the navigation bar to the end of the navigation bar.

29. An electronic device, characterized in that, include: Memory, used to store computer instructions; A processor for invoking computer instructions stored in the memory to perform the method as described in any one of claims 1 to 28.

30. A computer-readable storage medium, characterized in that, Used to store computer instructions for implementing the method as described in any one of claims 1 to 28.

Images