Picture layout method and electronic device

By implementing flexible picture layout methods on electronic devices, the problem of low aesthetics caused by fixed size and layout is solved. The large-size pictures are placed vertically interleaved and the original direction is retained to form an S-shaped streamlined effect, which improves user experience and sharing efficiency.

CN112529645BActive Publication Date: 2025-01-14HUAWEI TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN201910879246.3
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2019-09-18
Publication Date
2025-01-14
Estimated Expiration
2039-09-18

AI Technical Summary

Technical Problem

When existing electronic devices display multiple pictures, fixed sizes and fixed layouts lead to low aesthetics and cannot effectively present the original content and composition awareness of the picture.

Method used

By implementing a flexible layout method of pictures on electronic devices, the pictures are allowed to present different sizes and layouts, but the overall shape is rectangular, and large-size pictures are placed in a staggered longitudinal direction to form an S-shaped streamlined effect, and retain the original direction and aspect ratio of the picture. , supports swipe, share and screenshot operations to improve user experience.

Benefits of technology

It realizes the flexibility and aesthetics of picture layout, brings users agile visual effects, reduces the operating costs of users when sharing and viewing, and improves the display and sharing experience of pictures.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN112529645B_ABST
    Figure CN112529645B_ABST
Patent Text Reader

Abstract

A method for arranging pictures and an electronic device, relating to the field of electronic technology, is used to arrange multiple pictures so that each picture presents a different size and layout, but the multiple pictures are arranged in a rectangular layout as a whole, and the picture layout is flexible but not messy, giving users a smart visual effect. The method specifically includes: an electronic device receives an operation of previewing a first album, and the electronic device displays a first interface, the first interface includes a part of the preview image of the first album; receives an operation of sliding up on the first interface by the user, and displays a second interface, the second interface includes another part of the preview image of the first album. Among them, in the preview image of the first album, multiple pictures of the first album are divided into multiple picture groups, the area of ​​each picture group is smaller than the area of ​​the screen, the pictures in each picture group are arranged in a rectangular layout as a whole, and the pictures with larger sizes in each picture group are arranged in a left-right staggered layout in the vertical direction.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of electronic technology, and in particular to a picture layout method and electronic equipment. Background Art

[0002] There are many scenarios where electronic devices need to display multiple pictures, such as preview pictures of photos or videos in albums, shopping websites or applications displaying various products in the form of pictures, etc. Obviously, the layout effect of pictures directly affects the aesthetics of the display interface of electronic devices.

[0003] At present, the commonly used image layout is the grid layout, that is, all images are of the same size and are arranged and displayed in a fixed number of rows and columns. For example: the interface for browsing multiple photos or videos in an album. It can be seen that no matter whether the original photo or video is shot in horizontal or vertical mode, it is displayed as a preview image of the same size, and the content of the original photo or video cannot be presented. In addition, the layout of fixed rows and columns is monotonous and not aesthetically pleasing. Summary of the invention

[0004] The present application provides a picture layout method and electronic device, which layout multiple pictures so that each picture presents a different size and layout, but the multiple pictures are arranged in a rectangular layout as a whole. The picture layout is flexible but not messy, giving users a smart visual effect.

[0005] In order to achieve the above objectives, the embodiments of the present application provide the following technical solutions:

[0006] In a first aspect, a method provided by the present application includes: an electronic device receives a first operation of a user to preview a first album, the first album including multiple pictures; in response to the first operation, the electronic device displays a first interface, the first interface includes a portion of the preview image of the first album, and the preview image of the first album includes multiple pictures; the electronic device receives a second operation of the user sliding up on the first interface; in response to the second operation, the electronic device displays a second interface, the second interface includes another portion of the preview image of the first album; wherein, in the preview image of the first album, the multiple pictures are divided into at least two picture groups, any one of the at least two picture groups includes one or more pictures, and all pictures in any one of the at least two picture groups are arranged in a rectangular shape as a whole; and the display area of ​​any one of the at least two picture groups on the electronic device is not greater than the display area of ​​the electronic device screen; and, in any one of the at least two picture groups, in the longitudinal direction, pictures with a size greater than a preset threshold are not continuously located on the left or right side of the electronic device screen.

[0007] For example, the first album may be a wonderful moment album in a gallery application. The first interface may be an interface for browsing the wonderful moment album. Usually, there are many photos in the wonderful moment album, and the entire content of the first album preview image cannot be displayed at once in the effective display area of ​​the mobile phone screen. In this case, the user can view other parts of the first album preview image by, for example, sliding up on the mobile phone screen.

[0008] Among them, pictures whose sizes are larger than a preset threshold can be considered as pictures with larger sizes. Usually, pictures with larger sizes will attract the user's attention and are the content that the user is most likely to pay attention to, and can be considered as the user's visual focus. In the layout scheme of pictures in this application, in the vertical direction, the larger pictures are placed alternately on the left and right. In this way, the preview picture of the first album visually gives the user an S-shaped (including forward S-shaped and reverse S-shaped) streamlined effect, giving the user a smart reading feeling.

[0009] Since the pictures in the preview of the first album are of different sizes and layouts, but the overall layout is rectangular, the picture layout of the preview of the first album is flexible but not messy. In one example, the preview of the first album can retain the original orientation of the photos, that is, the horizontal version of the photos is laid out horizontally, and the vertical version of the photos is laid out vertically. In this way, the preview of the first album can show the original composition of the photos, allowing users to preview more and more accurate photo content. In another example, the original aspect ratio of the photos can be retained in the preview of the first album.

[0010] In a possible implementation, after the electronic device displays the first interface, the method further includes: the electronic device receives a third operation of the user to share the first photo album; in response to the third operation, the electronic device sends a preview image of the first photo album to other electronic devices.

[0011] Thus, the electronic device provides a method for quickly sharing multiple pictures in the first album, which, on the one hand, can reduce the need for users to process multiple pictures before sharing, such as needing to use jigsaw software to put multiple pictures together, etc. On the other hand, it can reduce the need for other users to zoom in, manually slide, etc. to view the contents of multiple pictures when viewing and processing.

[0012] In one possible implementation, after the electronic device displays the first interface, the method also includes: the electronic device receives a fourth operation of the user sharing the first album; in response to the fourth operation, the electronic device prompts the user to select one or more groups of pictures in the first album; the electronic device receives a fifth operation of the user selecting one or more groups of pictures in the first album; after the electronic device receives the fifth operation, the electronic device sends content corresponding to the one or more groups of pictures selected by the user in the preview image of the first album to other electronic devices.

[0013] For example, the picture group here can be considered as the card group below, and the present application provides a quick sharing method based on the card group. Since the size of a card group is smaller than the size of the screen, multiple pictures in a card group can be viewed on one screen. That is, the user can directly share multiple photos that he sees on one screen with other users quickly, which can meet the sharing needs of users in more scenarios.

[0014] In one possible implementation, the method also includes: the electronic device receives a screenshot operation from the user; in response to the screenshot operation, the electronic device determines to share all the contents of the preview image of the first album, or shares the contents corresponding to the picture group currently displayed on the screen in the preview image of the first album.

[0015] When a user performs a screenshot operation while browsing multiple photos in the first album, it is very likely that multiple photos in the album need to be shared. By directly using the sharing method provided in the embodiment of the present application, a preview image of the entire album can be quickly shared, or multiple pictures displayed on the current screen can be quickly shared in units of card groups.

[0016] In one possible implementation, the method also includes: the electronic device receives a sixth operation of the user to share the first album; if the second interface displayed by the electronic device includes all pictures in the first picture group of at least two picture groups, the electronic device determines the content corresponding to the first picture group in the preview picture of the first album to be shared.

[0017] In a possible implementation, each picture in the preview image of the first album retains the original layout of each picture, and the original layout of each picture is the layout of each picture when it is displayed in full screen on the electronic device, including horizontal or vertical layout.

[0018] In a possible implementation, the method further includes: arranging the multiple pictures in the preview image of the first album in the order of shooting time or saving time of the multiple pictures.

[0019] In a possible implementation, the preview image of the first album includes the name of the first album, and / or the shooting date or saving date of the pictures in the first album, and / or the shooting location of the pictures in the first album.

[0020] In one example, the text portion of the preview image of the first album may be arranged in a magazine-like layout, such as a large title, large blank space, decorative elements, and the like. For example, the name of the Wonderful Moments album may be in the form of a large title, that is, the font size of the name of the Wonderful Moments album is larger than other text such as the date. Optionally, the name of the Wonderful Moments album may also be displayed in a specific font or color. For another example, a certain amount of blank space may be left in other locations outside of text and images. In this way, the preview image of the first album presents a magazine-like reading feel, enhancing the user's visual experience.

[0021] In a possible implementation, the preview image of the first album includes at least one date group, and one date group in the at least one date group includes at least two picture groups.

[0022] In a second aspect, an electronic device is provided, comprising: a processor, a memory and a touch screen, wherein the memory and the touch screen are coupled to the processor, the memory is used to store computer program codes, the computer program codes include computer instructions, and when the processor reads the computer instructions from the memory, the electronic device performs the following operations: receiving a first operation of a user to preview a first album, the first album includes a plurality of pictures; in response to the first operation, displaying a first interface, the first interface includes a portion of the preview image of the first album, the preview image of the first album includes a plurality of pictures; receiving a second operation of the user sliding upward on the first interface; in response to the second operation, displaying a second interface, the second interface includes another portion of the preview image of the first album; wherein, in the preview image of the first album, the plurality of pictures are divided into at least two picture groups, any one of the at least two picture groups includes one or more pictures, and all pictures in any one of the at least two picture groups are arranged in a rectangular shape as a whole; and the display area of ​​any one of the at least two picture groups on the electronic device is not greater than the display area of ​​the electronic device screen; and in any one of the at least two picture groups, in the longitudinal direction, pictures with a size greater than a preset threshold are not continuously located on the left or right side of the electronic device screen.

[0023] In one possible implementation, when the processor reads computer instructions from the memory, the electronic device further performs the following operations: receiving a third operation of the user to share the first album; and sending a preview image of the first album to other electronic devices in response to the third operation.

[0024] In one possible implementation, when the processor reads computer instructions from the memory, the electronic device also performs the following operations: receiving a fourth operation of the user sharing the first album; in response to the fourth operation, prompting the user to select one or more groups of pictures in the first album; receiving a fifth operation of the user selecting one or more groups of pictures in the first album; after the electronic device receives the fifth operation, sending the content corresponding to the one or more groups of pictures selected by the user in the preview image of the first album to other electronic devices.

[0025] In one possible implementation, when the processor reads computer instructions from the memory, the electronic device also performs the following operations: receiving a screenshot operation from the user; in response to the screenshot operation, determining to share all the contents of the preview image of the first album, or sharing the contents corresponding to the group of pictures currently displayed on the screen in the preview image of the first album.

[0026] In one possible implementation, when the processor reads computer instructions from the memory, so that the electronic device also performs the following operations: receiving the sixth operation of the user to share the first photo album; if the second interface displayed by the electronic device includes all pictures in the first photo group of at least two photo groups, then determining the content corresponding to the first photo group in the preview image of the shared first photo album.

[0027] In a possible implementation, each picture in the preview image of the first album retains the original layout of each picture, and the original layout of each picture is the layout of each picture when it is displayed in full screen on the electronic device, including horizontal or vertical layout.

[0028] In a possible implementation, when the processor reads the computer instructions from the memory, the electronic device further performs the following operation: arranging the multiple pictures in the preview image of the first album in the order of the shooting time or the saving time of the multiple pictures.

[0029] In a possible implementation, the preview image of the first album includes the name of the first album, and / or the shooting date or saving date of the pictures in the first album, and / or the shooting location of the pictures in the first album.

[0030] In a possible implementation, the preview image of the first album includes at least one date group, and one date group in the at least one date group includes at least two picture groups.

[0031] In a third aspect, a graphical user interface is provided on an electronic device, wherein the electronic device has a display screen, a camera, a memory, and one or more processors, wherein the one or more processors are used to execute one or more computer programs stored in the memory, and the graphical user interface includes a graphical user interface displayed when the electronic device executes the method described in the above aspects and any possible implementation methods thereof.

[0032] In a fourth aspect, a device is provided, which is included in an electronic device, and the device has the function of implementing the electronic device behavior in any of the above aspects and possible implementation methods. The function can be implemented by hardware, or by hardware executing corresponding software. The hardware or software includes at least one module or unit corresponding to the above function. For example, a receiving module or unit, a display module or unit, and a sending module or unit, etc.

[0033] In a fifth aspect, a computer storage medium is provided, comprising computer instructions. When the computer instructions are executed on an electronic device, the electronic device executes the method as described in the above aspects and any possible implementation thereof.

[0034] In a sixth aspect, a computer program product is provided. When the computer program product is run on a computer, the computer is enabled to execute the method as described in the above aspects and any possible implementation thereof.

[0035] In the seventh aspect, a chip system is provided, including a processor. When the processor executes instructions, the processor executes the method described in the above aspects and any possible implementation thereof. BRIEF DESCRIPTION OF THE DRAWINGS

[0036] Figure 1 A schematic diagram of the structure of an electronic device provided in an embodiment of the present application Figure 1 ;

[0037] Figure 2 A schematic diagram of the structure of an electronic device provided in an embodiment of the present application Figure 2 ;

[0038] Figure 3 Schematic diagram of user interfaces of some electronic devices provided in embodiments of the present application;

[0039] Figure 4 Schematic diagrams of user interfaces of some other electronic devices provided in embodiments of the present application;

[0040] Figure 5 Schematic diagrams of user interfaces of some other electronic devices provided in embodiments of the present application;

[0041] Figure 6 Schematic diagrams of user interfaces of some other electronic devices provided in embodiments of the present application;

[0042] Figure 7 Schematic diagrams of user interfaces of some other electronic devices provided in embodiments of the present application;

[0043] Figure 8Schematic diagrams of user interfaces of some other electronic devices provided in embodiments of the present application;

[0044] Fig. 9 A schematic diagram of a flow chart of a method for arranging pictures provided in an embodiment of the present application;

[0045] Fig.10 A schematic diagram of a picture layout provided in an embodiment of the present application;

[0046] Fig.11 A schematic diagram of a picture layout process provided in an embodiment of the present application;

[0047] Fig.12 A schematic diagram of another picture layout process provided in an embodiment of the present application;

[0048] Fig.13 A schematic diagram of another picture layout process provided in an embodiment of the present application;

[0049] Fig.14 A schematic diagram of the structure of a chip system provided in an embodiment of the present application. DETAILED DESCRIPTION

[0050] In the description of the embodiments of the present application, unless otherwise specified, “ / ” means or. For example, A / B can mean A or B. The “and / or” in this article is merely a way to describe the association relationship of associated objects, indicating that three relationships may exist. For example, A and / or B can mean: A exists alone, A and B exist at the same time, and B exists alone.

[0051] In the following, the terms "first" and "second" are used for descriptive purposes only and are not to be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Thus, a feature defined as "first" or "second" may explicitly or implicitly include one or more of the features.

[0052] In the description of the embodiments of the present application, unless otherwise specified, "multiple" means two or more. In the embodiments of the present application, words such as "exemplary" or "for example" are used to indicate examples, illustrations or descriptions. Any embodiment or design described as "exemplary" or "for example" in the embodiments of the present application should not be interpreted as being more preferred or more advantageous than other embodiments or designs. Specifically, the use of words such as "exemplary" or "for example" is intended to present related concepts in a concrete way.

[0053] The embodiment of the present application provides a method for arranging pictures, so that each picture presents different sizes and layouts, but the multiple pictures are arranged in a rectangular layout as a whole, and the picture layout is flexible but not messy, giving the user a smart visual effect. Exemplarily, the electronic device in the present application can be a mobile phone, a tablet computer, a personal computer (PC), a personal digital assistant (PDA), a smart watch, a netbook, a wearable electronic device, an augmented reality (AR) device, a virtual reality (VR) device, a vehicle-mounted device, a smart car, a smart speaker, a robot, etc. The present application does not impose any special restrictions on the specific form of the electronic device.

[0054] Figure 1 A schematic structural diagram of an electronic device 100 is shown.

[0055] The 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, an antenna 1, an 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, an earphone interface 170D, a sensor module 180, a button 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 a pressure sensor 180A, a gyroscope sensor 180B, an air pressure sensor 180C, a magnetic sensor 180D, an acceleration sensor 180E, a distance sensor 180F, a proximity light sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L, a bone conduction sensor 180M, etc.

[0056] It is to be understood that the structure illustrated in the embodiment of the present invention does not constitute a specific limitation on the electronic device 100. In other embodiments of the present application, the electronic device 100 may include more or fewer components than shown in the figure, or combine some components, or separate some components, or arrange the components differently. The components shown in the figure may be implemented in hardware, software, or a combination of software and hardware.

[0057] The processor 110 may include one or more processing units, for example, the processor 110 may include an application processor (AP), a modem processor, a graphics processor (GPU), an image signal processor (ISP), a controller, a video codec, a digital signal processor (DSP), a baseband processor, and / or a neural-network processing unit (NPU), etc. Different processing units may be independent devices or integrated into one or more processors.

[0058] The controller can generate operation control signals according to the instruction operation code and timing signal to complete the control of instruction fetching and execution.

[0059] The processor 110 may also be provided with a memory for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. The memory may store instructions or data that the processor 110 has just used or cyclically used. If the processor 110 needs to use the instruction or data again, it may be directly called from the memory. This avoids repeated access, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.

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

[0061] The I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (SCL). In some embodiments, the processor 110 may include multiple groups of I2C buses. The processor 110 may be coupled to the touch sensor 180K, the charger, the flash, the camera 193, etc. through different I2C bus interfaces. For example: the processor 110 may be coupled to the touch sensor 180K through the I2C interface, so that the processor 110 communicates with the touch sensor 180K through the I2C bus interface, thereby realizing the touch function of the electronic device 100.

[0062] The I2S interface can be used for audio communication. In some embodiments, the processor 110 can include multiple I2S buses. The processor 110 can be coupled to the audio module 170 via the I2S bus to achieve communication between the processor 110 and the audio module 170. In some embodiments, the audio module 170 can transmit an audio signal to the wireless communication module 160 via the I2S interface to achieve the function of answering a call through a Bluetooth headset.

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

[0064] The UART interface is a universal serial data bus for asynchronous communication. The bus can be a bidirectional communication bus. It converts the data to be transmitted between serial communication and parallel communication. In some embodiments, the UART interface is generally used to connect the processor 110 and the wireless communication module 160. For example, the processor 110 communicates with the Bluetooth module in the wireless communication module 160 through the UART interface to implement the Bluetooth function. In some embodiments, the audio module 170 can transmit an audio signal to the wireless communication module 160 through the UART interface to implement the function of playing music through a Bluetooth headset.

[0065] The MIPI interface can be used to connect the processor 110 with peripheral devices such as the display screen 194 and the camera 193. The MIPI interface includes a camera serial interface (CSI), a display serial interface (DSI), etc. In some embodiments, the processor 110 and the camera 193 communicate via the CSI interface to implement the shooting function of the electronic device 100. The processor 110 and the display screen 194 communicate via the DSI interface to implement the display function of the electronic device 100.

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

[0067] The USB interface 130 is an interface that complies with the USB standard specification, and specifically can be a Mini USB interface, a Micro USB interface, a USB Type C interface, etc. The USB interface 130 can be used to connect a charger to charge the electronic device 100, and can also be used to transfer data between the electronic device 100 and a peripheral device. It can also be used to connect headphones to play audio through the headphones. The interface can also be used to connect other electronic devices, such as AR devices, etc.

[0068] It is understandable that the interface connection relationship between the modules illustrated in the embodiment of the present invention is only a schematic illustration and does not constitute a structural limitation on the electronic device 100. In other embodiments of the present application, the electronic device 100 may also adopt different interface connection methods in the above embodiments, or a combination of multiple interface connection methods.

[0069] The charging management module 140 is used to receive charging input from a charger. The charger may be a wireless charger or a wired charger. In some wired charging embodiments, the charging management module 140 may receive charging input from a wired charger through the USB interface 130. In some wireless charging embodiments, the charging management module 140 may receive wireless charging input through a wireless charging coil of the electronic device 100. While the charging management module 140 is charging the battery 142, it may also power the electronic device through the power management module 141.

[0070] The power management module 141 is used to connect the battery 142, the charging management module 140 and the processor 110. The power management module 141 receives input from the battery 142 and / or the charging management module 140, and supplies power to the processor 110, the internal memory 121, the display screen 194, the camera 193, and the wireless communication module 160. The power management module 141 can also be used to monitor parameters such as battery capacity, battery cycle number, battery health status (leakage, impedance), etc. In some other embodiments, the power management module 141 can also be set in the processor 110. In other embodiments, the power management module 141 and the charging management module 140 can also be set in the same device.

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

[0072] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in electronic device 100 can be used to cover a single or multiple communication frequency bands. Different antennas can also be reused to improve the utilization of antennas. For example, antenna 1 can be reused as a diversity antenna for a wireless local area network. In some other embodiments, the antenna can be used in combination with a tuning switch.

[0073] The mobile communication module 150 can provide solutions for wireless communications including 2G / 3G / 4G / 5G, etc., applied to the electronic device 100. The mobile communication module 150 may include at least one filter, a switch, a power amplifier, a low noise amplifier (LNA), etc. The mobile communication module 150 can receive electromagnetic waves from the antenna 1, and filter, amplify, and process the received electromagnetic waves, and transmit them to the modulation and demodulation processor for demodulation. The mobile communication module 150 can also amplify the signal modulated by the modulation and demodulation processor, and convert it into electromagnetic waves for radiation through the antenna 1. In some embodiments, at least some of the functional modules of the mobile communication module 150 can be set in the processor 110. In some embodiments, at least some of the functional modules of the mobile communication module 150 can be set in the same device as at least some of the modules of the processor 110.

[0074] The modem processor may include a modulator and a demodulator. Among them, the modulator is used to modulate the low-frequency baseband signal to be sent into a medium-high frequency signal. The demodulator is used to demodulate the received electromagnetic wave signal into a low-frequency baseband signal. The demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing. After the low-frequency baseband signal is processed by the baseband processor, it is passed to the application processor. The application processor outputs a sound signal through an audio device (not limited to a speaker 170A, a receiver 170B, etc.), or displays an image or video through a display screen 194. In some embodiments, the modem processor may be an independent device. In other embodiments, the modem processor may be independent of the processor 110 and be set in the same device as the mobile communication module 150 or other functional modules.

[0075] The wireless communication module 160 can provide wireless communication solutions including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) networks), bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), infrared (IR), etc., which are applied to the electronic device 100. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via the antenna 2, modulates the frequency of the electromagnetic wave signal and performs filtering, and sends the processed signal to the processor 110. The wireless communication module 160 can also receive the signal to be sent from the processor 110, modulate the frequency of it, amplify it, and convert it into electromagnetic waves for radiation through the antenna 2.

[0076] In some embodiments, the antenna 1 of the electronic device 100 is coupled to the mobile communication module 150, and the antenna 2 is coupled to the wireless communication module 160, so that the electronic device 100 can communicate with the network and other devices through wireless communication technology. The wireless communication technology may include global system for mobile communications (GSM), general packet radio service (GPRS), code division multiple access (CDMA), wideband code division multiple access (WCDMA), time-division code division multiple access (TD-SCDMA), long term evolution (LTE), BT, GNSS, WLAN, NFC, FM, and / or IR technology. The GNSS may include a global positioning system (GPS), a global navigation satellite system (GLONASS), a Beidou navigation satellite system (BDS), a quasi-zenith satellite system (QZSS) and / or a satellite based augmentation system (SBAS).

[0077] The electronic device 100 implements the display function through a GPU, a display screen 194, and an application processor. The GPU is a microprocessor for image processing, which connects 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 change display information.

[0078] The display screen 194 is used to display images, videos, etc. 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 or an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), Miniled, MicroLed, Micro-oLed, a quantum dot light-emitting diode (QLED), etc. In some embodiments, the electronic device 100 may include 1 or N display screens 194, where N is a positive integer greater than 1.

[0079] The electronic device 100 can realize the shooting function through ISP, camera 193, video codec, GPU, display screen 194 and application processor.

[0080] ISP is used to process the data fed back by camera 193. For example, when taking a photo, the shutter is opened, and the light is transmitted to the camera photosensitive element through the lens. The light signal is converted into an electrical signal, and the camera photosensitive element transmits the electrical signal to ISP for processing and converts it into an image visible to the naked eye. ISP can also perform algorithm optimization on the noise, brightness, and skin color of the image. ISP can also optimize the exposure, color temperature and other parameters of the shooting scene. In some embodiments, ISP can be set in camera 193.

[0081] The camera 193 is used to capture still images or videos. The object generates an optical image through the lens and projects it onto the photosensitive element. The photosensitive element can be a charge coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the optical signal into an electrical signal, and then passes the electrical signal to the ISP to be converted into a digital image signal. The ISP outputs the digital image signal to the DSP for processing. The DSP converts the digital image signal into an image signal in a standard RGB, YUV or other format. In some embodiments, the electronic device 100 may include 1 or N cameras 193, where N is a positive integer greater than 1.

[0082] The digital signal processor is used to process digital signals, and can process not only digital image signals but also other digital signals. For example, when the electronic device 100 is selecting a frequency point, the digital signal processor is used to perform Fourier transform on the frequency point energy.

[0083] Video codecs are used to compress or decompress digital videos. The electronic device 100 may support one or more video codecs. Thus, the electronic device 100 may play or record videos in a variety of coding formats, such as Moving Picture Experts Group (MPEG) 1, MPEG2, MPEG3, MPEG4, etc.

[0084] NPU is a neural network (NN) computing processor. By drawing on the structure of biological neural networks, such as the transmission mode between neurons in the human brain, it can quickly process input information and can also continuously self-learn. Through NPU, applications such as intelligent cognition of electronic device 100 can be realized, such as image recognition, face recognition, voice recognition, text understanding, etc.

[0085] The external memory interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100. The external memory card communicates with the processor 110 through the external memory interface 120 to implement a data storage function, such as storing music, video and other files in the external memory card.

[0086] The internal memory 121 can be used to store computer executable program codes, which include instructions. The internal memory 121 may include a program storage area and a data storage area. Among them, the program storage area may store an operating system, an application required for at least one function (such as a sound playback function, an image playback function, etc.), etc. The data storage area may store data created during the use of the electronic device 100 (such as audio data, a phone book, etc.), etc. In addition, the internal memory 121 may include a high-speed random access memory, and may also include a non-volatile memory, such as at least one disk storage device, a flash memory device, a universal flash storage (UFS), etc. The processor 110 executes various functional applications and data processing of the electronic device 100 by running instructions stored in the internal memory 121, and / or instructions stored in a memory provided in the processor.

[0087] The electronic device 100 can implement audio functions such as music playing and recording through the audio module 170, the speaker 170A, the receiver 170B, the microphone 170C, the headphone jack 170D, and the application processor.

[0088] The audio module 170 is used to convert digital audio information into analog audio signal output, and is also used to convert analog audio input into digital audio signals. The audio module 170 can also be used to encode and decode audio signals. In some embodiments, the audio module 170 can be arranged in the processor 110, or some functional modules of the audio module 170 can be arranged in the processor 110.

[0089] The speaker 170A, also called a "speaker", is used to convert an audio electrical signal into a sound signal. The electronic device 100 can listen to music or listen to a hands-free call through the speaker 170A.

[0090] The receiver 170B, also called a "earpiece", is used to convert audio electrical signals into sound signals. When the electronic device 100 receives a call or voice message, the voice can be received by placing the receiver 170B close to the human ear.

[0091] Microphone 170C, also called "microphone" or "microphone", is used to convert sound signals into electrical signals. When making a call or sending a voice message, the user can speak by putting their mouth close to microphone 170C to input the sound signal into microphone 170C. The electronic device 100 can be provided with at least one microphone 170C. In other embodiments, the electronic device 100 can be provided with two microphones 170C, which can not only collect sound signals but also realize noise reduction function. In other embodiments, the electronic device 100 can also be provided with three, four or more microphones 170C to collect sound signals, reduce noise, identify the sound source, realize directional recording function, etc.

[0092] The earphone interface 170D is used to connect a wired earphone and can be a USB interface 130 or a 3.5 mm open mobile terminal platform (OMTP) standard interface or a cellular telecommunications industry association of the USA (CTIA) standard interface.

[0093] The pressure sensor 180A is used to sense the pressure signal and can convert the pressure signal into an electrical signal. In some embodiments, the pressure sensor 180A can be set on the display screen 194. There are many types of pressure sensors 180A, such as resistive pressure sensors, inductive pressure sensors, capacitive pressure sensors, etc. The capacitive pressure sensor can be a parallel plate including at least two conductive materials. When a force acts on the pressure sensor 180A, the capacitance between the electrodes changes. The electronic device 100 determines the intensity of the pressure according to the change in capacitance. When a touch operation acts on the display screen 194, the electronic device 100 detects the touch operation intensity according to the pressure sensor 180A. The electronic device 100 can also calculate the touch position according to the detection signal of the pressure sensor 180A. In some embodiments, touch operations acting on the same touch position but with different touch operation intensities can correspond to different operation instructions. For example: when a touch operation with a touch operation intensity less than the first pressure threshold acts on the short message application icon, an instruction to view the short message is executed. When a touch operation with a touch operation intensity greater than or equal to the first pressure threshold acts on the short message application icon, an instruction to create a new short message is executed.

[0094] The gyro sensor 180B can be used to determine the motion posture of the electronic device 100. In some embodiments, the angular velocity of the electronic device 100 around three axes (i.e., x, y, and z axes) can be determined by the gyro sensor 180B. The gyro sensor 180B can be used for anti-shake shooting. For example, when the shutter is pressed, the gyro sensor 180B detects the angle of the electronic device 100 shaking, calculates the distance that the lens module needs to compensate based on the angle, and allows the lens to offset the shaking of the electronic device 100 through reverse movement to achieve anti-shake. The gyro sensor 180B can also be used for navigation and somatosensory game scenes.

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

[0096] The magnetic sensor 180D includes a Hall sensor. The electronic device 100 can use the magnetic sensor 180D to detect the opening and closing of the flip leather case. In some embodiments, when the electronic device 100 is a flip phone, the electronic device 100 can detect the opening and closing of the flip cover according to the magnetic sensor 180D. Then, according to the detected opening and closing state of the leather case or the opening and closing state of the flip cover, the flip cover can be automatically unlocked.

[0097] The acceleration sensor 180E can detect the magnitude of the acceleration of the electronic device 100 in all directions (generally three axes). When the electronic device 100 is stationary, the magnitude and direction of gravity can be detected. It can also be used to identify the posture of the electronic device and is applied to applications such as horizontal and vertical screen switching and pedometers.

[0098] The distance sensor 180F is used to measure the distance. The electronic device 100 can measure the distance by infrared or laser. In some embodiments, when shooting a scene, the electronic device 100 can use the distance sensor 180F to measure the distance to achieve fast focusing.

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

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

[0101] The fingerprint sensor 180H is used to collect fingerprints. The electronic device 100 can use the collected fingerprint characteristics to implement fingerprint unlocking, access application locks, fingerprint photography, fingerprint call answering, etc.

[0102] The temperature sensor 180J is used to detect temperature. In some embodiments, the electronic device 100 uses the temperature detected by the temperature sensor 180J to execute a temperature processing strategy. For example, when the temperature reported by the temperature sensor 180J exceeds a threshold, the electronic device 100 reduces the performance of a processor located near the temperature sensor 180J to reduce power consumption and implement thermal protection. In other embodiments, when the temperature is lower than another threshold, the electronic device 100 heats the battery 142 to avoid abnormal shutdown of the electronic device 100 due to low temperature. In other embodiments, when the temperature is lower than another threshold, the electronic device 100 performs a boost on the output voltage of the battery 142 to avoid abnormal shutdown caused by low temperature.

[0103] The touch sensor 180K is also called a "touch control device". The touch sensor 180K can be set on the display screen 194. The touch sensor 180K and the display screen 194 form a touch screen, also called a "touch control screen". The touch sensor 180K is used to detect touch operations acting on or near it. The touch sensor can pass the detected touch operation to the application processor to determine the type of touch event. Visual output related to the touch operation can be provided through the display screen 194. In other embodiments, the touch sensor 180K can also be set on the surface of the electronic device 100, which is different from the position of the display screen 194.

[0104] The bone conduction sensor 180M can obtain a vibration signal. In some embodiments, the bone conduction sensor 180M can obtain a vibration signal of a vibrating bone block of the vocal part of the human body. The bone conduction sensor 180M can also contact the human pulse to receive a blood pressure beat signal. In some embodiments, the bone conduction sensor 180M can also be set in an earphone and combined into a bone conduction earphone. The audio module 170 can parse out a voice signal based on the vibration signal of the vibrating bone block of the vocal part obtained by the bone conduction sensor 180M to realize a voice function. The application processor can parse the heart rate information based on the blood pressure beat signal obtained by the bone conduction sensor 180M to realize a heart rate detection function.

[0105] The key 190 includes a power key, a volume key, etc. The key 190 may be a mechanical key or a touch key. The electronic device 100 may receive key input and generate key signal input related to user settings and function control of the electronic device 100.

[0106] Motor 191 can generate vibration prompts. Motor 191 can be used for incoming call vibration prompts, and can also be used for touch vibration feedback. For example, touch operations acting on different applications (such as taking pictures, audio playback, etc.) can correspond to different vibration feedback effects. For touch operations acting on different areas of the display screen 194, motor 191 can also correspond to different vibration feedback effects. Different application scenarios (for example: time reminders, receiving messages, alarm clocks, games, etc.) can also correspond to different vibration feedback effects. The touch vibration feedback effect can also support customization.

[0107] Indicator 192 may be an indicator light, which may be used to indicate charging status, power changes, messages, missed calls, notifications, etc.

[0108] The SIM card interface 195 is used to connect a SIM card. The SIM card can be connected to and separated from the electronic device 100 by inserting it into the SIM card interface 195 or pulling it out from the SIM card interface 195. The electronic device 100 can support 1 or N SIM card interfaces, where N is a positive integer greater than 1. The SIM card interface 195 can support Nano SIM cards, Micro SIM cards, SIM cards, and the like. Multiple cards can be inserted into the same SIM card interface 195 at the same time. The types of the multiple cards can be the same or different. The SIM card interface 195 can also be compatible with different types of SIM cards. The SIM card interface 195 can also be compatible with external memory cards. The electronic device 100 interacts with the network through the SIM card to implement functions such as calls and data communications. In some embodiments, the electronic device 100 uses an eSIM, i.e., an embedded SIM card. The eSIM card can be embedded in the electronic device 100 and cannot be separated from the electronic device 100.

[0109] The software system of the electronic device 100 may adopt a layered architecture, an event-driven architecture, a micro-core architecture, a micro-service architecture, or a cloud architecture. In the embodiment of the present invention, the Android system of the layered architecture is taken as an example to exemplify the software structure of the electronic device 100.

[0110] Figure 2 1 is a software structure block diagram of the electronic device 100 according to an embodiment of the present invention.

[0111] The layered architecture divides the software into several layers, each with clear roles and division of labor. The layers communicate with each other through software interfaces. In some embodiments, the Android system is divided into four layers, from top to bottom: the application layer, the application framework layer, the Android runtime and system library, and the kernel layer.

[0112] The application layer can include a series of application packages.

[0113] like Figure 2 As shown, the application package may include camera, gallery, calendar, call, map, navigation, WLAN, Bluetooth, music, video, short message and other applications.

[0114] In some embodiments of the present application, the gallery application can display preview images of multiple images, so that the user can preview multiple images at the same time. Among them, multiple images can be laid out in a flexible and changeable manner, such as forming an S-shaped streamlined layout, etc., to give the user a smart visual experience.

[0115] The application framework layer provides an application programming interface (API) and a programming framework for the applications in the application layer. The application framework layer includes some predefined functions.

[0116] like Figure 2 As shown, the application framework layer may include a window manager, a content provider, a view system, a phone manager, a resource manager, a notification manager, and the like.

[0117] The window manager is used to manage window programs. The window manager can obtain the display screen size, determine whether there is a status bar, lock the screen, capture the screen, etc.

[0118] Content providers are used to store and retrieve data and make it accessible to applications. The data may include videos, images, audio, calls made and received, browsing history and bookmarks, phone books, etc.

[0119] The view system includes visual controls, such as controls for displaying text, controls for displaying images, etc. The view system can be used to build applications. A display interface can be composed of one or more views. For example, a display interface including a text notification icon can include a view for displaying text and a view for displaying images.

[0120] In some embodiments of the present application, the view system may include a picture layout algorithm for flexibly and variedly laying out multiple pictures to be displayed, so as to enhance the aesthetics of the display interface of the electronic device 100 and enhance the visual experience of the user when previewing pictures. Of course, the picture layout algorithm may also be stored in a system library, or stored in an application framework layer as a separate module, etc., which is not specifically limited in the embodiments of the present application. When the electronic device 100 runs a gallery application, the picture layout algorithm may be called to lay out multiple pictures to be displayed, and then display them on the screen of the electronic device 100.

[0121] The phone manager is used to provide communication functions of the electronic device 100, such as management of call status (including connecting, hanging up, etc.).

[0122] The resource manager provides various resources for applications, such as localized strings, icons, images, layout files, video files, and so on.

[0123] The notification manager enables applications to display notification information in the status bar. It can be used to convey notification-type messages and can disappear automatically after a short stay without user interaction. For example, the notification manager is used to notify download completion, message reminders, etc. The notification manager can also be a notification that appears in the system top status bar in the form of a chart or scroll bar text, such as notifications of applications running in the background, or a notification that appears on the screen in the form of a dialog window. For example, a text message is displayed in the status bar, a prompt sound is emitted, an electronic device vibrates, an indicator light flashes, etc.

[0124] Android Runtime includes core libraries and virtual machines. Android runtime is responsible for scheduling and management of the Android system.

[0125] The core library consists of two parts: one part is the function that needs to be called by the Java language, and the other part is the Android core library.

[0126] The application layer and the application framework layer run in a virtual machine. The virtual machine executes the Java files of the application layer and the application framework layer as binary files. The virtual machine is used to perform functions such as object life cycle management, stack management, thread management, security and exception management, and garbage collection.

[0127] The system library may include multiple functional modules, such as surface manager, media library, 3D graphics processing library (such as OpenGL ES), 2D graphics engine (such as SGL), etc.

[0128] The surface manager is used to manage the display subsystem and provide the fusion of 2D and 3D layers for multiple applications.

[0129] The media library supports playback and recording of a variety of commonly used audio and video formats, as well as static image files, etc. The media library can support a variety of audio and video encoding formats, such as: MPEG4, H.264, MP3, AAC, AMR, JPG, PNG, etc.

[0130] The 3D graphics processing library is used to implement 3D graphics drawing, image rendering, compositing, and layer processing.

[0131] A 2D graphics engine is a drawing engine for 2D drawings.

[0132] The kernel layer is the layer between hardware and software. The kernel layer contains at least display driver, camera driver, audio driver, and sensor driver.

[0133] The technical solutions involved in the following embodiments can all be implemented in the electronic device 100 having the above-mentioned hardware architecture and software architecture.

[0134] The picture layout method provided in the embodiment of the present application can be applied to various scenarios where an electronic device needs to display multiple photos at the same time. For example: a browsing interface that displays multiple photos or videos in a mobile phone gallery application or folder. Another example: a browsing interface that displays photos, videos or files in a folder on a computer. Another example: a display interface of various product pictures on a mobile phone shopping app or a computer shopping website.

[0135] This application takes the photo gallery application of a mobile phone as an example and describes in detail the technical solution provided in the embodiments of the present application in conjunction with the accompanying drawings.

[0136] The user can open the gallery application by clicking the gallery application icon on the mobile phone desktop, or by other means such as voice commands. For example, in response to the user's operation of opening the gallery application, the mobile phone can display the following Figure 3 The interface 301 shown in (1) is the interface of the "Photo" function in the gallery application. In the interface of the "Photo" function, you can view the photos or videos saved in the gallery application (including photos or videos taken, screenshots, pictures downloaded from the Internet, etc.), and you can also perform corresponding operations on these photos or videos, such as deleting, editing, sharing, and collecting.

[0137] In the interface of the "Photo" function, there are also function controls such as "Photo", "Album", "Moments" and "Discover". Users can quickly switch to the interface of the corresponding function through these function controls.

[0138] The user can enter the "Album" function interface by clicking the "Album" function control, for example, Figure 3 Interface 302 shown in (2). Users can view the albums created in the gallery application and the photos in each album through the "Album" function. Users can also create new albums, delete created albums, etc.

[0139] Users can also enter the "Moment" function interface by clicking the "Moment" function control, for example, Figure 3 The interface 303 shown in (3) is shown in the figure. The "Moments" function refers to the mobile phone intelligently analyzing the shooting time, location, characters and other information of the photos or videos in the gallery application, automatically creating wonderful moments albums with different themes, and intelligently collecting wonderful memories for users. After entering each wonderful moment album, the mobile phone can provide a video playback method to allow users to browse the photos in the wonderful moment album, and can also provide a photo preview method to allow users to browse the photos in the wonderful moment album.

[0140] Users can also enter the "Discover" function interface by clicking the "Discover" function control, for example, Figure 3The interface 304 shown in (4) in the figure. The "discover" function can be used to quickly locate the photos that the user needs. For example, by entering keywords, such as events, people, places, times, terms related to the photos, or even text contained in the photos, the user can search for the photos that the user needs.

[0141] It can be understood that each function in the above-mentioned gallery application may include a browsing interface for displaying multiple photos or videos. For the browsing interface of multiple photos or videos in each of the above-mentioned functions, the method provided in the embodiment of the present application can be adopted to flexibly and diversely layout the previewed photos to enhance the user's visual experience when browsing photos.

[0142] The following description takes the gallery of highlights in "Moments" as an example.

[0143] Please continue to see Figure 3 In the interface shown in (3), in response to the user selecting any of the wonderful moments albums, the mobile phone displays the display page of the selected wonderful moments album. For example, the user selects the wonderful moments album of "Water Village Tour", and the mobile phone displays Figure 4 The display page 401 of “Water Village Tour” shown in (1) above includes a video preview 402 and a photo preview 403 .

[0144] Among them, video preview 402 is a thumbnail of a video, which is composed of photos in the wonderful moments album of "Water Village Tour". The user can choose to play the video through the corresponding playback controls or playback options. Photo preview 403 shows multiple photos in the wonderful moments album of "Water Village Tour". It can be noted that at this time, what is displayed in the display page 401 is a part of the photo preview 403. This is because there are usually a large number of photos in the wonderful moments album, and the entire content of the photo preview 403 cannot be displayed at one time in the effective display area of ​​the mobile phone screen. In this case, the user can view other parts of the photo preview 403 by, for example, sliding up on the mobile phone screen.

[0145] For example, Figure 4 (2) shows an example of photo preview 403. Photo preview 403 may include multiple photos in the current wonderful moment album, which may be all photos or part of the photos in the current wonderful moment album, and the embodiment of the present application does not limit this.

[0146] It can be seen that the photos in the photo preview 403 are presented in different sizes and layouts, but the overall layout is rectangular, which makes the layout of the photos in the photo preview 403 flexible but not messy, giving the user a smart visual effect. In one example, the original placement direction of the photos can be retained in the photo preview 403, that is, the horizontal version of the photos is laid out horizontally, and the vertical version of the photos is laid out vertically. In this way, the photo preview 403 can show the original composition awareness of the photos, allowing the user to preview more and more accurate photo content. In another example, the original aspect ratio of the photos can be retained in the photo preview 403.

[0147] Generally, larger photos will attract the user's attention and are the content that the user is most likely to pay attention to. They can be considered as the user's visual focus. In the layout scheme of the pictures in this application, the larger photos are placed alternately on the left and right sides in the vertical direction. In this way, the photo preview 403 gives the user an S-shaped (including positive S-shaped and reverse S-shaped) streamlined effect visually, giving the user a smart reading experience. For example: Figure 4 As shown in (2), the centers of the larger photos in the photo preview 403 are connected to form a reverse S-shaped curve as shown by the dotted arrow, which can be used to represent the moving direction of the user's visual focus. It can be seen that the user's visual focus moves in an S-shaped streamlined manner, giving the user a flexible reading experience.

[0148] In some embodiments, the mobile phone can divide the photos in the photo preview 403 into multiple date groups according to the shooting date (or saving date) of the photos. In specific implementation, the mobile phone can sort the photos in the selected moment album according to the photo shooting time or saving time, and then divide these photos into multiple date groups. When dividing the date groups, it can be divided according to days, weeks, months, quarters, half a year, years, etc. It can also be divided in combination with the number of photos. For example, if the number of photos on certain days is small, the photos of these days can be combined into a date group. If there are more photos on a certain day, the photos of that day are a separate date group, etc. In other words, the lengths of the time periods contained in the date groups can be the same or different. The embodiment of the present application does not specifically limit the specific division of date groups.

[0149] For example, Figure 4As shown in (2), the photo preview 403 includes two date groups, date group 1 (e.g., "June 1") and date group 2 (e.g., "June 2"). It can be seen that the photos in each date group also present different sizes and layouts. In the vertical direction, the photos with larger sizes are also placed alternately on the left and right, forming an S-shaped streamlined layout. However, the overall layout of all the photos in a date group is rectangular, which makes the photos of the entire date group still give the user a uniform visual effect when the user pays attention to the photos of a certain date group, even if the photos in the date group have different sizes and layouts. In one example, different date groups can be distinguished by marking different dates. Alternatively, they can be distinguished by other methods such as frame lines and blank spaces. The embodiment of the present application does not specifically limit the method of distinguishing photos of different date groups.

[0150] Of course, in the photo preview 403, the photos can also be divided according to the location where the photos were taken (for example, indoors, outdoors, scenic spots, streets, etc.). The photos can also be divided according to the content of the photos. For example, the people photographed in the photos (for example, oneself, family, friends, colleagues, etc.), the type of the photos (for example, people, scenery, animals, sports, etc.), the color of the photos, the album where the photos are located, the time period when the photos were taken (for example, daytime or night), the season when the photos were taken (four seasons of spring, summer, autumn, and winter), etc., which are not limited in the embodiments of the present application.

[0151] In other embodiments, when there are many photos in a date group, the date group can be divided into multiple card groups, so that the photos in a card group can be fully displayed in the limited display area of ​​the mobile phone screen. In other words, the user can see the preview of multiple photos in the entire card group in one interface on the mobile phone screen, which is convenient for the user to process multiple photos in the card group, such as sharing. Figure 4 As shown in (2), the date group of "June 2" includes two card groups, such as card group 1 and card group 2. The two card groups are shown in the form of dotted boxes. Among them, the size of each card group is not larger than the size of the mobile phone screen. It can be noted that the photos in a card group still have different sizes and layouts, and all the photos in a card group are rectangular as a whole. In this way, the layout of photos in a card group is flexible and neat, which improves the overall aesthetics of the interface. Optionally, the mobile phone can use frame lines, blank spaces, etc. to visually distinguish the photos in different card groups, or it may not make visual distinctions.

[0152] It is understandable that when a card group is processed as a unit, for example, when it is shared with other users, other users can also view multiple photos of the card group in an interface of the mobile phone. On the one hand, it can reduce the need for users to process multiple photos before sharing, such as the need to use puzzle software to put multiple photos together. On the other hand, it can reduce the need for other users to zoom in, manually slide, etc. to view the contents of multiple photos when viewing and processing.

[0153] In some other embodiments, the photo preview 403 may also include text or pattern information of any one of the name, shooting date, and shooting location of the wonderful moment album. In one example, the text portion in the photo preview 403 may be arranged in a magazine-like layout, such as a large title, a large blank space, and embellishment elements. For example, the name of the wonderful moment album may be arranged in a large title, that is, the font size of the name of the wonderful moment album is larger than other text such as the date. Optionally, the name of the wonderful moment album may also be displayed using a specific font or color. For another example, a certain amount of blank space may be left in other locations outside the text and photos. In this way, the photo preview 403 presents a magazine-like reading feel, enhancing the user's visual experience.

[0154] In summary, the method provided in the embodiment of the present application can make the layout of photos more flexible and changeable, thereby improving the user's visual experience when previewing photos.

[0155] In some other embodiments, the mobile phone can also perform other operations on the photo previews laid out according to the method of the present application, such as saving, sharing, editing, etc., to meet more user needs.

[0156] Exemplarily, since the wonderful moments album is a collection of wonderful memories automatically collected by the mobile phone for the user based on the photos or videos in the gallery application, the user may need to share the wonderful moments with other users. To this end, the mobile phone can perform a sharing operation on the photo preview of the selected wonderful moments album in response to the user's predefined operation. In one example, the entire content of the photo preview of the selected wonderful moments album can be shared. In another example, part of the content of the photo preview of the selected wonderful moments album can be shared. For example, the content corresponding to one or more date groups in the photo preview, or the content corresponding to one or more card groups.

[0157] Among them, the above-mentioned predefined operations can be one or more operations of the user operating a specific button or selecting a specific option on a specific interface, or it can be a gesture of the user drawing a specific pattern on a specific interface, or it can be the user executing a voice command or pressing a specific physical button or physical button combination on the mobile phone, etc. The embodiments of the present application do not impose specific restrictions on this.

[0158] For example, in response to detecting that a user is in Figure 4On the display page 401 of the wonderful moment album shown in (1), the more controls 404 are operated, and the mobile phone displays the following Figure 5 The menu 501 shown in (1) in the figure. The user can turn on the sharing function of the mobile phone by selecting the "Share Wonderful Moments" option in the menu 501. In this example, the predefined operation is a plurality of operations for selecting specific options.

[0159] In one example, if Figure 5 As shown in (2), in response to the user selecting the "Share Wonderful Moments" option, the mobile phone displays interface 502. Furthermore, the user can select a specific method for sharing the photo preview 403 on the interface 502. For example, select Huawei Share to share the photo preview 403 on the mobile phone with another mobile phone or device. For another example, select "WeChat", "Friends Circle" and other instant messaging software to share with other users. Of course, you can also choose to share through other methods such as email, cloud album, WLAN direct connection, etc. Finally, the mobile phone can share the photo preview 403 with other users in the form of a picture.

[0160] In another example, in response to the user selecting the "Share Wonderful Moments" option, the mobile phone pops up a pop-up window as shown in FIG. Figure 5 The option menu 503 shown in (3) in the figure. The user can select the content to be shared through the option menu 503, and choose to share the entire content of the photo preview of the wonderful moment album, or choose to share the content corresponding to some date groups or some card groups. After the user selects the content to be shared, the mobile phone can display the following Figure 5 In the interface 502 shown in (2), the user selects a specific sharing method. Finally, if the user chooses to share all the contents in the photo preview 403, the mobile phone can share it with other users in the form of a picture. If the user chooses to share the contents corresponding to the selected date group or card group in the photo preview 403 with other users in the form of one or more pictures.

[0161] Of course, the mobile phone can also provide other forms of selection interfaces for users to select the content to be shared, and this application does not impose any specific restrictions on this.

[0162] In another example, in response to the user selecting the "Share Wonderful Moments" option, the mobile phone pops up a pop-up window as shown below: Figure 6 As shown in the interface 601, it can be seen that the interface 601 includes options corresponding to the entire contents of the photo preview 403 (e.g., option box 602), options corresponding to the contents of each date group (e.g., option boxes 603 and 604), and options corresponding to each card group (e.g., option box 60401 and option box 60402). It should be noted that Figure 6It is only a schematic diagram, and the interface actually displayed on the mobile phone is the content in the effective display area of ​​the mobile phone, that is, the content of the part enclosed by the thick frame line is the interface actually displayed on the mobile phone. It is understandable that the user can adjust the interface content displayed on the mobile phone by sliding up and down on the mobile phone screen to view other content in the photo preview 403.

[0163] Optionally, the mobile phone can mark the content selected by the user, so that the user can understand the selected content and facilitate the user to accurately select the content to be shared. The marking method, for example, can add a check mark to the selected content, or mark the selected content in gray, etc., which is not specifically limited in the embodiment of the present application.

[0164] For another example, in response to detecting that a user is in Figure 4 When a specific pattern (e.g., a pattern in the shape of an "S") is drawn on the display page 401 of the wonderful moment album shown in (1), the mobile phone displays the following Figure 5 The interface 502 shown in (2) or the mobile phone displays the following Figure 5 The interface shown in (3) above, or the mobile phone displays the following Figure 6 Interface 601 is shown.

[0165] For another example, in response to detecting that a user is in Figure 4 When a long press operation is performed on the display page 401 of the wonderful moment album shown in (1), or the long press operation time reaches threshold 1, or the long press operation intensity reaches threshold 2, or the area of ​​the mobile phone screen contacted by the long press operation reaches threshold 3, the mobile phone displays the following Figure 5 The interface 502 shown in (2) or the mobile phone displays the following Figure 5 The interface shown in (3) above, or the mobile phone displays the following Figure 6 Interface 601 is shown.

[0166] For another example, when a user performs a screenshot operation on the display page of the wonderful moment album (for example, pressing the volume button and the lock screen button at the same time, or opening the drop-down menu bar and clicking the screenshot control), it is likely that the user wants to share the photos in the wonderful moment album. Therefore, the user can be prompted whether to share the photos in the wonderful moment album.

[0167] In one example, in response to detecting that a user is Figure 4 When a screenshot operation is performed on the display page 401 of the wonderful moment album shown in (1), the mobile phone may pop up a pop-up window such as Figure 7 The dialog box 701 shown in (1) asks the user whether to share the wonderful moments album. If the user selects yes, the mobile phone enters the sharing interface of the wonderful moments album, for example, the mobile phone displays the following Figure 5 The interface 502 shown in (2) or the mobile phone displays the following Figure 5The interface shown in (3) above, or the mobile phone displays the following Figure 6 If the user selects no, the mobile phone takes a screenshot of the content currently displayed on the mobile phone screen. In a specific embodiment, in response to detecting that the user is in the following Figure 4 When a screenshot operation is performed on the display page 401 of the wonderful moment album shown in (1), the mobile phone can also share the entire photo preview 403 by default, or share the content corresponding to the card group currently displayed on the screen in the photo preview 403 by default. In this way, the operation cost of user selection is reduced, and efficient interaction between the user and the mobile phone is achieved.

[0168] In another example, in response to detecting that a user is in a Figure 4 When a screenshot operation is performed on the display page 401 of the wonderful moment album shown in (1), the mobile phone may pop up a pop-up window such as Figure 7 The dialog box 702 shown in (2) prompts the user to choose whether to take a screenshot with the mobile phone or to share the album of wonderful moments.

[0169] In some other embodiments, after detecting the above predefined operation of the user, the mobile phone can also intelligently recommend the content to be shared to the user according to the content currently displayed on the screen. For example, share all the content, or share the content corresponding to the currently displayed date group, or share the content corresponding to the currently displayed card group, or share the content corresponding to the currently displayed complete card group.

[0170] For example, Figure 8 As shown in (1), when the mobile phone displays the video preview and the photo preview, a predefined operation of the user is detected. The user is likely to want to share the entire photo preview of the wonderful moment album. Then the user can be prompted whether to share the entire content of the photo preview, or to share the content corresponding to the currently displayed date group. Of course, in a specific embodiment, the mobile phone can also share the entire content of the photo preview by default, or share the content corresponding to the currently displayed date group in the photo preview. In this way, the operation cost of the user's selection is reduced, and efficient interaction between the user and the mobile phone is achieved.

[0171] For example Figure 8 As shown in (2), when the mobile phone displays the beginning of the photo preview, if a predefined operation of the user is detected, the user can be prompted whether to share the entire content of the photo preview, or to share the content corresponding to the date group currently displayed. Of course, in a specific embodiment, the mobile phone can also share the entire content of the photo preview by default, or to share the content corresponding to the date group currently displayed in the photo preview. In this way, the operation cost of the user's selection is reduced, and efficient interaction between the user and the mobile phone is achieved.

[0172] For example Figure 8As shown in (3), when the mobile phone displays the content in the middle of the photo preview, the user can be prompted whether to share the content corresponding to the currently displayed date group, or to share the content corresponding to the currently displayed complete card group. Of course, in a specific embodiment, the mobile phone can also default to sharing the content corresponding to the currently displayed date group in the photo preview, or to sharing the content corresponding to the currently displayed complete card group in the photo preview. In this way, the operating cost of the user's selection is reduced, and efficient interaction between the user and the mobile phone is achieved.

[0173] For example Figure 8 As shown in (4), when the mobile phone displays the end of the photo preview, if the user's predefined operation is detected, the user can be prompted whether to share the content corresponding to the currently displayed complete card group, or share the content corresponding to the currently displayed date group, or share the entire content of the photo preview. Of course, in a specific embodiment, the mobile phone can also default to sharing the content corresponding to the currently displayed complete card group in the photo preview, or share the content corresponding to the currently displayed date group in the photo preview, or share the entire content of the photo preview. In this way, the operating cost of the user's selection is reduced, and efficient interaction between the user and the mobile phone is achieved.

[0174] It can also be understood that in the layout scheme of the present application, in addition to the overall or partial (in terms of date groups or card groups) batch processing of multiple photos for photo preview, each photo can also be processed individually.

[0175] For example, see Figure 4 In the interface 401 shown in (1), the user can also operate a single photo in the photo preview 403. For example, by clicking on a single photo, the photo can be displayed in full screen so that the user can view the details. For another example, you can click on the "Select" control to select any one or several photos and share the selected photos. When the user selects multiple photos, they can be shared with other users in the form of multiple pictures, or the selected multiple photos can be laid out according to the layout method of the present application to form a picture to share with other users.

[0176] It is understandable that when the user adds or deletes one or more photos in the wonderful moment album, the mobile phone can use a similar method to rearrange the layout according to the added or deleted photos. In one example, the changed date group or card group and the photos after the changed date group or card group can be rearranged according to the method provided in the embodiment of the present application in units of date groups or card groups, so that the mobile phone can display the preview of the photos in the wonderful moment album after the rearrangement.

[0177] It should be noted that for other operations such as saving as and editing the photo preview, please refer to the sharing operation of the photo preview, which will not be repeated here.

[0178] The following describes in detail the specific implementation of the layout method provided in the embodiment of the present application.

[0179] like Fig. 9 FIG. 1 is a flow chart of a layout method provided in an embodiment of the present application, which specifically includes:

[0180] S901. Divide the target pictures into multiple date groups according to the time of the target pictures, wherein each date group includes one or more target pictures.

[0181] The target images are multiple images that the mobile phone needs to layout, which can be photos taken or saved by the user, preview images of videos, or images downloaded from the Internet. The time of the target images can be the shooting time or saving time of the photos, the shooting time or saving time of the videos, etc.

[0182] When dividing the date groups, the mobile phone can divide them according to the units of day, week, month, quarter, half year, year, etc. The division can also be combined with the number of target images. For example, if the number of target images on some days is small, the target images on these days can be combined into one date group. If there are many target images on a certain day, the target images on that day can be taken as a separate date group, etc. In other words, the lengths of the time periods included in the date groups can be the same or different. The embodiments of the present application do not specifically limit the specific division of the date groups.

[0183] It is understood that here, the date groups divided according to the time of the target picture are used as an example for explanation. Of course, the target pictures can also be divided in other ways, for example, the target picture is divided into multiple address groups according to the shooting location of the target picture, and then the card groups are divided for each address group. For another example, it can also be divided according to the shooting content of the target picture. For example, the characters shot in the target picture (for example: oneself, family, friends, colleagues, etc.), the type of picture (for example: people, scenery, animals, sports, etc.), the color of the picture, the album where the picture is located, the time period of the target picture shooting (for example, daytime or night), the season of the target picture shooting (spring, summer, autumn, winter, etc.), etc. are divided, and the embodiment of the present application does not limit this.

[0184] In some embodiments, the target image may not be divided into date groups in advance, and then each date group may be divided into one or more card groups. Instead, the target image may be directly divided into one or more card groups, that is, step S901 is not executed, and step S902 is directly executed.

[0185] S902: Divide each date group into one or more card groups according to the number of target pictures in each date group.

[0186] The number of target images included in a card group is less than a first threshold, and when a date group includes multiple card groups, at least two card groups include different numbers of target images.

[0187] The mobile phone can determine the first threshold value according to the size of the mobile phone screen, so that multiple target images of a deck can be fully displayed on one screen of the mobile phone, that is, one interface displayed by the mobile phone can include all target images of a deck. In one example, the first threshold value is 10, that is, the number of target images included in a deck is less than 10.

[0188] In a specific implementation, when the number of target images in a date group is greater than a first threshold value (e.g., 10), a number can be randomly selected from a first range (e.g., 7 to 9) less than the first threshold value as the number of target images contained in a card group, recorded as number a, and from the target images of the date group, a number of target images are selected as a card group. Subsequently, a number is randomly selected from the first range as the number of target images contained in the next card group, recorded as number b, and from the remaining target images in the date group, b number of target images are selected as another card group. And so on, until the number of target images remaining in the date group is less than the first threshold value, then the remaining target images are used as a card group.

[0189] It can be seen that the number of target images contained in a card group is randomly selected from the first range less than the first threshold, that is, the number of target images contained in each card group is random, which can avoid the same layout after each card group is laid out and ensure the flexibility of the overall layout of the final target image.

[0190] Optionally, when determining the quantity of the target images that each deck contains, each number in the first scope can also be arranged in a preset order, and then the quantity of the target images that each deck contains is determined in sequence according to the preset order. For example: the quantity of the target images that each deck contains is determined in sequence according to the order of 7, 8, and 9. In this way, it is also possible to ensure that the connected decks contain different numbers of target images, ensuring the flexibility of the final target icon layout.

[0191] The embodiment of the present application does not limit the specific method for determining the number of target images contained in each card group.

[0192] S903: for each card group, determine whether the target images in the card group can be arranged in a rectangle as a whole when the first layout mode is adopted.

[0193] Among them, the first layout method can make multiple target images in a card group present different sizes and layouts, forming a flexible layout. For example, the first layout method can make the target images in multiple card groups in a certain date group present an S-shaped streamlined layout, such as Figure 4 In some examples, the target pictures in the card group in a certain date group can also be arranged in a spiral, such as Fig.10 Picture layout shown.

[0194] In a specific implementation, a preset number (e.g., 4, 8, etc.) of basic units may be predefined. Each of the basic units may be used to place a target image. For example, a large horizontal unit, a small horizontal unit, a large vertical unit, and a small vertical unit. The screen area occupied by the large horizontal unit is larger than the screen area occupied by the small horizontal unit. The screen area occupied by the large vertical unit is larger than the screen area occupied by the small vertical unit. Among them, the horizontal target image or the square target image matches the large horizontal unit or the small horizontal unit, and the horizontal target image matches the large vertical unit or the small vertical unit.

[0195] When specifically typesetting, the mobile phone screen can be divided into m*n cells according to the size of the mobile phone screen, where each cell has the same size. In one example, the aspect ratio of each cell is 4:3 (a classic aspect ratio in image layout, of course, other ratios are also possible). For example, the mobile phone screen is divided into 6*12 cells, that is, there are 6 cells horizontally and 12 cells vertically. Then, the size of each basic unit is defined in cells.

[0196] For example, a large horizontal unit can be set to occupy 4*4 cells, and a small horizontal unit can be set to occupy 2*2 cells. A large vertical unit can be set to occupy 4*6 cells, and a small vertical unit can be set to occupy 2*4 cells.

[0197] Subsequently, according to the layout type (horizontal or vertical) of the target image to be typeset and the situation of the arranged target images, the basic unit corresponding to the target image to be typeset is selected.

[0198] For ease of explanation, (Xi, Yj) is used here to represent the position of the i-th cell in the horizontal direction and the j-th cell in the vertical direction, and Wj is used to represent the remaining width in the horizontal direction (j-th row), in units of cells.

[0199] Exemplarily, when typeset the target image in the card group, first traverse the position in the mobile phone screen to find the position of the first untypeset target image on the mobile phone screen and the remaining width in the horizontal direction. Then, according to the position of the first untypeset target image, the remaining width in the horizontal direction, and the layout (horizontal or vertical) of the image to be typeset, determine whether a large basic unit (a large horizontal basic unit or a large vertical basic unit) is possible. If a large basic unit can be placed, then place the large basic unit, otherwise place a small basic unit (a small horizontal basic unit or a small vertical basic unit).

[0200] When the first layout mode is adopted for layout, it is desired that the large basic units are staggered in the vertical direction. Therefore, a flag bit can be set to indicate whether the large basic units have been placed on the left side (or right side) in the vertical direction, so as to achieve the effect of staggered placement of large basic units in the vertical direction in the present application. For example, when the flag bit is the first value, it indicates that the large basic units are not placed on the left side (or right side) in the vertical direction. When the flag bit is the second value, it indicates that the large basic units have been placed on the left side (or right side) in the vertical direction. The initial value of the flag bit is the first value. Of course, two flag bits can also be set, respectively used to identify whether the large basic units are placed on the left or right side of the screen in the vertical direction. Here, a flag bit is set to indicate whether the large basic units have been placed on the left side in the vertical direction as an example for explanation.

[0201] Specifically, when judging whether a large basic unit can be placed, you can follow the following steps:

[0202] Step 1: Is the remaining width in the horizontal direction of the current mobile phone screen not less than the width of the large basic unit, for example, greater than or equal to 4. If it is greater than the width of the large basic unit, it indicates that the large basic unit can be placed at this position.

[0203] Step 2: Check whether the placement position is on the far left of the screen, that is, whether Xi is equal to 0.

[0204] If Xi is equal to 0, it indicates that the placement position is at the far left of the screen. At this time, it is necessary to determine whether the flag is the first value. If the flag is the first value, it indicates that no large basic unit is placed on the left side in the vertical direction. In this case, a large basic unit can be placed at this time, that is, a large basic unit is placed on the far left of the screen. After a large basic unit is placed on the left, the flag needs to be set to the second value. If the flag is the second value, it indicates that a large basic unit has been placed on the left side in the vertical direction. In this case, no large basic unit can be placed to avoid large basic units being continuously located on the left, making the layout of the target image inflexible.

[0205] If Xi is not equal to 0, it indicates that the placement position is not located at the far left of the screen, and it can be considered that the placement position is located on the right side of the screen. At this time, it is necessary to determine whether the flag is the second value. If the flag is the second value, it indicates that a large basic unit is placed on the left side in the vertical direction. At this time, a large basic unit can be placed, that is, a large basic unit is placed on the right side of the screen. After the large basic unit is placed on the right side of the screen, the flag needs to be set to the first value. If the flag is the first value, it indicates that a large basic unit is not placed on the left side of the screen in the vertical direction. A large basic unit may be placed on the right side of the screen. At this time, a large basic unit cannot be placed on the right side to avoid large basic units being continuously located on the right side, making the layout of the target image inflexible.

[0206] In all other cases, it is determined to place a small base unit.

[0207] Step 3: Then determine whether to place the horizontal basic unit or the vertical basic unit according to the layout of the target image to be typeset.

[0208] Of course, the order of the above steps 1 to 3 can also be changed. For example, first determine whether the first unformatted position is to be placed in a horizontal basic unit or a vertical basic unit according to the layout of the target image to be typeset. Then, determine whether a large basic unit can be placed. This embodiment of the application does not specifically limit this.

[0209] For example, see Fig.11 As shown, it is assumed that the mobile phone screen is divided into 6*12 cells, and it is set that the large horizontal unit occupies 4*4 cells, and the small horizontal unit occupies 2*2 cells; the large vertical unit occupies 4*6 cells, and the small vertical unit occupies 2*4 cells.

[0210] When placing the first target image, determine that the position of the first unplaced target image on the screen is (X0, Y0), and W0=6, which is greater than the width of the large basic unit, and the flag is the first value, then the large basic unit can be placed. Assuming that the first target image is a horizontal version, a large horizontal basic unit is placed. The figure uses 1 to mark the cell occupied by the first target image. After placing the first target image, modify the flag to the second value. Fig.11 The layout shown in (1) is a schematic diagram after the first target image is placed.

[0211] When placing the second target image, the first position on the screen where the target image is not placed is determined to be (X4, Y0), and W0 = 2, which is less than the width of the large basic unit, so a small basic unit is determined to be placed. Assuming that the second target image is a horizontal version, a small horizontal basic unit is placed. The cell occupied by the second image is marked with 2 in the figure. Fig.11 The layout shown in (2) is a schematic diagram after the second target image is placed.

[0212] When placing the third target image, the first position on the screen where no target image is placed is determined to be (X4, Y2), and W2 = 2, which is smaller than the width of the large basic unit, so a small basic unit is determined to be placed. Assuming that the third target image is a vertical version, a small vertical basic unit is placed. The cell occupied by the third image is marked with 3 in the figure. Fig.11 The layout shown in (3) is a schematic diagram after the third target image is placed.

[0213] When placing the fourth target image, the first position on the screen where no target image is placed is determined to be (X0, Y4), and W4=4, which is equal to the width of the large basic unit. However, since this position is located at the leftmost side of the screen and the flag is the second value, it is determined to place a small basic unit. Assuming that the fourth target image is a horizontal version, a small horizontal basic unit is placed. In the figure, 4 indicates the cell occupied by the fourth target image.

[0214] And so on, the fifth and sixth target images are placed. Fig.11 The layout shown in (4) is a schematic diagram after the sixth target image is placed.

[0215] When placing the seventh target image, the first position on the screen where no target image is placed is determined to be (X2, Y6), and W6=4, which is equal to the width of the large basic unit. Since this position is located on the right side of the screen and the flag is the second value, it is determined that the large basic unit is placed. Assuming that the seventh target image is a vertical version, a large vertical basic unit is placed. The cell occupied by the fourth target image is marked with 7 in the figure. Fig.11 The layout shown in (5) is a schematic diagram after the seventh target image is placed.

[0216] Then, after all target images in a deck are typeset according to the first layout mode, determine whether the overall layout of all target images of this deck forms a rectangle. Specifically, can be by determining whether the remaining width of the position row where the target image is not placed at this moment is the quantity of the cell that zero or one row of screen comprises. If it is the quantity of the cell that zero or one row of screen comprises, then determine that the overall layout of all target images of this deck forms a rectangle, otherwise determine that the overall layout of all target images of this deck does not form a rectangle.

[0217] For example, see Fig.11 , if the card group includes 7 target pictures, and the first layout is used to form Fig.11 In the layout shown in (5), the remaining width of the row where the target image is not placed is 2, and it is determined that the multiple target images of the card group cannot form a rectangle using the first layout mode. Then, step S905 is executed.

[0218] For example, see Fig.12 , if the card group includes 8 target pictures, and the first layout is used to form Fig.12 In the layout shown, the remaining width of the row where the target image is not placed is 0, and it is determined that the multiple target images of the card group can form a rectangle by using the first layout mode. Then, step S904 is executed.

[0219] S904: If the multiple images of a card group can form a rectangle as a whole, determine to use the first layout mode for layout.

[0220] It is understandable that when the first layout method is used for layout, the multiple target images in each card group will present different sizes and different layouts. Even if the target images of a card group are all horizontal images, or all vertical images, after the first layout method is used for layout, the target images in the card group will be laid out using large basic units and small basic units, and the large basic units are placed alternately in the vertical direction, forming an S-shaped streamlined layout as a whole, giving users a smart visual experience.

[0221] S905: If the multiple images of a card group cannot form a rectangle as a whole, determine to use the second layout method for layout.

[0222] Among them, the second layout mode can make the multiple target images in the card group form a rectangle as a whole. In the second layout mode, the multiple target images in the card group also present different sizes and layouts, and also follow the rule that the target images with larger sizes are placed in a left-right staggered manner in the vertical direction of the screen.

[0223] In a specific implementation, a card group contains a number of target images less than a first threshold. The multiple target images in the card group can be divided into multiple rectangular blocks, and each rectangular block is laid out according to a preset template. The multiple target images contained in each rectangular block form a rectangle as a whole. For example, a card group contains less than 10 target images, and the target images can be divided into 1-3 rectangular blocks, wherein each rectangular block includes no more than 4 target images. Table 1 shows a schematic diagram of a method for dividing multiple target images of a card group into multiple rectangular blocks.

[0224] Table 1

[0225]

[0226]

[0227] It can be noted that the target images contained in multiple rectangular blocks in the same card group can be different, which can make the layout more diverse and increase the flexibility of the layout. Table 1 is only an example, and the embodiment of the present application does not limit the specific method for dividing rectangular blocks for each card group.

[0228] It should be noted that a rectangular block template can be set for each situation according to the number of pictures contained in the rectangular block and the possible arrangement of the horizontal and vertical versions of each picture. The template setting method is not specifically limited. Subsequently, when the target picture is laid out, the corresponding template is searched according to the rectangular blocks into which the target picture is divided, the number of target pictures contained in each rectangular block, and the horizontal and vertical versions of each target picture, and the layout is performed according to the template.

[0229] For example, a deck of cards includes 9 target images. The 9 target images in the deck can be divided into 3 rectangular blocks, where each rectangular block contains 4, 3, and 2 target images respectively. For the first rectangular block, determine its corresponding template according to the layout of the 4 target images, for example, Fig.13 The template 2 shown in (1) is used. The four target images in the first rectangular block of the card group are arranged according to the template 1. For the second rectangular block, the corresponding template is determined according to the layout of the three target images, for example, Fig.13 The template 2 shown in (2) is used to arrange the three target images in the second rectangular block of the card group according to the template 2. For the third rectangular block, the corresponding template is determined according to the layout of the two target images, for example, Fig.13 The template 3 shown in (3) is used, and the two target images in the third rectangular block of the card group are arranged according to the template 3. That is, the layout of the card group is finally formed as follows Fig.13 The layout shown in (4).

[0230] It should also be noted that when the above-mentioned first layout method or second layout method is used for layout, other processing can also be performed on the multiple pictures after layout, such as adding a background to the pictures after layout, adding decorative elements (such as location information, etc.), etc., so as to make the picture layout more beautiful and further enhance the visual effect of the user previewing the pictures.

[0231] For example, for a card group containing a small number of pictures, such as a card group including 1, 2, 3, etc., after the pictures of the card group are laid out in the first layout mode or the second layout mode, the base color of the pictures contained can be extracted by the color extraction algorithm, and the base color can be used as the background of the card group. Optionally, if the saturation of the base color is high, the saturation of the base color can be reduced before being used as the background of the card group, so that the background in the card group will not be too bright and the pictures of the card group are still highlighted. In a specific implementation, some conversion rules can be added to the color extraction algorithm, and the extracted base color can be converted into the Morandi color system and used as the picture of the card group.

[0232] The present application also provides a chip system, such as Fig.14 As shown, the chip system includes at least one processor 1101 and at least one interface circuit 1102. The processor 1101 and the interface circuit 1102 can be interconnected via lines. For example, the interface circuit 1102 can be used to receive signals from other devices (such as the memory of the electronic device 100). For another example, the interface circuit 1102 can be used to send signals to other devices (such as the processor 1101). Exemplarily, the interface circuit 1102 can read the instructions stored in the memory and send the instructions to the processor 1101. When the instructions are executed by the processor 1101, the electronic device can execute the various steps performed by the electronic device 100 (such as a mobile phone) in the above-mentioned embodiment. Of course, the chip system can also include other discrete devices, which are not specifically limited in the embodiments of the present application.

[0233] It is understandable that, in order to realize the above functions, the above-mentioned electronic devices, etc. include hardware structures and / or software modules corresponding to the execution of each function. Those skilled in the art should easily realize that, in combination with the units and algorithm steps of each example described in the embodiments disclosed herein, the embodiments of the present application can be implemented in the form of hardware or a combination of hardware and computer software. Whether a function is executed in the form of hardware or computer software driving hardware depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered to exceed the scope of the embodiments of the present invention.

[0234] The embodiment of the present application can divide the functional modules of the above-mentioned electronic device etc. according to the above-mentioned method example. For example, each functional module can be divided corresponding to each function, or two or more functions can be integrated into one processing module. The above-mentioned integrated module can be implemented in the form of hardware or in the form of software functional modules. It should be noted that the division of modules in the embodiment of the present invention is schematic and is only a logical function division. There may be other division methods in actual implementation.

[0235] Through the description of the above implementation methods, technicians in the relevant field can clearly understand that for the convenience and simplicity of description, only the division of the above functional modules is used as an example. In actual applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device is divided into different functional modules to complete all or part of the functions described above. The specific working process of the system, device and unit described above can refer to the corresponding process in the aforementioned method embodiment, and will not be repeated here.

[0236] Each functional unit in each embodiment of the present application can be integrated into a processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The above integrated unit can be implemented in the form of hardware or in the form of software functional units.

[0237] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the embodiment of the present application is essentially or the part that contributes to the prior art or all or part of the technical solution can be embodied in the form of a software product, and the computer software product is stored in a storage medium, including a number of instructions to enable a computer device (which can be a personal computer, a server, or a network device, etc.) or a processor to perform all or part of the steps of the method described in each embodiment of the present application. The aforementioned storage medium includes: various media that can store program codes, such as flash memory, mobile hard disk, read-only memory, random access memory, disk or optical disk.

[0238] The above is only a specific implementation of the present application, but the protection scope of the present application is not limited thereto. Any changes or substitutions within the technical scope disclosed in the present application should be included in the protection scope of the present application. Therefore, the protection scope of the present application should be based on the protection scope of the claims.

Claims

1. A method for layout of pictures, characterized in that: include: The electronic device receives a first operation of a user to preview a first album, where the first album includes a plurality of pictures; In response to the first operation, the electronic device displays a first interface, where the first interface includes a portion of the preview image of the first album, where the preview image of the first album includes the plurality of images; The electronic device receives a second operation of the user sliding upward on the first interface; In response to the second operation, the electronic device displays a second interface, where the second interface includes another part of the preview image of the first album; Wherein, in the preview image of the first album, the plurality of images are divided into at least two image groups, any one of the at least two image groups includes one or more images, and all images in any one of the at least two image groups are arranged in a rectangular shape as a whole; Furthermore, a display area of ​​any one of the at least two picture groups on the electronic device is not larger than a display area of ​​a screen of the electronic device; Furthermore, in any one of the at least two picture groups, in the longitudinal direction, pictures with a size greater than a preset threshold are not continuously located on the left side or the right side of the screen of the electronic device; The electronic device receives a fifth operation of a user selecting one or more picture groups in the first album; After the electronic device receives the fifth operation, the electronic device sends the content corresponding to the one or more picture groups selected by the user in the preview image of the first album to other electronic devices, wherein each picture group selected by the user corresponds to a date.

2. The method according to claim 1, characterized in that After the electronic device displays the first interface, the method further includes: The electronic device receives a third operation of the user sharing the first album; In response to the third operation, the electronic device sends a preview image of the first album to other electronic devices.

3. The method according to claim 1, characterized in that After the electronic device displays the first interface, the method further includes: The electronic device receives a fourth operation of the user sharing the first album; In response to the fourth operation, the electronic device prompts the user to select one or more picture groups in the first album.

4. The method according to any one of claims 1 to 3, characterized in that: The method further comprises: The electronic device receives a screen capture operation by the user; In response to the screenshot operation, the electronic device determines to share all the contents of the preview image of the first album, or to share the contents corresponding to the picture group currently displayed on the screen in the preview image of the first album.

5. The method according to claim 4, characterized in that The method further comprises: The electronic device receives a sixth operation of the user sharing the first album; If the second interface displayed by the electronic device includes all pictures in the first picture group of the at least two picture groups, the electronic device determines to share the content corresponding to the first picture group in the preview image of the first album.

6. The method according to claim 5, characterized in that Each picture in the preview image of the first album retains the original layout of each picture, and the original layout of each picture is the layout of each picture when it is displayed in full screen in the electronic device, including horizontal or vertical layout.

7. The method according to claim 6, characterized in that The method further comprises: The multiple pictures in the preview image of the first album are arranged in the order of shooting time or saving time of the multiple pictures.

8. The method according to claim 7, characterized in that The preview image of the first album includes the name of the first album, and / or the shooting date or saving date of the pictures in the first album, and / or the shooting location of the pictures in the first album.

9. The method according to claim 8, characterized in that The preview image of the first album includes at least one date group, and one date group in the at least one date group includes at least two picture groups.

10. An electronic device, characterized in that: include: A processor, a memory and a touch screen, wherein the memory and the touch screen are coupled to the processor, the memory is used to store computer program codes, and the computer program codes include computer instructions. When the processor reads the computer instructions from the memory, the electronic device performs the following operations: receiving a first operation of a user to preview a first album, where the first album includes a plurality of pictures; In response to the first operation, displaying a first interface, the first interface including a portion of the preview image of the first album, the preview image of the first album including the plurality of images; receiving a second operation of the user sliding upward on the first interface; In response to the second operation, displaying a second interface, wherein the second interface includes another part of the preview image of the first album; Wherein, in the preview image of the first album, the plurality of images are divided into at least two image groups, any one of the at least two image groups includes one or more images, and all images in any one of the at least two image groups are arranged in a rectangular shape as a whole; Furthermore, a display area of ​​any one of the at least two picture groups on the electronic device is not larger than a display area of ​​a screen of the electronic device; Furthermore, in any one of the at least two picture groups, in the longitudinal direction, pictures with a size greater than a preset threshold are not continuously located on the left side or the right side of the screen of the electronic device; receiving a fifth operation of the user selecting one or more picture groups in the first album; After the electronic device receives the fifth operation, it sends the content corresponding to the one or more picture groups selected by the user in the preview image of the first album to other electronic devices, wherein each picture group selected by the user corresponds to a date.

11. The electronic device according to claim 10, characterized in that: When the processor reads the computer instruction from the memory, the electronic device further performs the following operations: receiving a third operation of the user sharing the first album; In response to the third operation, a preview image of the first album is sent to other electronic devices.

12. The electronic device according to claim 10, characterized in that: When the processor reads the computer instruction from the memory, the electronic device further performs the following operations: receiving a fourth operation of the user sharing the first album; In response to the fourth operation, the user is prompted to select one or more picture groups in the first album.

13. The electronic device according to any one of claims 10 to 12, characterized in that: When the processor reads the computer instruction from the memory, the electronic device further performs the following operations: Receiving a screenshot operation from the user; In response to the screenshot operation, it is determined to share all the contents of the preview image of the first album, or to share the contents corresponding to the picture group currently displayed on the screen in the preview image of the first album.

14. The electronic device according to claim 13, characterized in that: When the processor reads the computer instruction from the memory, the electronic device further performs the following operations: receiving a sixth operation of the user sharing the first album; If the second interface displayed by the electronic device includes all pictures in the first picture group of the at least two picture groups, it is determined to share the content corresponding to the first picture group in the preview image of the first album.

15. The electronic device according to claim 14, characterized in that: Each picture in the preview image of the first album retains the original layout of each picture, and the original layout of each picture is the layout of each picture when it is displayed in full screen in the electronic device, including horizontal or vertical layout.

16. The electronic device according to claim 15, characterized in that: When the processor reads the computer instruction from the memory, the electronic device further performs the following operations: The multiple pictures in the preview image of the first album are arranged in the order of shooting time or saving time of the multiple pictures.

17. The electronic device according to claim 16, characterized in that: The preview image of the first album includes the name of the first album, and / or the shooting date or saving date of the pictures in the first album, and / or the shooting location of the pictures in the first album.

18. The electronic device according to claim 17, characterized in that: The preview image of the first album includes at least one date group, and one date group in the at least one date group includes at least two picture groups.

19. A computer storage medium, characterized in that: The method comprises computer instructions, and when the computer instructions are executed on an electronic device, the electronic device executes the picture layout method as claimed in any one of claims 1 to 9.

20. A chip system, characterized in that: The method comprises one or more processors. When the one or more processors execute instructions, the one or more processors execute the picture layout method according to any one of claims 1 to 9.

21. A graphical user interface on an electronic device, characterized in that: The electronic device has a display screen, a camera, a memory, and one or more processors, the one or more processors are used to execute one or more computer programs stored in the memory, and the graphical user interface includes a graphical user interface displayed when the electronic device executes the picture layout method as described in any one of claims 1-9.

Citation Information

Patent Citations

  • Picture sharing method and apparatus

    CN106407365A

  • Multimedia file sharing method and mobile terminal

    CN108563684A