Page sliding processing method and related device

Abstract

The page sliding processing method comprises the steps that an electronic device displays a first page module, a second page module and a third page module of a first page, the second page module, the first page module and the third page module in the first page are sequentially arranged, and a first interval is formed between the first page module and the second page module; a second interval is formed between the first page module and the third page module; the electronic equipment receives a sliding operation acting on the first page module in the first direction; the first direction points to the second page module from the first page module; in response to the sliding operation, the first page module, the second page module and the third page module slide in the first direction; wherein the first interval is reduced in the first time period and is increased in the second time period; the second interval increases in the third time period and decreases in the fourth time period. According to the embodiment of the invention, the interestingness of page sliding is increased, the feedback effect of the electronic equipment on a user is enhanced, and the user experience is effectively improved.

Description

[0001] This application is a divisional application. The application number of the original application is 202010901735.7, and the original application date is August 31, 2020. The entire contents of the original application are incorporated into this application by reference. Technical Field

[0002] The present application relates to the field of electronic technology, and in particular to a page sliding processing method and related devices. Background Art

[0003] Electronic devices display more and more rich page contents to users. The screen of the electronic device may not be able to display all the contents of the page. The user needs to slide the page downward (or upward, left, or right) to display more content of the page. Currently, during the page sliding process, all elements in the page move as a whole, resulting in a single page sliding effect and poor user experience. Summary of the invention

[0004] The embodiments of the present application provide a page sliding processing method and related devices, which improve the fun of page sliding, enhance the feedback effect of the electronic device on the user, and improve the user experience.

[0005] In the first aspect, the present application provides a method for processing page sliding, including: an electronic device displays a first page module, a second page module and a third page module of a first page, in which the second page module, the first page module and the third page module are arranged in sequence, and the first page module and the second page module have a first interval; the first page module and the third page module have a second interval; the electronic device receives a sliding operation acting on the first page module along a first direction; wherein the first direction points from the first page module to the second page module; in response to the sliding operation, the first page module, the second page module and the third page module slide along the first direction; wherein the first interval decreases in the first time period and increases in the second time period, and the start time of the second time period is equal to the end time of the first time period; the second interval increases in the third time period and decreases in the fourth time period, and the start time of the fourth time period is equal to the end time of the third time period. In this way, the embodiment of the present application provides a dynamic page sliding effect, increases the fun of page sliding, enhances the feedback effect of the electronic device on the user, and effectively improves the user experience.

[0006] In one implementation, the width of the second page module along the first direction decreases in the first time period and increases in the second time period; the width of the third page module along the first direction increases in the third time period and decreases in the fourth time period. In this way, the width of the page module can also change dynamically as the page slides.

[0007] In one implementation, the width of the second page module along the first direction is not equal to the width of the third page module along the first direction, the starting time of the first time period and the third time period are the same, and the distance between the second page module and the third page module along the first direction increases during the first time period.

[0008] In one implementation, the start time of the first time period and the third time period are the same, and the end time of the first time period and the third time period are the same; or, the end time of the first time period is later than the end time of the third time period; or, the end time of the first time period is earlier than the end time of the third time period.

[0009] In one implementation, the duration of the sliding operation is a sixth time period, the start time of the sixth time period is the same as the start time of the first time period, and the end time of the first time period is earlier than the end time of the sixth time period;

[0010] Alternatively, the end time of the first time period is equal to the end time of the sixth time period; or, the end time of the first time period is later than the end time of the sixth time period.

[0011] In one implementation, the first page module stops sliding.

[0012] In one implementation, the first page module continues to slide.

[0013] In one implementation, before the first page module, the second page module, and the third page module slide along the first direction, the first interval is equal to the first value, and the second interval is equal to the second value; the first interval increases to the first value in the second time period, and the second interval decreases to the second value in the fourth time period.

[0014] In one implementation, before the first page module, the second page module and the third page module slide along the first direction, the first interval is equal to the first value, and the second interval is equal to the second value; the first interval decreases to the first value in the seventh time period, and the second interval increases to the second value in the eighth time period; the starting time of the seventh time period is equal to the ending time of the second time period, and the starting time of the eighth time period is equal to the ending time of the fourth time period; in the first time period and the second time period, the sliding direction of the first page module is the first direction, and in the seventh time period and the eighth time period, the sliding direction of the first page module is the second direction, and the first direction and the second direction are opposite.

[0015] In one implementation, before the first page module, the second page module and the third page module slide along the first direction, the first interval is equal to the first value, and the second interval is equal to the second value; the second interval increases to the second value in the ninth time period, and the first interval increases to the first value in the second time period; the starting time of the ninth time period is later than or equal to the ending time of the fourth time period, and the starting time of the ninth time period is earlier than the ending time of the second time period; in the first time period and the second time period, the sliding direction of the first page module is the first direction; in the ninth time period, the sliding direction of the first page module is the second direction, and the first direction and the second direction are opposite.

[0016] In one implementation, before the first page module, the second page module and the third page module slide along the first direction, the first interval is equal to the first value, and the second interval is equal to the second value; the second interval increases in the tenth time period, decreases to the first value in the eleventh time period, and the first interval increases to the first value in the second time period; the end time of the tenth time period is equal to the start time of the eleventh time period, the start time of the tenth time period is later than or equal to the end time of the fourth time period, and the start time of the eleventh time period is earlier than the end time of the second time period; in the first time period and the second time period, the sliding direction of the first page module is the first direction; in the ninth time period and the tenth time period, the sliding direction of the first page module is the second direction, and the first direction and the second direction are opposite.

[0017] In one implementation, during the ninth time period, the third page module stops sliding, and the third page module among the first page module, the second page module and the third page module is closest to the first side of the electronic device, where the first side is the side of the electronic device pointed to by the second direction.

[0018] In one implementation, within the sixth time period, when the display content of the electronic device does not include the entire content of the third page module, the sliding distance of the first page module is equal to the sliding distance of the sliding operation in the first direction; when the display content of the electronic device includes the entire content of the third page module, the sliding distance of the first page module is less than the sliding distance of the sliding operation in the first direction.

[0019] In one implementation, the second page module and the third page module start sliding later than the first page module.

[0020] In one implementation, the second page module and the third page module start sliding simultaneously.

[0021] In one implementation, the distance between the second module and the third module along the first direction remains unchanged.

[0022] In one implementation, the second page module and the third page module stop sliding later than the first page module.

[0023] In one implementation, the second page module and the third page module stop sliding simultaneously.

[0024] In one implementation, the sliding duration of the second page module and the third page module is shorter than that of the first page module.

[0025] In one implementation, the sliding durations of the second page module and the third page module are equal.

[0026] In one implementation, after the sixth time period, the distance that the first page module slides along the first direction is determined based on the sliding speed of the sliding operation.

[0027] In one implementation, in the first page, the fourth page module, the second page module, the first page module, the third page module and the fifth page module are arranged in sequence, the second page module and the fourth page module have a third interval, and the third page module and the fifth page module have a fourth interval; in response to the sliding operation, the first page module, the second page module and the third page module slide along the first direction, including: in response to the sliding operation, the first page module, the second page module, the third page module, the fourth page module and the fifth page module slide along the first direction; the third interval decreases in the first time period and increases in the second time period; the fourth interval increases in the third time period and decreases in the fourth time period.

[0028] In one implementation, the fourth page module starts sliding later than the second page module, and the fifth page module starts sliding later than the third page module.

[0029] In one implementation, the fourth page module and the fifth page module start sliding simultaneously.

[0030] In one implementation, compared to the start moment of the first time period, at a first moment within the first time period, the decrease in the third interval is less than the decrease in the first interval; compared to the start moment of the third time period, at a second moment within the third time period, the increase in the fourth interval is less than the increase in the second interval.

[0031] In one implementation, compared to the start time of the first time period, at a first moment in the first time period, the decrease amplitude of the third interval is equal to the decrease amplitude of the first interval; compared to the start time of the third time period, at a second moment in the third time period, the increase amplitude of the fourth interval is equal to the increase amplitude of the second interval.

[0032] In a second aspect, the present application provides an electronic device, comprising one or more processors and one or more memories. The one or more memories are coupled to the one or more processors, and the one or more memories are used to store computer program codes, and the computer program codes include computer instructions, and when the one or more processors execute the computer instructions, the electronic device executes any possible implementation of the first aspect.

[0033] In a third aspect, an embodiment of the present application provides a computer storage medium, including computer instructions, which, when executed on an electronic device, enables the electronic device to execute any possible implementation of the first aspect.

[0034] In a fourth aspect, an embodiment of the present application provides a computer program product, which, when executed on a computer, enables the computer to execute any possible implementation of the first aspect. BRIEF DESCRIPTION OF THE DRAWINGS

[0035] Figures 1A to 1C A schematic diagram of the arrangement of page modules provided in an embodiment of the present application;

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

[0037] Figure 3A A schematic diagram of a main interface provided in an embodiment of the present application;

[0038] Figure 3B A schematic diagram of a negative one screen provided in an embodiment of the present application;

[0039] FIG. 4A to FIG. 4C A schematic diagram of a sliding effect of a negative one screen page provided in an embodiment of the present application;

[0040] FIG. 5A to FIG. 5F A schematic diagram of a page sliding effect provided in an embodiment of the present application;

[0041] FIG. 6A to FIG. 6C A schematic diagram of a page sliding effect provided in an embodiment of the present application;

[0042] FIG. 7A to FIG. 7C A schematic diagram of a page sliding effect provided in an embodiment of the present application;

[0043] FIG. 8A to FIG. 8C A schematic diagram of a page sliding effect provided in an embodiment of the present application;

[0044] 9A to 9D A schematic diagram of a sliding effect of a multi-task page provided in an embodiment of the present application;

[0045] Fig.9EA schematic diagram of a sliding effect of a multi-task page provided in an embodiment of the present application;

[0046] Fig.10 A schematic diagram of a page sliding system provided in an embodiment of the present application;

[0047] Fig.11A A curve diagram of speed V and time t in the friction model provided in an embodiment of the present application;

[0048] Fig. 11B A curve diagram of speed S(t) and time t in the friction model provided in an embodiment of the present application;

[0049] Fig. 12A A schematic diagram of a critical damping motion state of a spring provided in an embodiment of the present application;

[0050] Fig. 12B A schematic diagram of an under-damped motion state of a spring provided in an embodiment of the present application;

[0051] Fig. 12C A schematic diagram of an over-damped motion state of a spring provided in an embodiment of the present application;

[0052] Fig.13 A schematic diagram of a page sliding effect provided in an embodiment of the present application;

[0053] Fig.14A A motion curve diagram of a page module provided in an embodiment of the present application;

[0054] Fig. 14B A motion curve diagram of another page module provided in an embodiment of the present application;

[0055] FIG. 15A to FIG. 15D A schematic diagram of the sliding time of the page module provided in an embodiment of the present application;

[0056] Fig.16 An animation implementation principle diagram provided for an embodiment of the present application. DETAILED DESCRIPTION

[0057] The technical solution in the embodiment of the present application will be described below in conjunction with the accompanying drawings. In the description of the embodiment of the present application, unless otherwise specified, " / " means or, for example, A / B can mean A or B; "and / or" in the text is only a description of the association relationship of associated objects, indicating that there can be three relationships, for example, A and / or B can mean: A exists alone, A and B exist at the same time, and B exists alone. In addition, in the description of the embodiment of the present application, "multiple" means two or more than two.

[0058] In the following, the terms "first" and "second" are used for descriptive purposes only and are not to be understood as suggesting 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, and in the description of the embodiments of the present application, unless otherwise specified, "plurality" means two or more.

[0059] The embodiment of the present application provides a method for processing page sliding, which is applied to the electronic device 100. The method can improve the fun of page sliding, enhance the feedback effect of the electronic device on the user, and improve the user experience.

[0060] For example, Figure 2 A structural schematic diagram of an electronic device 100 involved in an embodiment of the present application is shown.

[0061] like Figure 2 As shown, 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.

[0062] It is to be understood that the structure illustrated in the embodiment of the present application 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 split 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.

[0063] 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 memory, a video codec, a digital signal processor (DSP), a baseband processor, and / or a neural-network processing unit (NPU), etc. Among them, different processing units may be independent devices or integrated into one or more processors. The processor 110 may run multiple tasks (such as applications) simultaneously to provide users with a variety of services and functions.

[0064] The controller may be the nerve center and command center of the electronic device 100. The controller may generate an operation control signal according to the instruction operation code and the timing signal to complete the control of fetching and executing instructions.

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

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

[0067] The I2C interface is a bidirectional synchronous serial bus that includes 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 respectively 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, enabling the processor 110 to communicate with the touch sensor 180K through the I2C bus interface to implement the touch function of the electronic device 100.

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

[0069] The PCM interface can also be used for audio communication to sample, quantize, and encode analog signals. In some embodiments, the audio module 170 and the wireless communication module 160 may be coupled through the PCM bus interface. In some embodiments, the audio module 170 may also transmit an audio signal to the wireless communication module 160 through the PCM interface to implement the function of answering a call through a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.

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

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

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

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

[0074] It is understandable that the interface connection relationship between the modules illustrated in the embodiment of the present application 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.

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

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

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

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

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

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

[0081] 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 filters it, 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.

[0082] 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, etc. GNSS may include the global positioning system (GPS), the global navigation satellite system (GLONASS), the Beidou navigation satellite system (BDS), the quasi-zenith satellite system (QZSS) and / or the satellite based augmentation system (SBAS).

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

[0084] 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 (AMOLED), a flexible light-emitting diode (FLED), a MiniLED, a MicroLED, a Micro-OLED, a quantum dot light-emitting diode (QLED), etc. In some embodiments, the electronic device 100 may include one or N display screens 194, where N is a positive integer greater than 1.

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

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

[0087] The camera 193 is used to capture static images or videos. An 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 transmits the electrical signal to the ISP to convert it 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 format such as RGB, YUV, etc. In some embodiments, the electronic device 100 may include one or N cameras 193, where N is a positive integer greater than 1.

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

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

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

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

[0092] The internal memory 121 may be used to store computer executable program codes, which may include instructions. The processor 110 executes various functional applications and data processing of the electronic device 100 by running the instructions stored in the internal memory 121. The internal memory 121 may include a program storage area and a data storage area.

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

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

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

[0096] The receiver 170B, also known as the "earpiece", is used to convert an audio electrical signal into a sound signal. When the electronic device 100 answers a call or a voice message, the voice can be listened to by placing the receiver 170B close to the human ear.

[0097] The microphone 170C, also known as the "microphone" or "transmitter", is used to convert a sound signal into an electrical signal. When making a call or sending a voice message, the user can speak close to the microphone 170C with the mouth, and input the sound signal into the microphone 170C. The electronic device 100 can be provided with at least one microphone 170C.

[0098] The headphone jack 170D is used to connect a wired headphone. The headphone jack 170D 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.

[0099] The pressure sensor 180A is used to sense a pressure signal and can convert the pressure signal into an electrical signal. In some embodiments, the pressure sensor 180A can be disposed on the display screen 194. There are many types of pressure sensors 180A, such as a resistive pressure sensor, an inductive pressure sensor, a capacitive pressure sensor, etc. The capacitive pressure sensor can include at least two parallel plates having a conductive material. 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 intensity of the touch operation according to the pressure sensor 180A. The electronic device 100 can also calculate the position of the touch 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 a first pressure threshold acts on a 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.

[0100] The gyro sensor 180B may 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 (ie, x, y, and z axes) may be determined by the gyro sensor 180B.

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

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

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

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

[0105] 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 the photodiode to detect infrared reflected light from nearby objects.

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

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

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

[0109] The touch sensor 180K is also called a "touch panel". The touch sensor 180K can be set on the display screen 194, and the touch sensor 180K and the display screen 194 form a touch screen, also called a "touch 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.

[0110] The bone conduction sensor 180M can obtain vibration signals. In some embodiments, the bone conduction sensor 180M can obtain vibration signals of vibrating bones of the human body. The bone conduction sensor 180M can also contact the human body's pulse to receive blood pressure beating signals.

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

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

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

[0114] The SIM card interface 195 is used to connect a SIM card. The SIM card can be connected to or disconnected from the electronic device 100 by inserting the SIM card interface 195 or removing the SIM card from the SIM card interface 195 .

[0115] First, the relevant concepts involved in the embodiments of the present application are explained so that those skilled in the art can understand.

[0116] Control: A control can be an encapsulation of data and methods. A control can have its own properties and methods. Properties are simple accessors to control data, and methods are some simple visible functions of controls. Controls are basic elements of user interfaces. For example, the types of controls may include, but are not limited to: user interface controls (controls used to develop and build user interfaces, such as controls for interface elements such as windows, text boxes, buttons, and drop-down menus), chart controls (controls used to develop charts, which can realize data visualization, etc.), report controls (controls used to develop reports, which realize functions such as browsing, viewing, designing, editing, and printing of reports), table controls (controls used to develop tables (CELLs), which realize functions of data processing and operation in grids), etc. In the embodiments of the present application, the types of controls may also include: composite controls (combining various existing controls to form a new control, concentrating the performance of multiple controls), extended controls (deriving a new control based on existing controls, adding new performance to existing controls or changing the performance of existing controls), custom controls, etc.

[0117] In the embodiment of the present application, controls may include but are not limited to: windows, scroll bars, table views, buttons, menu bars, text boxes, navigation bars, toolbars, images, static text, widgets and other visual interface elements.

[0118] Page: The term "page" in the specification, claims and drawings of this application may also be referred to as "user interface (UI)", which is a media interface for interaction and information exchange between an application or operating system and a user. It realizes the conversion between the internal form of information and the form acceptable to the user. The user interface of an application is source code written in a specific computer language such as Java and extensible markup language (XML). The interface source code is parsed and rendered on the terminal device and finally presented as content that the user can recognize, such as pictures, text, buttons and other controls. The properties and content of the controls in the interface are defined by tags or nodes, such as XML through <textview> 、 <imgview> 、 <videoview>The controls contained in the interface are specified by nodes such as <head> and <head>. A node corresponds to a control or attribute in the interface. After parsing and rendering, the node is presented as user-visible content. In addition, many applications, such as hybrid applications, usually also contain web pages in their interfaces. A web page can be understood as a special control embedded in the application interface. A web page is source code written in a specific computer language, such as hypertext markup language (HTML), cascading style sheets (CSS), JavaScript (JS), etc. The web page source code can be loaded and displayed as user-recognizable content by a browser or a web page display component with similar functions to a browser. The specific content contained in a web page is also defined by tags or nodes in the web page source code. For example, HTML is defined by <head> and <body>. 、 、 <video> 、 <canvas>To define the elements and attributes of a web page.

[0119] Page module: Based on the layout and properties of controls in a page, a page can be divided into multiple continuous page modules. A page module can carry one or more types of information such as pictures, texts, operation buttons, links, animations, sounds, and videos. A page module can be presented as a collection of one or more controls, or as a card, or as a collection of a card and other controls.

[0120] Among them, cards can provide a more fine-grained service capability than applications (APPs), and directly display the services or content that users care about most to users in the form of interactive cards. Cards can be embedded in various APPs or interactive scenarios to better meet user needs. Integrate multiple elements of an application, such as pictures, texts, operation buttons, links, etc., into a card. The card can be associated with one or more user interfaces of the application. Users can jump to the user interface of the corresponding application by performing operations on the card (such as clicking operations). Using a card-style layout, different contents can be displayed separately, making the presentation of the display interface content more intuitive, and allowing users to operate on different contents more easily and accurately.

[0121] In the embodiment of the present application, different page modules may overlap or may not overlap.

[0122] In some embodiments of the present application, the display screen 194 of the electronic device 100 cannot display all the content of the page, and the display content of the page displayed on the display screen 194 may include part or all of one or more continuous page modules of the page.

[0123] like Figure 1A As shown, a page of the electronic device 100 (e.g., a negative one-screen page) may include multiple page modules arranged vertically. For the page modules arranged vertically, the user may slide a finger up / down on the display screen 194 to move the page module up / down to view more page modules of the page; or Figure 1B As shown, a page of the electronic device 100 (e.g., a multitasking page) may also include multiple horizontally arranged page modules; for the horizontally arranged page modules, the user may slide a finger left / right on the display screen 194 to move the page module left / right to view more page modules of the page. Figure 1C As shown, a page of the electronic device 100 (eg, a main page of an application store) may also include a plurality of vertically arranged page modules and a plurality of horizontally arranged page modules.

[0124] In the embodiment of the present application, the first page mentioned in the embodiment of the present application may be a negative one screen page, a multi-tasking page or the main page of an application store, or may be other pages including multiple page modules arranged in sequence.

[0125] It should be noted that, in addition to the vertical arrangement and the horizontal arrangement, the page modules can also be arranged in other orientations on the display page of the electronic device 100, which is not specifically limited here.

[0126] Exemplarily, page 1 includes multiple continuous page modules, and the display screen 194 of the electronic device 100 may display part of the content of the page. In response to the user sliding the page, the electronic device can display more content of the page. In response to the received user operation 1, the electronic device 100 displays display content 1 of page 1, and display content 1 includes part or all of one or more continuous page modules of the page. When the electronic device 100 displays the above display content 1, in response to the received user operation 2, it displays display content 2 of page 1, and display content 2 includes part or all of one or more continuous page modules of the page.

[0127] For example, page 1 is Figure 1A In the negative one screen page shown, user operation 1 is that the user's finger slides to the right on the main interface of the electronic device, and user operation 2 is that the user's finger slides downward on the display screen.

[0128] In some embodiments of the present application, the electronic device 100 responds to the received user operation 1, draws all the contents of the page 1, and stores them in the cache area; then the electronic device 100 displays the above display content 1 based on the image data of the display content 1 drawn in the cache area. The electronic device 100 responds to the received user operation 2, and directly displays the above display content 2 based on the image data of the display content 2 drawn in the cache area.

[0129] In some embodiments of the present application, the electronic device 100 draws display content 1 of page 1 in response to received user operation 1 and stores it in the cache area; then the electronic device 100 displays the above display content 1 based on the image data of the display content 1 drawn in the cache area. The electronic device 100 draws display content 2 of page 1 in response to received user operation 2 and stores it in the cache area; then the electronic device 100 displays the above display content 2 based on the image data of the display content 2 drawn in the cache area.

[0130] In some embodiments of the present application, the electronic device 100, in response to the received user operation 1, draws the display content 1 of page 1, and one or more page modules closest to the display content 1 of page 1, and stores them in the cache area; then the electronic device 100 displays the above display content 1 based on the image data of the display content 1 drawn in the cache area. In response to the received user operation 2, when it is determined that the image data drawn in the cache area includes the display content 2, the electronic device 100 displays the above display content 2 based on the image data of the display content 2 drawn in the cache area; when the image data drawn in the cache area includes part of the display content 2, the electronic device draws the display content 2 based on the part and stores it in the cache area, and then displays the above display content 2 based on the image data of the display content 2 drawn in the cache area; when the image data drawn in the cache area does not include the content of the display content 2, the electronic device draws the display content 2 and stores it in the cache area, and then displays the above display content 2 based on the image data of the display content 2 drawn in the cache area.

[0131] In some embodiments, the display height of page 1 on display screen 194 is equal to the height of display screen 194. In some embodiments, the display height of page 1 on display screen 194 is less than the height of display screen 194. For example, the display height of page 1 on display screen 194 is equal to the height of display screen 194 minus the height of the navigation bar. This embodiment of the present application is not limited to this.

[0132] In addition, in the embodiment of the present application, the layout of the page modules can be divided into two categories based on the display position of the page modules on the display screen 194. In one type of layout, a page module is limited to be located in the center of the display interface. In the embodiment of the present application, this type of layout is called a center layout. Figure 1B The multitasking interface shown in the figure. Figure 1B As shown, page module 1 is in the center of the user interface, which means that the distance 1 from the left edge of page module 1 to the left edge of the display interface is equal to the distance 2 from the right edge of page module 1 to the right edge of the display interface. For this type of card layout, the user moves the page module in the display interface by sliding on the display screen 194. When the page stops moving, one page module will stay in the center of the user interface. In another type of card layout, it is not required that one page module must be in the center of the user interface. In the embodiment of the present application, this type of layout is called a non-center layout, for example Figure 1A The negative one screen page shown.

[0133] Module interval: reference Figure 1A For the page modules arranged vertically, the module interval may refer to the shortest distance between two page modules along the long side of the electronic device 100; Figure 1B For the horizontally arranged page modules, the module interval may refer to the shortest distance between two page modules along the short side of the electronic device 100. In the embodiment of the present application, the module interval between two adjacent stationary page modules is referred to as the initial interval between the above two page modules, and the initial intervals between any two module intervals in the same page may be equal or unequal. During the page sliding process, the module interval between two adjacent page modules may not be equal to the initial interval between the two page modules; when the page stops sliding, the module interval between two adjacent page modules is equal to the initial interval between the two page modules. The initial interval between adjacent page modules may be preset by the electronic device 100 or set by the user.

[0134] It should be noted that the top, bottom, left, right, as well as upward, downward, left and right mentioned in the embodiments of the present application are all relative, and are exemplary descriptions in specific implementation methods, and should not constitute a limitation on the embodiments of the present application.

[0135] The following is a detailed introduction to the page sliding processing method provided in the embodiment of the present application in conjunction with the accompanying drawings.

[0136] The following takes the negative one screen as an example to introduce the processing method for page sliding in a non-centered layout.

[0137] The negative first screen can be used to place some quick service functions and notification messages, such as quick entrances to applications, instant messages and reminders (express information, travel information, schedule information, etc.), dynamics (news flash, sports live broadcasts, etc.), etc. The user can view the negative first screen by sliding right on the main interface of the electronic device 100.

[0138] For example, Figure 3A As shown, the electronic device 100 displays a home screen 10. The home screen 10 may include a status bar, a navigation bar, a calendar indicator, and a weather indicator. It may also include multiple application icons, such as a gallery icon, a music icon, a smart home icon, and the like.

[0139] like Figure 3A and Figure 3B As shown, the user's finger slides to the right on the display screen 194, and the electronic device 100 detects the above user operation. In response to the above user operation, the electronic device 100 displays the negative one screen 11. The negative one screen 11 may include: a status bar 201, and page modules 202, 203, 204, 205, and 206 of the negative one screen page. The page modules 203, 205, and 206 are all presented as a card, the page module 203 includes an icon 202A and a search box 202B, and the page module 204 includes a title bar 204A, a control 204B, and a card 204C.

[0140] For example, see FIG. 4A to FIG. 4C , is a schematic diagram of a page sliding effect provided by taking the negative one screen 11 as an example in an embodiment of the present application.

[0141] like Figure 4A As shown, the negative one screen page includes the page module displayed on the display screen 194, and also includes other page modules not shown. Figure 4A The page modules shown in the figure, the negative one screen page can also include other page modules, which are not specifically limited here. Figure 4A As shown, at time t1, the user's finger slides upward starting from the page module 205. After the electronic device 100 detects the above user operation on the page module 205, it controls each page module of the negative one screen page to slide upward.

[0142] For ease of description, in the embodiment of the present application, the page module 205 that is activated when the user slides the page upward is called a focus module, and the focus module is numbered as X, and then other page modules are numbered with reference to the focus module, such as Figure 4A As shown, the page modules of the negative one screen page are numbered from top to bottom as X-3, X-2, X-1, X, X+1, X+2, X+3 and X+4. In some embodiments, when the user slides the page, if the contact surface between the user's finger and the display screen 194 falls on two adjacent page modules at the same time, the electronic device 100 determines that the page module with a larger contact surface with the user's finger is the focus module X. In some embodiments, when the user slides the page, if the contact surface between the user's finger (or stylus) and the display screen 194 falls on the module interval between two adjacent page modules, the electronic device 100 determines that the page module closest to the contact surface of the user's finger is the focus module X.

[0143] refer to FIG. 4A to FIG. 4C , the page module corresponding to the dotted box in the drawings provided in the embodiment of the present application is the page module of the negative one screen page that is not displayed on the display screen 194. As the page module of the negative one screen page slides on the display screen, the page module corresponding to the dotted box can also be displayed on the display screen 194. In some embodiments, if the display screen of the electronic device is large enough, Figure 4A The page module corresponding to the dotted box can also be displayed on the display screen 194. In another embodiment, the display content of the dotted box is only a schematic visual effect when displayed on the screen, and it may not be drawn before being displayed, and does not occupy the corresponding display resources.

[0144] like Figure 4A and Figure 4B As shown, from time t1 to time t3, the electronic device controls each page module to slide upward, the module interval between module Xn and module Xn-1 decreases, and the module interval between module X+n and module X+n-1 increases. Among them, the module interval between module Xn and module Xn-1 includes: the module interval between module X-1 and module X, the module interval between module X-2 and module X-1, or the module interval between module X-3 and module X-2, and the module interval between module X+n and module X+n-1 includes: the module interval between module X and module X+1, the module interval between module X+1 and module X+2, the module interval between module X+2 and module X+3, and the module interval between module X+3 and module X+4. Among them, n is a positive integer.

[0145] like Figure 4B As shown, from time t3 to time t4, the electronic device controls each page module to continue to slide upward, the module interval between module Xn and module Xn-1 increases, and the module interval between module X+n and module X+n-1 decreases. Figure 4B and Figure 4C As shown, from time t4 to time t5, when the relative displacement of each page module in the sliding direction reaches displacement 1, the sliding stops, the module interval between module Xn and module Xn-1 increases to the initial interval, and the module interval between module X+n and module X+n-1 decreases to the initial interval. In some embodiments, displacement 1 can be determined by the electronic device 100 based on at least one of the user's sliding speed and sliding distance. It should be noted that before and after the page slides, the module intervals in the page are all initial intervals, and the relative displacements of each page module are equal. In the embodiment of the present application, the relative displacement of each page module can also be referred to as the relative displacement of the page.

[0146] Depend on FIG. 4A to FIG. 4C It can be seen that when the user slides the page upward, the module interval in the sliding direction (i.e., the module interval between module Xn and module Xn-1) first decreases from the initial interval and then increases to the initial interval; the module interval in the opposite direction of the sliding (i.e., the module interval between module X+n and module X+n-1) first increases from the initial interval and then decreases to the initial interval. Similarly, when the user slides the page downward, the module interval above the focus module X that the user acts on first increases from the initial interval and then decreases to the initial interval; the module interval below the focus module X first decreases from the initial interval and then increases to the initial interval.

[0147] In the embodiment of the present application, the focus module X affected by the user sliding operation can be referred to as the first page module, and the page module adjacent to the focus module X in the user sliding direction can be referred to as the second page module (for example, Figure 4A The module X-1 shown in the figure), the page module adjacent to the focus module X in the opposite direction of the user's sliding can be called the third page module (for example, Figure 4A The first page module and the second page module have a first interval; the first page module and the third page module have a second interval; the first interval decreases in the first time period and increases in the second time period, and the start time of the second time period is equal to the end time of the first time period; the second interval increases in the third time period and decreases in the fourth time period, and the start time of the fourth time period is equal to the end time of the third time period.

[0148] For example, see Figure 4A , the first interval may be the module interval between module X and module X-1, and the second interval may be the module interval between module X and module X+1; see FIG. 4A to FIG. 4C , the first time period and the third time period may be time periods corresponding to time t1 to time t3, and the second time period and the fourth time period may be time periods corresponding to time t3 to time t5. In the embodiment of the present application, the sliding direction of the user points from the first page module to the second page module. In response to the sliding operation of the user, the sliding direction of the first page module may be referred to as the first direction, and the direction opposite to the first direction may be referred to as the second direction. The initial interval between the first page module and the second page module may be the first value, and the initial interval between the first page module and the third page module may be the second value.

[0149] Below Figure 5A Taking the modules X-1, X, and X+1 in the example, the sliding effect of page sliding is further introduced. In the embodiment of the present application, the module interval between module X+a and module X+a-1 is defined as L (X+a-1，X+a) , where a is an integer, that is, the module interval between module X-1 and module X is L (X-1，X) ; The module spacing between module X+1 and module X is L (X，X+1) .

[0150] like Figure 5A As shown, at time t21, the module interval L (X-1，X) Equal to the initial interval between module X-1 and module X, the module interval L (X，X+1) = ... (X-1，X) Reduce, module spacing L (X，X+1) Increase; Compared with time t22, at time t23, the module interval L (X-1，X) Continue to decrease, the module interval L (X，X+1) From t23 to t25, module X-1, module X, and module X+1 continue to slide upward. Compared with t23, at t24, the module interval L (X-1，X) Increase, module spacing L (X，X+1) Reduced; Compared with time t24, at time t25, the module interval L (X-1，X) Increase to the initial interval between module X-1 and module X, module interval L (X，X+1) Reduced to the initial interval between module X and module X+1. After t25, Figure 5A The displayed page modules all stop sliding.

[0151] In some embodiments of the present application, see Figure 5A , the second page module may be module X-1, the third page module may be module X+1, and the first interval may be module interval L (X-1，X) , the second interval can be the module interval L (X，X+1) ; See Figure 5A The first time period and the third time period may be time periods corresponding to time t21 to time t23, and the second time period and the fourth time period may be time periods corresponding to time t23 to time t25. Figure 5A In the embodiment, the starting time of the first time period and the third time period are the same, and the ending time of the first time period and the third time period are also the same.

[0152] In some embodiments, the start time of the first time period may be earlier than the start time of the third time period, for example Figure 5A Medium module spacing L (X-1，X) The time when the decrease starts is earlier than the module interval L (X，X+1) In some embodiments, the start time of the first time period may be later than the start time of the third time period, for example Figure 5A The middle module interval L (X，X+1) The moment when it starts to increase is earlier than the module interval L (X-1，X) The moment when it starts to decrease.

[0153] In some embodiments, the end moment of the first time period can be later than the end moment of the third time period. For example Figure 5A The middle module interval L (X-1，X) When decreasing, the module interval L (X，X+1) Has started to change from an increasing trend to a decreasing trend. In some embodiments, the end moment of the first time period can be earlier than the end moment of the third time period. For example Figure 5A The middle module interval L (X，X+1) When increasing, the module interval L (X，X+1) Has started to change from a decreasing trend to an increasing trend.

[0154] In some embodiments, the end moment of the second time period can be earlier than the end moment of the fourth time period. For example Figure 5A The middle module interval L (X-1，X) When increasing to the initial interval between module X - 1 and module X, the module interval L (X，X+1) Is still continuing to decrease until it decreases to the initial interval between module X and module X + 1. In some embodiments, the end moment of the second time period can be later than the end moment of the fourth time period. For example Figure 5A The middle module interval L (X，X+1) When decreasing to the initial interval between module X and module X + 1, the module interval L (X-1，X) Is still continuing to increase until it increases to the initial interval between module X - 1 and module X.

[0155] In some embodiments of the present application, each page module is connected to a virtual spring, and the movement trend of each page module conforms to the movement trend of the elastic force of the spring.

[0156] In some embodiments of the present application, such as Figure 5B Shown Figure 5B The adjacent page modules shown adopt a chain connection with spring properties. In the embodiments of the present application, the virtual spring between module X + a and module X + a - 1 is called Y (X+a-1,X+a) , where a is an integer. The module interval L (X+a-1，X+a) Between module X + a and module X + a - 1 is the length of the virtual spring Y (X+a-1,X+a) .

[0157] Such as Figure 5B As shown, at time t21, the user's finger slides upward on the display screen 194 starting from the focus module X, and the electronic device detects that the user's sliding speed is V1. After the user stops sliding, the module X slides upward at the initial speed V1. From time t21 to time t22, the module interval L (X-1，X) Reduce, module spacing L (X，X+1) The adjacent modules are connected in a chain-like manner with spring properties. (X-1，X) decreases, module X will be affected by the virtual spring Y (X,X-1) The elastic force directed toward the bottom of the electronic device 100, module X-1 is also affected by the virtual spring Y (X,X-1) Based on the elastic force directed toward the top of the electronic device 100, the module X-1 also moves toward the top of the electronic device 100. From time t21 to time t23, the moving speed of the module X-1 is less than the moving speed of the module X, and the module interval L (X-1，X) Gradually decreases. Due to the module spacing L (X，X+1) increases, module X will be affected by the virtual spring Y (X,X+1) The pulling force directed toward the bottom of the electronic device 100, module X+1 will be affected by the virtual spring Y (X,X+1) Based on the pulling force directed toward the top of the electronic device 100, the module X+1 also moves toward the top of the electronic device 100. From time t21 to time t23, the moving speed of the module X+1 is less than the moving speed of the module X, and the module interval L (X，X+1) Gradually increases. During the sliding process of module X from t21 to t23, module X will be subject to the elastic force pointing to the bottom of the electronic device 100, the pulling force pointing to the bottom of the electronic device 100, and the friction force f. Therefore, the acceleration of module X from t21 to t25 is negative, and the speed of module X will gradually decrease from the initial speed V1. From t23, the speed of module X is less than the speed of module X-1 and the speed of module X+1. From t23 to t25, the module interval L (X-1，X) Gradually increase, module interval L (X，X+1) Gradually decrease.

[0158] In some embodiments, V1 may be the average speed of the user sliding on the display screen 194 during the sliding operation, or the instantaneous speed before the user stops sliding. The electronic device 100 may determine the relative displacement S1 of each page module based on the user's sliding speed V1.

[0159] In some embodiments, from time t21, module X slides upward, and along with virtual spring Y (X,X-1) The compression amount increases, and module X-1 is affected by the virtual spring Y (X,X-1) The elastic force directed toward the top of the electronic device 100 also increases. (X,X-1) The elastic force directed toward the top of the electronic device 100 is greater than the friction force on module X-1, and module X-1 starts to move toward the top of the electronic device 100. The sliding time of module X-1 is later than that of module X. Similarly, from time t21, module X slides upward, and with the virtual spring Y (X,X+1) The stretching amount increases, and module X+1 is affected by the virtual spring Y (X,X+1) The pulling force directed toward the top of the electronic device 100 also increases. (X,X+1) The pulling force directed toward the top of the electronic device 100 is greater than the friction force on the module X+1, and the module X+1 starts to move toward the top of the electronic device 100, and the sliding time of the module X+1 is later than that of the module X.

[0160] In some embodiments, module X-1, module X, and module X+1 are not subject to friction during the sliding process. (X,X-1) When compressed, module X-1 is acted upon by virtual spring Y (X,X-1) The elastic force directed toward the top of the electronic device 100 immediately moves toward the top of the electronic device 100. At time t21, module X slides upward, and the virtual spring Y (X,X+1) When stretched, module X+1 is affected by virtual spring Y (X,X+1) The pulling force directed toward the top of the electronic device 100 immediately moves toward the top of the electronic device 100.

[0161] Below Figure 5C Taking the page module shown in the figure as an example, the sliding effect of page sliding is further introduced. Figure 5C For the sliding effects of module X-1, module X and module X+1, please refer to Figure 5A The sliding effects of module X-1, module X and module X+1.

[0162] like Figure 5C As shown, at time t21, the module interval L (X-n-1，X-n) Equal to the initial interval between module Xn and module Xn-1, the module interval L (X+n-1，X+n) = ... (X-n-1，X-n) Reduce, module spacing L (X+n-1，X+n) Increase; Compared with time t22, at time t23, the module interval L (X-n-1，X-n) Continue to decrease, the module interval L (X+n-1，X+n) From time t23 to time t25, each page module continues to slide upward. Compared with time t23, at time t24, the module interval L (X-n-1，X-n) Increase, module spacing L (X+n-1，X+n) Reduced; Compared with time t24, at time t25, the module interval L (X-n-1，X-n) Increase to the initial interval between module Xn and module Xn-1, the module interval L (X+n-1，X+n) Reduced to the initial interval between module X+n-1 and module X+n. After time t25, Figure 5A The displayed page modules all stop sliding.

[0163] In some embodiments of the present application, at time t22, the module interval L (X-1，X) Smaller than module spacing L (X-2，X-1) , module spacing L (X，X+1) Greater than module spacing L (X+1，X+2) At t23, the module interval L (X-1，X) Less than or equal to module L (X-2，X-1) , module spacing L (X，X+1) Greater than module spacing L (X+1，X+2) , module spacing L (X+1，X+2) Greater than module spacing L (X+2，X+3) In one implementation, at time t24, the module interval L (X-1，X) Greater than module L (X-2，X-1) , module spacing L (X，X+1) Smaller than module spacing L (X+1，X+2) , module spacing L (X+1，X+2) Smaller than module spacing L (X+2，X+3) In another implementation, at time t24 and time t25, the module interval L (X-1，X) Smaller than module L (X-2，X-1) , module spacing L (X，X+1) Greater than module spacing L (X+1，X+2) , module spacing L (X+1，X+2) Greater than module spacing L (X+2，X+3) In another implementation, at time t24, the module interval L (X-1，X) Greater than module L (X-2，X-1) , module spacing L (X，X+1) Smaller than module spacing L (X+1，X+2) , module spacing L (X+1，X+2) Greater than module spacing L (X+2，X+3) .

[0164] In some embodiments of the present application, at any time from time t21 to time t25, the module interval L (X-1，X) Equal to the module spacing L (X-2，X-1) , module spacing L (X，X+1) Equal to the module spacing L (X+1，X+2) , module spacing L (X+2，X+3) , module spacing L (X+3，X+4) , module spacing L (X+4，X+5) That is, the interval between each module is L (X-n，X-n-1) The change trends are the same, and the interval between each module is L (X+n，X+n-1) The changing trends are also the same.

[0165] In some embodiments of the present application, compared with time t21, at time t22, the module interval L (X-2，X-1) The reduction is less than the module spacing L (X-1，X) The reduction of module spacing L (X+1，X+2) The increase is smaller than the module spacing L (X，X+1) The increase rate of t22 can also be referred to as the first moment and / or the second moment.

[0166] In some embodiments of the present application, compared with time t21, at time t22, the module interval L (X-2，X-1) The reduction is equal to the module spacing L (X-1，X) The reduction of module spacing L (X+1，X+2) The increase is equal to the module spacing L (X，X+1) the increase.

[0167] In some embodiments of the present application, at any time from time t21 to time t25, the distance between module Xn and module X+n remains unchanged. For example, the distance between module X-1 and module X+1 remains unchanged, that is, the distance between module X and module X+1 is less than or equal to the module interval L. (X-1，X) Plus the module spacing L (X，X+1) , the distance between module X and module X-1 is greater than or equal to zero. For example, the distance between module X-2 and module X+2 remains unchanged.

[0168] In some embodiments of the present application, the change trend in the process of reducing (or increasing) the module interval can be a linear change or a nonlinear change. The process of reducing (or increasing) the module interval can be continuous or discontinuous. For example, the time period from time t22 to time t23 includes time period 1 and time period 2, and the module interval L (X-1，X) From t22 to t23, the overall time period shows a decreasing trend, and the module interval L (X-1，X) It can remain unchanged in time period 1 and decrease in time period 2. The order of time period 1 and time period 2 is not specifically limited here.

[0169] In some embodiments of the present application, another page module adjacent to the second page module may also be referred to as a fourth page module, and another page module adjacent to the third page module may also be referred to as a fifth page module. The second page module and the fourth page module have a third interval, and the third page module and the fifth page module have a fourth interval. The third interval decreases in the first time period and increases in the second time period; the fourth interval increases in the third time period and decreases in the fourth time period. For example, see Figure 5C , the fourth page module may be module X-2, and the fifth page module may be module X+2. The third interval may be module interval L (X-2，X-1) , the fourth interval can be the module interval L (X+1，X+2) .

[0170] In some embodiments of the present application, there is a time difference between the start sliding moments of each page module. The electronic device 100 detects an upward sliding operation on the focus module X. In response to the sliding operation, the electronic device 100 controls each page module to slide upward, and there is a time difference between the start sliding moments of two adjacent page modules on the same side of the focus module X, wherein the module close to the focus module X slides first. In addition, the start sliding moments of module Xn and module X+n are the same.

[0171] For example, Figure 5D As shown, between time t21 and time t22, time t26 and time t27 may also be included. The electronic device 100 detects the upward sliding operation on the focus module X, and the electronic device 100 controls each page module to slide upward. From time t21 to time t26, module X slides upward, and the positions of other modules remain unchanged. Compared with time t21, at time t26, the module interval L (X-1，X) Reduce, module spacing L (X，X+1) Increase, module spacing L (X-2，X-1) and module spacing L (X+1，X+2) From t26 to t27, module X continues to slide upward, and modules X-1 and X+1 begin to slide upward, while the positions of other modules remain unchanged. Compared with t26, at t27, the module interval L (X-2，X-1) And the module spacing L (X-1，X) Reduce, module spacing L (X，X+1) And the module spacing L (X+1，X+2) Increase. The starting sliding time difference between module X-1 and module X is time difference 1, that is, the time difference between time t21 and time t26, and the starting sliding time difference between module X-2 and module X-1 is time difference 2, that is, the time difference between time t26 and time t22. Among them, time difference 1 and time difference 2 can be set by default by the electronic device 100, or preset by the user, or determined by the electronic device according to the friction of the page module, and time difference 1 and time difference 2 can be equal or unequal.

[0172] In some embodiments of the present application, there is no time difference between the start sliding moments of each page module. Figure 5E As shown, the electronic device 100 detects an upward sliding operation on the focus module X, and the electronic device 100 controls each page module to slide upward at the same time. From time t21, each page module slides upward. Compared with time t21, at time t26, the module interval L (X-n-1，X-n) Reduce, module spacing L (X+n-1，X+n) From time t26 to time t27, each page module continues to slide upward. Compared with time t26, at time t27, the module interval L (X-n-1，X-n) Continue to decrease, the module interval L (X+n-1，X+n) Continue to grow.

[0173] In some embodiments of the present application, there is a time difference between the stop sliding moments of each page module. There is a time difference between the stop sliding moments of two adjacent page modules on the same side of the focus module X, where the module close to the focus module X stops sliding first. In addition, the stop sliding moments of module Xn and module X+n are the same.

[0174] For example, Fig. 5F As shown, between time t24 and time t25, time t28 and time t29 are also included. From time t24 to time t28, each page module slides upward, and the module interval L (X-n-1，X-n) Increase, module spacing L (X+n-1，X+n) At t28, module X starts to stop sliding, and at t29, modules X-1 and X+1 start to stop sliding. From t28 to t29, the position of module X remains unchanged, and other modules continue to slide upward. Compared with t28, at t29, the module interval L (X-n-1，X-n) Continue to increase, module spacing L (X+n-1，X+n) Continue to decrease, where the module interval L (X-1，X) Increase to the initial interval, module interval L (X，X+1) Reduced to the initial interval. From t29 to t25, the positions of module X, module X-1 and module X+1 remain unchanged, and other modules continue to slide upward. Compared with t29, at t25, the module interval L (X-1，X) and module spacing L (X，X+1) Unchanged, except for the module spacing L (X-1，X) Module spacing outside L (X-n-1，X-n) Increase to the initial interval, except for the module interval L (X，X+1) Module spacing outside L (X+n-1，X+n) The time difference between module X-1 and module X when they stop sliding is time difference 3, that is, the time difference between time t27 and time t28, and the time difference between module X-2 and module X-1 when they stop sliding is time difference 4. Time difference 3 and time difference 4 may be set by default by the electronic device 100 or may be preset by the user, and time difference 3 and time difference 4 may be equal or unequal.

[0175] In one implementation, adjacent page modules are connected in a chain-like manner with spring properties. When the elastic force directed toward the top of the electronic device 100 by module Xn is greater than the sliding friction of module Xn, module Xn starts to slide toward the top of the electronic device 100. From time t21 to time t22, the sliding speed of module Xn is less than or equal to module Xn-1, and the sliding time of module Xn-1 is later than that of module Xn. Therefore, compared with time t21, at time t22, the module interval L (X-2，X-1) Reduced and less than the module spacing L (X-1，X) Similarly, when the elastic force on module X+n directed toward the top of the electronic device 100 is greater than the sliding friction of module X+n, module X+n starts to slide toward the top of the electronic device 100. From time t21 to time t22, the sliding speed of module X+n+1 is less than that of module X+n, and the sliding time of module X+n+1 is later than that of module X+n. Therefore, compared with time t21, at time t22, the module interval L (X+1，X+2) Increase, and less than the module spacing L (X，X+1) .

[0176] Figure 5C The page shown may also include other page modules. Based on the above embodiments, the sliding effects of any module Xn and module X+n can be derived similarly, which will not be repeated here.

[0177] like FIG. 6A to FIG. 6C As shown, several page sliding effects are provided according to an embodiment of the present application based on the sliding of a user's finger on the display screen 194 .

[0178] like Fig. 6A and Figure 6B As shown, at time t21, the user's finger slides upward on the display screen 194 starting from the focus module X S3, and the electronic device 100 detects the above user operation and controls each page module to slide upward, with the module interval L (X-n-1，X-n) Reduce, module spacing L (X+n-1，X+n) At time t22, the user's finger leaves the display screen 194. The electronic device 100 determines the relative displacement of module X after time t22 by S4 and the relative displacement of other modules after time t21 by S3+S4 based on the sliding speed before the user's finger leaves the display screen 194 using the friction model, and controls each page module to slide upward. In one implementation, refer to Fig. 6A After t22, from t22 to t26, the module interval L (X-n-1，X-n) Reduce and then increase to the initial interval, module interval L (X+n-1，X+n) In another implementation, see Figure 6B , after t22, it also includes t30 and t31. From t22 to t31, the module interval L (X-n-1，X-n) Increase to the initial interval, module interval L (X+n-1，X+n) Reduce to the initial interval.

[0179] like Figure 6C As shown, from time t21 to time t22, the user's finger slides upward on the display screen 194 starting from the focus module X S3, and the electronic device 100 detects the above user operation and controls each page module to slide upward, with the module interval L (X-n-1，X-n) Reduce, module spacing L (X+n-1，X+n) After time t22, the user's finger leaves the display screen 194, the module X stops sliding, and the electronic device 100 determines that the relative displacement of each page module is S3. From time t22 to time t28, the module interval L (X-n-1，X-n) Increase to the initial interval, module interval L (X+n-1，X+n) Reduce to the initial interval.

[0180] In the embodiment of the present application, the user performs a sliding operation within the sixth time period. FIG. 6A to FIG. 6C , the sixth time period may be a time period corresponding to time t21 to time t22. In some embodiments, the end time of the first time period is later than the end time of the sixth time period. Fig. 6A As shown, the first time period and the third time period may be time periods corresponding to time t21 to time t23, and the second time period and the fourth time period may be time periods corresponding to time t23 to time t25.

[0181] In some embodiments, the end time of the first time period is equal to the end time of the sixth time period. Figure 6B As shown, the first time period and the third time period may be time periods corresponding to time t21 to time t22, and the second time period and the fourth time period may be time periods corresponding to time t22 to time t31. Figure 6C As shown, the first time period and the third time period may be time periods corresponding to time t21 to time t22, and the second time period and the fourth time period may be time periods corresponding to time t22 to time t32.

[0182] In some embodiments, the end time of the first time period may be earlier than the end time of the sixth time period.

[0183] Below Fig. 7A Taking the page module shown as an example, another sliding effect of page sliding provided in an embodiment of the present application is introduced. Fig. 7A In the page sliding effect shown, the size of the page module can change as the page module slides.

[0184] See also Fig. 7A , the user slides upward from the focus module X as the starting point, and the electronic device 100 detects the above user operation and controls the page to slide upward. During the page sliding process, the width of the module Xn in the sliding direction of the module X and the module interval L (X-n，X-n-1) First decrease and then increase, the width of module X+n in the opposite direction of module X sliding and the module spacing L (X-n，X-n-1) First increase and then decrease. In the embodiment of the present application, the width of the page module X+a before the page slides is defined as the initial width of the module X+a.

[0185] like Fig. 7A As shown, at time t21, the width of module X-1 is the initial width of module X-1, the width of module X is the initial width of module X, and the module interval L (X-1，X) Equal to the initial interval between module X-1 and module X, the module interval L (X，X+1) = ... (X-1，X) Reduce the width of module X+1 and the module spacing L (X，X+1) Increase; Compared with time t22, at time t23, the width of module X-1 and the module interval L (X-1，X) Continue to reduce, the width of module X+1 and the module spacing L (X，X+1) From t23 to t25, module X-1, module X, and module X+1 continue to slide upward. Compared with t23, at t24, the width of module X-1 and the module interval L (X-1，X) Increase the width of module X+1 and the module spacing L (X，X+1) Compared with time t24, at time t25, the width of module X-1 increases to the initial width of module X-1, and the module interval L (X-1，X) The width of module X+1 is reduced to the initial width of module X+1. The module spacing L (X，X+1) Reduced to the initial interval between module X and module X+1. After t25, Fig. 7A The displayed page modules all stop sliding.

[0186] In one implementation, during the page sliding process from time t21 to time t26, the width of module X-1 and the module interval L (X-1，X) Increase or decrease in the same proportion, the width of module X+1 and the module spacing L (X，X+1) For example, compared with time t21, at time t22, the width of module X-1 and the module spacing L (X-1，X) Reduce the width of module X+1 and the module spacing L (X，X+1) At time t22, the ratio of the width of module X-1 to the initial width of module X-1 is 1, and the module spacing L (X-1，X) The ratio of the width of module X+1 to the initial width of module X+1 is 1. At time t22, the ratio of the width of module X+1 to the initial width of module X+1 is 2. The module spacing L (X，X+1) The ratio of the initial interval between the two modules (i.e., the initial interval between module X+1 and module X) is also 2. In another implementation, during the page sliding process from time t21 to time t26, the width of module X-1 and the module interval L (X-1，X) Increase or decrease the width of module X+1 and the module spacing L at different ratios (X，X+1) It also increases or decreases in different proportions.

[0187] Below Figure 7B Taking the page shown as an example, another sliding effect of page sliding provided in an embodiment of the present application is introduced. Figure 7B In the page sliding effect, the size of the page module affects the changing trend of the module interval.

[0188] like Figure 7B As shown, compared Figure 5A The module X-1 shown, Figure 7B The module X-1 shown has a smaller initial width than Figure 5A The module X+1 shown, Figure 7B The initial width of module X+1 is larger. At time t21, the user slides upward starting from the focus module X. After the electronic device 100 detects the user operation, it controls the page to slide upward. Figure 5A The page sliding effect shown, the module interval is L (X-1，X) First decrease and then increase, the module spacing L (X，X+1) Increase first and then decrease. Figure 5A , Figure 7B At time t22 and time t23, the module interval L (X-1，X) and module spacing L (X，X+1) Bigger.

[0189] In one implementation, adjacent page modules are connected in a chain-like manner with spring properties. The larger the area of ​​a page module, the greater its mass, and the greater the friction force on the page module. Figure 7B As shown in the figure, from time t21, module X slides upward, along with the virtual spring Y (X,X-1) The compression amount increases, and module X-1 is affected by the virtual spring Y (X,X-1) The elastic force directed toward the top of the electronic device 100 also increases. (X,X-1) The elastic force directed toward the top of the electronic device 100 is greater than the friction force on the module X-1, and the module X-1 starts to move toward the top of the electronic device 100. The smaller the area of ​​the module X-1, the smaller the friction force it is subjected to, and the smaller the elastic force required for the module X-1 to slide upward, that is, the smaller the required spring compression. Figure 5A At time t22 and time t23, the module interval L (X-1，X) From time t21, module X slides upward, along with the virtual spring Y (X,X+1) The stretching amount increases, and module X+1 is affected by the virtual spring Y (X,X+1) The pulling force directed toward the top of the electronic device 100 also increases. (X,X+1) The pulling force directed toward the top of the electronic device 100 is greater than the friction force on module X+1, and module X+1 begins to move toward the top of the electronic device 100. The larger the area of ​​module X+1, the greater the friction force it experiences, and the greater the pulling force required for module X+1 to slide upward, that is, the greater the required spring stretch. Figure 5A At time t22 and time t23, the module interval L (X，X+1) Bigger.

[0190] In some embodiments of the present application, the widths of module X-1 and module X+1 are not equal, and during time t21 to t23, the distance between module X-1 and module X+1 increases.

[0191] Below Figure 7C Taking the page shown as an example, another sliding effect of page sliding provided in an embodiment of the present application is introduced. Figure 7C Provides a page sliding effect with page rebound.

[0192] like Figure 7C As shown, from time t41, the user's finger slides upward on the display screen 194 starting from the focus module X. After the electronic device 100 detects the above user operation on the focus module X, it controls each page module to slide upward. From time t41 to time t43, module X-1, module X, and module X+1 slide upward. Compared with time t41, at time t42, the module interval L (X-1，X) Reduce, module spacing L (X，X+1) Increase; Compared with time t42, at time t43, the module interval L (X-1，X) Continue to decrease, the module interval L (X，X+1) From time t43 to time t44, module X-1, module X, and module X+1 continue to slide upward. Compared with time t43, at time t44, the module interval L (X-1，X) Increase, module spacing L (X，X+1) From t44 to t45, module X stops sliding, and modules X-1 and X+1 continue to slide upward. Compared with t44, at t45, the module interval L (X-1，X) Continue to increase, module spacing L (X，X+1) Continue to decrease. From t45 to t46, module X-1, module X, and module X+1 slide downward. Compared with t45, at t46, the module interval L (X-1，X) Reduced to the initial interval between module X-1 and module X, the module interval L (X，X+1) Increase to the initial interval between module X and module X+1. After time t46, Figure 5A The indicated page module stops sliding.

[0193] In some embodiments of the present application, Figure 7C The movement trend of the page module shown is consistent with the under-damped movement state of the spring. Figure 7C As shown, the sliding distance of the page is S1. During the page sliding process, the relative displacement of the page module first exceeds S1 and then rebounds to S1. In some embodiments, during the page sliding process, the sliding of the page module may rebound multiple times, which is not specifically limited here.

[0194] In some embodiments of the present application, see Figure 7C , the second page module may be module X-1, the third page module may be module X+1, and the first interval may be module interval L (X-1，X) , the second interval can be the module interval L (X，X+1) ; See Figure 7C The first time period and the third time period may be time periods corresponding to time t41 to time t43, and the second time period and the fourth time period may be time periods corresponding to time t43 to time t45.

[0195] In some embodiments of the present application, the first interval is reduced to the initial interval in the seventh time period after the second time period, and the second interval is increased to the initial interval in the eighth time period after the fourth time period; the start time of the seventh time period is equal to the end time of the second time period, and the start time of the eighth time period is equal to the end time of the fourth time period. Figure 7C , the seventh time period and the eighth time period may be time periods corresponding to time t45 to time t46.

[0196] Below Fig. 8A Taking the page shown in the figure as an example, another sliding effect of page sliding provided by the embodiment of the present application is introduced. Fig. 8A As shown, module X-2 is Fig. 8A The edge modules of the page shown, one side of module X-2 is connected to module X-1, and the other side is not connected to the page module. Fig. 8A , when the user slides the page downward, from time t53 to time t56, module X-2 is displayed on the display screen 194, and the distance between the upper edge of module X-2 and the upper edge of the display interface is greater than the preset value 1. This embodiment of the present application refers to this situation as page crossing, and for this situation, the embodiment of the present application provides a page sliding effect with crossing rebound.

[0197] like Fig. 8A As shown, from time t51, the user's finger slides downward on the display screen 194 starting from the focus module X. After the electronic device 100 detects the above user operation on the focus module X, it controls each page module to slide. From time t51 to time t52, each page module slides downward. Compared with time t51, at time t52, the module interval L (X-n-1，X-n) Increase, module spacing L (X+n-1，X+n) From time t52 to time t53, each page module continues to slide downward. Compared with time t52, at time t53, the module interval L (X-n-1，X-n) Reduced, while the module spacing L (X+n-1，X+n) From time t53 to time t54, each page module continues to slide downward. Compared with time t53, at time t54, the module interval L (X-n-1，X-n) Increase, module spacing L (X+n-1，X+n) From time t54 to time t55, each page module slides upward. Compared with time t54, at time t55, the module interval L (X-n-1，X-n) Continue to increase, module spacing L (X+n-1，X+n) Also continues to increase, the module interval L (X+n-1，X+n) is greater than the initial interval between module X+n-1 and module X+n. From time t55 to time t56, each page module continues to slide upward. Compared with time t55, at time t56, edge module X-2 slides to the top of display screen 194, and the module interval L (X-n-1，X-n) Reduced to the initial interval between module Xn and module Xn-1, and the module interval L (X+n-1，X+n) Increase to the initial interval between module X+n-1 and module X+n. After time t56, Fig. 8A The indicated page module stops sliding.

[0198] In some embodiments of the present application, see Figure 8B , from time t51 to time t53, the user's finger slides on the display screen 194 starting from the focus module, and the electronic device 100 detects the above user operation and controls the page module to slide down with the finger. From time t51 to time t52, the page does not cross the boundary, and the sliding distance of the electronic device 100 control module X is the same as the sliding distance 1 of the finger along the long side of the electronic device 100; from time t52 to time t53, the page crosses the boundary, that is, the distance between the upper edge of the edge module X-2 and the upper edge of the display interface is greater than the preset value 1, and the sliding distance S5 of the electronic device 100 control module X is less than the sliding distance S6 of the finger along the long side of the electronic device 100.

[0199] In one implementation, the ratio of S5 to S6 is ratio 2. Ratio 2 is less than 1, for example, ratio 2 is equal to 0.4. For example, the preset value 1 is 0 or 5 mm. It can be understood that when the page does not cross the border, the sliding speed of the module X is the same as that of the finger, and when the page crosses the border, the sliding speed of the module X is lower than the sliding speed of the finger.

[0200] See also Figure 8B At t53, the finger leaves the display screen 194. The electronic device 100 controls the module X to continue sliding downward from t53 to t54 based on the sliding speed before the finger leaves. After t54, each page module rebounds upward. From t54 to t56, each page module slides upward, and the edge module X-2 slides to the top of the display screen 194 of the electronic device 100. The module interval L (X-n-1，X-n) First increase and then decrease to the initial interval, while the module interval L (X+n-1，X+n) In one implementation, the electronic device 100 determines the downward sliding distance of the module X from time t53 to time t54 using a friction model based on the sliding speed of the user's finger before it leaves.

[0201] In some embodiments of the present application, see Figure 8C , after time t53, there are also time t57 and time t58. At time t53, after the user's finger leaves the display screen 194, the electronic device 100 immediately controls each page module to rebound upward. From time t53 to time t57, each page module slides upward, and the module interval L (X-n-1，X-n) Increase, module spacing L (X+n-1，X+n) From time t57 to time t58, the edge module X-2 slides to the top of the display screen 194 of the electronic device 100, and the module interval L (X-n-1，X-n) Reduced to the initial interval, module interval L (X+n-1，X+n) Increase to the initial interval.

[0202] In some embodiments of the present application, see FIG. 8A to FIG. 8C , the second page module may be module X+1, the third page module may be module X-1, and the first interval may be module interval L (X，X+1) , the second interval can be the module interval L (X-1，X) ; See Fig. 8A and Figure 8B The first time period may be a time period corresponding to time t51 to time t53, the second time period may be a time period corresponding to time t53 to time t56, the third time period may be a time period corresponding to time t51 to time t52, and the fourth time period may be a time period corresponding to time t52 to time t53. Figure 8B , the second time period and the fourth time period are time periods corresponding to time t53 to time t56. Fig. 8A and Figure 8B The first time period may be the time period corresponding to time t51 to time t53, the second time period may be the time period corresponding to time t53 to time t58, the third time period may be the time period corresponding to time t51 to time t52, and the fourth time period may be the time period corresponding to time t52 to time t53.

[0203] In some embodiments of the present application, the second interval increases to the initial interval in a ninth time period after the fourth time period; the start time of the ninth time period is later than or equal to the end time of the fourth time period, and the start time of the ninth time period is earlier than the end time of the second time period.

[0204] In some embodiments of the present application, the second interval increases in the tenth time period after the fourth time period, and decreases to the initial interval in the eleventh time period after the tenth time period; the end time of the tenth time period is equal to the start time of the eleventh time period, the start time of the tenth time period is later than or equal to the end time of the fourth time period, and the start time of the eleventh time period is earlier than the end time of the second time period. Fig. 8A and Figure 8B The tenth time period may be a time period corresponding to time t53 to time t55, and the eleventh time period may be a time period corresponding to time t55 to time t56. Figure 8C The tenth time period may be a time period corresponding to time t53 to time t57, and the eleventh time period may be a time period corresponding to time t57 to time t58.

[0205] The following takes the multi-tasking interface as an example to introduce the processing method for page sliding in the center layout.

[0206] As the number of applications used by users increases, users often need to switch between different applications to use different services and functions provided by different applications. The multitasking interface may include page modules corresponding to multiple applications that have been started and run by the electronic device 100. Users can quickly switch between different applications through the page modules on the multitasking interface.

[0207] For example, Fig.9A As shown in FIG. 1 , a multi-task page is provided in an embodiment of the present application. Fig.9A As shown, the applications started by the electronic device 100 include calendar, text messages, photo albums, calls, contacts and other applications. The multitasking page of the electronic device 100 includes page modules corresponding to the above multiple applications. The multiple page modules on the multitasking page can be arranged based on a variety of sorting strategies, which are not specifically limited here. In one implementation, the electronic device 100 is sorted according to the most recent foreground running time of the started applications.

[0208] like Fig.9A As shown, the page module 301 corresponding to the call application displayed by the electronic device 100 includes a title bar 301A and a card 301B, wherein the title bar 301A can be used to display the name and icon of the application, and the card 301B can display the interface content of the application.

[0209] Exemplary, reference 9A to 9D , the following introduces another sliding effect of page sliding provided in an embodiment of the present application.

[0210] like Fig.9A As shown, at time t61, the user's finger slides rightward from page module 301 as the starting point. After the electronic device 100 detects the above user operation on page module 301, it slides the page modules of the multitasking page to the right. For the convenience of description, in the embodiment of the present application, the page module 301 that is acted upon when the user slides the page to the right is called the focus module, and the focus module is numbered as X. Then, other page modules are numbered with reference to the focus module, such as Fig.9A As shown, the page modules of the negative one screen page are numbered X-1, X-2, X-3, X and X+1 from right to left.

[0211] like Fig.9A As shown, during the period from t61 to t62, when the page slides to the right, the module interval L between module X and module X-1 is (X-1，X) Reduce the module spacing L between module X+n and module X+n-1 (X+n-1，X+n) Increase. Among them, the module interval L (X+n-1，X+n) Includes: The interval L between module X and module X+1 (X，X+1) 、The interval L between module X+1 and module X+2 (X+1，X+2) 、The interval L between module X+2 and module X+3 (X+2，X+3) . Where n is a positive integer.

[0212] like Fig.9A and Fig. 9B As shown, from time t62 to time t63, when the page slides to the right, the module interval L (X-1，X) Continue to decrease, the module interval L (X+n-1，X+n) Continue to grow. Fig. 9B and Fig. 9C As shown, from time t63 to time t64, when the page slides to the right, the module interval L (X-1，X) Increase to the initial interval between module X and module X-1, module interval L (X+n-1，X+n) Reduced to the initial spacing between module X+n and module X+n-1.

[0213] Depend on 9A to 9C It can be seen that when the user slides the page to the right, the module interval on the right side of the focus module affected by the user (i.e., the interval between module X and module X-1) first decreases from the initial interval and then increases to the initial interval; the module interval on the left side of the focus module (i.e., the interval between module X+n and module X+n-1) first increases from the initial interval and then decreases to the initial interval. Similarly, when the user slides the page to the left, the module interval on the left side of the focus module affected by the user first increases from the initial interval and then decreases to the initial interval; the module interval on the right side of the focus module first decreases from the initial interval and then increases to the initial interval. After time t66, all modules stop sliding, and the relative displacement of each module from time t61 to time t66 is S2.

[0214] In some embodiments of the present application, see FIG. 9A to FIG. 9B , the second page module may be module X-1, the third page module may be module X+1, and the first interval may be module interval L (X-1，X) , the second interval can be the module interval L (X，X+1) ; The first time period and the third time period may be time periods corresponding to time t61 to time t63, and the second time period and the fourth time period may be time periods corresponding to time t63 to time t64.

[0215] For example, the following Fig.9E Taking the multi-tasking page shown as an example, another sliding effect of page sliding provided in an embodiment of the present application is introduced.

[0216] like Fig.9E As shown, module X+1 is Fig.9E The edge module of the page shown, one side of module X+1 is connected to module X, and the other side is not connected to the page module. Refer to Fig.9E , when the user swipes the page to the right, module X+1 is displayed on the display screen 194. In view of the above situation, the embodiment of the present application provides another page sliding effect of over-bound rebound.

[0217] As Fig.9E shown, at time t71, the module interval L (X-n-1，X-n) is equal to the initial interval between module X-n and module X-n-1, and the module interval L (X，X+1) is equal to the initial interval between module X and module X+1. Starting from time t71, the user's finger slides to the right on the display screen 194 with the focus module X as the starting point. After the electronic device 100 detects the above user operation acting on the focus module X, it controls each page module of the multitasking page to slide. From time t71 to time t72, each page module slides to the right. Compared with time t71, at time t72, the module interval L (X，X+1) increases, and the module interval L (X-n-1，X-n) decreases. From time t72 to time t73, each page module continues to slide to the right. Compared with time t72, at time t73, the module interval L (X，X+1) continues to increase, while the module interval L (X-n-1，X-n) continues to decrease. From time t73 to time t74, each page module slides to the left. Compared with time t73, at time t74, the module interval L (X，X+1) decreases, and the module interval L (X-n-1，X-n) increases. At time t74, module X+1 slides to the center position of the page. From time t74 to time t75, module X+1 stops sliding. Compared with time t74, at time t75, the module interval L (X，X+1) decreases to the initial interval between module X and module X+1, and the module interval L (X-n-1，X-n) increases to the initial interval between module X-n and module X-n-1. After time t75, Fig.9E all the page modules shown stop sliding.

[0218] In some embodiments of the present application, refer to Fig.9E , the second page module may be module X-1, the third page module may be module X+1, the first interval may be the module interval L (X-1，X) , the second interval may be the module interval L (X，X+1) ; the first time period and the third time period may be the time period corresponding to time t71 to time t73, and the second time period and the fourth time period may be the time period corresponding to time t73 to time t75.

[0219] It should be noted that for pages with a centered layout, the page module can also be deformed during the sliding process. For example, the width of the page module can be increased or decreased during the sliding process. For details, please refer to Fig. 7A For pages with a centered layout, during the sliding of the page module, the change in the module interval may also be related to the size of the page module. For details, please refer to Figure 7B Related embodiments; For pages with a centered layout, during the sliding process of the page module, the page module can also perform one or more page rebounds. For details, please refer to Figure 7C Related embodiments.

[0220] See also FIG. 5A to FIG. 9E In the page sliding processing method provided in the embodiment of the present application, the user's finger slides on the page to slide the page. During the page sliding process, the rate change mode of each page module may include one or more of the rates such as uniform speed, acceleration, deceleration, parabolic rate, etc. The module interval of the page module presents dynamic changes, and the width of the page module may also present dynamic changes. Among them, the module interval in the user sliding direction can be reduced first and then restored to the initial interval, and the module interval in the opposite direction of the user sliding can be increased first and then restored to the initial interval. The page sliding processing method provided in the embodiment of the present application provides a variety of page sliding effects, increases the fun of page sliding, enhances the feedback effect of the electronic device 100 on the user, and effectively improves the user experience.

[0221] The following describes a page sliding system provided by an embodiment of the present application. For example, Fig.10 As shown, the sliding system includes a friction force model and an elastic force model.

[0222] In some embodiments of the present application, Fig.10 As shown, the electronic device 100 detects the sliding operation of the user on the focus module X and the sliding speed of the sliding operation through the detection module. The electronic device 100 can use the friction model to determine the relative displacement S of the page sliding based on the above sliding speed, thereby determining the movement start point and movement end point of the page. At the same time, based on the spring parameters of module X, the electronic device 100 can determine the spring parameters of each page module using the damping conduction algorithm; and then in the process of page sliding with a relative displacement of S, each page module is controlled to perform elastic force model movement based on the spring parameters of each page module.

[0223] A friction model provided in an embodiment of the present application is introduced below.

[0224] The friction model provided in the embodiment of the present application is a friction model based on an exponential function. The following formulas (1) and (2) are the functional relationships among velocity V (velocity), displacement S, and time t in the friction model.

[0225] V(t)=V 0 *e -4.2*f*t (1)

[0226]

[0227] Among them, V 0 is the initial velocity of the object, t is the time the object moves, and f is the friction the object experiences during its movement.

[0228] It is understood that the greater the friction, the easier it is for an object to stop and the shorter the distance it moves; conversely, the greater the friction. In the embodiment of the present application, the friction may be set by the electronic device 100 according to a specific scenario, or may be a factory default setting of the electronic device 100, or may be set by the user.

[0229] like Fig.11A As shown in FIG. 1 , it is a curve diagram of speed V and time t in a friction model provided in an embodiment of the present application. Fig. 11B , which is a curve diagram of displacement S(t) and time t in a friction force model provided in an embodiment of the present application.

[0230] In some embodiments of the present application, the electronic device 100 can use a speed detection technology (eg, VelocityTracker algorithm) to fit the user's sliding speed on the display screen 194 and set it as V 0 , and then use at least one of formula (1) and formula (2) to determine the relative displacement of the page sliding. The unit of the sliding speed can be pixels per second.

[0231] For pages with non-centered layouts, the following describes how to determine the relative displacement of page sliding based on the user's sliding speed.

[0232] In some embodiments of the present application, the user's sliding speed is set to V 0 . Referring to formula (1), as t increases, V(t) tends to zero. When the speed difference between moment t81 and moment t81-ε1 is less than the preset value λ1, that is, V(t81)-V(t81-ε1)<λ1, the electronic device 100 determines that S(t81) corresponding to moment t81 in formula (2) is the relative displacement of the page sliding. Among them, the preset value ε1 and the preset value λ1 are both preset minimum values, for example, ε1 is equal to 0.1, and λ1 is equal to 0.01. In some embodiments, the electronic device 100 also uses a friction model to determine that the sliding duration of the page sliding is t81.

[0233] In some embodiments of the present application, referring to formula (2), as t increases, S(t) tends to a specific value. When the displacement difference between time t81 and time t81-ε2 is less than the preset value λ2, that is, S(t81)-S(t81-ε)<λ2, the electronic device 100 determines that S(t81) corresponding to time t81 is the relative displacement of the page sliding. In some embodiments, the electronic device 100 also uses a friction model to determine that the sliding duration of the page sliding is t81.

[0234] For pages with a centered layout, the following describes how to determine the relative displacement of page sliding.

[0235] In an embodiment of the present application, a page module in a centered layout is limited to be located at the center of the page. Therefore, for a centered layout page, the relative displacement of the page will have one or more fixed displacement values. In some embodiments, the electronic device 100 first uses a friction model to determine the middle displacement of the centered layout page, and then determines that the relative displacement of the page is the displacement value with the smallest difference with the above-mentioned middle displacement among the one or more fixed displacement values. Among them, how to use the friction model to determine the middle displacement of the centered layout page can refer to the implementation method of using the friction model to determine the relative displacement of a non-centered layout page.

[0236] Exemplary, reference Fig.9A , the electronic device 100 detects a rightward sliding operation on the focus module X, and in response to the sliding operation, the electronic device 100 controls each page module to slide to the right. When the page stops sliding, if the module X+1 is in the center of the page, the relative displacement of the page is the width of the module X and the module interval L (X，X+1) If module X+2 is in the center of the page, the relative displacement of the page is the width of module X, the width of module X+1, and the module spacing L. (X，X+1) , module spacing L (X+1，X+2) If module X+3 is in the center of the page, the relative displacement of the page is the width of module X, the width of module X+1, the width of module X+2, and the module spacing L. (X，X+1) , module spacing L (X+1，X+2) and module spacing L (X+1，X+2) The sum of . In summary, Fig.9A For the page shown, there are only 3 possible relative displacements.

[0237] An elastic force model provided by an embodiment of the present application is described below. The elastic force motion conforms to the damped vibration formula under Hooke's law as shown in formula (3) and formula (4).

[0238] f=ma (3)

[0239]

[0240] Among them, f is the force during the vibration process, m is the mass, a is the acceleration, k is the stiffness coefficient (stiffness), x is the spring deformation, d is the damping coefficient (damping), and t is the time.

[0241] The stiffness coefficient is the size of the elastic force required for a unit deformation of the spring. The larger the stiffness coefficient k, the shorter the time it takes for the spring to return to the equilibrium position from the maximum amplitude, and vice versa. In some embodiments, the stiffness coefficient k can range from 1 to 99, and the recommended value range of the stiffness coefficient k can be 150 to 400.

[0242] The damping coefficient is a quantitative representation of the damping force (such as fluid resistance, friction, etc.) of the spring during vibration. The damping force can gradually reduce the spring amplitude until it stops at the equilibrium position. The larger the damping coefficient, the easier it is for the spring to stop at the equilibrium position, and vice versa. In some embodiments, the damping coefficient k can range from 1 to 99, and the electronic device 100 can set the damping coefficient according to the specific scenario.

[0243] According to the damping characteristics of the spring, the motion state of the spring can be divided into three states: critical damping, underdamping and overdamping. FIG. 12A to FIG. 12C , which is a curve diagram of the spring deformation x and time t under the above three states provided by the embodiment of the present application. Fig. 12A , in the critical damping state, the spring returns to the equilibrium position at the most stable speed in the shortest time and stops moving without oscillating. Fig. 12B In the underdamped state, the spring slowly reduces the amplitude through multiple oscillations and finally returns to the equilibrium position. Fig. 12C , in the over-damped state, the spring has almost no vibration, the amplitude gradually decreases, and reaches the equilibrium position. In some embodiments, when d 2 =4*m*k, the spring is in critical damping state; when d 2 <4*m*k, the spring is in an underdamped state; that is, when d 2 When >4*m*k, the spring is in an over-damped state.

[0244] In some embodiments of the present application, the electronic device 100 can determine the damping coefficient and rigidity coefficient of the focus module X, and based on the damping coefficient and rigidity coefficient of the focus module, use the damping conduction algorithm to determine the damping coefficient and rigidity coefficient corresponding to other page modules. The damping coefficient and rigidity coefficient of the focus module can be set by default by the electronic device 100, can be set by the user, or can be determined by the electronic device 100 according to a specific scenario. For example, see Figure 5C , the electronic device 100 detects the sliding operation of the user, determines the focus module X acted by the user based on the sliding operation, and determines the modules X+c (for example, module X+1, module X-1, module X+2, module X-2) on both sides of the focus module X according to the arrangement order of the modules with the focus module X as a reference, where c is an integer not equal to 0. The rigidity coefficient of module X is represented as k X , the rigidity coefficient of module X+c is expressed as k X+c , the damping coefficient of module X is denoted as d X , the damping coefficient of module X+c is expressed as d X+c .

[0245] In some embodiments, referring to formula (5) and formula (6), the stiffness coefficient k X and the stiffness coefficient k X+c The relationship between the damping coefficient d X and the damping coefficient d X+c The relationship can be expressed as follows:

[0246] k X+c =k X *(|c|+1) -0.18*g (5)

[0247] d X+c =d X *(|c|+1) -0.18*g (6)

[0248] Where g is the conduction coefficient.

[0249] In some embodiments, referring to formula (7) and formula (8), the damping coefficient k X and the damping coefficient k X+c The relationship between the rigidity coefficient d X and stiffness coefficient d X+c The relationship can be expressed as follows:

[0250] k X+c =k X -|c|*g (7)

[0251] d X+c =d X -|c|*g (8)

[0252] In some embodiments, the ratio of the damping coefficient to the stiffness coefficient of module X is expressed as p X , the ratio of the damping coefficient to the stiffness coefficient of module X+c is expressed as p X+c . Referring to the damped conduction algorithm shown in formula (9), the parameter p X and the damping coefficient p X+c The relationship can be expressed as follows:

[0253] p X+c =p X *(|c|+1) -0.18*g (9)

[0254] For example, g is 0.9, k X The value is 30, d X The value is 228.

[0255] From the damping conduction algorithm shown in any one of formulas (5) to (9), it can be seen that the larger the conduction coefficient g, the greater the difference in spring characteristics corresponding to adjacent page modules, resulting in a greater difference in the elastic force movement of adjacent page modules. Conversely, the smaller the difference in spring characteristics corresponding to adjacent page modules, the smaller the difference in elastic force movement of adjacent page modules. When the conduction coefficient g is 0, the damping coefficients of each page module are equal, the rigidity coefficients of each page module are also equal, and the spring characteristics corresponding to adjacent page modules are the same.

[0256] For example, Fig.13 This is another page sliding effect provided by the embodiment of the present application. Figure 5A The page shown, Fig.13 The conductivity coefficient g of the page shown is small. Fig.13 As shown, compared Figure 5A , Fig.13 The difference in the elastic force movement of two adjacent page modules is small, resulting in a smaller change trend in the module interval between two adjacent page modules. Figure 5A , Fig.13 At time t22, t23, and t24, the module interval L (X-1，X) Larger, module spacing L (X，X+1) Smaller.

[0257] In addition, it can be seen from formula (5) to formula (9) that when g is greater than 0, the damping coefficient and rigidity coefficient of the focus module X are the largest, and the damping coefficient and rigidity coefficient of the module farther from the focus module X are smaller. The smaller the damping coefficient and rigidity coefficient of the page module, the more difficult it is for the elastic force movement of the page module to return to the equilibrium position, that is, the longer the sliding time of the page module.

[0258] For example, Fig.14A The curve 1 shown is the motion curve diagram of module X, and the curve 2 is the motion curve diagram of module X-1. The conduction coefficient g of the page module is greater than 0. Fig.14A It can be seen that under the same displacement (i.e., deformation x), the sliding time 1 corresponding to module X-1 is later than the sliding time 2 corresponding to module X-1.

[0259] See also Figure 5D , there may be a time difference Δt between the start sliding moments of adjacent page modules. For example, Fig.14A Curve 3 is another motion curve of module X-1. Curve 3 corresponds to a start sliding moment of module X-1 that is Δt later than module X. Fig.14A It can be seen that under the same displacement (ie, deformation x), the sliding time 3 corresponding to module X-1 in curve 3 is later than the sliding time 1 corresponding to module X, and the difference between time 3 and time 1 is greater than the time difference Δt.

[0260] For example, Fig. 14B Curve 4 is the motion curve of module X, and curve 5 is the motion curve of module X-1. The conduction coefficient of the page module is g=0, and the start sliding time of module X-1 is Δt later than that of module X. Fig. 14B It can be seen that at the same sliding moment, the displacement corresponding to module X in curve 4 (i.e., deformation x) is greater than the displacement corresponding to module X-1.

[0261] like Fig.14A and Fig. 14B It can be seen that the displacement difference between module X-1 and module X increases first and then decreases, and the total relative displacement is equal (i.e. Fig.14A and Fig. 14B Therefore, if module X-1 is in the sliding direction of the user, as time t increases, the module interval L between module X-1 and module X (X-1，X) will decrease and then increase; if module X-1 is in the opposite direction of the user's sliding, as time t increases, the module interval L between module X-1 and module X (X-1，X) It will increase and then decrease.

[0262] Down FIG. 15A to FIG. 15D It is a schematic diagram of the sliding time of each page module under different values ​​of g and Δt.

[0263] like Fig.15A As shown, when Δt=0, there is no time difference between the start sliding moments of adjacent page modules, and each page module moves at the same time. When g>0, the farther the module is from the focus module X, the longer the sliding time. Fig. 15B As shown, when Δt>0 and g>0, compared with Fig.15A , since the modules farther from the focus module X start sliding later and the sliding duration is longer, the modules farther from the focus module X stop sliding later. Fig. 15C As shown, when Δt>0 and g=0, the sliding duration of each page module is the same, and the time difference between the start sliding moments of adjacent page modules is equal to the time difference between the stop sliding moments of the adjacent page modules. Fig.15D As shown, when Δt=0 and g=0, the sliding duration of each page module is the same, and the starting sliding moments of adjacent page modules are also the same, that is, the movement trends of each page module are the same, and the module intervals of each page module remain unchanged.

[0264] The following describes the page sliding animation implementation principle provided in the embodiment of the present application.

[0265] For example, Fig.16 As shown in FIG. 1 , it is a schematic diagram of an animation implementation principle provided by an embodiment of the present application. Fig.16 As shown, the elements for implementing animation include the initial state of animation, the final state of animation, animation duration and animation interpolator. The interpolator is used to set the change logic of the animation attribute value from the initial state to the final state, thereby controlling the rate of animation change, so that the animation effect can change at one or more rates such as uniform speed, acceleration, deceleration, parabolic rate, etc.

[0266] In some embodiments of the present application, the electronic device 100 can determine the animation duration, animation initial state and animation final state according to the friction model, and set the change logic of the animation attribute value through the system interpolator or the custom interpolator (such as the elastic force interpolator, the friction interpolator). When the animation is running, when the electronic device 100 determines that the animation attribute value has changed according to the above change logic, it draws the frame image based on the above animation attribute value and refreshes the display page. FIG. 5A to FIG. 9E , are some page sliding animation effects provided in the embodiments of the present application.

[0267] In some embodiments of the present application, when the electronic device 100 determines that the animation property value has changed according to the change logic of the interpolator, the invalidate() function is called based on the animation property value to refresh the view, that is, the onDraw() function is called to redraw the view and display it.

[0268] In some embodiments of the present application, the electronic device 100 customizes an elastic force interpolator. Exemplarily, the function code of the elastic force interpolator can be expressed as one of the following: "SpringInterpolator(floatstiffness,float damping)", "SpringInterpolator(float stiffness,float damping,float endPos)", "SpringInterpolator(float stiffness,float damping,floatendPos,float velocity)", "SpringInterpolator(float stiffness,float damping,float endPos,float velocity,float valueThreshold)". In one implementation, the parameters of the function of the elastic force interpolator include at least a stiffness coefficient (stiffness) and a damping coefficient damping.

[0269] The parameter endPos represents the relative displacement, that is, the difference between the initial position and the static position of the spring. In the embodiment of the present application, endPos can represent the relative displacement of the page sliding.

[0270] The parameter valueThreshold represents the threshold for judging whether the animation stops. When the displacement (or other attributes) difference between two adjacent frames is less than the threshold, the animation stops running. The larger the threshold, the easier it is for the animation to stop and the shorter the running time; conversely, the animation runs longer. The value of the threshold can be set according to the specific animation properties. In some embodiments, the elastic interpolator FloatValueHold parameter defaults to 1 / 1000, and the threshold value is 1 in other construction methods. In some embodiments, when customizing the threshold, the recommended value shown in Table 1 can be used according to the animation properties.

[0271] Table 1

[0272]

[0273]

[0274] In addition, the threshold can also directly use the following constants provided by the DynamicAnimation class: MIN_VISIBLE_CHANGE_PIXELS, MIN_VISIBLE_CHANGE_ROTATION_DEGREES, MIN_VISIBLE_CHANGE_ALPHA, MIN_VISIBLE_CHANGE_SCALE.

[0275] For example, the specific code of the animation class of the custom elastic force interpolator can be expressed as follows:

[0276] "PhysicalInterpolatorBase interpolator=new SpringInterpolator(400F,40F,200F,2600F,1F);

[0277] ObjectAnimator animator=ObjectAnimator.ofFloat(listView,"translationY",0,346);

[0278] animator.setDuration(interpolator.getDuration()); / / Get animation duration

[0279] animator.setInterpolator(interpolator); / / Set the custom interpolator to the animation class

[0280] animator.start(); / / Run animation".

[0281] In some embodiments of the present application, the electronic device 100 customizes a friction interpolator. For example, the function code of the friction interpolator can be expressed as "FlingInterpolator (float initVelocity, floatfriction)". In which initVelocity represents the initial velocity.

[0282] For example, the specific code of the animation class using the friction interpolator can be expressed as follows:

[0283] "PhysicalInterpolatorBase interpolator=new FlingInterpolator(600F,0.5F);

[0284] ObjectAnimator animator=ObjectAnimator.ofFloat(listView,"translationY",0,interpolator.getEndOffset());

[0285] animator.setDuration(interpolator.getDuration()); / / Get animation duration

[0286] animator.setInterpolator(interpolator); / / Set the custom interpolator to the animation class

[0287] animator.start(); " / / Run the animation.

[0288] In some embodiments of the present application, the electronic device 100 can set the animation duration (Duration) and the starting position by itself; it can also call the engine model to obtain the animation duration (Duration) and the ending position, and then set them to the animation class (Animator class).

[0289] For example, the code for the electronic device 100 to call the engine model to obtain the animation duration can be represented as "com.huawei.dynamicanimation.interpolator.PhysicalInterpolatorBase#getDuration"

[0290] For example, the code for calling the engine model to obtain the end position of the spring can be expressed as "com.huawei.dynamicanimation.interpolator.PhysicalInterpolatorBase#getEndOffset".

[0291] For example, the code for setting the parameter valueThreshold can be expressed as "

[0292] com.huawei.dynamicanimation.interpolator.PhysicalInterpolatorBase#setValueThreshold".

[0293] In some embodiments of the present application, the code using the elastic engine animation class can be represented as one of the following codes: "HWSpringAnimation(K object,FloatPropertyCompat <k>property,floatstiffness,float damping,float startValue,float endValue,float velocity)”、"HWSpringAnimation(K object,FloatPropertyCompat <k>property,float stiffness,float damping,float endValue,float velocity)".

[0294] Among them, the parameter object represents the animation object; Property represents the property object of the animation class or interpolator. Referring to Table 1, this parameter can be used to indirectly set valueThreshold. This parameter is optional in the interpolator version. When valueThreshold has been set by other means, this parameter can be omitted, that is, the construction method without property parameter can be used directly. This parameter is a required parameter in the animation class version. The DynamicAnimation class has provided the following constants that can be used directly: "TRANSLATION_X, TRANSLATION_Y, TRANSLATION_Z, SCALE_X, SCALE_Y, ROTATION, ROTATION_X, ROTATION_Y, X, Y, Z, ALPHA, SCROLL_X, SCROLL_Y", and the electronic device 100 can also customize the implementation of the ViewProperty interface.

[0295] For example, the specific code using the spring engine animation class can be expressed as follows:

[0296] "HWSpringAnimation animation=HWSpringAnimation(listView,DynamicAnimation.TRANSLATION_Y,400F,40F,0,1000F);

[0297] animation.start();"

[0298] In some embodiments of the present application, the code using the friction engine animation class can be expressed as: "HWFlingAnimation(Kobject,FloatPropertyCompat <k>property,float initVelocity,float friction)".

[0299] For example, the specific code using the friction animation class can be expressed as follows:

[0300] "HWFlingAnimation animation=HWFlingAnimation(listView,DynamicAnimation.TRANSLATION_Y,2000F,0.5F);

[0301] animation.start();".

[0302] In the above embodiments, it can be implemented in whole or in part by software, hardware, firmware or any combination thereof. When implemented using software, it can be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, the process or function described in the embodiment of the present application is generated in whole or in part. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable devices. The computer instructions can be stored in a computer-readable storage medium, or transmitted from one computer-readable storage medium to another computer-readable storage medium. For example, the computer instructions can be transmitted from a website site, computer, server or data center by wired (e.g., coaxial cable, optical fiber, digital subscriber line) or wireless (e.g., infrared, wireless, microwave, etc.) mode to another website site, computer, server or data center. The computer-readable storage medium can be any available medium that a computer can access or a data storage device such as a server or data center that contains one or more available media integration. The available medium can be a magnetic medium, (e.g., a floppy disk, a hard disk, a tape), an optical medium (e.g., a DVD), or a semiconductor medium (e.g., a solid-state hard disk), etc.

[0303] Those skilled in the art can understand that to implement all or part of the processes in the above-mentioned embodiments, the processes can be completed by computer programs to instruct related hardware, and the programs can be stored in computer-readable storage media. When the programs are executed, they can include the processes of the above-mentioned method embodiments. The aforementioned storage media include: ROM or random access memory RAM, magnetic disk or optical disk and other media that can store program codes.< / k> < / k> < / k> < / canvas> < / video> < / videoview> < / imgview> < / textview>

Claims

1. A method for processing page sliding, It is characterized in that include: The electronic device displays a first page module, a second page module and a third page module of a first page, wherein the second page module, the first page module and the third page module are arranged in sequence in the first page, the first page module and the second page module have a first interval, and the first interval is equal to a first value; the first page module and the third page module have a second interval, and the second interval is equal to a second value; The electronic device receives a sliding operation on the first page module along a first direction; wherein the first direction is from the first page module to the second page module; In response to the sliding operation, the first page module, the second page module and the third page module slide along the first direction; wherein, the first interval decreases and then increases; the second interval increases and then decreases; when the first page module, the second page module and the third page module all stop sliding, the first interval between the first page module and the second page module is equal to the first value; the second interval between the first page module and the third page module is equal to the second value.

2. The method according to claim 1, It is characterized in that The first interval decreases in the first time period and increases in the second time period, and the start time of the second time period is equal to the end time of the first time period; the second interval increases in the third time period and decreases in the fourth time period, and the start time of the fourth time period is equal to the end time of the third time period.

3. The method according to claim 2, It is characterized in that The width of the second page module along the first direction decreases in a first time period and increases in a second time period; the width of the third page module along the first direction increases in a third time period and decreases in a fourth time period.

4. The method according to claim 3, It is characterized in that The width of the second page module along the first direction is not equal to the width of the third page module along the first direction, the starting time of the first time period is the same as the starting time of the third time period, and the distance between the second page module and the third page module along the first direction increases during the first time period.

5. The method according to any one of claims 2 to 4, It is characterized in that The first time period and the third time period start at the same time. The end time of the first time period is the same as that of the third time period; or, the end time of the first time period is later than that of the third time period; or, the end time of the first time period is earlier than that of the third time period.

6. The method according to any one of claims 2 to 4, It is characterized in that The duration of the sliding operation is a sixth time period, and the start time of the sixth time period is the same as the start time of the first time period. The end time of the first time period is earlier than the end time of the sixth time period; or, the end time of the first time period is equal to the end time of the sixth time period; or, the end time of the first time period is later than the end time of the sixth time period.

7. The method according to claim 6, It is characterized in that After the sixth time period, the first page module stops sliding.

8. The method according to claim 7, It is characterized in that After the sixth time period, the first page module continues to slide.

9. The method according to claim 6, It is characterized in that The first interval increases to the first value in a second time period, and the second interval decreases to the second value in a fourth time period.

10. The method according to any one of claims 2 to 6, It is characterized in that The first interval decreases to the first value in a seventh time period, and the second interval increases to the second value in an eighth time period; the start time of the seventh time period is equal to the end time of the second time period, and the start time of the eighth time period is equal to the end time of the fourth time period; In the first time period and the second time period, the sliding direction of the first page module is the first direction, and in the seventh time period and the eighth time period, the sliding direction of the first page module is the second direction, and the first direction is opposite to the second direction.

11. The method according to any one of claims 2 to 6, It is characterized in that The second interval increases to the second value in a ninth time period, and the first interval increases to the first value in the second time period; the start time of the ninth time period is later than or equal to the end time of the fourth time period, and the start time of the ninth time period is earlier than the end time of the second time period; In the first time period and the second time period, the sliding direction of the first page module is the first direction; In the ninth time period, the sliding direction of the first page module is the second direction, and the first direction is opposite to the second direction.

12. The method according to any one of claims 2 to 6, It is characterized in that The second interval increases in the tenth time period, decreases to the first value in the eleventh time period, and the first interval increases to the first value in the second time period; the end time of the tenth time period is equal to the start time of the eleventh time period, the start time of the tenth time period is later than or equal to the end time of the fourth time period, and the start time of the eleventh time period is earlier than the end time of the second time period; In the first time period and the second time period, the sliding direction of the first page module is the first direction; In the ninth time period and the tenth time period, the sliding direction of the first page module is the second direction, and the first direction is opposite to the second direction.

13. The method according to claim 9, It is characterized in that During the ninth time period, the third page module stops sliding, and the third page module among the first page module, the second page module and the third page module is closest to the first side of the electronic device, and the first side is the side of the electronic device pointed to by the second direction.

14. The method according to claim 13, It is characterized in that During the sixth time period, when the display content of the electronic device does not include the entire content of the third page module, the sliding distance of the first page module is equal to the sliding distance of the sliding operation in the first direction; when the display content of the electronic device includes the entire content of the third page module, the sliding distance of the first page module is less than the sliding distance of the sliding operation in the first direction.

15. The method according to any one of claims 2 to 6, It is characterized in that The second page module and the third page module start sliding later than the first page module.

16. The method according to any one of claims 2 to 6, It is characterized in that In the first page, the fourth page module, the second page module, the first page module, the third page module and the fifth page module are arranged in sequence, the second page module and the fourth page module have a third interval, and the third page module and the fifth page module have a fourth interval; In response to the sliding operation, the first page module, the second page module, and the third page module slide along the first direction, including: In response to the sliding operation, the first page module, the second page module, the third page module, the fourth page module and the fifth page module slide along the first direction; the third interval decreases in the first time period and increases in the second time period; the fourth interval increases in the third time period and decreases in the fourth time period.

17. The method according to claim 16, It is characterized in that Compared with the starting moment of the first time period, at a first moment in the first time period, the decrease amplitude of the third interval is smaller than the decrease amplitude of the first interval; compared with the starting moment of the third time period, at a second moment in the third time period, the increase amplitude of the fourth interval is smaller than the increase amplitude of the second interval.

18. The method according to claim 16, It is characterized in that Compared with the starting moment of the first time period, at a first moment in the first time period, the decrease amplitude of the third interval is equal to the decrease amplitude of the first interval; compared with the starting moment of the third time period, at a second moment in the third time period, the increase amplitude of the fourth interval is equal to the increase amplitude of the second interval.

19. An electronic device comprising a display screen, a memory, one or more processors, and one or more programs; in, The one or more programs are stored in the memory; it is characterized in that when the one or more processors execute the one or more programs, the electronic device implements the method according to any one of claims 1 to 18.

20. A computer storage medium, It is characterized in that The method comprises computer instructions, which, when executed on an electronic device, cause the electronic device to execute the method according to any one of claims 1 to 18.

Images