WO2021120914A1 - 一种界面元素的显示方法及电子设备 - Google Patents

一种界面元素的显示方法及电子设备 Download PDF

Info

Publication number
WO2021120914A1
WO2021120914A1 PCT/CN2020/126896 CN2020126896W WO2021120914A1 WO 2021120914 A1 WO2021120914 A1 WO 2021120914A1 CN 2020126896 W CN2020126896 W CN 2020126896W WO 2021120914 A1 WO2021120914 A1 WO 2021120914A1
Authority
WO
WIPO (PCT)
Prior art keywords
interface
electronic device
area
display
application
Prior art date
Application number
PCT/CN2020/126896
Other languages
English (en)
French (fr)
Inventor
宋朗
Original Assignee
华为技术有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 华为技术有限公司 filed Critical 华为技术有限公司
Publication of WO2021120914A1 publication Critical patent/WO2021120914A1/zh

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/04817Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance using icons
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F21/00Security arrangements for protecting computers, components thereof, programs or data against unauthorised activity
    • G06F21/30Authentication, i.e. establishing the identity or authorisation of security principals
    • G06F21/31User authentication
    • G06F21/32User authentication using biometric data, e.g. fingerprints, iris scans or voiceprints
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G06F3/04883Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures for inputting data by handwriting, e.g. gesture or text
    • GPHYSICS
    • G09EDUCATION; CRYPTOGRAPHY; DISPLAY; ADVERTISING; SEALS
    • G09GARRANGEMENTS OR CIRCUITS FOR CONTROL OF INDICATING DEVICES USING STATIC MEANS TO PRESENT VARIABLE INFORMATION
    • G09G5/00Control arrangements or circuits for visual indicators common to cathode-ray tube indicators and other visual indicators
    • G09G5/10Intensity circuits

Definitions

  • Different unlocking methods may correspond to the same unlocking animation, that is, to the display process of the same interface element.
  • fingerprint unlocking process with the maturity of half-screen fingerprint, wide-area fingerprint or full-screen fingerprint unlocking technology, in the future, when a user unlocks a fingerprint on the screen of a terminal device, the position of the finger or user gestures and actions will be random, while unlocking
  • the display process of the interface elements in the middle is single, which affects the process and display effect of the unlocking animation, and the user's perception of the unlocking animation is not smooth.
  • the electronic device may have a fixed fingerprint recognition area, that is, the fingerprint sensor under the touch screen of the electronic device can only obtain the user's fingerprint in the fixed fingerprint recognition area; or the electronic device may have a wide-area or full-screen fingerprint recognition area
  • the fingerprint sensor under the touch screen of the electronic device can acquire the user's fingerprint in the entire touch screen area of the electronic device, which is not limited in the embodiment of the present application.
  • the first interface is the interface when the electronic device is in the locked screen state.
  • the lock screen interface of the electronic device may include a black screen and a locked screen interface.
  • a fingerprint icon may be displayed on the black screen interface to prompt the user Fingerprint authentication can be performed; or, the electronic device can remain in a black screen state without displaying any fingerprint icons.
  • the first interface may be an interface of an electronic device with a bright screen and a lock screen.
  • the electronic device unlocking program is started, the screen is turned on, and the touch screen is on.
  • the fingerprint icon can be displayed on the screen to prompt the user to unlock the fingerprint.
  • the first interface may be that when the user performs fingerprint unlocking, pressing the power button or other methods to initiate the unlocking process of the electronic device, and the electronic device displays the fingerprint icon in the lit state.
  • the electronic device displays a fingerprint icon when it detects a user's touch or a user's finger movement, which is not limited in the embodiment of the present application.
  • the first operation can be used to unlock the electronic device.
  • a user's finger touches the fingerprint recognition area of the screen of the electronic device to perform fingerprint authentication.
  • the electronic device can be unlocked.
  • the user may only unlock by sliding the screen to enter the main interface of the mobile phone, and the first operation is any form of sliding operation by the user.
  • the first operation may be an operation of the user sliding the graphic on the screen, which is not limited in the embodiment of the present application.
  • the interface elements of the present application are not limited to application icons, but may also be widgets, shortcut components, controls, texts, etc. of the interface. In the embodiments of the present application, they are collectively referred to as “interface elements”.
  • the mobile phone interface can also display wallpaper, etc.
  • the display of the wallpaper can also be gradually displayed according to the display method of the interface elements provided in the embodiments of this application, for example, display area by area; or after the mobile phone is unlocked, the wallpaper is displayed on the display screen, and the interface elements are displayed according to The methods provided in the embodiments of this application are all displayed within the protection scope of this application.
  • the first operation is a touch operation for unlocking the fingerprint by the user
  • the position where the first operation occurs on the display screen of the electronic device is the first position
  • the first operation An area includes the first position
  • the first position is a preset position of the display screen of the electronic device, or any position of the display screen of the electronic device.
  • the first operation is a sliding operation having a first sliding trajectory
  • the first area includes the starting position of the first sliding trajectory and/ Or the end position of the first sliding track.
  • the first direction is the direction of the first sliding track; or the first direction is the starting position of the first sliding track. Sliding direction; or the first direction is the sliding direction at the end position of the first sliding track.
  • using the first area as the starting area to display the second interface element in the second area includes: The first area is the starting area, displaying the second interface elements in the second area, where the first rate is associated with the sliding rate of the sliding operation, or the first rate is associated with the user's starting position in the first sliding track The sliding rate at, or the first rate is associated with the sliding rate of the user at the end position of the first sliding track.
  • the electronic device in the process of displaying the second interface, the electronic device first displays the first interface element in the first area of the second interface, Including: in the process of displaying the second interface, the electronic device displays the first interface element in the first area on the first interface according to a first rule, wherein the first rule includes at least one of the following: Set rules for changing the transparency of interface elements; preset changing rules for interface element sizes; preset changing rules for the display position of interface elements; preset changing rules for blur degree of interface elements.
  • the display method of the interface elements provided in this application can make the display effect of the unlocking animation more smooth and natural, and the display of the interface elements is not affected by the position of the user’s finger and the user’s gestures when unlocking.
  • the impact of actions makes users more perceptual and improves user experience.
  • the first operation is a touch operation for unlocking the fingerprint by the user
  • the position where the first operation occurs on the display screen of the electronic device is the first position
  • the first operation The area includes the first position
  • the first position is a preset position of the display screen of the electronic device, or an arbitrary position of the display screen of the electronic device.
  • the first operation is a sliding operation having a first sliding track
  • the first area includes the starting position and/or of the first sliding track The end position of the first sliding track.
  • the electronic device when the one or more programs are executed by the processor, the electronic device is caused to perform the following steps: according to the first rate, at the first rate One area is the starting area, displaying the second interface element in the second area, where the first rate is associated with the sliding rate of the sliding operation, or the first rate is associated with the user being at the starting position of the first sliding track Or the first rate is associated with the user's sliding rate at the end position of the first sliding track.
  • the present application provides a device included in an electronic device, and the device has a function of implementing the foregoing aspects and the behavior of the electronic device in the possible implementation manners of the foregoing aspects.
  • the function can be realized by hardware, or by hardware executing corresponding software.
  • the hardware or software includes one or more modules or units corresponding to the above-mentioned functions. For example, a display module or unit, a detection module or unit, a processing module or unit, and so on.
  • this application provides an electronic device including one or more processors and one or more memories.
  • the one or more memories are coupled with one or more processors, and the one or more memories are used to store computer program codes.
  • the computer program codes include computer instructions.
  • the electronic device executes The display method of the interface element in any possible implementation of any one of the above aspects.
  • the present application provides a computer-readable storage medium, including computer instructions, which, when the computer instructions run on an electronic device, cause the electronic device to perform any one of the possible video playback methods in any of the foregoing aspects.
  • this application provides a computer program product, which when the computer program product runs on an electronic device, causes the electronic device to execute any one of the possible interface element display methods in any of the above aspects.
  • Fig. 2 is a software structure block diagram of an example of an electronic device provided by an embodiment of the present application.
  • FIG. 3 is a schematic diagram of a graphical user interface of an example of a display process of interface elements provided by an embodiment of the present application.
  • FIG. 5 is a schematic diagram of an example of a display process of an icon of a video application provided by an embodiment of the present application.
  • FIG. 6 is a schematic diagram of another example of the display process of interface elements provided by an embodiment of the present application.
  • FIG. 9 is a schematic diagram of another example of the display process of interface elements provided by an embodiment of the present application.
  • the structure illustrated in the embodiment of the present application does not constitute a specific limitation on the electronic device 100.
  • the electronic device 100 may include more or fewer components than those shown in the figure, or combine certain components, or split certain components, or arrange different components.
  • the illustrated components can be implemented in hardware, software, or a combination of software and hardware.
  • the processor 110 may include one or more processing units.
  • the processor 110 may include an application processor (AP), a modem processor, a graphics processing unit (GPU), and an image signal processor. (image signal processor, ISP), controller, memory, video codec, digital signal processor (digital signal processor, DSP), baseband processor, and/or neural-network processing unit (NPU) Wait.
  • AP application processor
  • modem processor modem processor
  • GPU graphics processing unit
  • image signal processor image signal processor
  • ISP image signal processor
  • controller memory
  • video codec digital signal processor
  • DSP digital signal processor
  • NPU neural-network processing unit
  • the different processing units may be independent devices or integrated in one or more processors.
  • the controller may be the nerve center and command center of the electronic device 100.
  • the controller can generate operation control signals according to the instruction operation code and timing signals to complete the control of fetching instructions and executing instructions.
  • a memory may also be provided in the processor 110 to store instructions and data.
  • the processor 110 may include one or more interfaces, for example, the interface may include an integrated circuit (inter-integrated circuit, I2C) interface, an integrated circuit built-in audio (inter-integrated circuit sound, I2S) interface, and pulse Code modulation (PCM) interface, universal asynchronous receiver/transmitter (UART) interface, mobile industry processor interface (MIPI), general-purpose input/output (general-purpose input/ output, GPIO) interface, subscriber identity module (SIM) interface, and/or universal serial bus (USB) interface, etc.
  • I2C integrated circuit
  • I2S integrated circuit sound
  • PCM pulse Code modulation
  • UART universal asynchronous receiver/transmitter
  • MIPI mobile industry processor interface
  • GPIO general-purpose input/output
  • SIM subscriber identity module
  • USB universal serial bus
  • the I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (SCL).
  • the processor 110 may include multiple sets of I2C buses.
  • the processor 110 may be coupled to the touch sensor 180K, charger, flash, camera 193, etc., respectively through different I2C bus interfaces.
  • the processor 110 may couple the touch sensor 180K through an I2C interface, so that the processor 110 and the touch sensor 180K communicate through the I2C bus interface to implement the touch function of the electronic device 100.
  • the MIPI interface can be used to connect the processor 110 with the display screen 194, the camera 193 and other peripheral devices.
  • the MIPI interface includes a camera serial interface (camera serial interface, CSI), a display serial interface (display serial interface, DSI), and so on.
  • the processor 110 and the camera 193 communicate through a CSI interface to implement the shooting function of the electronic device 100.
  • the processor 110 and the display screen 194 communicate through a DSI interface to realize the display function of the electronic device 100.
  • the processor 110 may couple the touch sensor 180K through an I2C interface, so that the processor 110 and the touch sensor 180K communicate through the I2C bus interface.
  • the touch sensor 180K can transmit the user's touch operation to the processor 110 to realize the touch function of the display screen.
  • the processor 110 may control the display process of the interface elements on the display screen 194, and the processor 110 and the display screen 194 communicate through the DSI interface, thereby controlling the display process of the interface elements on the display screen 194 of the electronic device 100, for example, controlling the display process of the interface elements. Transparency change, size change, position coordinate change, etc.
  • the USB interface 130 is an interface that complies with the USB standard specification, and specifically may be a Mini USB interface, a Micro USB interface, a USB Type C interface, and so on.
  • 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 peripheral devices. It can also be used to connect earphones and play audio through earphones. This interface can also be used to connect other electronic devices, such as AR devices.
  • the interface connection relationship between the modules illustrated in the embodiment of the present application is merely a schematic description, and does not constitute a structural limitation of the electronic device 100.
  • the electronic device 100 may also adopt different interface connection modes in the foregoing embodiments, or a combination of multiple interface connection modes.
  • the charging management module 140 is used to receive charging input from the charger.
  • the charger can be a wireless charger or a wired charger.
  • the power management module 141 is used to connect the battery 142, the charging management module 140 and the processor 110.
  • the power management module 141 receives input from the battery 142 and/or the charging management module 140, and supplies power to the processor 110, the internal memory 121, the external memory, the display screen 194, the camera 193, and the wireless communication module 160.
  • the power management module 141 can also be used to monitor parameters such as battery capacity, battery cycle times, and battery health status (leakage, impedance).
  • the wireless communication function of the electronic device 100 can be implemented by the antenna 1, the antenna 2, the mobile communication module 150, the wireless communication module 160, the modem processor, and the baseband processor.
  • the antenna 1 and the antenna 2 are used to transmit and receive electromagnetic wave signals.
  • the mobile communication module 150 can provide a wireless communication solution including 2G/3G/4G/5G and the like applied to the electronic device 100.
  • 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 and 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 the speaker 170A, the receiver 170B, etc.), or displays an image or video through the display screen 194.
  • the wireless communication module 160 can provide applications on the electronic device 100 including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) networks), bluetooth (BT), and global navigation satellites.
  • WLAN wireless local area networks
  • BT Bluetooth
  • GNSS global navigation satellite system
  • FM frequency modulation
  • NFC near field communication
  • infrared technology infrared, IR
  • the electronic device 100 implements a display function through a GPU, a display screen 194, an application processor, and the like.
  • the GPU is an image processing microprocessor, which is connected to the display screen 194 and the application processor.
  • the GPU is used to perform mathematical and geometric calculations and is used for graphics rendering.
  • the processor 110 may include one or more GPUs that execute program instructions to generate or change display information.
  • the display screen 194 is used to display images, videos, and the like.
  • the display screen 194 includes a display panel.
  • the display panel can use liquid crystal display (LCD), organic light-emitting diode (OLED), active matrix organic light-emitting diode or active-matrix organic light-emitting diode (active-matrix organic light-emitting diode).
  • LCD liquid crystal display
  • OLED organic light-emitting diode
  • active-matrix organic light-emitting diode active-matrix organic light-emitting diode
  • AMOLED flexible light-emitting diode (FLED), Miniled, MicroLed, Micro-oLed, quantum dot light-emitting diode (QLED), etc.
  • the electronic device 100 may include one or N display screens 194, and N is a positive integer greater than one.
  • the electronic device 100 can implement a shooting function through an ISP, a camera 193, a video codec, a GPU, a display screen 194, and an application processor.
  • the ISP is used to process the data fed back by the camera 193.
  • the camera 193 is used to capture still images or videos.
  • the object generates an optical image through the lens and is projected to the photosensitive element.
  • Video codecs are used to compress or decompress digital video.
  • the external memory interface 120 may 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 realize the data storage function. For example, save music, video and other files in an external memory card.
  • the electronic device 100 can implement audio functions through the audio module 170, the speaker 170A, the receiver 170B, the microphone 170C, the earphone interface 170D, and the application processor. For example, music playback, recording, etc.
  • 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.
  • the motor 191 can generate vibration prompts.
  • the indicator 192 may be an indicator light, which may be used to indicate the charging status, power change, or to indicate messages, missed calls, notifications, and so on.
  • the SIM card interface 195 is used to connect to the SIM card. The SIM card can be inserted into the SIM card interface 195 or pulled out from the SIM card interface 195 to achieve contact and separation with the electronic device 100.
  • the electronic device 100 may support 1 or N SIM card interfaces, and N is a positive integer greater than 1.
  • the window manager is used to manage window programs.
  • the window manager can obtain the size of the display screen, determine whether there is a status bar, lock the screen, take a screenshot, etc.
  • the window manager can participate in the display process of the interface elements of the display screen.
  • the resource manager provides various resources for the application, such as localized strings, icons, pictures, layout files, video files, and so on.
  • the notification manager enables the application to display notification information in the status bar, which can be used to convey notification-type messages, and it can automatically disappear after a short stay without user interaction.
  • the notification manager is used to notify the user that the download is complete, message reminders, and so on.
  • the notification manager can also be a notification that appears in the status bar at the top of the system in the form of a chart or a scroll bar text, such as a notification of an application running in the background, or a notification that appears on the screen in the form of a dialog window.
  • text messages are prompted in the status bar, or notifications can be made by sounding a prompt sound, vibrating, or blinking an indicator light.
  • Android runtime includes core libraries and virtual machines. Android runtime is responsible for the scheduling and management of the Android system.
  • the core library consists of two parts: one part is the function functions that the java language needs to call, and the other part is the core library of Android.
  • the application layer and application framework layer run in a virtual machine.
  • the virtual machine executes the java files of the application layer and the application framework layer as binary files.
  • the virtual machine is used to perform functions such as object life cycle management, stack management, thread management, security and exception management, and garbage collection.
  • the media library supports playback and recording of a variety of commonly used audio and video formats, as well as still image files.
  • the media library can support multiple audio and video encoding formats, such as: MPEG4, H.264, MP3, AAC, AMR, JPG, PNG, etc.
  • the surface manager, the three-dimensional graphics processing library, etc. can participate in the display process of the interface elements of the electronic device, and the specific display process will not be repeated here.
  • the unlocking animation can usually correspond to the display process of different interface elements.
  • the display process of a possible interface element is based on the center of the screen as the center of the circle and spreading to the surroundings. Specifically, taking the application icon as an example, the application icon at the center of the screen appears first, and the application icon at the edge of the screen appears later.
  • another possible display of interface elements may be that the interface elements spread in a fixed direction, for example, the application icons are gradually spread from the bottom of the screen to the top of the screen, the application icons at the bottom of the screen appear first, and the application icons at the top of the screen appear later .
  • the mobile phone may have a fixed fingerprint recognition area, and the fingerprint sensor under the touch screen of the mobile phone can only obtain the user's fingerprint in this fixed fingerprint recognition area; or the mobile phone may have a full-screen fingerprint recognition area, and the fingerprint sensor under the touch screen of the mobile phone can be located in the entire mobile phone.
  • the touch screen area acquires the user's fingerprint, which is not limited in the embodiment of the present application.
  • the mobile phone can be unlocked and changed from a black screen state to a bright screen state.
  • the animation after the mobile phone is unlocked can be shown as the process of (b) to (f) in Figure 3.
  • the display process of the icon of the interface can be based on the position where the user touches the screen of the mobile phone. The change changes.
  • the screen may be in the bright screen state, and the bright screen interface displays as shown in Figure 3 (b) Shown in the clock window 31.
  • the clock window 31 may be similar to the clock window displayed on the mobile phone interface when the power button is pressed when the mobile phone is locked.
  • the clock window 31 may be the same as the clock window 71 on the interface when the screen is locked as shown in FIG. 7(a).
  • the embodiment of the present application does not limit the position of the clock window 31 on the interface.
  • the interface 302 displays on the lower right corner area where the user touches the mobile phone screen
  • the icon of the video application is the icon that appears in the first step of the phone interface after unlocking. Further, the interface 302 is changed to the interface 303 as shown in (c). With the icon of the video application appearing in the first step as the starting area, the application icons around the video application are displayed diffusely, for example, the display distance The icon of the video application and the icon of the recent camera application and the icon of the music application.
  • the interface 303 changes to the interface 304 as shown in Figure (d), and continues to use the icon of the video application that appeared in the first step as the starting area to diffusely display the icons of the settings application, the icons of the album application, and the tasks The icon for the card store application. Then change from interface 304 to interface 305 as shown in Figure (e), continue to use the icon of the video application that appeared in the first step as the starting area, and display the icons of the browser application, the icon of the card package application and the contacts in a diffuse manner.
  • Application icon The diffusion change process shown in (b) to (f) in Figure 3 can be shown as a dotted line, with the icon of the video application appearing in the first step as the starting area, and the mobile phone interface is displayed diffusely along the dotted line.
  • the dotted line is only a schematic diagram showing a possible display area change of the diffusion process, and does not necessarily appear on the display screen of the mobile phone.
  • the main interface 306 displays a variety of applications (application, App) of the phone, such as Huawei Mall, Information, Contacts, Task Card Store, Weather , Card package, photo album, music, browser, settings, camera and video, etc.
  • applications such as Huawei Mall, Information, Contacts, Task Card Store, Weather , Card package, photo album, music, browser, settings, camera and video, etc.
  • main interface of the mobile phone may also include a clock window 10, which is used to display the current time, date, location, temperature, etc.
  • the main interface 306 of the embodiment of the present application may also include more applications or other interface elements. , I won’t repeat it here.
  • the mobile phone interface can also display wallpaper, etc.
  • the display of the wallpaper can also be gradually displayed according to the display method of the interface elements provided in the embodiment of the present application, for example, display area by area; or the wallpaper is displayed on the display screen after the mobile phone is unlocked.
  • the interface elements are then displayed according to the methods provided in the embodiments of the present application, and all are within the protection scope of the present application.
  • FIGs (b) to (f) in Figure 3 introduced above show the display process of the interface elements after the mobile phone is unlocked.
  • the display process can take the position where the user’s finger touches the screen as the starting area.
  • the interface elements close to the position where the finger touches the screen are displayed first, and the interface elements far away from the position where the finger touches the screen are displayed.
  • the position is the starting area, and the dynamic display effect is displayed diffusely around.
  • each interface element can have a different display effect.
  • FIG. 4 is a schematic diagram of an example of interface element display process provided by an embodiment of the present application.
  • the transparency of the icon of the video application is in a changing state.
  • the icon of the video application may have a changing effect as shown in (a) of FIG. 4, and the transparency gradually changes from 0 to 1.
  • the transparency of the icon of the video application is 0, the icon and text can be fully transparent; when the transparency of the icon of the video application is 0.5, the icon and text can be semi-transparent; when the transparency of the icon of the video application is 1 , The icon and text can be the non-transparent effect of the final display.
  • the size of the icon of the video application is in a changing state.
  • the icon of the video application may have a change effect as shown in (b) of FIG. 4, and the size of the icon gradually changes from n to 1, and n is less than 1.
  • the icon and text may be the smallest size.
  • the size of the icon of the video application gradually increases.
  • the icon and text can be the standard size of the final display.
  • the position of the icon of the video application gradually moves to the preset coordinates.
  • the video application preset by the user is the fixed display area in the lower right corner as shown in Figure 3(b).
  • the icon may be in the display process, and other positions gradually move to the fixed display area.
  • the position is gradually moved to the preset position.
  • the blur degree of the icon of the video application is gradually reduced until it is completely clear, and the icon and text are the standard size of the final display.
  • the fuzzy degree of the application icon can be achieved by fuzzy processing algorithms, such as Gaussian fuzzy algorithm, mean fuzzy algorithm, etc.
  • the application does not limit the type of fuzzy control algorithm.
  • the pixels occupied on the display interface are 100 ⁇ 100, and for different degrees of blur, some pixels can be extracted from 100 ⁇ 100 pixels for blur processing.
  • FIG. 5 is a schematic diagram of an example of the display process of the icon of a video application provided by an embodiment of the present application.
  • the transparency of the icon of the video application introduced in conjunction with Figure 4(a) gradually changes from 0 to 1
  • Figure 4(c) The display process of the icon size of the video application gradually changing from large to the final standard size.
  • the area in the lower right corner of the phone interface is shown in Figure 5.
  • Figure (a) first display the icon of a larger video application with a transparency of 0.
  • the transparency of the icon of the video application gradually increases, and the size is gradually reduced, as shown in (b) in FIG. 5.
  • (c) of FIG. 5 the transparency of the icon of the video application gradually increases to 1, and the size is displayed as the final standard size.
  • the display area in the figure (c) starts with the area where the video application is located, and gradually expands to show the icon of the camera application and the icon of the music application.
  • the icon of the camera application and the icon of the music application can be combined with the icon of the music application.
  • the icon of the video application has the same display effect, transparent and larger in size.
  • the change process of the icon of each interface element described above can correspond to the display process of the interface element on the mobile phone interface.
  • the change process of the interface element can be tens to hundreds of milliseconds, which is not done in the embodiment of this application. limited.
  • FIG. 6 is a schematic diagram of another example of the interface element display process provided by an embodiment of the present application.
  • a possible display interface 601 is shown in the lock screen mode of the mobile phone.
  • the interface 601 may be a black screen interface, and a fingerprint icon is displayed on the black screen interface 601.
  • the display order of the interface elements can be changed according to the change of the position where the user touches the mobile phone screen.
  • the position where the user's finger touches the screen may be a random position.
  • FIG. 6 (a) when the user touches the lower left corner area of the mobile phone screen for fingerprint recognition, as shown in Figure 6 (b), after the mobile phone is unlocked, the interface 602 is displayed on the user Touch the lower left corner of the phone screen to display the icon of the browser application.
  • the icon of the browser application is the icon that appears in the first step of the phone interface after unlocking.
  • the interface 602 is changed to the interface 603 as shown in Figure (c), with the icon of the browser application appearing in the first step as the starting area, and the dotted frame area around the browser application is displayed diffusely.
  • the application icon for example, the icon of the weather application and the icon of the setting application that are closest to the icon of the browser application are displayed in the second step.
  • the interface 603 is changed to the interface 604 shown in Figure (d), and the icon of the browser application that appears in the first step is continued as the starting area, and the icons of the Huawei Mall application in the area of the dotted frame are displayed diffusely.
  • the interface 604 changes to the interface 605 as shown in Figure (e), and continues to use the icon of the browser application that appeared in the first step as the starting area to diffusely display the icon of the information application and the contact application in the dashed frame area Icon, music application icon, and video application icon.
  • the unlocked main interface 606 as shown in Figure (f) the details will not be repeated here.
  • Figures 3 and 6 have introduced the display process of different interface elements after the mobile phone is unlocked when the position where the user touches the screen of the mobile phone to unlock changes.
  • This method can be used for electronic devices with wide-area fingerprint recognition functions, such as semi-automatic fingerprint recognition.
  • the interface elements can start with the unlocking position of the user's finger touching the screen, and display all the interface elements in a circular diffusion.
  • this method can also be applied to electronic devices with a fixed fingerprint recognition area.
  • the user can only perform fingerprint recognition and unlock in this fixed area, and the interface elements can be
  • the unlocked position of the fixed area is the starting area, and all interface elements are displayed in a circular diffusion outside the fixed area.
  • the embodiment of the present application takes the interface elements that display the main interface of the mobile phone after unlocking as an example, and introduces the display method and display process of the interface elements.
  • the interface before the lock screen can also be displayed after the mobile phone is unlocked.
  • the mobile phone displays a music playback interface before the screen is locked, and after the user unlocks it, the music playback interface continues to be displayed.
  • the interface elements may include the background, icons, controls, menus, etc. of the music playing interface.
  • all interface elements of the music playing interface can be dynamically displayed. In other words, this application does not limit the unlocked interface, and all the interface elements on the unlocked interface can be displayed according to the display method provided in the embodiment of this application.
  • the user may only unlock by sliding the screen to enter the main interface of the mobile phone.
  • the present application also provides a method for displaying interface elements. When the user's finger slides on the screen, after the mobile phone is unlocked, the display order of the interface elements can be changed according to the user's sliding gesture.
  • FIG. 7 is a schematic diagram of another example of the interface element display process provided by an embodiment of the present application, where (a) in FIG. 7 shows that a mobile phone without fingerprint unlocking is in the lock screen mode, a possibility
  • the interface 701 may include text content for prompting the user to "unlock to view details", a clock window, and shortcut application icons such as a phone book and a camera.
  • the slide track when the user slides a finger on the screen to unlock, the slide track may be as shown by a curve with an arrow in the figure. Assuming that the starting position of the user's sliding track is O 1 , the end position of the user's finger leaving the screen is O 2 , and the speed when the user's finger leaves O 2 is V, and the direction of speed V is shown by the dotted line in the figure.
  • the interface elements may gradually start to display, for example, after obtaining the starting position O 1 of the user sliding and the sliding direction, the icon of the browser application starts to be displayed.
  • the mobile phone starts to display the icon of the browser application after unlocking, which is not limited in the embodiment of the present application.
  • the start position O 1 of the user's sliding track on the display screen is used as the starting area, and the mobile phone's information is displayed diffusely along the direction where the user's finger leaves O 2 at a speed of V. Interface elements.
  • the starting position of the user's sliding track on the display screen is O 1
  • the interface 702 first displays the icon of the browser application closest to the starting position O 1.
  • the icon of the app is the icon that appears in the first step of the phone interface after unlocking.
  • the direction of the velocity V when the user's finger leaves O 2 is shown along the dashed line, and the interface elements in this direction are displayed in turn, which can be changed from the interface 702 to the interface 703 as shown in figure (c) to start
  • the position O 1 is the starting area, and the application icons close to the browser application are displayed diffusely along the direction of the speed V when the user's finger leaves O 2.
  • the icon of the setting application is displayed in the second step.
  • the interface 703 is changed to the interface 704 as shown in (d), and the icon of the browser application that appears in the first step is continued as the starting area, and the icon of the camera application is displayed diffusely.
  • the interface 704 is changed to the interface 705 as shown in the figure, which continues to display the icons of the video application in a diffuse manner, and then displays the icons of the weather application, the icon of the card package application, the icon of the album application, and And music application icons.
  • the mobile phone displays the unlocked main interface 706 as shown in Figure (f), the details will not be repeated here.
  • the display of the interface elements in the direction V can be performed synchronously with the display of the interface elements in the direction perpendicular to the speed V.
  • the icon of the video application in the direction of V and the icon of the weather application in the direction perpendicular to the speed V can start to be displayed synchronously.
  • the display of interface elements in the direction of V can be performed asynchronously with the display of interface elements in the direction perpendicular to the direction of speed V.
  • the weather application icon and the card package application icon in the direction perpendicular to the speed V are further displayed.
  • the embodiment of the application does not limit this.
  • the display process interface element shown in Figure 7 the user at the start of the display screen of the sliding track is O 1, starting from the position of the sliding track for the later time points O 1 farther interface element will be displayed, For example, the time when the application icon of the task card store starts to be displayed is the latest.
  • FIG. 8 is a schematic diagram of another example of the interface element display process provided by an embodiment of the present application. As shown in Figure 8 (a), when the user's finger slides in the direction shown by the arrow on the screen, After the mobile phone is unlocked, the user's sliding track on the display screen is taken as the central axis, and the interface elements of the mobile phone are displayed diffusely to both sides along the central axis.
  • the interface 802 is first displayed as the icon of the browser application or the card package application on the sliding track or the closest to the sliding track. Icons and icons for contact applications. Further, the interface 802 is changed to the interface 803 as shown in (c), and the application icons around the sliding track are displayed in sequence along the sliding track along the sliding track in the direction indicated by the dashed lines on both sides with the center axis of the sliding track.
  • the direction of the dashed line may be parallel or approximately parallel to the direction of the sliding track; or the direction of the dashed line may also be perpendicular or approximately perpendicular to the direction of the sliding track.
  • the second step shows the icon of the weather application and the icon of the information application on one side of the sliding track, the line of the icon of the weather application and the icon of the information application is parallel to the sliding track, and the setting application on the other side of the sliding track is displayed.
  • the icon of the icon and the icon of the album application, the straight line where the icon of the setting application and the icon of the album application are also parallel to the sliding track.
  • the interface 803 changes to the interface 804 as shown in Figure (d), and continues to use the sliding track as the starting area to diffusely display the icon of the Huawei Mall application on one side of the sliding track and the other side of the sliding track.
  • the interface 804 changes to the interface 805 as shown in (e), and continues to use the sliding track as the starting area to diffusely display the icons of the music application, the icon of the video application, etc. in the interface.
  • the mobile phone displays the unlocked main interface 806 as shown in Figure (f) including the clock window 10, it will not be repeated here.
  • FIG. 9 is a schematic diagram of another example of the display process of interface elements provided by an embodiment of the present application.
  • the interface element closest to the irregular graph or curve can be displayed first, and then the display area determined by the irregular graph or curve is used as the starting area to diffusely display the interface elements of the mobile phone to the periphery.
  • the application icon in the area determined by the curve is displayed first, or the application icon located on the curve is displayed.
  • the first step after unlocking the mobile phone is the icon of the card package application and the icon of the album application in the area enclosed by the closed curve.
  • the area enclosed by the closed curve is taken as the starting area, and other application icons are diffused to the periphery.
  • the enclosed area of the closed curve is taken as the starting area, and the outward concentric circles are the diffusion direction.
  • the second step displays the application icons on the concentric circles, such as pointing information Application icon, contact application icon, settings application icon, camera application icon, weather application icon, music application icon.
  • the interface elements may be displayed according to the change of the sliding track of the user on the lock screen interface. In a possible implementation manner, each interface element in this case may have a different display effect.
  • the mobile phone can obtain the speed at which the finger leaves the screen and the direction of the speed when the user slides.
  • Each interface element of the mobile phone can be displayed according to the speed before the finger leaves the screen, or according to different display processes along the speed direction. To present their respective animation effects.
  • the different display process of each interface element here can refer to the related introduction in Figure 4, and each interface element can be performed according to its own different transparency changes, size changes, icon position changes, and icon blur degree changes. Display, or each interface element is extended or shortened according to the speed before the finger leaves the screen, and the time it takes to display to the final form, etc., will not be repeated here.
  • the transparency of the interface elements changes, the size changes, the position of the icon changes, and the degree of blur of the icon
  • the change is completed within 100ms, and the final display effect is presented.
  • the transparency change of the interface elements, the size change, the icon position change, and the icon blur degree change are completed within 50ms, and the final display effect is presented.
  • the application embodiment does not limit this.
  • the transparency change of the interface element, the size change, the icon position change, and the icon blur degree change are completed within 50ms , And present the final display effect.
  • the sliding track when the user slides and the horizontal angle of the short side of the phone is 30°
  • the transparency change of the interface element, the size change, the icon position change, and the icon blur degree change are completed within 100ms, and the final display is presented.
  • the effect is not limited in the embodiment of the present application.
  • the mobile phone can obtain the speed at which the finger leaves the screen and the direction of the speed when the user slides.
  • Each interface element of the mobile phone can be displayed according to the speed before the finger leaves the screen, or according to different display processes along the speed direction. To present their respective animation effects.
  • the mobile phone can obtain the order of the display of each interface element.
  • the display order of each interface element can be determined by the position sequence in the direction of the user's sliding speed; every two interface elements start
  • the time difference between the displayed time points can be determined by the position of the interface element and the sliding speed of the user's finger.
  • the time point when the icon of the card package application and the icon of the album application start to be displayed is t 1
  • the time point when the icon of the human application starts to be displayed is t 2
  • the time period between t 2 and t 1 may be related according to the sliding speed of the user's finger.
  • the time period between t 2 and t 1 is small, and when the user's finger sliding speed is slow, the time period between t 2 and t 1 is long.
  • the display method of the interface elements introduced in Figures 6 and 7 can be applied to any electronic device that is unlocked on the screen by sliding a finger.
  • the electronic device can be unlocked without a password or biometrics, and can only be unlocked by clicking on the lock screen. Slide on the interface to unlock, the electronic device is not limited to whether it has fingerprint recognition and other functions.
  • the display method of the interface elements provided in the embodiments of the present application can be applied to different scenarios such as unlocking by the user through fingerprint recognition, sliding unlocking, etc., and can also be applied to the scenario unlocking according to the position and movement direction of the user’s finger, such as pattern unlocking.
  • the embodiment of the application does not limit this.
  • the display method of the interface elements provided in this application may be based on the unlocking gesture and the unlocking finger position during the unlocking process of the user, for example, according to the gesture direction of the user unlocking, the speed of the gesture action, and the finger during the fingerprint unlocking process. Position, etc., control the display order and display effects of multiple interface elements, and the display process of each interface element, thereby controlling the animation effects presented in the unlocking process, so that the animation presented in the unlocking process is closely related to the user's gestures.
  • the display method of the interface elements provided in this application can make the display effect of the unlocking animation more smooth and natural, and the display of the interface elements is not affected by the position of the user’s finger and the user’s gestures when unlocking.
  • the impact of actions makes users more perceptual and improves user experience.
  • the display order and display speed of the interface elements can be changed according to the change of the position where the user fingerprint unlocking occurs, for example, taking the position where the fingerprint unlocking occurs as the center of the circle, and spreading out other areas of the display screen to display other interfaces element.
  • the display duration of the interface element is dynamically adjusted according to the occurrence speed of the user's gestures.
  • FIG. 10 is a schematic flowchart of a method for displaying interface elements provided by an embodiment of the present application. As shown in FIG. 10, the method may include the following steps:
  • the electronic device displays a second interface, and the second interface is an interface after the electronic device is unlocked.
  • the electronic device first displays the first interface element in the first area of the second interface, and the first area is associated with the occurrence of the first operation on the display screen of the electronic device Position, with the first area as the starting area, display the second interface element in the second area, the second area is adjacent to the first area, and the second area is in the first area of the first area Direction until the electronic device displays the second interface.
  • the electronic device may have a fixed fingerprint recognition area, that is, the fingerprint sensor under the touch screen of the electronic device can only obtain the user's fingerprint in the fixed fingerprint recognition area; or the electronic device may have a wide-area or full-screen fingerprint recognition area
  • the fingerprint sensor under the touch screen of the electronic device can acquire the user's fingerprint in the entire touch screen area of the electronic device, which is not limited in the embodiment of the present application.
  • the first interface is the interface when the electronic device is in the locked screen state.
  • the lock screen interface of the electronic device may include a black screen and a locked screen interface.
  • a fingerprint icon may be displayed on the black screen interface to prompt the user Fingerprint authentication can be performed; or, the electronic device can remain in a black screen state without displaying any fingerprint icons.
  • the first interface may be an interface of an electronic device with a bright screen and a lock screen.
  • the electronic device unlocking program is started, the screen is turned on, and the touch screen is on.
  • the fingerprint icon can be displayed on the screen to prompt the user to unlock the fingerprint.
  • the first interface may be that when the user performs fingerprint unlocking, pressing the power button or other methods to initiate the unlocking process of the electronic device, and the electronic device displays the fingerprint icon in the lit state.
  • the electronic device displays a fingerprint icon when it detects a user's touch or a user's finger movement, which is not limited in the embodiment of the present application.
  • the first operation can be used to unlock the electronic device.
  • a user's finger touches the fingerprint recognition area of the screen of the electronic device to perform fingerprint authentication.
  • the electronic device can be unlocked.
  • the user may only unlock by sliding the screen to enter the main interface of the mobile phone, and the first operation is any form of sliding operation by the user.
  • the first operation may be an operation of the user sliding the graphic on the screen, which is not limited in the embodiment of the present application.
  • the interface elements of the present application are not limited to application icons, but may also be widgets, shortcut components, controls, texts, etc. of the interface. In the embodiments of the present application, they are collectively referred to as “interface elements”.
  • the mobile phone interface can also display wallpaper, etc.
  • the display of the wallpaper can also be gradually displayed according to the display method of the interface elements provided in the embodiments of this application, for example, display area by area; or after the mobile phone is unlocked, the wallpaper is displayed on the display screen, and the interface elements are displayed according to The methods provided in the embodiments of this application are all displayed within the protection scope of this application.
  • the first operation is a touch operation for unlocking the fingerprint by the user
  • the position where the first operation occurs on the display screen of the electronic device is the first position
  • the first area includes the first position
  • the first position is a preset position of the display screen of the electronic device, for example, the first position of the display screen is a position where a fixed fingerprint identification module is set; or an arbitrary position of the display screen of the electronic device.
  • the user touches the lower right corner area of the mobile phone screen to perform fingerprint recognition.
  • the first position may be the position where the user touches the display screen, and the first area may be the area including the position where the user touches the display screen as shown in (b) in FIG. 3.
  • the video application icon in the first area is first displayed, and then, as shown in Figure (c), the video application icon that appears in the first step is used as the starting area, and the area is diffused.
  • the icon of the camera application and the icon of the music application around the video application are displayed, and the second area may be the area where the icon of the camera application and the icon of the music application are located.
  • the icon of the video application that appears in the first step is used as the starting area, and the display on the mobile phone interface is diffused along the dotted line.
  • the user touches the lower left corner area of the mobile phone screen to perform fingerprint recognition.
  • the first position may be the position where the user touches the display screen, and the first area may be the area including the position where the user touches the display screen as shown in (b) in FIG. 6.
  • the icon of the browser application in the first area is first displayed, and further, as shown in Figure (c), the icon of the browser application that appears in the first step is taken as the starting area.
  • the icon of the weather application and the icon of the setting application around the browser application are displayed diffusely, and the second area may be the area where the icon of the weather application and the icon of the setting application are located.
  • the first operation is a sliding operation having a first sliding track
  • the first area includes a starting position of the first sliding track and/or an end position of the first sliding track.
  • the first direction is the direction of the first sliding track; or the first direction is the sliding direction at the start position of the first sliding track; or the first direction is the first sliding track.
  • the sliding track may be shown as a curve with an arrow in Fig. 7 (a).
  • the first position may be the start position of the first sliding track of the user or the end position of the first sliding track.
  • the icon of the browser application in the first area is first displayed, and further, as shown in Figure (c), the icon of the browser application that appears in the first step is taken as the starting area.
  • the icon of the setting application and the icon of the camera application in the first direction are displayed diffusely along the first direction shown by the dashed line.
  • the second area may be an area where the icon of the setting application and the icon of the camera application are located. Continue the diffusion display shown in (d) to (f) in Figure 7 until the unlocked main interface as shown in Figure (f) is displayed.
  • the electronic device may display the second interface element in the second area based on the first rate, using the first area as the starting area, where the first rate is associated with the sliding operation.
  • the sliding rate, or the first rate is associated with the user's sliding rate at the start position of the first sliding track, or the first rate is associated with the user's sliding rate at the end position of the first sliding track.
  • the electronic device displays the first interface element in the first area on the first interface according to the first rule, wherein the first rule It includes at least one of the following: a preset interface element transparency change rule; a preset interface element size change rule; a preset interface element display position change rule; a preset interface element blur degree change rule.
  • the change process of each application icon as shown in FIG. 4 can have different display effects for each interface element.
  • the icon of each application can be as shown in Figure 4 (a), the transparency gradually changes from 0 to 1; the icon of each application can be shown in Figure 4 (b), ( c) The change effect shown in Figure and (d), the size of the application icon is the state of change; the blur degree of each application’s icon is the state of change; the size change process of each application’s icon is accompanied by the icon
  • the display reaches the standard size of the final display, and the position gradually moves to the preset position.
  • the change process of the icon of each interface element described above may correspond to the display process of the interface element on the mobile phone interface.
  • the change process of the interface element may be tens to hundreds of milliseconds.
  • the rate of change is not limited.
  • the display method of the interface elements provided in this application may be based on the unlocking gesture and the unlocking finger position during the unlocking process of the user, for example, according to the gesture direction of the user unlocking, the speed of the gesture action, and the finger during the fingerprint unlocking process. Position, etc., control the display order and display effects of multiple interface elements, and the display process of each interface element, thereby controlling the animation effects presented in the unlocking process, so that the animation presented in the unlocking process is closely related to the user's gestures.
  • the display method of the interface elements provided in this application can make the display effect of the unlocking animation more smooth and natural, and the display of the interface elements is not affected by the position of the user’s finger and the user’s gestures when unlocking.
  • the impact of actions makes users more perceptual and improves user experience.
  • an electronic device in order to implement the above-mentioned functions, includes hardware and/or software modules corresponding to each function.
  • the present application can be implemented in the form of hardware or a combination of hardware and computer software. Whether a certain function is executed by hardware or computer software-driven hardware depends on the specific application and design constraint conditions of the technical solution. Those skilled in the art can use different methods for each specific application in combination with the embodiments to implement the described functions, but such implementation should not be considered as going beyond the scope of the present application.
  • the electronic device can be divided into functional modules according to the foregoing method examples.
  • each functional module can be divided corresponding to each function, or two or more functions can be integrated into one processing module.
  • the above-mentioned integrated modules can be implemented in the form of hardware. It should be noted that the division of modules in this embodiment is illustrative, and is only a logical function division, and there may be other division methods in actual implementation.
  • the electronic device provided in this embodiment is used to execute the above-mentioned display method of interface elements, and therefore can achieve the same effect as the above-mentioned implementation method.
  • the electronic device may include a processing module, a storage module, and a communication module.
  • the processing module can be used to control and manage the actions of the electronic device, for example, can be used to support the electronic device to perform the above steps.
  • the storage module can be used to support the electronic device to execute the storage program code and data.
  • the communication module can be used to support the communication between electronic devices and other devices.
  • the processing module may be a processor or a controller. It can implement or execute various exemplary logical blocks, modules, and circuits described in conjunction with the disclosure of this application.
  • the processor may also be a combination that implements computing functions, such as a combination of one or more microprocessors, a combination of digital signal processing (DSP) and a microprocessor, and so on.
  • the storage module may be a memory.
  • the communication module may specifically be a radio frequency circuit, a Bluetooth chip, a Wi-Fi chip, and other devices that interact with other electronic devices.
  • the electronic device involved in this embodiment may be a device having the structure shown in FIG. 1.
  • This embodiment also provides a computer-readable storage medium, the computer-readable storage medium stores computer instructions, and when the computer instructions run on an electronic device, the electronic device executes the above-mentioned related method steps to implement the steps in the above-mentioned embodiment
  • the display method of interface elements is also provided.
  • This embodiment also provides a computer program product, which when the computer program product runs on a computer, causes the computer to execute the above-mentioned related steps, so as to implement the interface element display method in the above-mentioned embodiment.
  • the embodiments of the present application also provide a device.
  • the device may specifically be a chip, component or module.
  • the device may include a processor and a memory connected to each other.
  • the memory is used to store computer execution instructions.
  • the processor can execute the computer-executable instructions stored in the memory, so that the chip executes the interface element display method in the foregoing method embodiments.
  • the electronic device, computer readable storage medium, computer program product, or chip provided in this embodiment are all used to execute the corresponding method provided above. Therefore, the beneficial effects that can be achieved can refer to the above provided The beneficial effects of the corresponding method will not be repeated here.
  • the disclosed device and method may be implemented in other ways.
  • the device embodiments described above are merely illustrative.
  • the division of modules or units is only a logical function division.
  • there may be other division methods for example, multiple units or components may be combined or It can be integrated into another device, or some features can be ignored or not implemented.
  • the displayed or discussed mutual coupling or direct coupling or communication connection may be indirect coupling or communication connection through some interfaces, devices or units, and may be in electrical, mechanical or other forms.
  • the units described as separate parts may or may not be physically separate, and the parts displayed as units may be one physical unit or multiple physical units, that is, they may be located in one place, or they may be distributed to multiple different places. Some or all of the units may be selected according to actual needs to achieve the objectives of the solutions of the embodiments.
  • the functional units in the various embodiments of the present application may be integrated into one processing unit, or each unit may exist alone physically, or two or more units may be integrated into one unit.
  • the above-mentioned integrated unit can be implemented in the form of hardware or software functional unit.
  • the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a readable storage medium.
  • the technical solutions of the embodiments of the present application are essentially or the part that contributes to the prior art, or all or part of the technical solutions can be embodied in the form of a software product, and the software product is stored in a storage medium. It includes several instructions to make a device (which may be a single-chip microcomputer, a chip, etc.) or a processor (processor) execute all or part of the steps of the methods of the various embodiments of the present application.
  • the aforementioned storage media include: U disk, mobile hard disk, read only memory (ROM), random access memory (RAM), magnetic disk or optical disk and other media that can store program codes.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Computer Hardware Design (AREA)
  • Computer Security & Cryptography (AREA)
  • Software Systems (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

一种界面元素的显示方法及电子设备,该方法应用于手机、平板等电子设备,该方法在用户解锁过程中,可以基于用户解锁动作的手势和解锁时的手指位置等,例如根据用户解锁时手势方向、手势发生的速度、指纹解锁过程的手指位置,控制多个界面元素的显示顺序和显示效果,以及每个界面元素的显示过程,从而控制解锁过程呈现的动画效果,使得解锁过程呈现的动画和用户的手势息息相关。

Description

一种界面元素的显示方法及电子设备
本申请要求于2019年12月18日提交中国专利局、申请号为201911311051.5、申请名称为“一种界面元素的显示方法及电子设备”的中国专利申请的优先权,其全部内容通过引用结合在本申请中。
技术领域
本申请涉及电子技术领域,尤其涉及一种界面元素的显示方法及电子设备。
背景技术
用户在使用终端设备的过程中,一般会为终端设备设置锁屏,使用的时候通过不同的解锁方式对终端设备进行解锁。在用户对终端设备的解锁过程中,例如可以使用指纹解锁、人脸识别解锁、数字密码解锁、图形解锁等不同的解锁方式。
不同的解锁方式可能对应相同的解锁动画,即对应相同的界面元素的显示过程。对于指纹解锁过程,随着半屏指纹、广域指纹或者全屏指纹解锁技术的成熟,未来用户在终端设备的屏幕上进行指纹解锁时,手指的位置或者用户手势、动作将是随机的,而解锁中界面元素的显示过程单一,影响解锁动画的进程和显示效果,且用户对解锁动画的观感不流畅。
发明内容
本申请提供一种界面元素的显示方法及电子设备,该方法可以使得界面元素的显示过程更加自然,解锁动画的播放更流畅,用户的感知性更强。
第一方面,提供了一种界面元素的显示方法,应用于电子设备,该方法包括:显示第一界面,该第一界面是该电子设备处于锁屏状态时的界面;检测用户的第一操作;响应于该第一操作,该电子设备显示第二界面,该第二界面为该电子设备解锁后的界面;其中,在显示该第二界面的过程中,该电子设备先显示该第二界面的第一区域内的第一界面元素,该第一区域关联该第一操作在该电子设备的显示屏的发生位置,以该第一区域为起始区域,显示第二区域内的第二界面元素,该第二区域与该第一区域相邻,且所述第二区域在所述第一区域的第一方向上,直到该电子设备显示该第二界面。
在本申请中,该电子设备可以具有固定指纹识别区域,即该电子设备的触摸屏下指纹传感器只能在该固定指纹识别区域获取用户的指纹;或者该电子设备可以具有广域或者全屏指纹识别区域,该电子设备的触摸屏下指纹传感器可以在整个该电子设备的触摸屏区域获取用户的指纹,本申请实施例对此不做限定。
应理解,第一界面是该电子设备处于锁屏状态时的界面,电子设备的锁屏界面可以包括黑屏且锁屏的界面,示例性的,该黑屏界面上可以显示指纹图标,用于提示用户可以进行指纹认证;或者,该电子设备可以保持黑屏状态,不显示任何指纹图标。
或者,该第一界面可以是电子设备的亮屏且锁屏的界面,例如当检测到用户的手接近 触摸屏或者检测到人脸信息时,启动该电子设备解锁程序,点亮屏幕,触摸屏在亮屏时可以显示指纹图标,用于提示用户可以进行指纹解锁。或者,该第一界面可以是用户进行指纹解锁时,按压电源键等方式启动该电子设备解锁过程,该电子设备在点亮状态下显示指纹图标。又或者,该电子设备在检测到用户的触摸或者用户手指运动时显示指纹图标,本申请实施例对此不做限定。
还应理解,该第一操作可以用于解锁电子设备。例如,对于设置指纹认证解锁的电子设备,用户手指触摸电子设备屏幕的指纹识别区域进行指纹认证,当指纹认证通过时,该电子设备可以解锁。或者,对于没有设置指纹解锁的电子设备,用户可能仅通过滑动屏幕解锁以进入手机的主界面,第一操作是可以用户的任意形式的滑动操作。又或者,对于图形解锁的电子设备,第一操作可以是用户在屏幕上滑动图形的操作,本申请实施例对此不做限定。
此外,还应理解,本申请的界面元素不限于应用图标,还可以是界面的小工具、快捷组件、控件、文字等,本申请实施例中,统一称为“界面元素”。手机界面还可以显示壁纸等,壁纸的显示也可以按照本申请实施例提供的界面元素的显示方法逐渐显示,例如逐个区域进行显示;或者手机解锁后就在显示屏上显示壁纸,界面元素再根据本申请实施例提供的方法进行显示,都在本申请的保护范围之内。
结合第一方面,在第一方面的某些实现方式中,该第一操作是用户进行指纹解锁的触摸操作,该第一操作在该电子设备的显示屏的发生位置为第一位置,该第一区域包括该第一位置。
结合第一方面和上述实现方式,在第一方面的某些实现方式中,该第一位置为该电子设备的显示屏的预设位置,或者为该电子设备的显示屏的任意位置。
结合第一方面和上述实现方式,在第一方面的某些实现方式中,该第一操作是具有第一滑动轨迹的滑动操作,该第一区域包括该第一滑动轨迹的起始位置和/或该第一滑动轨迹的终点位置。
结合第一方面和上述实现方式,在第一方面的某些实现方式中,该第一方向是该第一滑动轨迹的方向;或者该第一方向是该第一滑动轨迹的起始位置处的滑动方向;或者该第一方向是该第一滑动轨迹的终点位置处的滑动方向。
结合第一方面和上述实现方式,在第一方面的某些实现方式中,以该第一区域为起始区域,显示第二区域内的第二界面元素,包括:根据第一速率,以该第一区域为起始区域,显示第二区域内的第二界面元素,其中,该第一速率关联该滑动操作的滑动速率,或者该第一速率关联用户在该第一滑动轨迹的起始位置处的滑动速率,或者该第一速率关联用户在该第一滑动轨迹的终点位置处的滑动速率。
结合第一方面和上述实现方式,在第一方面的某些实现方式中,在显示该第二界面的过程中,该电子设备先显示该第二界面的第一区域内的第一界面元素,包括:在显示该第二界面的过程中,该电子设备按照第一规则,在该第一界面显示该第一区域内的该第一界面元素,其中该第一规则包括以下至少一种:预设的界面元素透明度变化规则;预设的界面元素尺寸变化规则;预设的界面元素显示位置变化规则;预设的界面元素模糊程度变化规则。
综上所述,本申请提供的界面元素的显示方法可以基于用户解锁过程中,解锁动作的手势和解锁的手指位置等,例如根据用户解锁时手势方向、手势动作的速度、指纹解锁过 程的手指位置等,控制多个界面元素的显示顺序和显示效果,以及每个界面元素的显示过程,从而控制解锁过程呈现的动画效果,使得解锁过程呈现的动画和用户的手势息息相关。相对于现有解锁过程中界面元素具有固定的显示过程,本申请提供的界面元素的显示方法可以使得解锁动画的显示效果更加流畅自然,界面元素的显示不受用户解锁时手指位置和用户手势、动作的影响,用户的感知性更强,提高了用户体验。
具体地,对于指纹解锁场景,界面元素的显示顺序和显示速度可以根据用户指纹解锁发生的位置的变化而变化,例如以指纹解锁发生的位置为圆心,向外显示屏的其他区域扩散显示其他界面元素。同时,在每个界面元素的显示过程中,根据用户手势的发生速度等动态调整界面元素的显示时长。
第二方面,提供了一种电子设备,包括:一个或多个处理器;存储器;多个应用程序;以及一个或多个程序,其中该一个或多个程序被存储在该存储器中,当该一个或者多个程序被该处理器执行时,使得该电子设备执行以下步骤:显示第一界面,该第一界面是该电子设备处于锁屏状态时的界面;检测用户的第一操作;响应于该第一操作,显示第二界面,该第二界面为该电子设备解锁后的界面;其中,在显示该第二界面的过程中,先显示该第二界面的第一区域内的第一界面元素,该第一区域关联该第一操作在该电子设备的显示屏的发生位置,以该第一区域为起始区域,显示第二区域内的第二界面元素,该第二区域与该第一区域相邻,且第二区域在该第一区域的第一方向上,直到显示该第二界面。
结合第二方面,在第二方面的某些实现方式中,第一操作是用户进行指纹解锁的触摸操作,该第一操作在该电子设备的显示屏的发生位置为第一位置,该第一区域包括该第一位置。
结合第二方面和上述实现方式,在第二方面的某些实现方式中,第一位置为该电子设备的显示屏的预设位置,或者为该电子设备的显示屏的任意位置。
结合第二方面和上述实现方式,在第二方面的某些实现方式中,第一操作是具有第一滑动轨迹的滑动操作,该第一区域包括该第一滑动轨迹的起始位置和/或该第一滑动轨迹的终点位置。
结合第二方面和上述实现方式,在第二方面的某些实现方式中,第一方向是该第一滑动轨迹的方向;或者该第一方向是该第一滑动轨迹的起始位置处的滑动方向;或者该第一方向是该第一滑动轨迹的终点位置处的滑动方向。
结合第二方面和上述实现方式,在第二方面的某些实现方式中,当该一个或者多个程序被该处理器执行时,使得该电子设备执行以下步骤:根据第一速率,以该第一区域为起始区域,显示第二区域内的第二界面元素,其中,该第一速率关联该滑动操作的滑动速率,或者该第一速率关联用户在该第一滑动轨迹的起始位置处的滑动速率,或者该第一速率关联用户在该第一滑动轨迹的终点位置处的滑动速率。
结合第二方面和上述实现方式,在第二方面的某些实现方式中,当该一个或者多个程序被该处理器执行时,使得该电子设备执行以下步骤:按照第一规则,在该第一界面显示该第一区域内的该第一界面元素,其中该第一规则包括以下至少一种:预设的界面元素透明度变化规则;预设的界面元素尺寸变化规则;预设的界面元素显示位置变化规则;预设的界面元素模糊程度变化规则。
第三方面,本申请提供了一种装置,该装置包含在电子设备中,该装置具有实现上述方面及上述方面的可能实现方式中电子设备行为的功能。功能可以通过硬件实现,也可以 通过硬件执行相应的软件实现。硬件或软件包括一个或多个与上述功能相对应的模块或单元。例如,显示模块或单元、检测模块或单元、处理模块或单元等。
第四方面,本申请提供了一种电子设备,包括:触摸显示屏,其中,触摸显示屏包括触敏表面和显示器;摄像头;一个或多个处理器;存储器;多个应用程序;以及一个或多个计算机程序。其中,一个或多个计算机程序被存储在存储器中,一个或多个计算机程序包括指令。当指令被电子设备执行时,使得电子设备执行上述任一方面任一项可能的实现中的界面元素的显示方法。
第五方面,本申请提供了一种电子设备,包括一个或多个处理器和一个或多个存储器。该一个或多个存储器与一个或多个处理器耦合,一个或多个存储器用于存储计算机程序代码,计算机程序代码包括计算机指令,当一个或多个处理器执行计算机指令时,使得电子设备执行上述任一方面任一项可能的实现中的界面元素的显示方法。
第六方面,本申请提供了一种计算机可读存储介质,包括计算机指令,当计算机指令在电子设备上运行时,使得电子设备执行上述任一方面任一项可能的视频播放的方法。
第七方面,本申请提供了一种计算机程序产品,当计算机程序产品在电子设备上运行时,使得电子设备执行上述任一方面任一项可能的界面元素的显示方法。
附图说明
图1是本申请实施例提供的一例电子设备的结构示意图。
图2是本申请实施例提供的一例电子设备的软件结构框图。
图3是本申请实施例提供的一例界面元素显示过程的图形用户界面示意图。
图4是本申请实施例提供的一例界面元素显示过程示意图。
图5是本申请实施例提供的一例视频应用的图标的显示过程示意图。
图6是本申请实施例提供的又一例界面元素显示过程的示意图。
图7是本申请实施例提供的又一例界面元素显示过程的示意图。
图8是本申请实施例提供的又一例界面元素显示过程的示意图。
图9是本申请实施例提供的又一例界面元素显示过程的示意图。
图10是本申请实施例提供的一例界面元素的显示方法的示意性流程图。
具体实施方式
下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行描述。其中,在本申请实施例的描述中,除非另有说明,“/”表示或的意思,例如,A/B可以表示A或B;本文中的“和/或”仅仅是一种描述关联对象的关联关系,表示可以存在三种关系,例如,A和/或B,可以表示:单独存在A,同时存在A和B,单独存在B这三种情况。另外,在本申请实施例的描述中,“多个”是指两个或多于两个。
以下,术语“第一”、“第二”仅用于描述目的,而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此,限定有“第一”、“第二”的特征可以明示或者隐含地包括一个或者更多个该特征。
本申请实施例提供了一种界面元素的显示方法,可以应用于电子设备,也可是单独的计算机程序,在电子设备解锁过程中,该计算机程序可以实现电子设备界面元素具有不同的显示过程,从而为用户显示不同的解锁动画效果。
本申请实施例提供的界面元素的显示方法可以应用于手机、平板电脑、可穿戴设备、车载设备、增强现实(augmented reality,AR)/虚拟现实(virtual reality,VR)设备、笔记本电脑、超级移动个人计算机(ultra-mobile personal computer,UMPC)、上网本、个人数字助理(personal digital assistant,PDA)等可以根据用户的手指位置或者用户手势等进行解锁的电子设备上,本申请实施例对电子设备的具体类型不作任何限制。
示例性的,图1是本申请实施例提供的一例电子设备的结构示意图。电子设备100可以包括处理器110,外部存储器接口120,内部存储器121,通用串行总线(universal serial bus,USB)接口130,充电管理模块140,电源管理模块141,电池142,天线1,天线2,移动通信模块150,无线通信模块160,音频模块170,扬声器170A,受话器170B,麦克风170C,耳机接口170D,传感器模块180,按键190,马达191,指示器192,摄像头193,显示屏194,以及用户标识模块(subscriber identification module,SIM)卡接口195等。其中传感器模块180可以包括压力传感器180A,陀螺仪传感器180B,气压传感器180C,磁传感器180D,加速度传感器180E,距离传感器180F,接近光传感器180G,指纹传感器180H,温度传感器180J,触摸传感器180K,环境光传感器180L,骨传导传感器180M等。
可以理解的是,本申请实施例示意的结构并不构成对电子设备100的具体限定。在本申请另一些实施例中,电子设备100可以包括比图示更多或更少的部件,或者组合某些部件,或者拆分某些部件,或者不同的部件布置。图示的部件可以以硬件,软件或软件和硬件的组合实现。
处理器110可以包括一个或多个处理单元,例如:处理器110可以包括应用处理器(application processor,AP),调制解调处理器,图形处理器(graphics processing unit,GPU),图像信号处理器(image signal processor,ISP),控制器,存储器,视频编解码器,数字信号处理器(digital signal processor,DSP),基带处理器,和/或神经网络处理器(neural-network processing unit,NPU)等。其中,不同的处理单元可以是独立的器件,也可以集成在一个或多个处理器中。
其中,控制器可以是电子设备100的神经中枢和指挥中心。控制器可以根据指令操作码和时序信号,产生操作控制信号,完成取指令和执行指令的控制。
处理器110中还可以设置存储器,用于存储指令和数据。在一些实施例中,处理器110可以包括一个或多个接口,例如,接口可以包括集成电路(inter-integrated circuit,I2C)接口,集成电路内置音频(inter-integrated circuit sound,I2S)接口,脉冲编码调制(pulse code modulation,PCM)接口,通用异步收发传输器(universal asynchronous receiver/transmitter,UART)接口,移动产业处理器接口(mobile industry processor interface,MIPI),通用输入输出(general-purpose input/output,GPIO)接口,用户标识模块(subscriber identity module,SIM)接口,和/或通用串行总线(universal serial bus,USB)接口等。
I2C接口是一种双向同步串行总线,包括一根串行数据线(serial data line,SDA)和一根串行时钟线(derail clock line,SCL)。在一些实施例中,处理器110可以包含多组I2C总线。处理器110可以通过不同的I2C总线接口分别耦合触摸传感器180K,充电器,闪光灯,摄像头193等。例如:处理器110可以通过I2C接口耦合触摸传感器180K,使处理器110与触摸传感器180K通过I2C总线接口通信,实现电子设备100的触摸功能。
MIPI接口可以被用于连接处理器110与显示屏194,摄像头193等***器件。MIPI接口包括摄像头串行接口(camera serial interface,CSI),显示屏串行接口(display serial  interface,DSI)等。在一些实施例中,处理器110和摄像头193通过CSI接口通信,实现电子设备100的拍摄功能。处理器110和显示屏194通过DSI接口通信,实现电子设备100的显示功能。
例如,在本申请中,处理器110可以通过I2C接口耦合触摸传感器180K,使处理器110与触摸传感器180K通过I2C总线接口通信,当用户触摸显示屏时,或者通过显示屏执行一定的触摸操作时,该触摸传感器180K可以将用户的触摸操作传递给处理器110,以实现显示屏的触摸功能。或者,处理器110可以控制显示屏194上界面元素的显示过程,处理器110和显示屏194通过DSI接口通信,进而控制电子设备100的显示屏194上界面元素的显示过程,例如控制界面元素的透明度变化、尺寸大小变化、位置坐标变化等。
USB接口130是符合USB标准规范的接口,具体可以是Mini USB接口,Micro USB接口,USB Type C接口等。USB接口130可以用于连接充电器为电子设备100充电,也可以用于电子设备100与***设备之间传输数据。也可以用于连接耳机,通过耳机播放音频。该接口还可以用于连接其他电子设备,例如AR设备等。
可以理解的是,本申请实施例示意的各模块间的接口连接关系,只是示意性说明,并不构成对电子设备100的结构限定。在本申请另一些实施例中,电子设备100也可以采用上述实施例中不同的接口连接方式,或多种接口连接方式的组合。
充电管理模块140用于从充电器接收充电输入。其中,充电器可以是无线充电器,也可以是有线充电器。电源管理模块141用于连接电池142,充电管理模块140与处理器110。电源管理模块141接收电池142和/或充电管理模块140的输入,为处理器110,内部存储器121,外部存储器,显示屏194,摄像头193,和无线通信模块160等供电。电源管理模块141还可以用于监测电池容量,电池循环次数,电池健康状态(漏电,阻抗)等参数。
电子设备100的无线通信功能可以通过天线1,天线2,移动通信模块150,无线通信模块160,调制解调处理器以及基带处理器等实现。
天线1和天线2用于发射和接收电磁波信号。移动通信模块150可以提供应用在电子设备100上的包括2G/3G/4G/5G等无线通信的解决方案。调制解调处理器可以包括调制器和解调器。其中,调制器用于将待发送的低频基带信号调制成中高频信号。解调器用于将接收的电磁波信号解调为低频基带信号。随后解调器将解调得到的低频基带信号传送至基带处理器处理。低频基带信号经基带处理器处理后,被传递给应用处理器。应用处理器通过音频设备(不限于扬声器170A,受话器170B等)输出声音信号,或通过显示屏194显示图像或视频。无线通信模块160可以提供应用在电子设备100上的包括无线局域网(wireless local area networks,WLAN)(如无线保真(wireless fidelity,Wi-Fi)网络),蓝牙(bluetooth,BT),全球导航卫星***(global navigation satellite system,GNSS),调频(frequency modulation,FM),近距离无线通信技术(near field communication,NFC),红外技术(infrared,IR)等无线通信的解决方案。
电子设备100通过GPU,显示屏194,以及应用处理器等实现显示功能。GPU为图像处理的微处理器,连接显示屏194和应用处理器。GPU用于执行数学和几何计算,用于图形渲染。处理器110可包括一个或多个GPU,其执行程序指令以生成或改变显示信息。
显示屏194用于显示图像,视频等。显示屏194包括显示面板。显示面板可以采用液晶显示屏(liquid crystal display,LCD),有机发光二极管(organic light-emitting diode,OLED), 有源矩阵有机发光二极体或主动矩阵有机发光二极体(active-matrix organic light emitting diode的,AMOLED),柔性发光二极管(flex light-emitting diode,FLED),Miniled,MicroLed,Micro-oLed,量子点发光二极管(quantum dot light emitting diodes,QLED)等。在一些实施例中,电子设备100可以包括1个或N个显示屏194,N为大于1的正整数。
电子设备100可以通过ISP,摄像头193,视频编解码器,GPU,显示屏194以及应用处理器等实现拍摄功能。其中,ISP用于处理摄像头193反馈的数据。摄像头193用于捕获静态图像或视频。物体通过镜头生成光学图像投射到感光元件。视频编解码器用于对数字视频压缩或解压缩。
外部存储器接口120可以用于连接外部存储卡,例如Micro SD卡,实现扩展电子设备100的存储能力。外部存储卡通过外部存储器接口120与处理器110通信,实现数据存储功能。例如将音乐,视频等文件保存在外部存储卡中。
内部存储器121可以用于存储计算机可执行程序代码,所述可执行程序代码包括指令。处理器110通过运行存储在内部存储器121的指令,从而执行电子设备100的各种功能应用以及数据处理。
电子设备100可以通过音频模块170,扬声器170A,受话器170B,麦克风170C,耳机接口170D,以及应用处理器等实现音频功能。例如音乐播放,录音等。
压力传感器180A用于感受压力信号,可以将压力信号转换成电信号。陀螺仪传感器180B可以用于确定电子设备100的运动姿态。气压传感器180C用于测量气压。磁传感器180D包括霍尔传感器。电子设备100可以利用磁传感器180D检测翻盖皮套的开合。加速度传感器180E可检测电子设备100在各个方向上(一般为三轴)加速度的大小。距离传感器180F,用于测量距离。电子设备100可以通过红外或激光测量距离。接近光传感器180G可以包括例如发光二极管(LED)和光检测器,例如光电二极管。发光二极管可以是红外发光二极管。电子设备100通过发光二极管向外发射红外光。电子设备100使用光电二极管检测来自附近物体的红外反射光。当检测到充分的反射光时,可以确定电子设备100附近有物体。当检测到不充分的反射光时,电子设备100可以确定电子设备100附近没有物体。环境光传感器180L用于感知环境光亮度。温度传感器180J用于检测温度。骨传导传感器180M可以获取振动信号。按键190包括开机键,音量键等。按键190可以是机械按键。也可以是触摸式按键。电子设备100可以接收按键输入,产生与电子设备100的用户设置以及功能控制有关的键信号输入。马达191可以产生振动提示。指示器192可以是指示灯,可以用于指示充电状态,电量变化,也可以用于指示消息,未接来电,通知等。SIM卡接口195用于连接SIM卡。SIM卡可以通过***SIM卡接口195,或从SIM卡接口195拔出,实现和电子设备100的接触和分离。电子设备100可以支持1个或N个SIM卡接口,N为大于1的正整数。
在本申请中,在用户对电子设备的解锁过程中,可以通过指纹传感器180H用于采集指纹。电子设备100可以利用采集的指纹特性实现指纹解锁,访问应用锁,指纹拍照,指纹接听来电等。该指纹传感器可以设置在电子设备设备的显示屏下方的固定区域,实现电子设备的例如半屏指纹识别、广域指纹或者全屏指纹识别的功能,本申请实施例对此不做限定。
触摸传感器180K,也称“触控面板”触摸传感器180K可以设置于显示屏194,由触摸传感器180K与显示屏194组成触摸屏,也称“触控屏”。触摸传感器180K用于检测作用 于其上或附近的触摸操作。触摸传感器可以将检测到的触摸操作传递给应用处理器,以确定触摸事件类型。可以通过显示屏194提供与触摸操作相关的视觉输出。在另一些实施例中,触摸传感器180K也可以设置于电子设备100的表面,与显示屏194所处的位置不同。
在本申请中,在用户对电子设备的解锁过程中,可以通过触摸传感器180K用于采集用户的触摸操作,例如当用户进行解锁时,可以通过用户的滑动操作、或者绘制图案的操作等进行解锁,本申请实施例对此不做限定。
电子设备100的软件***可以采用分层架构,事件驱动架构,微核架构,微服务架构,或云架构。本申请实施例以分层架构的Android***为例,示例性说明电子设备100的软件结构。
图2是本申请实施例提供的一例电子设备100的软件结构框图。分层架构将软件分成若干个层,每一层都有清晰的角色和分工。层与层之间通过软件接口通信。在一些实施例中,将Android***分为四层,从上至下分别为应用程序层,应用程序框架层,安卓运行时(Android runtime)和***库,以及内核层。应用程序层可以包括一系列应用程序包。
如图2所示,结合本申请实施例的描述,该应用程序包可以包括相机,图库、信息、联系人、天气、音乐、卡包、任务卡商店、设置、相册、视频、浏览器、华为商城和桌面等应用程序,其中,桌面应用可以控制电子设备的界面上的应用图标、控件等界面元素的显示尺寸、位置坐标以及显示效果等。
应用程序框架层为应用程序层的应用程序提供应用编程接口(application programming interface,API)和编程框架。应用程序框架层包括一些预先定义的函数。
如图2所示,应用程序框架层可以包括窗口管理器,内容提供器,视图***,电话管理器,资源管理器,通知管理器等。
窗口管理器用于管理窗口程序。窗口管理器可以获取显示屏大小,判断是否有状态栏,锁定屏幕,截取屏幕等。本申请中,该窗口管理器可以参与显示屏的界面元素的显示过程。
内容提供器用来存放和获取数据,并使这些数据可以被应用程序访问。所述数据可以包括视频,图像,音频,拨打和接听的电话,浏览历史和书签,电话簿等。
视图***包括可视控件,例如显示文字的控件,显示图片的控件等。视图***可用于构建应用程序。显示界面可以由一个或多个视图组成的。例如,显示界面上应用图标的显示,或者包括短信通知图标的显示界面,可以包括显示文字的视图以及显示图片的视图。
电话管理器用于提供电子设备100的通信功能。例如通话状态的管理(包括接通,挂断等)。
资源管理器为应用程序提供各种资源,比如本地化字符串,图标,图片,布局文件,视频文件等等。
通知管理器使应用程序可以在状态栏中显示通知信息,可以用于传达告知类型的消息,可以短暂停留后自动消失,无需用户交互。比如通知管理器被用于告知用户下载完成,消息提醒等。通知管理器还可以是以图表或者滚动条文本形式出现在***顶部状态栏的通知,例如后台运行的应用程序的通知,还可以是以对话窗口形式出现在屏幕上的通知。例如在状态栏提示文本信息,或者通过发出提示音、振动、指示灯闪烁等方式进行通知。
Android runtime包括核心库和虚拟机。Android runtime负责安卓***的调度和管理。
核心库包含两部分:一部分是java语言需要调用的功能函数,另一部分是安卓的核心库。
应用程序层和应用程序框架层运行在虚拟机中。虚拟机将应用程序层和应用程序框架层的java文件执行为二进制文件。虚拟机用于执行对象生命周期的管理,堆栈管理,线程管理,安全和异常的管理,以及垃圾回收等功能。
***库可以包括多个功能模块。例如:表面管理器(surface manager),媒体库(media libraries),三维图形处理库(例如:OpenGL ES),2D图形引擎(例如:SGL)等。
表面管理器用于对显示子***进行管理,并且为多个应用程序提供了2D和3D图层的融合。
媒体库支持多种常用的音频,视频格式回放和录制,以及静态图像文件等。媒体库可以支持多种音视频编码格式,例如:MPEG4,H.264,MP3,AAC,AMR,JPG,PNG等。
三维图形处理库用于实现三维图形绘图,图像渲染,合成,和图层处理等。2D图形引擎是2D绘图的绘图引擎。
本申请中,表面管理器、三维图形处理库等可以参与电子设备的界面元素的显示过程,此处不再对具体的显示过程进行赘述。
内核层是硬件和软件之间的层。内核层至少包含显示驱动,传感器驱动等。
为了便于理解,本申请以下实施例将以具有图1和图2所示结构的电子设备为例,结合附图和应用场景,对本申请实施例提供的界面元素的显示方法进行具体阐述。
目前,在用户解锁过程中,都对应有固定的解锁动画,该解锁动画通常可以对应不同的界面元素的显示过程。一种可能的界面元素的显示过程是以屏幕中心点为圆心,向周围进行扩散。具体地,以应用图标为例,位于屏幕中心的应用图标先出现,屏幕边缘的应用图标后出现。或者,另一种可能的界面元素的显示可以是界面元素沿固定方向进行扩散,例如从屏幕底部向屏幕顶部逐渐扩散地显示应用图标,屏幕底部的应用图标先出现,屏幕顶部的应用图标后出现。
图3是本申请实施例提供的一例界面元素显示过程的图形用户界面(graphical user interface,GUI)的示意图,本申请将以手机作为电子设备,以用户通过指纹识别的方式解锁手机的过程为例,详细介绍本申请提供的界面元素的显示方法。
其中,图3中的(a)图示出了手机的锁屏模式下,一种可能的显示界面301。示例性的,当用户启动手机解锁程序时,手机可以显示如图(a)所示的界面301。该界面301可以是黑屏界面,并在该黑屏界面301上显示指纹图标,用于提示用户可以进行指纹认证。
应理解,手机可以具有固定指纹识别区域,手机的触摸屏下指纹传感器只能在该固定指纹识别区域获取用户的指纹;或者手机可以具有全屏指纹识别区域,手机的触摸屏下指纹传感器可以在整个手机的触摸屏区域获取用户的指纹,本申请实施例对此不做限定。
还应理解,本申请实施例对启动手机解锁程序的方式不做限定。例如,当检测到用户的手接近触摸屏或者检测到人脸信息时,启动手机解锁程序,触摸屏上可以显示指纹图标,用于提示用户可以进行指纹解锁。或者,当用户进行指纹解锁时,还可以通过按压电源键等方式启动手机解锁过程,手机屏幕还可以在点亮状态下显示该指纹图标。或者,手机可以保持黑屏状态,不显示任何指纹图标。又或者,手机在检测到用户的触摸或者用户手指运动时显示指纹图标,本申请实施例对此不做限定。
用户触摸手机屏幕的指纹识别区域进行指纹认证,当指纹认证通过时,手机可以解锁,并由黑屏状态变为亮屏状态。手机解锁后的动画可以展示为如图3中的(b)图至(f)图的过程,具体地,对于手机显示解锁之后的界面,界面的图标的显示过程可以根据用户触 摸手机屏幕的位置的变化而变化。
可选地,对于解锁后的手机,在完全显示图3中的(f)图所示的主界面之前,可以为亮屏状态,且亮屏界面上显示有如图3中的(b)图所示的时钟窗口31。该时钟窗口31可以类似于手机锁屏状态时,按下电源键手机界面显示的时钟窗口。示例性的,该时钟窗口31可以和图7中的(a)图示出的锁屏时界面上的时钟窗口71相同,本申请实施例对该时钟窗口31在界面的位置不做限定。
随着手机桌面上应用图标的逐渐出现,该包括时钟窗口31的界面逐渐被出现的应用的图标替换,直到完全显示图3中的(f)图所示的解锁后的手机界面。应理解,该时钟窗口31不同于图3中的(f)图手机主界面306所示的时钟窗口10。
或者,对于解锁后的手机,在完全显示图3中的(f)图所示的主界面之前,可以为黑屏状态,即对于图3中的(b)图,除了虚线框内区域亮屏且显示视频应用的图标之外,其他手机屏幕的显示区域为黑屏,本申请实施例对此不做限定。后续实施例的描述中,以亮屏状态为例进行介绍。
示例性的,如图(a)所示,当用户触摸手机屏幕的右下角区域进行指纹识别,如图(b)所示,手机解锁之后,界面302上在用户触摸手机屏幕的右下角区域显示视频应用的图标,该视频应用的图标为解锁后手机界面第一步出现的图标。进一步地,由界面302变化为如图(c)所示的界面303,以第一步出现的视频应用的图标为起始区域,扩散地显示该视频应用的周围的应用图标,例如显示距离该视频应用的图标最近的相机应用的图标和音乐应用的图标。再进一步地,由界面303变化为如图(d)所示的界面304,继续以第一步出现的视频应用的图标为起始区域,扩散地显示设置应用的图标、相册应用的图标和任务卡商店应用的图标。再由界面304变化为如图(e)所示的界面305,继续以第一步出现的视频应用的图标为起始区域,扩散地显示浏览器应用的图标、卡包应用的图标和联系人应用的图标。图3中的(b)图至(f)图所示的扩散变化过程可以如虚线所示,以第一步出现的视频应用的图标为起始区域,沿着虚线向外扩散地显示手机界面上其他应用的图标,应理解,该虚线仅为表示一种可能的扩散过程的显示区域变化的示意图,并不一定出现在手机的显示屏。
直到手机显示如图(f)所示的解锁之后的主界面306,该主界面306显示了手机的多款应用程序(application,App),例如华为商城、信息、联系人、任务卡商店、天气、卡包、相册、音乐、浏览器、设置、相机和视频等。
此外,该手机的主界面还可以包括时钟窗口10,该时钟窗口10用于显示当前时间、日期、所在地以及温度等,本申请实施例主界面306还可以包括更多的应用程序或者其他界面元素,此处不再赘述。
应理解,界面元素不限于应用图标,还可以是界面的小工具、快捷组件、控件、文字等,本申请实施例中,统一称为“界面元素”。
还应理解,手机界面还可以显示壁纸等,壁纸的显示也可以按照本申请实施例提供的界面元素的显示方法逐渐显示,例如逐个区域进行显示;或者手机解锁后就在显示屏上显示壁纸,界面元素再根据本申请实施例提供的方法进行显示,都在本申请的保护范围之内。
以上介绍的图3中的(b)图至(f)图展示了手机在解锁之后,界面元素的显示过程。该显示过程可以以用户手指接触屏幕的位置为起始区域,距离手指接触屏幕的位置近的界面元素先显示,距离手指接触屏幕的位置远的界面元素后显示,由此得到从手指接触屏幕 的位置为起始区域,向周围扩散地显示的动态显示效果。
在一种可能的实现方式中,对于每一个界面元素,可以具有不同的显示效果。
图4是本申请实施例提供的一例界面元素显示过程示意图。可选地,以视频应用的图标为例,对应于图3中的(b)图的视频应用的图标在显示过程中,该视频应用的图标的透明度为变化状态。
示例性的,该视频应用的图标可以如图4中的(a)图所示的变化效果,透明度从0逐渐变化到1。当视频应用的图标的透明度为0时,图标和文字可以为全透明态;当视频应用的图标的透明度为0.5时,图标和文字可以为半透明态;当视频应用的图标的透明度为1时,图标和文字可以为最终显示的非透明态效果。
可选地,对应于图3中的(b)图的视频应用的图标在显示过程中,该视频应用的图标的尺寸大小为变化状态。
示例性的,该视频应用的图标可以如图4中的(b)图所示的变化效果,图标尺寸从n逐渐变化到1,n小于1。当视频应用的图标的尺寸为n时,图标和文字可以为最小尺寸,在显示过程中,视频应用的图标的尺寸逐渐增大。当视频应用的图标的尺寸为1时,图标和文字可以为最终显示的标准尺寸大小。
应理解,该最终显示的标准尺寸大小为用户最终在界面上看见的图标大小。示例性的可以如图3中的(f)图所示的界面上的应用图标的尺寸大小,或者示例性的可以如图6中的(f)图所示的界面上的应用图标的尺寸大小,或者示例性的可以如图7中的(f)图所示的界面上的应用图标的尺寸大小,或者示例性的可以如图8中的(f)图所示的界面上的应用图标的尺寸大小,或者示例性的可以如图9中的(d)图所示的界面上的应用图标的尺寸大小,后续实施例中,该最终显示的标准尺寸大小可以参考该描述。
或者,示例性的,该视频应用的图标可以如图4中的(c)图所示的变化效果,图标尺寸从n逐渐变化到1,n大于1。当视频应用的图标的尺寸为n时,图标和文字可以为最大尺寸,在显示过程中,视频应用的图标的尺寸逐渐缩小,直到当视频应用的图标的尺寸为1时,图标和文字可以为最终显示的标准尺寸大小,本申请实施例对此不做限定。
又或者,示例性的,该视频应用的图标可以如图4中的(d)图所示的变化效果,图标尺寸从n逐渐变化到1,n大于1。当视频应用的图标的尺寸为n时,图标和文字可以为最大尺寸,在显示过程中,视频应用的图标的尺寸逐渐缩小到小于最终显示的标准尺寸,再逐渐增大,直到当视频应用的图标的尺寸为1时,图标和文字可以为最终显示的标准尺寸大小,本申请实施例对此不做限定。
可选地,对应于图3中的(b)图的视频应用的图标在显示过程中,该视频应用的图标的位置逐渐移动到预设坐标。例如,用户预设的该视频应用为图3中(b)图所示的右下角固定的显示区域,该图标可以是在显示过程,有其他位置逐渐移动到该固定的显示区域。
或者,结合图4中(b)图至(d)图的应用图标的尺寸变化过程,伴随着该图标显示到最终显示的标准尺寸,位置也逐渐移动到预设位置。可选地,对应于图3中的(b)图的视频应用的图标在显示过程中,该视频应用的图标的模糊程度逐渐降低,直到完全清晰,图标和文字为最终显示的标准尺寸大小。应理解,应用图标的模糊程度可以通过模糊处理的算法实现,例如高斯模糊算法、均值模糊算法等,本申请对模糊控制算法的类型不做限定。对于视频应用图标,在显示界面上占据的像素为100×100,针对不同的模糊程度, 可以从100×100个像素中提取部分像素进行模糊处理。示例性的,模糊程度为1时,从100×100个像素中提取5000个像素进行模糊处理;模糊程度为0.5时,从100×100个像素中提取1000个像素进行模糊处理,模糊程度为0时,从100×100个像素中都正常显示,本申请实施例对此不做限定。图5是本申请实施例提供的一例视频应用的图标的显示过程示意图,结合图4中的(a)图介绍的视频应用的图标透明度从0逐渐变化到1,以及图4中的(c)图视频应用的图标尺寸大小从大逐渐变化到最终标准尺寸的显示过程,当用户在图3中的(a)图所示的区域通过指纹认证之后,在手机界面的右下角区域如图5中的(a)图所示,先显示透明度为0的尺寸较大的视频应用的图标。该视频应用的图标的透明度逐渐增大,尺寸逐渐缩小,可以如图5中的(b)图所示。直到如图5中的(c)图所示,该视频应用的图标的透明度逐渐增大到1,尺寸显示为最终标准尺寸。可选地,此时(c)图中的显示区域以视频应用所在区域为起始区域,逐渐扩散显示出相机应用的图标和音乐应用的图标,该相机应用的图标和音乐应用的图标可以和视频应用的图标具有相同的显示效果,透明态且尺寸较大。
应理解,以上介绍的每一个界面元素的图标的变化过程可以对应该界面元素在手机界面显示过程,例如该界面元素的变化过程可以为几十至几百毫秒,本申请实施例对此不做限定。
还应理解,当每一个界面元素开始动态变化的同时,手机的界面以用户手指接触屏幕的位置为起始区域,向外扩散开,逐渐显示每一个界面元素,直到显示如图3中的(f)图所示的解锁后的主界面306。
图6是本申请实施例提供的又一例界面元素显示过程的示意图,其中,图6中的(a)图示出了手机的锁屏模式下,一种可能的显示界面601。示例性的,该界面601可以是黑屏界面,并在该黑屏界面601上显示指纹图标。
当用户的手指接触屏幕的位置发生变化时,手机解锁之后,界面元素的显示顺序可以根据用户触摸手机屏幕的位置的变化而变化。换言之,在本申请实施例中,用户的手指接触屏幕的位置可以为随机位置,当用户的手指接触屏幕的位置(指纹识别位置)变化时,后续界面元素的扩散显示过程的圆心随之变化。
示例性的,如图6中的(a)图所示,当用户触摸手机屏幕的左下角区域进行指纹识别,如图6中的(b)图所示,手机解锁之后,界面602上在用户触摸手机屏幕的左下角区域显示浏览器应用的图标,该浏览器应用的图标为解锁后手机界面第一步出现的图标。进一步地,由界面602变化为如图(c)所示的界面603,以第一步出现的浏览器应用的图标为起始区域,扩散地显示该浏览器应用的周围的虚线框区域内的应用图标,例如第二步显示的是距离该浏览器应用的图标最近的天气应用的图标和设置应用的图标。再进一步地,由界面603变化为如图(d)所示的界面604,继续以第一步出现的浏览器应用的图标为起始区域,扩散地显示虚线框区域内的华为商城应用的图标、卡包应用的图标、相机应用的图标和相册应用的图标。再由界面604变化为如图(e)所示的界面605,继续以第一步出现的浏览器应用的图标为起始区域,扩散地显示虚线框区域内的信息应用的图标、联系人应用的图标、音乐应用的图标和视频应用的图标。直到手机显示如图(f)所示的解锁之后的主界面606,此处不再赘述。
以上通过图3和图6介绍了当用户触摸手机屏幕进行解锁的位置发生变化时,手机解锁后界面元素不同的显示过程,该方法可以用于具有广域指纹识别功能的电子设备,例如 具有半屏指纹识别或者全屏指纹识别技术的电子设备,界面元素可以以用户手指接触屏幕的解锁位置为起始区域,环形扩散显示所有界面元素。此外,该方法还可以应用于具有固定指纹识别区域的电子设备,例如,当手机的指纹识别位于手机显示屏中间的固定区域,用户只可以在该固定区域进行指纹识别并解锁,界面元素可以以该固定区域的解锁位置为起始区域,向固定区域之外环形扩散显示所有界面元素。
本申请实施例以解锁后显示手机的主界面的界面元素为例,介绍了界面元素的显示方法和显示过程,应理解,手机解锁后还可以显示锁屏前的界面。例如,锁屏前手机显示的是音乐播放界面,用户解锁后,继续显示该音乐播放界面。此时界面元素可以包括音乐播放界面的背景、图标、控件、菜单等,根据本申请实施例提供的方法,可以动态的显示该音乐播放界面的所有界面元素。换言之,本申请对解锁后的界面不做限定,该解锁后的界面上的界面元素都可以根据本申请实施例提供的显示方法进行显示。
在另一种可能的实现方式中,手机没有设置指纹解锁的情况下,用户可能仅通过滑动屏幕解锁以进入手机的主界面。本申请还提供一种界面元素的显示方法,当用户的手指在屏幕上滑动时,手机解锁之后,界面元素的显示顺序可以根据用户滑动手势的变化而变化。
示例性的,图7是本申请实施例提供的又一例界面元素显示过程的示意图,其中,图7中的(a)图示出了未设置指纹解锁的手机在锁屏模式下,一种可能的显示界面701。示例性的,该界面701可以包括用于提示用户的“解锁查看详情”的文字内容、时钟窗口以及电话簿、相机等快捷应用图标。
可选地,如图7中的(a)图所示,当用户通过手指在屏幕上滑动进行解锁时,滑动轨迹可以如图中带箭头的曲线所示。假设用户的滑动轨迹的起始位置为O 1,用户的手指离开屏幕的终点位置为O 2,且用户的手指离开O 2时的速度为V,速度V方向如图中虚线所示。
可选地,当用户从O 1开始滑动时,界面元素就可以逐渐开始显示,例如获取用户滑动的起始位置O 1和滑动方向之后,就开始显示浏览器应用的图标。或者,当用户从O 1开始滑动到手指离开O 2时,手机解锁后再开始显示浏览器应用的图标,本申请实施例对此不做限定。
一种可能的实现方式中,手机解锁后,以用户在显示屏的滑动轨迹的起始位置O 1为起始区域,沿用户的手指离开O 2时的速度为V的方向扩散地显示手机的界面元素。
如图7中的(b)图所示,用户在显示屏的滑动轨迹的起始位置为O 1,界面702上先显示距离起始位置为O 1处最近的浏览器应用的图标,该浏览器应用的图标为解锁后手机界面第一步出现的图标。进一步地,沿着虚线示出用户的手指离开O 2时的速度V的方向,依次显示该方向上的界面元素,可以由界面702变化为如图(c)所示的界面703,以起始位置为O 1为起始区域,沿用户的手指离开O 2时的速度V的方向扩散地显示接近该浏览器应用的应用图标,例如第二步显示的是设置应用的图标。再进一步地,由界面703变化为如图(d)所示的界面704,继续以第一步出现的浏览器应用的图标为起始区域,扩散地显示相机应用的图标。再由界面704变化为如图所示的界面705,继续扩散地显示视频应用的图标,再以垂直于速度V的方向,依次显示天气应用的图标、卡包应用的图标、相册应用的图标、和音乐应用的图标。直到手机显示如图(f)所示的解锁之后的主界面706,此处不再赘述。
可选地,图7中示出的过程中,在V的方向上界面元素的显示可以和垂直于速度V 的方向上界面元素的显示同步进行。例如如图7中的(e)图中,V的方向上视频应用的图标和垂直于速度V的方向上天气应用的图标可以同步开始显示。
或者,在V的方向上界面元素的显示可以和垂直于速度V的方向上界面元素的显示不同步进行。例如如图7中的(e)图中,V的方向上直到视频应用的图标显示之后,垂直于速度V的方向上天气应用的图标、卡包应用的图标再进一步显示。本申请实施例对此不做限定。
根据图7所示的界面元素的显示过程,用户在显示屏的滑动轨迹的起始位置为O 1,距离滑动轨迹的起始位置为O 1越远的界面元素开始显示的时间点越晚,例如任务卡商店的应用图标开始显示的时间开始最晚。
在另一种可能的实现方式中,手机没有设置指纹解锁的情况下,用户可以以任一种滑动操作对屏幕进行解锁,以进入手机的主界面,界面元素的显示顺序可以根据用户滑动轨迹的变化而变化。示例性的,图8是本申请实施例提供的又一例界面元素显示过程的示意图,如图8中的(a)图所示,当用户的手指在屏幕上按照箭头所示的方向滑动时,手机解锁后,以用户在显示屏的滑动轨迹为中心轴线,沿该中心轴线向两侧扩散地显示手机的界面元素。
如图8中的(b)图所示,以用户在显示屏的滑动轨迹为中心轴线,界面802上先显示为滑动轨迹上或者距离该滑动轨迹最近的浏览器应用的图标、卡包应用的图标和联系人应用的图标。进一步地,由界面802变化为如图(c)所示的界面803,以该滑动轨迹中心轴线,沿滑动轨迹向两侧虚线所示方向扩散地依次显示该滑动轨迹周围的应用图标。可选地,该虚线方向可以是平行或者近似平行于该滑动轨迹方向;或者该虚线方向还可以是垂直或者近似垂直于该滑动轨迹方向。
例如第二步显示的是滑动轨迹一侧的天气应用的图标和信息应用的图标,该天气应用的图标和信息应用的图标所在的直线平行于滑动轨迹,以及显示滑动轨迹另一侧的设置应用的图标和相册应用的图标,该设置应用的图标和相册应用的图标所在的直线也平行于滑动轨迹。再进一步地,由界面803变化为如图(d)所示的界面804,继续以滑动轨迹为起始区域,扩散地显示滑动轨迹一侧的华为商城应用的图标,以及该滑动轨迹另一侧相机应用的图标和任务卡商店应用的图标。再由界面804变化为如图(e)所示的界面805,继续以该滑动轨迹为起始区域,扩散地显示界面内的音乐应用的图标、视频应用的图标等。直到手机显示包括时钟窗口10在内的如图(f)所示的解锁之后的主界面806,此处不再赘述。
示例性的,图9是本申请实施例提供的又一例界面元素显示过程的示意图,如图9中的(a)图所示,当用户的手指在屏幕上的滑动轨迹为不规则图形或者曲线时,可以先显示该不规则图形或者曲线最接近的界面元素,再以该不规则图形或者曲线确定的显示区域为起始区域,向周边扩散地显示手机的界面元素。
如图9中的(a)图所示,当用户滑动轨迹为封闭的曲线时,先显示该曲线确定的区域内的应用图标,或者显示位于该曲线上的应用图标。例如,如图9中的(b)图所示,手机解锁后第一步显示的是该封闭曲线包围区域内的卡包应用的图标和相册应用的图标。再以该封闭曲线包围区域为起始区域,向周边扩散显示其他应用图标。如图9中的(c)图所示,以该封闭曲线包围区域为起始区域,以向外的同心圆为扩散方向,第二步显示的是该同心圆上的应用图标,例如指向信息应用的图标、联系人应用的图标、设置应用的图 标、相机应用的图标、天气应用的图标、音乐应用的图标。继续以同心圆的方式向外扩散显示,直到手机显示包括时钟窗口10在内的如图(d)所示的解锁之后的主界面904,此处不再赘述。除了上述图6至图9介绍的界面元素的显示方法,可以根据用户在锁屏界面的滑动轨迹的变化,显示界面元素。在一种可能的实现方式中,对于该情况下的每一个界面元素,可以具有不同的显示效果。
可选地,手机可以获取用户滑动时手指离开屏幕前的速度及速度的方向,手机的每一个界面元素可以根据手指离开屏幕前的速度,或者沿该速度方向依次按照不同的显示过程进行显示,以呈现各自的动画效果。应理解,这里每一个界面元素不同的显示过程可以参照前述图4中的相关介绍,每一个界面元素可以根据自身不同透明度变化、尺寸大小的变化、图标位置的变化和图标模糊程度的变化等进行显示,或者每一个界面元素根据手指离开屏幕前的速度延长或者缩短自身显示到最终形态的时长等,此处不再赘述。
示例性的,当用户滑动时手指离开屏幕前的速度为10像素每毫秒(pixel/millisecond,px/ms)时,界面元素的透明度变化、尺寸大小的变化、图标位置的变化和图标模糊程度的变化等在100ms内完成,并呈现最终显示效果。当用户滑动时手指离开屏幕前的速度为50px/ms时,界面元素的透明度变化、尺寸大小的变化、图标位置的变化和图标模糊程度的变化等在50ms内完成,并呈现最终显示效果,本申请实施例对此不做限定。
用户在显示屏上手滑的速度越快,界面元素间开始显示的间隔的时长也越短,换言之,用户手指滑动速度越快,所有界面元素显示到最终界面完成动画的整体时长越短。
示例性的,当用户滑动时的滑动轨迹与手机短边的水平夹角为60°时,界面元素的透明度变化、尺寸大小的变化、图标位置的变化和图标模糊程度的变化等在50ms内完成,并呈现最终显示效果。当用户滑动时的滑动轨迹与手机短边的水平夹角30°时,界面元素的透明度变化、尺寸大小的变化、图标位置的变化和图标模糊程度的变化等在100ms内完成,并呈现最终显示效果,本申请实施例对此不做限定。
可选地,手机可以获取用户滑动时手指离开屏幕前的速度及速度的方向,手机的每一个界面元素可以根据手指离开屏幕前的速度,或者沿该速度方向依次按照不同的显示过程进行显示,以呈现各自的动画效果。
在每一个界面元素的显示过程中,手机可以获取每一个界面元素开始显示的前后顺序,该每一个界面元素的显示顺序可以由用户滑动的速度方向上的位置顺序决定;每两个界面元素开始显示的时间点相差的时间可以由界面元素的位置和用户手指滑动速度决定。以图9中的(b)图至(c)图的显示过程为例,卡包应用的图标和相册应用的图标开始显示的时间点为t 1,扩散至外圈的信息应用的图标和联系人应用的图标等开始显示的时间点为t 2,t 2和t 1相差的时间段可以根据用户手指滑动速度相关。当用户手指滑动速度快时,t 2和t 1相差的时间段小,当用户手指滑动速度慢时,t 2和t 1相差的时间段长。
应理解,图6和图7介绍的界面元素的显示方法可以应用于任何一种通过手指滑动在屏幕上解锁的电子设备,该电子设备可以没有设置密码解锁或生物识别解锁,仅通过在锁屏界面上滑动来进行解锁,该电子设备不限于是否具有指纹识别等功能。
还应理解,本申请实施例提供的界面元素的显示方法可以应用于用户通过指纹识别解锁、滑动解锁等不同场景,还可以应用于图案解锁等根据用户手指的位置和移动方向来解锁的场景,本申请实施例对此不做限定。
综上所述,本申请提供的界面元素的显示方法可以基于用户解锁过程中,解锁动作的 手势和解锁的手指位置等,例如根据用户解锁时手势方向、手势动作的速度、指纹解锁过程的手指位置等,控制多个界面元素的显示顺序和显示效果,以及每个界面元素的显示过程,从而控制解锁过程呈现的动画效果,使得解锁过程呈现的动画和用户的手势息息相关。相对于现有解锁过程中界面元素具有固定的显示过程,本申请提供的界面元素的显示方法可以使得解锁动画的显示效果更加流畅自然,界面元素的显示不受用户解锁时手指位置和用户手势、动作的影响,用户的感知性更强,提高了用户体验。
具体地,对于指纹解锁场景,界面元素的显示顺序和显示速度可以根据用户指纹解锁发生的位置的变化而变化,例如以指纹解锁发生的位置为圆心,向外显示屏的其他区域扩散显示其他界面元素。同时,在每个界面元素的显示过程中,根据用户手势的发生速度等动态调整界面元素的显示时长。
结合上述实施例及相关附图,本申请实施例提供了一种界面元素的显示方法,该方法可以在如图1、图2所示的具有触摸屏的电子设备(例如手机、平板电脑等)中实现。图10是本申请实施例提供的界面元素的显示方法的示意性流程图,如图10所示,该方法可以包括以下步骤:
1001,显示第一界面,该第一界面是该电子设备处于锁屏状态时的界面。
1002,检测用户的第一操作。
1003,响应于该第一操作,该电子设备显示第二界面,该第二界面为该电子设备解锁后的界面。
其中,在显示该第二界面的过程中,该电子设备先显示该第二界面的第一区域内的第一界面元素,该第一区域关联该第一操作在该电子设备的显示屏的发生位置,以该第一区域为起始区域,显示第二区域内的第二界面元素,该第二区域与该第一区域相邻,且所述第二区域在所述第一区域的第一方向上,直到该电子设备显示该第二界面。
在本申请中,该电子设备可以具有固定指纹识别区域,即该电子设备的触摸屏下指纹传感器只能在该固定指纹识别区域获取用户的指纹;或者该电子设备可以具有广域或者全屏指纹识别区域,该电子设备的触摸屏下指纹传感器可以在整个该电子设备的触摸屏区域获取用户的指纹,本申请实施例对此不做限定。
应理解,第一界面是该电子设备处于锁屏状态时的界面,电子设备的锁屏界面可以包括黑屏且锁屏的界面,示例性的,该黑屏界面上可以显示指纹图标,用于提示用户可以进行指纹认证;或者,该电子设备可以保持黑屏状态,不显示任何指纹图标。
或者,该第一界面可以是电子设备的亮屏且锁屏的界面,例如当检测到用户的手接近触摸屏或者检测到人脸信息时,启动该电子设备解锁程序,点亮屏幕,触摸屏在亮屏时可以显示指纹图标,用于提示用户可以进行指纹解锁。或者,该第一界面可以是用户进行指纹解锁时,按压电源键等方式启动该电子设备解锁过程,该电子设备在点亮状态下显示指纹图标。又或者,该电子设备在检测到用户的触摸或者用户手指运动时显示指纹图标,本申请实施例对此不做限定。
还应理解,该第一操作可以用于解锁电子设备。例如,对于设置指纹认证解锁的电子设备,用户手指触摸电子设备屏幕的指纹识别区域进行指纹认证,当指纹认证通过时,该电子设备可以解锁。或者,对于没有设置指纹解锁的电子设备,用户可能仅通过滑动屏幕解锁以进入手机的主界面,第一操作是可以用户的任意形式的滑动操作。又或者,对于图形解锁的电子设备,第一操作可以是用户在屏幕上滑动图形的操作,本申请实施例对此不 做限定。
此外,还应理解,本申请的界面元素不限于应用图标,还可以是界面的小工具、快捷组件、控件、文字等,本申请实施例中,统一称为“界面元素”。手机界面还可以显示壁纸等,壁纸的显示也可以按照本申请实施例提供的界面元素的显示方法逐渐显示,例如逐个区域进行显示;或者手机解锁后就在显示屏上显示壁纸,界面元素再根据本申请实施例提供的方法进行显示,都在本申请的保护范围之内。
在一种可能的实现方式中,该第一操作是用户进行指纹解锁的触摸操作,该第一操作在该电子设备的显示屏的发生位置为第一位置,该第一区域包括该第一位置。
可选地,该第一位置为该电子设备的显示屏的预设位置,例如显示屏的第一位置为设置固定的指纹识别模组的位置;或者为该电子设备的显示屏的任意位置。
示例性的,如图3中的(a)图所示,用户触摸手机屏幕的右下角区域进行指纹识别。第一位置可以是用户触摸显示屏的位置,第一区域可以是图3中的(b)图所示包括用户触摸显示屏的位置的区域。电子设备的界面元素在显示过程中,先显示第一区域的视频应用的图标,再进一步地,如图(c)所示,以第一步出现的视频应用的图标为起始区域,扩散地显示该视频应用的周围的相机应用的图标和音乐应用的图标,该第二区域可以是相机应用的图标和音乐应用的图标所在的区域。继续如图3中的(b)图至(f)图所示的扩散变化过程所示,以第一步出现的视频应用的图标为起始区域,沿着虚线向外扩散地显示手机界面上其他应用的图标,直到显示如图(f)所示的解锁之后的主界面。
示例性的,如图6中的(a)图所示,用户触摸手机屏幕的左下角区域进行指纹识别。第一位置可以是用户触摸显示屏的位置,第一区域可以是图6中的(b)图所示包括用户触摸显示屏的位置的区域。电子设备的界面元素在显示过程中,先显示第一区域的浏览器应用的图标,再进一步地,如图(c)所示,以第一步出现的浏览器应用的图标为起始区域,扩散地显示该浏览器应用的周围的天气应用的图标和设置应用的图标,该第二区域可以是天气应用的图标和设置应用的图标所在的区域。继续如图6中的(b)图至(f)图所示的扩散变化过程所示,以第一步出现的浏览器应用的图标为起始区域,沿着虚线向外扩散地显示手机界面上其他应用的图标,直到显示如图(f)所示的解锁之后的主界面。
在一种可能的实现方式中,该第一操作是具有第一滑动轨迹的滑动操作,该第一区域包括该第一滑动轨迹的起始位置和/或该第一滑动轨迹的终点位置。
在一种可能的实现方式中,该第一方向是该第一滑动轨迹的方向;或者该第一方向是该第一滑动轨迹的起始位置处的滑动方向;或者该第一方向是该第一滑动轨迹的终点位置处的滑动方向。
示例性的,用户通过手指在屏幕上滑动进行解锁时,滑动轨迹可以如图7中的(a)图带箭头的曲线所示。第一位置可以是用户第一滑动轨迹的起始位置或者该第一滑动轨迹的终点位置。电子设备的界面元素在显示过程中,先显示第一区域的浏览器应用的图标,再进一步地,如图(c)所示,以第一步出现的浏览器应用的图标为起始区域,沿虚线示出的第一方向扩散地显示该第一方向上的设置应用的图标和相机应用的图标。该第二区域可以是设置应用的图标和相机应用的图标所在的区域。继续如图7中的(d)图至(f)图所示的扩散显示,直到显示如图(f)所示的解锁之后的主界面。
在一种可能的实现方式中,该电子设备可以根据第一速率,以该第一区域为起始区域,显示第二区域内的第二界面元素,其中,该第一速率关联该滑动操作的滑动速率,或者该 第一速率关联用户在该第一滑动轨迹的起始位置处的滑动速率,或者该第一速率关联用户在该第一滑动轨迹的终点位置处的滑动速率。
在一种可能的实现方式中,在显示该第二界面的过程中,该电子设备按照第一规则,在该第一界面显示该第一区域内的该第一界面元素,其中该第一规则包括以下至少一种:预设的界面元素透明度变化规则;预设的界面元素尺寸变化规则;预设的界面元素显示位置变化规则;预设的界面元素模糊程度变化规则。
如图4所示的每一个应用图标的变化过程,对于每一个界面元素,可以具有不同的显示效果。示例性的,每一个应用的图标可以如图4中的(a)图所示的变化效果,透明度从0逐渐变化到1;每一个应用的图标可以如图4中的(b)图、(c)图和(d)图所示的变化效果,应用的图标的尺寸大小为变化状态;每一个应用的图标的模糊程度为变化状态;每一个应用的图标的尺寸变化过程,伴随着该图标显示到最终显示的标准尺寸,位置也逐渐移动到预设位置。
应理解,以上介绍的每一个界面元素的图标的变化过程可以对应该界面元素在手机界面显示过程,例如该界面元素的变化过程可以为几十至几百毫秒,本申请实施例对界面元素的变化速率不做限定。
综上所述,本申请提供的界面元素的显示方法可以基于用户解锁过程中,解锁动作的手势和解锁的手指位置等,例如根据用户解锁时手势方向、手势动作的速度、指纹解锁过程的手指位置等,控制多个界面元素的显示顺序和显示效果,以及每个界面元素的显示过程,从而控制解锁过程呈现的动画效果,使得解锁过程呈现的动画和用户的手势息息相关。相对于现有解锁过程中界面元素具有固定的显示过程,本申请提供的界面元素的显示方法可以使得解锁动画的显示效果更加流畅自然,界面元素的显示不受用户解锁时手指位置和用户手势、动作的影响,用户的感知性更强,提高了用户体验。
可以理解的是,电子设备为了实现上述功能,其包含了执行各个功能相应的硬件和/或软件模块。结合本文中所公开的实施例描述的各示例的算法步骤,本申请能够以硬件或硬件和计算机软件的结合形式来实现。某个功能究竟以硬件还是计算机软件驱动硬件的方式来执行,取决于技术方案的特定应用和设计约束条件。本领域技术人员可以结合实施例对每个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本申请的范围。
本实施例可以根据上述方法示例对电子设备进行功能模块的划分,例如,可以对应各个功能划分各个功能模块,也可以将两个或两个以上的功能集成在一个处理模块中。上述集成的模块可以采用硬件的形式实现。需要说明的是,本实施例中对模块的划分是示意性的,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式。
需要说明的是,上述方法实施例涉及的各步骤的所有相关内容均可以援引到对应功能模块的功能描述,在此不再赘述。
本实施例提供的电子设备,用于执行上述界面元素的显示方法,因此可以达到与上述实现方法相同的效果。
在采用集成的单元的情况下,电子设备可以包括处理模块、存储模块和通信模块。其中,处理模块可以用于对电子设备的动作进行控制管理,例如,可以用于支持电子设备执行上述步骤。存储模块可以用于支持电子设备执行存储程序代码和数据等。通信模块,可以用于支持电子设备与其他设备的通信。
其中,处理模块可以是处理器或控制器。其可以实现或执行结合本申请公开内容所描述的各种示例性的逻辑方框,模块和电路。处理器也可以是实现计算功能的组合,例如包含一个或多个微处理器组合,数字信号处理(digital signal processing,DSP)和微处理器的组合等等。存储模块可以是存储器。通信模块具体可以为射频电路、蓝牙芯片、Wi-Fi芯片等与其他电子设备交互的设备。
在一个实施例中,当处理模块为处理器,存储模块为存储器时,本实施例所涉及的电子设备可以为具有图1所示结构的设备。
本实施例还提供一种计算机可读存储介质,该计算机可读存储介质中存储有计算机指令,当该计算机指令在电子设备上运行时,使得电子设备执行上述相关方法步骤实现上述实施例中的界面元素的显示方法。
本实施例还提供了一种计算机程序产品,当该计算机程序产品在计算机上运行时,使得计算机执行上述相关步骤,以实现上述实施例中的界面元素的显示方法。
另外,本申请的实施例还提供一种装置,这个装置具体可以是芯片,组件或模块,该装置可包括相连的处理器和存储器;其中,存储器用于存储计算机执行指令,当装置运行时,处理器可执行存储器存储的计算机执行指令,以使芯片执行上述各方法实施例中的界面元素的显示方法。
其中,本实施例提供的电子设备、计算机可读存储介质、计算机程序产品或芯片均用于执行上文所提供的对应的方法,因此,其所能达到的有益效果可参考上文所提供的对应的方法中的有益效果,此处不再赘述。
通过以上实施方式的描述,所属领域的技术人员可以了解到,为描述的方便和简洁,仅以上述各功能模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能模块完成,即将装置的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。
在本申请所提供的几个实施例中,应该理解到,所揭露的装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,模块或单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个装置,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性,机械或其它的形式。
作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是一个物理单元或多个物理单元,即可以位于一个地方,或者也可以分布到多个不同地方。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个可读取存储介质中。基于这样的理解,本申请实施例的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该软件产品存储在一个存储介质中,包括若干指令用以使得一个设备(可以是单片机,芯片等)或处理器(processor)执行本申请各个实施例方法的全部或部分步骤。而前述的存 储介质包括:U盘、移动硬盘、只读存储器(read only memory,ROM)、随机存取存储器(random access memory,RAM)、磁碟或者光盘等各种可以存储程序代码的介质。
以上内容,仅为本申请的具体实施方式,但本申请的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本申请揭露的技术范围内,可轻易想到变化或替换,都应涵盖在本申请的保护范围之内。因此,本申请的保护范围应以权利要求的保护范围为准。

Claims (16)

  1. 一种界面元素的显示方法,其特征在于,应用于电子设备,所述方法包括:
    显示第一界面,所述第一界面是所述电子设备处于锁屏状态时的界面;
    检测用户的第一操作;
    响应于所述第一操作,所述电子设备显示第二界面,所述第二界面为所述电子设备解锁后的界面;
    其中,在显示所述第二界面的过程中,所述电子设备先显示所述第二界面的第一区域内的第一界面元素,所述第一区域关联所述第一操作在所述电子设备的显示屏的发生位置,以所述第一区域为起始区域,显示第二区域内的第二界面元素,所述第二区域与所述第一区域相邻,且所述第二区域在所述第一区域的第一方向上,直到所述电子设备显示所述第二界面。
  2. 根据权利要求1所述的方法,其特征在于,所述第一操作是用户进行指纹解锁的触摸操作,所述第一操作在所述电子设备的显示屏的发生位置为第一位置,所述第一区域包括所述第一位置。
  3. 根据权利要求1或2所述的方法,其特征在于,所述第一位置为所述电子设备的显示屏的预设位置,或者为所述电子设备的显示屏的任意位置。
  4. 根据权利要求1所述的方法,其特征在于,所述第一操作是具有第一滑动轨迹的滑动操作,所述第一区域包括所述第一滑动轨迹的起始位置和/或所述第一滑动轨迹的终点位置。
  5. 根据权利要求4所述的方法,其特征在于,所述第一方向是所述第一滑动轨迹的方向;或者
    所述第一方向是所述第一滑动轨迹的起始位置处的滑动方向;或者
    所述第一方向是所述第一滑动轨迹的终点位置处的滑动方向。
  6. 根据权利要求4或5所述的方法,其特征在于,所述以所述第一区域为起始区域,显示第二区域内的第二界面元素,包括:
    根据第一速率,以所述第一区域为起始区域,显示第二区域内的第二界面元素,其中,所述第一速率关联所述滑动操作的滑动速率,或者所述第一速率关联用户在所述第一滑动轨迹的起始位置处的滑动速率,或者所述第一速率关联用户在所述第一滑动轨迹的终点位置处的滑动速率。
  7. 根据权利要求1至6中任一项所述的方法,其特征在于,所述在显示所述第二界面的过程中,所述电子设备先显示所述第二界面的第一区域内的第一界面元素,包括:
    在显示所述第二界面的过程中,所述电子设备按照第一规则,在所述第一界面显示所述第一区域内的所述第一界面元素,其中所述第一规则包括以下至少一种:
    预设的界面元素透明度变化规则;
    预设的界面元素尺寸变化规则;
    预设的界面元素显示位置变化规则;
    预设的界面元素模糊程度变化规则。
  8. 一种电子设备,其特征在于,包括:一个或多个处理器;存储器;多个应用程序; 以及一个或多个程序,其中所述一个或多个程序被存储在所述存储器中,当所述一个或者多个程序被所述处理器执行时,使得所述电子设备执行以下步骤:
    显示第一界面,所述第一界面是所述电子设备处于锁屏状态时的界面;
    检测用户的第一操作;
    响应于所述第一操作,显示第二界面,所述第二界面为所述电子设备解锁后的界面;
    其中,在显示所述第二界面的过程中,先显示所述第二界面的第一区域内的第一界面元素,所述第一区域关联所述第一操作在所述电子设备的显示屏的发生位置,以所述第一区域为起始区域,显示第二区域内的第二界面元素,所述第二区域与所述第一区域相邻,且所述第二区域在所述第一区域的第一方向上,直到显示所述第二界面。
  9. 根据权利要求8所述的电子设备,其特征在于,所述第一操作是用户进行指纹解锁的触摸操作,所述第一操作在所述电子设备的显示屏的发生位置为第一位置,所述第一区域包括所述第一位置。
  10. 根据权利要求8或9所述的电子设备,其特征在于,所述第一位置为所述电子设备的显示屏的预设位置,或者为所述电子设备的显示屏的任意位置。
  11. 根据权利要求8所述的电子设备,其特征在于,所述第一操作是具有第一滑动轨迹的滑动操作,所述第一区域包括所述第一滑动轨迹的起始位置和/或所述第一滑动轨迹的终点位置。
  12. 根据权利要求11所述的电子设备,其特征在于,所述第一方向是所述第一滑动轨迹的方向;或者
    所述第一方向是所述第一滑动轨迹的起始位置处的滑动方向;或者
    所述第一方向是所述第一滑动轨迹的终点位置处的滑动方向。
  13. 根据权利要求11或12所述的电子设备,其特征在于,当所述一个或者多个程序被所述处理器执行时,使得所述电子设备执行以下步骤:
    根据第一速率,以所述第一区域为起始区域,显示第二区域内的第二界面元素,其中,所述第一速率关联所述滑动操作的滑动速率,或者所述第一速率关联用户在所述第一滑动轨迹的起始位置处的滑动速率,或者所述第一速率关联用户在所述第一滑动轨迹的终点位置处的滑动速率。
  14. 根据权利要求8至13中任一项所述的电子设备,其特征在于,当所述一个或者多个程序被所述处理器执行时,使得所述电子设备执行以下步骤:
    按照第一规则,在所述第一界面显示所述第一区域内的所述第一界面元素,其中所述第一规则包括以下至少一种:
    预设的界面元素透明度变化规则;
    预设的界面元素尺寸变化规则;
    预设的界面元素显示位置变化规则;
    预设的界面元素模糊程度变化规则。
  15. 一种计算机可读存储介质,其特征在于,包括计算机指令,当所述计算机指令在电子设备上运行时,使得所述电子设备执行如权利要求1至7中任一项所述的界面元素的显示方法。
  16. 一种计算机程序产品,其特征在于,当所述计算机程序产品在计算机上运行时,使得所述计算机执行如权利要求1至7中任一项所述的界面元素的显示方法。
PCT/CN2020/126896 2019-12-18 2020-11-06 一种界面元素的显示方法及电子设备 WO2021120914A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201911311051.5 2019-12-18
CN201911311051.5A CN111176504B (zh) 2019-12-18 2019-12-18 一种界面元素的显示方法及电子设备

Publications (1)

Publication Number Publication Date
WO2021120914A1 true WO2021120914A1 (zh) 2021-06-24

Family

ID=70655560

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2020/126896 WO2021120914A1 (zh) 2019-12-18 2020-11-06 一种界面元素的显示方法及电子设备

Country Status (2)

Country Link
CN (1) CN111176504B (zh)
WO (1) WO2021120914A1 (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
USD1024099S1 (en) 2022-02-25 2024-04-23 Waymo Llc Display screen or portion thereof with animated graphical user interface

Families Citing this family (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111176504B (zh) * 2019-12-18 2021-12-24 华为技术有限公司 一种界面元素的显示方法及电子设备
CN111782327A (zh) * 2020-06-30 2020-10-16 百度在线网络技术(北京)有限公司 显示控制方法、装置、电子设备以及可读介质
CN111966771A (zh) * 2020-07-23 2020-11-20 汉海信息技术(上海)有限公司 地图界面的显示方法、装置、电子设备及存储介质
CN114237780A (zh) * 2020-09-09 2022-03-25 华为技术有限公司 一种界面间的转换方法、设备及***
CN112380515A (zh) * 2020-11-13 2021-02-19 京东方科技集团股份有限公司 屏幕解锁方法、屏幕解锁装置、可读存储介质和显示设备
CN112835487B (zh) * 2021-03-22 2022-08-02 四川酷比通信设备有限公司 一种终端屏幕解锁控制方法、***、设备及存储介质
CN115964106B (zh) * 2021-04-20 2024-02-13 华为技术有限公司 图形界面显示方法、电子设备、介质以及程序产品
CN112988024B (zh) * 2021-05-10 2021-08-06 深圳掌酷软件有限公司 触屏锁屏解锁交互方法、装置、设备及存储介质
CN113986427A (zh) * 2021-10-26 2022-01-28 维沃移动通信有限公司 对象显示方法、装置、电子设备及存储介质
CN117435097A (zh) * 2022-07-12 2024-01-23 荣耀终端有限公司 一种显示方法及电子设备
CN115328594A (zh) * 2022-07-29 2022-11-11 华为技术有限公司 一种显示方法、装置和移动载体
CN116844196B (zh) * 2023-08-31 2024-02-27 荣耀终端有限公司 动效画面显示方法及电子设备

Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102369534A (zh) * 2009-03-30 2012-03-07 微软公司 解锁屏幕
CN102385473A (zh) * 2010-09-02 2012-03-21 腾讯科技(深圳)有限公司 页面切换方法和装置
US20150029121A1 (en) * 2012-06-06 2015-01-29 Huizhou Tcl Mobile Communication Co., Ltd. Slide unlocking method for touchscreen device under screen locking state
CN106611119A (zh) * 2015-10-22 2017-05-03 阿里巴巴集团控股有限公司 一种终端解锁方法、装置和智能终端
CN107329766A (zh) * 2017-07-05 2017-11-07 深圳市泰衡诺科技有限公司 一种组件信息的显示方法及显示装置
US20170357796A1 (en) * 2012-12-07 2017-12-14 Tencent Technology (Shenzhen) Company Limited Touchscreen unlocking method and apparatus
CN107704300A (zh) * 2017-09-25 2018-02-16 联想(北京)有限公司 信息处理方法及电子设备
CN111176504A (zh) * 2019-12-18 2020-05-19 华为技术有限公司 一种界面元素的显示方法及电子设备

Family Cites Families (19)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR101608673B1 (ko) * 2009-10-30 2016-04-05 삼성전자주식회사 터치 락 상태를 가지는 휴대 단말기 및 이의 운용 방법
KR101819513B1 (ko) * 2012-01-20 2018-01-17 엘지전자 주식회사 이동단말기 및 그 제어방법
TW201337721A (zh) * 2012-03-06 2013-09-16 Acer Inc 手持式裝置及其相關控制方法
US10739971B2 (en) * 2012-05-09 2020-08-11 Apple Inc. Accessing and displaying information corresponding to past times and future times
TWD161261S (zh) * 2013-01-07 2014-06-21 宏碁股份有限公司 顯示螢幕之圖形化使用者介面
WO2016036545A1 (en) * 2014-09-02 2016-03-10 Apple Inc. Reduced-size notification interface
CN104360800A (zh) * 2014-10-23 2015-02-18 深圳市金立通信设备有限公司 一种解锁模式调整方法
CN105700765A (zh) * 2014-11-28 2016-06-22 富泰华工业(深圳)有限公司 电子设备及其屏幕解锁方法
CN104636102B (zh) * 2014-12-26 2018-07-06 联想(北京)有限公司 显示控制方法及电子设备
US9996254B2 (en) * 2015-09-23 2018-06-12 Samsung Electronics Co., Ltd. Hidden application icons
CN105867721A (zh) * 2015-12-15 2016-08-17 乐视移动智能信息技术(北京)有限公司 一种快捷开关的控制方法及装置
CN110140342B (zh) * 2017-07-14 2021-04-20 华为技术有限公司 锁屏界面处理方法及终端
US10678116B1 (en) * 2017-11-09 2020-06-09 Facebook Technologies, Llc Active multi-color PBP elements
CN108132738A (zh) * 2017-12-01 2018-06-08 信利光电股份有限公司 一种智能终端的触控操作方法和智能终端
CN110832482B (zh) * 2018-03-26 2023-06-27 华为技术有限公司 一种指纹解锁方法及终端
CN109271073B (zh) * 2018-08-31 2022-04-22 努比亚技术有限公司 桌面动态图标实现方法、终端以及计算机可读介质
CN109375844A (zh) * 2018-09-17 2019-02-22 奇酷互联网络科技(深圳)有限公司 智能指纹解锁方法、移动终端及计算机可读储存介质
CN109976626A (zh) * 2019-02-19 2019-07-05 华为技术有限公司 一种应用图标的切换方法及电子设备
CN110262877B (zh) * 2019-04-30 2022-05-13 华为技术有限公司 一种卡片处理方法及设备

Patent Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102369534A (zh) * 2009-03-30 2012-03-07 微软公司 解锁屏幕
CN102385473A (zh) * 2010-09-02 2012-03-21 腾讯科技(深圳)有限公司 页面切换方法和装置
US20150029121A1 (en) * 2012-06-06 2015-01-29 Huizhou Tcl Mobile Communication Co., Ltd. Slide unlocking method for touchscreen device under screen locking state
US20170357796A1 (en) * 2012-12-07 2017-12-14 Tencent Technology (Shenzhen) Company Limited Touchscreen unlocking method and apparatus
CN106611119A (zh) * 2015-10-22 2017-05-03 阿里巴巴集团控股有限公司 一种终端解锁方法、装置和智能终端
CN107329766A (zh) * 2017-07-05 2017-11-07 深圳市泰衡诺科技有限公司 一种组件信息的显示方法及显示装置
CN107704300A (zh) * 2017-09-25 2018-02-16 联想(北京)有限公司 信息处理方法及电子设备
CN111176504A (zh) * 2019-12-18 2020-05-19 华为技术有限公司 一种界面元素的显示方法及电子设备

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
USD1024099S1 (en) 2022-02-25 2024-04-23 Waymo Llc Display screen or portion thereof with animated graphical user interface

Also Published As

Publication number Publication date
CN111176504A (zh) 2020-05-19
CN111176504B (zh) 2021-12-24

Similar Documents

Publication Publication Date Title
WO2021120914A1 (zh) 一种界面元素的显示方法及电子设备
WO2021227770A1 (zh) 应用窗口显示方法和电子设备
WO2021057830A1 (zh) 一种信息处理方法及电子设备
WO2021244443A1 (zh) 分屏显示方法、电子设备及计算机可读存储介质
WO2021057868A1 (zh) 一种界面切换方法及电子设备
EP3586316B1 (en) Method and apparatus for providing augmented reality function in electronic device
WO2021104030A1 (zh) 一种分屏显示方法及电子设备
WO2021129253A1 (zh) 显示多窗口的方法、电子设备和***
WO2022052671A1 (zh) 一种显示窗口的方法、切换窗口的方法、电子设备和***
WO2021037223A1 (zh) 一种触控方法与电子设备
US20150286328A1 (en) User interface method and apparatus of electronic device for receiving user input
KR102553558B1 (ko) 전자 장치 및 전자 장치의 터치 이벤트 처리 방법
EP3023861A1 (en) An electronic apparatus and a method for displaying a screen of the electronic apparatus
WO2022222752A1 (zh) 一种显示方法及相关装置
WO2021190524A1 (zh) 截屏处理的方法、图形用户接口及终端
WO2023040666A1 (zh) 键盘显示方法、折叠屏设备和计算机可读存储介质
KR20180086639A (ko) 전자 장치 및 전자 장치 제어 방법
KR102614044B1 (ko) 미라캐스트 제공 장치 및 방법
WO2022001279A1 (zh) 跨设备桌面管理方法、第一电子设备及第二电子设备
WO2021052488A1 (zh) 一种信息处理方法及电子设备
CN114780012B (zh) 电子设备的锁屏壁纸的显示方法和相关装置
WO2022213831A1 (zh) 一种控件显示方法及相关设备
WO2022228043A1 (zh) 显示方法、电子设备、存储介质和程序产品
WO2023202444A1 (zh) 一种输入方法及装置
WO2023078133A1 (zh) 视频播放方法和装置

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 20902794

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 20902794

Country of ref document: EP

Kind code of ref document: A1