WO2016115930A1 - 按钮交互方法和装置 - Google Patents

按钮交互方法和装置 Download PDF

Info

Publication number
WO2016115930A1
WO2016115930A1 PCT/CN2015/093065 CN2015093065W WO2016115930A1 WO 2016115930 A1 WO2016115930 A1 WO 2016115930A1 CN 2015093065 W CN2015093065 W CN 2015093065W WO 2016115930 A1 WO2016115930 A1 WO 2016115930A1
Authority
WO
WIPO (PCT)
Prior art keywords
button
event
state
switched
preset
Prior art date
Application number
PCT/CN2015/093065
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 小米科技有限责任公司
Priority to JP2016570158A priority Critical patent/JP6211721B2/ja
Priority to RU2016114553A priority patent/RU2651194C2/ru
Priority to KR1020157036562A priority patent/KR101871240B1/ko
Priority to EP15858090.2A priority patent/EP3089016A4/en
Priority to MX2016002007A priority patent/MX2016002007A/es
Publication of WO2016115930A1 publication Critical patent/WO2016115930A1/zh
Priority to US15/226,511 priority patent/US10705676B2/en

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
    • 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/03Arrangements for converting the position or the displacement of a member into a coded form
    • G06F3/041Digitisers, e.g. for touch screens or touch pads, characterised by the transducing means
    • G06F3/0414Digitisers, e.g. for touch screens or touch pads, characterised by the transducing means using force sensing means to determine a position
    • 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/03Arrangements for converting the position or the displacement of a member into a coded form
    • G06F3/041Digitisers, e.g. for touch screens or touch pads, characterised by the transducing means
    • G06F3/0416Control or interface arrangements specially adapted for digitisers
    • 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/04812Interaction techniques based on cursor appearance or behaviour, e.g. being affected by the presence of displayed objects
    • 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
    • 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
    • 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/04886Interaction 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 by partitioning the display area of the touch-screen or the surface of the digitising tablet into independently controllable areas, e.g. virtual keyboards or menus
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F2203/00Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/041Indexing scheme relating to G06F3/041 - G06F3/045
    • G06F2203/04105Pressure sensors for measuring the pressure or force exerted on the touch surface without providing the touch position
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F2203/00Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/041Indexing scheme relating to G06F3/041 - G06F3/045
    • G06F2203/04108Touchless 2D- digitiser, i.e. digitiser detecting the X/Y position of the input means, finger or stylus, also when it does not touch, but is proximate to the digitiser's interaction surface without distance measurement in the Z direction

Definitions

  • the present disclosure relates to the field of communications, and more particularly to a button interaction method and apparatus.
  • Button interaction means setting a button on the interactive interface.
  • the user can trigger the corresponding human-computer interaction response by clicking the button with the mouse or touching the button with the hand.
  • button interaction is very extensive.
  • the human-computer interaction function can be realized in real time and diversified through button interaction, which is convenient to use and can make the whole interaction process more visual and intuitive.
  • the present disclosure provides a button interaction method and apparatus.
  • a button interaction method comprising:
  • a wave pattern is output around the button; wherein the wave pattern is used to issue an interaction reminder and a loading process that characterizes an event triggered by the button state switch.
  • whether the button is toggled by the determining button includes:
  • the touch event for the button area is monitored again, and when the touch event is determined to be the second preset event, it is determined that the button is switched from the Hover state to the Press state.
  • whether the button is toggled by the determining button includes:
  • the mouse event for the button region is monitored again, and when the mouse event is determined to be the fourth preset event, it is determined that the button is switched from the Hover state to the Press state.
  • the first preset event is a long press event; the second preset event is a release event; the third preset event is a mouse hover event; and the fourth preset event is a mouse Click on the event.
  • the outputting the fluctuation pattern around the button includes:
  • the fluctuation pattern is dynamically outputted around the button according to a preset fluctuation period, and the event triggered when the button is switched from the Hover state to the Press state is completed. After that, the output of the fluctuation pattern is stopped.
  • the static outputting the wave pattern around the button includes:
  • a preset number of corrugated patterns are statically output around the button according to the magnitude of the pressing pressure; wherein the greater the pressing pressure, the greater the number of corrugated patterns that are statically outputted around the button.
  • the dynamically outputting the fluctuation pattern around the button according to a preset fluctuation period includes:
  • the corrugated source is controlled to diffuse outwardly by a predetermined diffusion rate to gradually attenuate the corrugated pattern.
  • a button interaction apparatus comprising
  • a judging module configured to determine whether a button state switch occurs on the button
  • an output module configured to output a wave pattern around the button when the button is toggled; wherein the wave pattern is used to issue an interaction reminder and a loading process that characterizes an event triggered by the button state switch.
  • the determining module includes:
  • a first monitoring submodule configured to monitor a touch event for the button area
  • a first determining sub-module configured to determine whether the touch event is a first preset event
  • a first determining submodule configured to: when the first determining submodule determines that the touch event is the first preset event, determine that the button is switched from a Normal state to a Hover state;
  • a second determining submodule configured to: after the button is switched to the Hover state, the first monitoring submodule monitors the touch event for the button area again, and the first determining submodule determines that the touch event is the second pre When the event is set, it is determined that the button is switched from the Hover state to the Press state.
  • the determining module includes:
  • a second determining sub-module configured to determine whether the mouse event is a third preset event
  • a third determining submodule configured to: when the mouse event is the third preset event, determine that the button is switched from a Normal state to a Hover state;
  • a fourth determining submodule configured to: after the button is switched to the Hover state, the second monitoring submodule monitors the pin again When the mouse event of the button area is determined, and the second determining sub-module determines that the mouse event is the fourth preset event, it is determined that the button is switched from the Hover state to the Press state.
  • the first preset event is a long press event; the second preset event is a release event; the third preset event is a mouse hover event; and the fourth preset event is a mouse Click on the event.
  • the output module includes:
  • a first output sub-module configured to statically output the fluctuation pattern around the button when the button is switched from the Normal state to the Hover state, to issue an interaction reminder
  • a second output submodule configured to dynamically output the wave pattern around the button according to a preset fluctuation period when the button is switched from a Hover state to a Press state, and switch the button from a Hover state to a Press After the event triggered by the state is loaded, the output of the fluctuation pattern is stopped.
  • the first output submodule includes:
  • an output subunit configured to statically output a preset number of corrugated patterns around the button according to the magnitude of the pressing pressure; wherein the greater the pressing pressure, the more the number of corrugated patterns that are statically outputted around the button.
  • the second output submodule includes:
  • control subunit configured to control the corrugated pattern of the corrugated source to gradually attenuate outward according to a predetermined diffusion rate.
  • a button interaction apparatus including:
  • a memory for storing processor executable instructions
  • processor is configured to:
  • a wave pattern is output around the button; wherein the wave pattern is used to issue an interaction reminder and a loading process that characterizes an event triggered by the button state switch.
  • a wave pattern is output around the button; since the wave pattern is used to issue an interaction reminder and characterize the The button state switches the loading process of the triggered event, so the user can output a clear and accurate interactive reminder and present a complete interactive process during the button interaction process, thereby optimizing the user's interactive experience.
  • FIG. 1 is a schematic diagram of a conventional interactive interface, according to an exemplary embodiment
  • FIG. 2 is a schematic flowchart diagram of a button interaction method according to an exemplary embodiment
  • FIG. 3 is a schematic flowchart diagram of another method of button interaction according to an exemplary embodiment
  • FIG. 4 is a schematic diagram of an interaction interface according to an exemplary embodiment
  • FIG. 5 is a schematic diagram of another interactive interface according to an exemplary embodiment
  • FIG. 6 is a schematic block diagram of a button interaction apparatus according to an exemplary embodiment
  • FIG. 7 is a schematic block diagram of another button interaction apparatus according to an exemplary embodiment
  • FIG. 8 is a schematic block diagram of another button interaction apparatus according to an exemplary embodiment
  • FIG. 9 is a schematic block diagram of another button interaction apparatus according to an exemplary embodiment.
  • FIG. 10 is a schematic block diagram of another button interaction apparatus according to an exemplary embodiment
  • FIG. 11 is a schematic block diagram of another button interaction apparatus according to an exemplary embodiment.
  • FIG. 12 is a schematic structural diagram of the button interaction apparatus according to an exemplary embodiment.
  • first, second, third, etc. may be used in the present disclosure to describe various information, such information should not be limited to these terms. These terms are only used to distinguish the same type of information from each other.
  • first information may also be referred to as second information without departing from the scope of the present disclosure.
  • second information may also be referred to as first information.
  • word "if” as used herein may be interpreted as "when” or “when” or “in response to a determination.”
  • the button In the traditional button interaction process, the button usually has three states: Normal state, Hover state and Press state; wherein, the Normal state refers to the default appearance of the button or the appearance when it is still; the Hover state refers to moving the mouse to the button or When the button is removed, the button assumes a hovering state.
  • the Hover state can usually be understood as an intermediate state, which is usually used to remind the user to click on the button to trigger an event; the Press state refers to the state in which the button is pressed.
  • an event is usually triggered; for example, taking the smart device's switch button as an example, when the switch button is in the Press state, an event that turns the smart device on is usually triggered.
  • buttons are usually designed for the above three button states of the button. Therefore, the user can output an interaction reminder to the user during the human-computer interaction between the button and the interactive page; for example, in the most common design, when the button is switched, the Hover state and the Press state can pass. Buttons present different colors to distinguish.
  • the Loading state is usually introduced.
  • the Loading state is used as a state reminder and is usually designed as a loading animation for Characterizing the loading process of the event triggered when the button is switched to the Press state;
  • the button may be a switch button on an APP installed on the terminal for controlling the remote smart device, and when the button is in the Press state (ie, the button is pressed), a button for turning on the smart device is usually triggered.
  • the terminal may send a startup command to the smart device in the background.
  • the smart device starts the device, and returns a response message of successful startup to the terminal after the startup is successful. Therefore, referring to FIG. 1, when the terminal issues the start command, a floating layer can be outputted in the area of the button, and a loading animation as shown in FIG. 1 is played on the floating layer, and the loading animation can be used. To characterize the loading process of the event.
  • the terminal When the smart device is successfully started, the terminal receives the response message of the successful startup returned by the smart device, and the event of the startup terminal is loaded at this time, so the playback animation can be stopped, and the floating layer is hidden, and the button is The area normally displays the button style when in the Press state.
  • the interactive reminder is output to the user, and the interaction is insufficient, especially for the touch screen interface, the user is using the finger and the button.
  • the finger may occlude the button, which may cause the output of the interactive reminder to be unclear and accurate.
  • the loading process of the event triggered when the button is switched to the Press state is represented, because in the implementation, a separate floating layer needs to be output in the area where the button is located for playing the Loading state.
  • the corresponding loading animation will reduce the design carrying capacity per unit area in the interactive interface, and the design space cannot be fully utilized, and the design efficiency is insufficient.
  • the present disclosure provides a button interaction method, by determining whether a button state switch occurs, when a button state transition occurs, a wave pattern is outputted around the button, and an interactive reminder is sent by the wave pattern. Characterizing the loading process of the event triggered by the button state switching; the present disclosure integrates the Hover state, the Press state, and the Loading state of the button, and inherits the button state and the interactive function of loading the animation in the traditional interface interaction design.
  • the traditional button state button style and the loading state of the loading animation are integrated, and the wave pattern distributed around the button is uniformly used to send an interaction reminder to the user and to characterize the loading process of the event triggered by the button state switching,
  • the visual focus and the operation center are ingeniously integrated, which can output clear and accurate interaction reminders to the user during the button interaction process and present the complete interaction process to the user, thereby optimizing the user's interactive experience.
  • FIG. 2 is a method for interacting with a button according to an exemplary embodiment.
  • the method for interacting with a button is used in a terminal, and includes the following steps:
  • step 201 it is determined whether a button state switch occurs.
  • the button state of the button may include the Normal state, the Hover state, and the Press state.
  • different implementation methods may be implemented in different terminal hardware environments. For example, when implemented on a touch screen terminal, the switching of the button state is usually triggered by a user's touch event for the area where the button is located. Therefore, when the button state switching is determined, the touch event for the area where the button is located may be monitored. Realization; when implemented on a PC terminal, the switching of the button state is usually triggered by the user's mouse event for the area where the button is located, so that it can be realized by monitoring the mouse event for the area where the button is located when determining whether the button is toggled. .
  • the button When implemented on the touch screen terminal, the button is switched from the Normal state to the Hover state, and can usually be triggered by a long press operation on the area where the button is located; the button is switched from the Hover state to the Press state, usually in the area where the button is located. Trigger after a long press release.
  • the touch screen terminal can monitor the touch event of the user in the area where the button is located in the background, and determine whether the monitored touch event is a preset event. If it is determined that the touch event is a long press event (the first preset event), the button is triggered to switch from the Normal state to the Hover state, so the touch screen terminal determines that the touch event is a long press event. , you can determine in the background that the button has been switched from the Normal state to the Hover state.
  • the touch screen terminal can continue to monitor the touch event for the button area in the background, and if the button is switched to the Hover state, the touch event for the button area is monitored again. And determining that the touch event is a release event (second preset event), at this time, triggering the button to switch from the Hover state to the Press state, so that the touch screen terminal determines that the touch event is a release event, It can be determined in the background that the button has been switched from the Hover state to the Press state.
  • a release event second preset event
  • the button When implemented on a PC terminal, the button is switched from the Normal state to the Hover state, which can usually be triggered by a mouse hovering over the area where the button is located; the button is switched from the Hover state to the Press state, which can usually be performed in the area where the button is located. Triggered by a mouse click to trigger.
  • the PC terminal can monitor the mouse event of the area where the button is located in the background in real time, and determine whether the monitored mouse event is a preset event. If it is determined that the mouse event is a mouse hovering event (a third preset event), the button is triggered to switch from the Normal state to the Hover state, so the PC terminal determines that the mouse event is a mouse hovering event. After that, it can be determined in the background that the button has been switched from the Normal state to the Hover state.
  • a mouse hovering event a third preset event
  • the PC terminal can continue to monitor the mouse event for the button area in the background, and if the button is switched to the Hover state, the mouse event for the button area is monitored again. And determining that the mouse event is a mouse click event (the fourth preset event), the button is triggered to switch from the Hover state to the Press state, so the PC terminal can determine that the mouse event is a mouse click event. In the background, it is determined that the button has been switched from the Hover state to the Press state.
  • step 202 when the button is toggled, a wave pattern is output around the button;
  • the fluctuation pattern is used to issue an interaction reminder and a loading process that represents an event triggered by the button state switching;
  • the button when the button is toggled, the button may be switched from the Normal state to the Hover state, or may be switched from the Hover state to the Press state. Therefore, in the embodiment, for the purpose of integrating the button state, whether the button is switched from the Normal state to the Hover state or the Hover state to the Press state, a wave pattern can be uniformly outputted around the button for When the button is switched from the Normal state to the Hover state, an interactive reminder is sent to the user; when the button is switched from the Hover state to the Press state, instead of the loading state function, the button triggered by the Hover state to the Press state is triggered. The loading process of the event.
  • the interaction reminder to the user is usually a static process
  • the button when the button is switched from the Normal state to the Hover state, the fluctuation pattern can be statically outputted around the button, so that an interactive reminder can be sent to the user;
  • the loading process of the event triggered when the button is switched from the Hover state to the Press state is usually a dynamic process
  • the button when the button is switched from the Hover state to the Press state, the button can be dynamically outputted around the button according to a preset fluctuation period.
  • the wave pattern is stopped, and after the event triggered by the button being switched from the Hover state to the Press state is completed, the wave pattern is stopped, so that the event can be presented to the user by dynamically outputting the wave pattern.
  • the loading process since the interaction reminder to the user is usually a static process, when the button is switched from the Normal state to the Hover state, the fluctuation pattern can be statically outputted around the button, so that an interactive reminder can be sent to the user;
  • the fluctuation pattern may be a corrugated pattern, and the following is an example in which the wave pattern is a corrugated pattern.
  • the ripple pattern of the surrounding button can be statically outputted around the button, thereby outputting to the user.
  • the user can accurately know that the button has been switched to the Hover state.
  • the pressing pressure of the user for the button region may also be acquired, and then the preset number of the pressing pressure is output according to the magnitude of the pressing pressure.
  • a corrugated pattern wherein, in this case, the number of output ripple patterns may depend on the magnitude of the pressing pressure, and the greater the pressing pressure, the more the number of corrugated patterns that are statically outputted around the button.
  • the button is switched from the Hover state to the Press state, and the button may be used according to a preset diffusion rate.
  • the edge is periodically outwardly diffused around the ripple pattern of the button
  • a ripple source can be set at the edge of the button, and then the terminal can control the ripple source to generate a ripple at a fixed time in the background, and control each ripple to spread outward according to a preset rate; Good interaction effect, the ripple pattern can be gradually attenuated in the process of outward diffusion, and the terminal can control the interface to periodically refresh the interface according to a certain frequency, and recalculate the position and attenuation of the current ripple after each refresh. Degree, then render the ripples onto the interactive interface.
  • the frequency of the interface refreshing interface can be set according to actual needs. For example, a higher refresh frequency can be set during implementation to ensure the rendering effect; the attenuation process of the ripple pattern can be made by using different ripple patterns. Set different shades to indicate the decay process of the ripple pattern.
  • the button when the button is switched to the press state, the button is in the "pressed” state.
  • the button's Press state can be considered as the current Normal state, and the button is in the normal state before the "press", which can be considered as the current Press state.
  • the button is switched from the current Normal state to the Press state, At this time, the button is in the "bounce” state, and the detailed button state switching process is the same as that of the above embodiment, and will not be described again in this embodiment.
  • the button state switching by determining whether the button state switching occurs, when the button is toggled, a wave pattern is outputted around the button, an interaction reminder is sent by the wave pattern, and the button state switching is performed.
  • the loading process of the triggered event the present disclosure integrates the Hover state, the Press state, and the Loading state of the button, and inherits the button state of the traditional interface interaction design and the interactive function of loading the animation, and the traditional button state.
  • the button style and the loading animation of the loading state are integrated, and the wave pattern distributed around the button is used to uniformly send an interactive reminder to the user and characterize the loading process of the event triggered by the button state switching, and the visual focus and the operation center are ingenious. Integration into one, you can output clear and accurate interaction reminders to the user during the button interaction process and present the complete interaction process to the user, thus optimizing the user's interactive experience.
  • FIG. 3 is another button interaction method according to an exemplary embodiment.
  • the method is used in a terminal, where the terminal may be a PC terminal or a touch screen smart terminal, and the method includes the following steps. :
  • step 301 it is determined whether a button state switch occurs.
  • step 302 when the button is switched from the Normal state to the Hover state, the fluctuation pattern is statically outputted around the button to issue an interactive reminder;
  • step 303 when the button is switched from the Hover state to the Press state, the fluctuation pattern is dynamically output around the button according to a preset fluctuation period, and when the button is switched from the Hover state to the Press state. After the triggered event is loaded, the output of the fluctuation pattern is stopped.
  • the button state of the button may include the Normal state, the Hover state, and the Press state.
  • different implementation methods may be implemented in different terminal hardware environments. For example, when implemented on a touch screen terminal, the switching of the button state is usually triggered by a user's touch event for the area where the button is located. Therefore, when the button state switching is determined, the touch event for the area where the button is located may be monitored. Realization; when implemented on a PC terminal, the switching of the button state is usually triggered by the user's mouse event for the area where the button is located, so that it can be realized by monitoring the mouse event for the area where the button is located when determining whether the button is toggled. .
  • the button When implemented on the touch screen terminal, the button is switched from the Normal state to the Hover state, and can usually be triggered by a long press operation on the area where the button is located; the button is switched from the Hover state to the Press state, usually in the area where the button is located. Trigger after a long press release.
  • the touch screen terminal can monitor the touch event of the user in the area where the button is located in the background, and determine whether the monitored touch event is a preset event. If it is determined that the touch event is a long press event (the first preset event), the button is triggered to switch from the Normal state to the Hover state, so the touch screen terminal determines that the touch event is a long press event. , you can determine in the background that the button has been switched from the Normal state to the Hover state.
  • the touch screen terminal can continue to monitor the touch event for the button area in the background, and if the button is switched to the Hover state, the touch event for the button area is monitored again. And determining that the touch event is a release event (second preset event), at this time, triggering the button to switch from the Hover state to the Press state, so that the touch screen terminal determines that the touch event is a release event, It can be determined in the background that the button has been switched from the Hover state to the Press state.
  • a release event second preset event
  • the button When implemented on a PC terminal, the button is switched from the Normal state to the Hover state, which can usually be triggered by a mouse hovering over the area where the button is located; the button is switched from the Hover state to the Press state, which can usually be performed in the area where the button is located. Triggered by a mouse click to trigger.
  • the PC terminal can monitor the mouse event of the area where the button is located in the background in real time, and determine whether the monitored mouse event is a preset event. If it is determined that the mouse event is a mouse hovering event (a third preset event), the button is triggered to switch from the Normal state to the Hover state, so the PC terminal determines that the mouse event is a mouse hovering event. After that, it can be determined in the background that the button has been switched from the Normal state to the Hover state.
  • a mouse hovering event a third preset event
  • the PC terminal can continue to monitor the mouse event for the button area in the background, and if the button is switched to the Hover state, the mouse event for the button area is monitored again. And determining that the mouse event is a mouse click event (the fourth preset event), the button is triggered to switch from the Hover state to the Press state, so the PC terminal can determine that the mouse event is a mouse click event. In the background, it is determined that the button has been switched from the Hover state to the Press state.
  • the button when the button is toggled, the button may be switched from the Normal state to the Hover state, or may be switched from the Hover state to the Press state. Therefore, in the embodiment, for the purpose of integrating the button state, whether the button is switched from the Normal state to the Hover state or the Hover state to the Press state, a wave pattern can be uniformly outputted around the button for When the button is switched from the Normal state to the Hover state, an interactive reminder is sent to the user; when the button is switched from the Hover state to the Press state, instead of the loading state function, the button triggered by the Hover state to the Press state is triggered. The loading process of the event.
  • the interaction reminder to the user is usually a static process
  • the fluctuation pattern can be statically outputted around the button, so that an interactive reminder can be sent to the user
  • the loading process of the event triggered when the button is switched from the Hover state to the Press state is usually a a dynamic process, so that when the button is switched from the Hover state to the Press state, the fluctuation pattern can be dynamically output around the button according to a preset fluctuation period, and triggered when the button is switched from the Hover state to the Press state.
  • the output of the fluctuation pattern is stopped, so that the loading process of the event can be presented to the user by dynamically outputting the fluctuation pattern.
  • the fluctuation pattern may be a corrugated pattern, and the following is an example in which the wave pattern is a corrugated pattern.
  • the ripple pattern of the surrounding button can be statically outputted around the button, thereby outputting to the user.
  • the user can accurately know that the button has been switched to the Hover state.
  • the pressing pressure of the user for the button region may also be acquired, and then the preset number of the pressing pressure is output according to the magnitude of the pressing pressure.
  • a corrugated pattern wherein, in this case, the number of output ripple patterns may depend on the magnitude of the pressing pressure, and the greater the pressing pressure, the more the number of corrugated patterns that are statically outputted around the button.
  • the button is used as an example of a switch button on an APP for controlling a remote smart device installed on a touch screen smart terminal, and is triggered when the user performs a long press operation on the area of the button.
  • the surrounding ripple pattern can be statically outputted around the button to send an interactive reminder to the user.
  • the terminal may also obtain the pressing pressure of the user for the button area, and then output a preset number of corrugated patterns according to the pressing pressure. At this time, the pressing pressure is larger, and the ripple is statically outputted around the button. The number of graphics is more.
  • the corrugated pattern is outputted around the button, when the user presses the button with a finger, the interactive reminder sent after the button state is switched is not blocked, and the presentation mode is more intuitive, so that the user can Get clear and accurate interactive reminders.
  • the button is switched from the Hover state to the Press state, and the button may be used according to a preset diffusion rate.
  • the edges are periodically outwardly diffused around the ripple pattern of the button.
  • a ripple source can be set at the edge of the button, and then the terminal can control the ripple source to generate a ripple at a fixed time in the background, and control each ripple to spread outward according to a preset rate; Good interaction effect, the ripple pattern can be gradually attenuated in the process of outward diffusion, and the terminal can control the interface to periodically refresh the interface according to a certain frequency, and recalculate the position and attenuation of the current ripple after each refresh. Degree, then render the ripples onto the interactive interface.
  • the frequency of the interface refreshing interface can be set according to actual needs. For example, a higher refresh frequency can be set during implementation to ensure the rendering effect; the attenuation process of the ripple pattern can be made by using different ripple patterns. Set different shades to indicate the decay process of the ripple pattern.
  • the button is still used as an example of a switch button on an APP for controlling a remote smart device installed on a touch screen smart terminal, and when the user performs a long press on the button, After the button is switched from the Hover state to the Press state, an event that the smart device is turned on is usually triggered. After the event is triggered, the terminal may send a startup command to the smart device in the background, and the smart device receives the startup command. After that, the device is started, and after the startup is successful, a response message indicating that the startup is successful is returned to the terminal. Therefore, referring to FIG.
  • the terminal may periodically diffuse outwardly from the edge of the button according to a preset diffusion rate to gradually attenuate the ripple pattern around the button. Since the diffusion process of the ripple pattern is completely synchronized with the loading process of the event, the user can synchronously understand the complete loading process of the event by viewing the animation effect displayed during the dynamic output of the ripple pattern. Compared with the existing implementation, since the corrugated pattern is outputted around the button and completely replaces the function of the loading state, it is not necessary to introduce a separate floating layer for playing the loading animation corresponding to the Loading state, so that the interactive interface can be effectively improved.
  • the design bearing capacity per unit area makes full use of the design space to improve design efficiency.
  • the button when the button is switched to the press state, the button is in the "pressed” state.
  • the button's Press state can be considered as the current Normal state, and the button is in the normal state before the "press", which can be considered as the current Press state.
  • the button is switched from the current Normal state to the Press state, At this time, the button is in the "bounce” state, and the detailed button state switching process is the same as that of the above embodiment, and will not be described again in this embodiment.
  • the button state switching by determining whether the button state switching occurs, when the button is toggled, a wave pattern is outputted around the button, an interaction reminder is sent by the wave pattern, and the button state switching is performed.
  • the loading process of the triggered event the present disclosure integrates the Hover state, the Press state, and the Loading state of the button, and inherits the button state of the traditional interface interaction design and the interactive function of loading the animation, and the traditional button state.
  • the button style and the loading animation of the loading state are integrated, and the wave pattern distributed around the button is used to uniformly send an interactive reminder to the user and characterize the loading process of the event triggered by the button state switching, and the visual focus and the operation center are ingenious. Integration into one, you can output clear and accurate interaction reminders to the user during the button interaction process and present the complete interaction process to the user, thus optimizing the user's interactive experience.
  • the present disclosure also provides an embodiment of a device.
  • FIG. 6 is a schematic block diagram of a button interaction apparatus according to an exemplary embodiment.
  • a button interaction apparatus 600 includes: a determination module 601 and an output module 602; wherein:
  • the determining module 601 is configured to determine whether a button state switch occurs on the button;
  • the output module 602 is configured to output a wave pattern around the button when the button is toggled; wherein the wave pattern is used to issue an interaction reminder and to characterize an event triggered by the button state switch Load the process.
  • the wave pattern is outputted around the button, and the wave pattern is used to issue an interactive reminder and a representation.
  • the button state switches the loading process of the event triggered by the button state; the disclosure integrates the Hover state, the Press state, and the Loading state of the button, and inherits the premise of the button state and the interactive function of loading the animation in the traditional interface interaction design.
  • the traditional button state of the button style and the loading state of the loading animation are integrated, uniformly using the wave pattern distributed around the button to send an interactive reminder to the user and characterizing the loading process of the event triggered by the button state switching, the vision
  • the focus and operation center are ingeniously integrated, which can output clear and accurate interaction reminders to the user during the button interaction process and present the complete interaction process to the user, thus optimizing the user's interactive experience.
  • FIG. 7 is a block diagram of another apparatus according to an exemplary embodiment of the present disclosure.
  • the determining module 601 may include a first monitoring. a submodule 601A, a first judging submodule 601B, a first determining submodule 601C, and a second determining submodule 601D; wherein:
  • the first snoop submodule 601A is configured to listen to a touch event for the button area
  • the first determining sub-module 601B is configured to determine whether the touch event is a first preset event
  • the first determining sub-module 601C is configured to: when the first determining sub-module determines that the touch event is the first preset event, determine that the button is switched from the Normal state to the Hover state;
  • the second determining sub-module 601D is configured to: after the button is switched to the Hover state, the first listening sub-module again listens to the touch event for the button area, and the first determining sub-module determines the touch event When it is the second preset event, it is determined that the button is switched from the Hover state to the Press state.
  • FIG. 8 is a block diagram of another apparatus according to an exemplary embodiment of the present disclosure.
  • the determining module 601 may further include a second a monitoring submodule 601E, a second determining submodule 601F, a third determining submodule 601G, and a fourth determining submodule 601G; wherein:
  • the second snoop submodule 601E is configured to listen to a mouse event for the button area
  • the second determining sub-module 601F is configured to determine whether the mouse event is a third preset event
  • the third determining sub-module 601G is configured to: when the mouse event is the third preset event, determine that the button is switched from the Normal state to the Hover state;
  • the fourth determining sub-module 601G is configured to, after the button is switched to the Hover state, the second listening sub-module again listens to the mouse event for the button area, and the second determining sub-module determines the mouse event.
  • the fourth preset event it is determined that the button is switched from the Hover state to the Press state.
  • the structures of the second monitoring submodule 601E, the second determining submodule 601F, the third determining submodule 601G, and the fourth determining submodule 601G shown in the foregoing apparatus embodiment shown in FIG. 8 may also include In the foregoing In the device embodiment of FIG. 7, the present disclosure is not limited thereto.
  • FIG. 9 is a block diagram of another apparatus according to an exemplary embodiment of the present disclosure.
  • the embodiment may further include the first output module 602 according to the foregoing embodiment shown in FIG. 6 .
  • the first output sub-module 602A is configured to statically output the fluctuation pattern around the button to issue an interaction reminder when the button is switched from the Normal state to the Hover state;
  • the second output sub-module 602B is configured to dynamically output the fluctuation pattern around the button according to a preset fluctuation period when the button is switched from the Hover state to the Press state, and the button is by Hover After the event triggered by the state switching to the Press state is completed, the output of the fluctuation pattern is stopped;
  • first output sub-module 602A and the second output sub-module 602B shown in the device embodiment shown in FIG. 9 above may also be included in the foregoing device embodiments of FIG. 7-8.
  • the disclosure is not limited.
  • FIG. 10 is a block diagram of another apparatus according to an exemplary embodiment of the present disclosure.
  • the first output sub-module 602A may include an acquisition sub-unit 602A1 and an output sub-unit 602A2; wherein:
  • the obtaining sub-unit 602A1 is configured to acquire a pressing pressure of the user for the button area
  • the output sub-unit 602A2 is configured to statically output a preset number of corrugated patterns around the button according to the magnitude of the pressing pressure; wherein the pressing pressure is larger, the strip of the corrugated pattern statically outputted around the button The more the number;
  • FIG. 11 is a block diagram of another apparatus according to an exemplary embodiment of the present disclosure. The embodiment is based on the embodiment shown in FIG. 9 , when the wave pattern is a ripple pattern.
  • the second output sub-module 602B may include a setting sub-unit 602B1 and a control sub-unit 602B2; wherein:
  • the setting subunit 602B1 is configured to set a ripple source at the edge of the button
  • the control sub-unit 602B2 is configured to control a ripple pattern in which the ripple source is gradually attenuated by a periodic diffusion according to a preset diffusion rate;
  • the device embodiment since it basically corresponds to the method embodiment, reference may be made to the partial description of the method embodiment.
  • the device embodiments described above are merely illustrative, wherein the description as separate components
  • the modules or units may or may not be physically separate.
  • the components displayed as modules or units may or may not be physical modules or units, ie may be located in one place, or may be distributed to multiple network modules or units. on. Some or all of the modules or units may be selected according to actual needs to achieve the objectives of the disclosed embodiments. Those of ordinary skill in the art can understand and implement without any creative effort.
  • the present disclosure further provides a button interaction device, the device comprising:
  • a memory for storing processor executable instructions
  • processor is configured to:
  • a wave pattern is output around the button; wherein the wave pattern is used to issue an interaction reminder and a loading process that characterizes an event triggered by the button state switch.
  • the present disclosure also provides a terminal, the terminal including a memory, and one or more programs, wherein one or more programs are stored in the memory and configured to be executed by one or more processors
  • the one or more programs include instructions for performing the following operations:
  • a wave pattern is output around the button; wherein the wave pattern is used to issue an interaction reminder and a loading process that characterizes an event triggered by the button state switch.
  • FIG. 12 is a schematic structural diagram of a button interaction apparatus according to an exemplary embodiment.
  • a button interaction device 1200 is shown in accordance with an exemplary embodiment.
  • the device 1200 can be a mobile terminal, a mobile phone, a computer, a digital broadcast terminal, a messaging device, a game console, a tablet device, and a medical device. Equipment, fitness equipment, personal digital assistants, etc.
  • apparatus 1200 can include one or more of the following components: processing component 1201, memory 1202, power component 1203, multimedia component 1204, audio component 1205, input/output (I/O) interface 1206, sensor component 1207, And a communication component 1208.
  • Processing component 1201 typically controls the overall operation of device 1200, such as operations associated with display, telephone calls, data communications, camera operations, and recording operations.
  • Processing component 1201 may include one or more processors 1209 to execute instructions to perform all or part of the steps of the above described methods.
  • processing component 1201 can include one or more modules to facilitate interaction between component 1201 and other components.
  • processing component 1201 can include a multimedia module to facilitate interaction between multimedia component 1204 and processing component 1201.
  • Memory 1202 is configured to store various types of data to support operation at device 1200. Examples of such data include instructions for any application or method operating on device 1200, contact data, phone book data, messages, pictures, videos, and the like.
  • the memory 1202 can be any type of volatile or non-volatile storage device or it Their combined implementations, such as static random access memory (SRAM), electrically erasable programmable read only memory (EEPROM), erasable programmable read only memory (EPROM), programmable read only memory (PROM), Read memory (ROM), magnetic memory, flash memory, disk or optical disk.
  • SRAM static random access memory
  • EEPROM electrically erasable programmable read only memory
  • EPROM erasable programmable read only memory
  • PROM programmable read only memory
  • ROM Read memory
  • magnetic memory magnetic memory
  • flash memory disk or optical disk.
  • Power component 1203 provides power to various components of device 1200.
  • Power component 1203 can include a power management system, one or more power sources, and other components associated with generating, managing, and distributing power for device 1200.
  • the multimedia component 1204 includes a screen between the device 1200 and the user that provides an output interface.
  • the screen can include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen can be implemented as a touch screen to receive input signals from the user.
  • the touch panel includes one or more touch sensors to sense touches, slides, and gestures on the touch panel. The touch sensor may sense not only the boundary of the touch or sliding action, but also the duration and pressure associated with the touch or slide operation.
  • the multimedia component 1204 includes a front camera and/or a rear camera. When the device 1200 is in an operation mode, such as a shooting mode or a video mode, the front camera and/or the rear camera can receive external multimedia data. Each front and rear camera can be a fixed optical lens system or have focal length and optical zoom capabilities.
  • the audio component 1205 is configured to output and/or input an audio signal.
  • the audio component 1205 includes a microphone (MIC) that is configured to receive an external audio signal when the device 1200 is in an operational mode, such as a call mode, a recording mode, and a voice recognition mode.
  • the received audio signal may be further stored in memory 1202 or transmitted via communication component 1208.
  • the audio component 1205 also includes a speaker for outputting an audio signal.
  • the I/O interface 1202 provides an interface between the processing component 1201 and the peripheral interface module, which may be a keyboard, a click wheel, a button, or the like. These buttons may include, but are not limited to, a home button, a volume button, a start button, and a lock button.
  • Sensor assembly 1207 includes one or more sensors for providing status assessment of various aspects to device 1200.
  • sensor assembly 1207 can detect an open/closed state of device 1200, relative positioning of components, such as the display and keypad of device 1200, and sensor component 1207 can also detect a change in position of one component of device 1200 or device 1200. The presence or absence of contact by the user with the device 1200, the orientation or acceleration/deceleration of the device 1200 and the temperature change of the device 1200.
  • Sensor assembly 1207 can include a proximity sensor configured to detect the presence of nearby objects without any physical contact.
  • Sensor assembly 1207 can also include a light sensor, such as a CMOS or CCD image sensor, for use in imaging applications.
  • the sensor assembly 1207 can also include an acceleration sensor, a gyro sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.
  • Communication component 1208 is configured to facilitate wired or wireless communication between device 1200 and other devices.
  • the device 1200 can access a wireless network based on a communication standard, such as WiFi, 2G or 3G, or a combination thereof.
  • communication component 1208 receives broadcast signals or broadcast associated information from an external broadcast management system via a broadcast channel.
  • the communication component 1208 also includes a near field communication (NFC) module to facilitate short range communication.
  • NFC near field communication
  • the NFC module can be implemented based on radio frequency identification (RFID) technology, infrared data association (IrDA) technology, ultra-wideband (UWB) technology, Bluetooth (BT) technology, and other technologies.
  • RFID radio frequency identification
  • IrDA infrared data association
  • UWB ultra-wideband
  • Bluetooth Bluetooth
  • device 1200 may be implemented by one or more application specific integrated circuits (ASICs), digital signal processors (DSPs), digital signal processing devices (DSPDs), programmable logic devices (PLDs), field programmable A gate array (FPGA), controller, microcontroller, microprocessor, or other electronic component implementation for performing the above methods.
  • ASICs application specific integrated circuits
  • DSPs digital signal processors
  • DSPDs digital signal processing devices
  • PLDs programmable logic devices
  • FPGA field programmable A gate array
  • controller microcontroller, microprocessor, or other electronic component implementation for performing the above methods.
  • non-transitory computer readable storage medium comprising instructions, such as a memory 1202 comprising instructions executable by processor 1209 of apparatus 1200 to perform the above method.
  • the non-transitory computer readable storage medium may be a ROM, a random access memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, and an optical data storage device.
  • enabling the mobile terminal to perform a button interaction method including:
  • a wave pattern is output around the button; wherein the wave pattern is used to issue an interaction reminder and a loading process that characterizes an event triggered by the button state switch.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • User Interface Of Digital Computer (AREA)
  • Input From Keyboards Or The Like (AREA)
  • Position Input By Displaying (AREA)

Abstract

本公开提出一种按钮交互方法,所述方法包括:判断按钮是否发生按钮态切换;当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。本公开在按钮交互过程中可以为用户输出清晰准确的交互提醒以及呈现完整的交互进程,从而优化了用户的交互体验。

Description

按钮交互方法和装置
本申请基于申请号为201510036107.6、申请日为2015/1/23的中国专利申请提出,并要求该中国专利申请的优先权,该中国专利申请的全部内容在此引入本申请作为参考。
技术领域
本公开涉及通讯领域,尤其涉及按钮交互方法和装置。
背景技术
按钮交互,是指在交互界面上设置一个按钮,用户通过鼠标点击按钮或者用手触摸按钮,可触发对应的人机交互响应。目前,在网页设计以及APP开发领域,按钮交互的应用非常广泛。在网页设计或者APP开发的过程中,通过按钮交互可以实时、多样化的实现人机交互功能,使用起来很方便,而且可以使得整个交互过程更加的形象直观。
然而,随着互联网领域的不断发展,对于人机交互的多样性提出了更高的要求,因此如何来提高按钮交互过程中的交互效率以及交互体验,已经成为目前业界关注的焦点。
发明内容
为克服相关技术中存在的问题,本公开提供一种按钮交互方法和装置。
根据本公开实施例的第一方面,提供一种按钮交互方法,所述方法包括:
判断按钮是否发生按钮态切换;
当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
可选的,所述判断按钮是否发生按钮态切换包括:
监听针对所述按钮区域的触摸事件;
判断所述触摸事件是否为第一预设事件;
当所述触摸事件为所述第一预设事件时,确定所述按钮由Normal态切换为Hover态;
当所述按钮切换为Hover态后,再次监听到针对所述按钮区域的触摸事件,并且判断出该触摸事件为第二预设事件时,确定所述按钮由Hover态切换为Press态。
可选的,所述判断按钮是否发生按钮态切换包括:
监听针对所述按钮区域的鼠标事件;
判断所述鼠标事件是否为第三预设事件;
当所述鼠标事件为所述第三预设事件时,确定所述按钮由Normal态切换为Hover态;
当所述按钮切换为Hover态后,再次监听到针对所述按钮区域的鼠标事件,并且判断出该鼠标事件为第四预设事件时,确定所述按钮由Hover态切换为Press态。
可选的,所述第一预设事件为长按事件;所述第二预设事件为松开事件;所述第三预设事件为鼠标悬停事件;所述第四预设事件为鼠标点击事件。
可选的,所述当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形包括:
当所述按钮由Normal态切换为Hover态时,在所述按钮周围静态输出所述波动图形,以发出交互提醒;
当所述按钮由Hover态切换为Press态时,按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形。
可选的,所述波动图形为波纹图形时,所述在所述按钮周围静态输出所述波动图形包括:
获取用户针对所述按钮区域的按压压力;
根据所述按压压力的大小在所述按钮周围静态输出预设数量的波纹图形;其中所述按压压力越大在所述按钮周围静态输出的波纹图形的条数越多。
可选的,所述波动图形为波纹图形时,所述按照预设的波动周期在所述按钮周围动态输出所述波动图形包括:
在所述按钮边缘设定波纹源;
控制所述波纹源按照预设的扩散速率向外周期性的扩散逐渐衰减的波纹图形。
根据本公开实施例的第二方面,提供一种按钮交互装置,所述装置包括
判断模块,用于判断按钮是否发生按钮态切换;
输出模块,用于在所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
可选的,所述判断模块包括:
第一监听子模块,用于监听针对所述按钮区域的触摸事件;
第一判断子模块,用于判断所述触摸事件是否为第一预设事件;
第一确定子模块,用于在第一判断子模块判断出所述触摸事件为所述第一预设事件时,确定所述按钮由Normal态切换为Hover态;
第二确定子模块,用于在所述按钮切换为Hover态后,第一监听子模块再次监听到针对所述按钮区域的触摸事件,并且第一判断子模块判断出该触摸事件为第二预设事件时,确定所述按钮由Hover态切换为Press态。
可选的,所述判断模块包括:
第二监听子模块,用于监听针对所述按钮区域的鼠标事件;
第二判断子模块,用于判断所述鼠标事件是否为第三预设事件;
第三确定子模块,用于在所述鼠标事件为所述第三预设事件时,确定所述按钮由Normal态切换为Hover态;
第四确定子模块,用于在所述按钮切换为Hover态后,第二监听子模块再次监听到针 对所述按钮区域的鼠标事件,并且第二判断子模块判断出该鼠标事件为第四预设事件时,确定所述按钮由Hover态切换为Press态。
可选的,所述第一预设事件为长按事件;所述第二预设事件为松开事件;所述第三预设事件为鼠标悬停事件;所述第四预设事件为鼠标点击事件。
可选的,所述输出模块包括:
第一输出子模块,用于在所述按钮由Normal态切换为Hover态时,在所述按钮周围静态输出所述波动图形,以发出交互提醒;
第二输出子模块,用于在所述按钮由Hover态切换为Press态时,按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形。
可选的,所述波动图形为波纹图形时,所述第一输出子模块包括:
获取子单元,用于获取用户针对所述按钮区域的按压压力;
输出子单元,用于根据所述按压压力的大小在所述按钮周围静态输出预设数量的波纹图形;其中所述按压压力越大在所述按钮周围静态输出的波纹图形的条数越多。
可选的,所述波动图形为波纹图形时,所述第二输出子模块包括:
设定子单元,用于在所述按钮边缘设定波纹源;
控制子单元,用于控制所述波纹源按照预设的扩散速率向外周期性的扩散逐渐衰减的波纹图形。
根据本公开实施例的第三方面,提供一种按钮交互装置,包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为:
判断按钮是否发生按钮态切换;
当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
本公开的实施例提供的技术方案可以包括以下有益效果:
本公开的以上实施例中,通过判断按钮是否发生按钮态切换,当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;由于所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程,因此在按钮交互过程中可以为用户输出清晰准确的交互提醒以及呈现完整的交互进程,从而优化了用户的交互体验。
应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例, 并与说明书一起用于解释本公开的原理。
图1是根据一示例性实施例示出的传统的交互界面示意图;
图2是根据一示例性实施例示出的一种按钮交互方法的流程示意图;
图3是根据一示例性实施例示出的另一种按钮交互方法的流程示意图;
图4是根据一示例性实施例示出的一种交互界面的示意图;
图5是根据一示例性实施例示出的另一种交互界面的示意图;
图6是根据一示例性实施例示出的一种按钮交互装置的示意框图;
图7是根据一示例性实施例示出的另一种按钮交互装置的示意框图;
图8是根据一示例性实施例示出的另一种按钮交互装置的示意框图;
图9是根据一示例性实施例示出的另一种按钮交互装置的示意框图;
图10是根据一示例性实施例示出的另一种按钮交互装置的示意框图;
图11是根据一示例性实施例示出的另一种按钮交互装置的示意框图;
图12是根据一示例性实施例示出的一种用于所述按钮交互装置的一结构示意图。
具体实施方式
这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。
在本公开使用的术语是仅仅出于描述特定实施例的目的,而非旨在限制本公开。在本公开和所附权利要求书中所使用的单数形式的“一种”、“所述”和“该”也旨在包括多数形式,除非上下文清楚地表示其他含义。还应当理解,本文中使用的术语“和/或”是指并包含一个或多个相关联的列出项目的任何或所有可能组合。
应当理解,尽管在本公开可能采用术语第一、第二、第三等来描述各种信息,但这些信息不应限于这些术语。这些术语仅用来将同一类型的信息彼此区分开。例如,在不脱离本公开范围的情况下,第一信息也可以被称为第二信息,类似地,第二信息也可以被称为第一信息。取决于语境,如在此所使用的词语“如果”可以被解释成为“在……时”或“当……时”或“响应于确定”。
在传统的按钮交互过程中,按钮通常具有Normal态、Hover态以及Press态三种状态;其中,Normal态是指按钮的默认外观或者静止时的外观;Hover态是指将鼠标移动到按钮上或者移出按钮时,按钮呈现出的一种悬停的状态,Hover态通常可以理解为一种中间状态,该状态通常用于提醒用户点击该按钮会触发一个事件;Press态是指按钮按下去的状态,当按钮处于Press态时,通常会触发一个事件;例如,以智能设备的开关按钮为例,当开关按钮处于Press态时,通常会触发一个将所述智能设备开启的事件。
在传统的界面交互设计中,通常会为按钮的以上三种按钮态分别设计不同的按钮样 式,从而用户在通过按钮与交互页面进行人机交互的过程中,可以向用户输出交互提醒;例如,在最常见的设计中,按钮在进行按钮态的切换时,Hover态和Press态可以通过按钮呈现不同的颜色来区分。
除此之外,在传统的界面交互设计中,除了以上三种按钮态以外,通常还会引入Loading态,所述Loading态作为一种状态提醒,通常会被设计为一种加载动画,用于表征按钮切换到Press态时所触发的事件的加载进程;
例如,所述按钮可以是终端上安装的用于控制远程智能设备的APP上的开关按钮,当所述按钮处于Press态后(即将按钮按下),通常会触发一个将所述智能设备开启的事件,该事件被触发后,终端可以在后台向智能设备发送一个启动指令,智能设备收到该启动指令后,启动设备,并在启动成功后向终端返回一个启动成功的响应消息。因此,请参见图1,当终端在发出所述启动指令后,可以在所述按钮的区域输出一个浮层,并在浮层上播放如图1所示出的加载动画,该加载动画可以用来表征所述事件的加载进程。当智能设备启动成功,终端在收到智能设备返回的启动成功的响应消息时,此时启动终端的事件加载完毕,因此可以停止播放所述加载动画,并隐藏浮层,此时所述按钮的区域正常显示处于Press态时的按钮样式。
通过以上描述可知,在传统的界面交互设计中至少存在以下缺陷:
一方面,传统的设计中,通过为不同的按钮态设计不同的按钮样式(例如用颜色来区分)来向用户输出交互提醒,交互性不足,尤其对于触屏界面中,用户在使用手指与按钮进行交互过程中,手指可能对按钮造成遮挡,可能会造成交互提醒输出不清晰准确的问题。
另一方面,传统的设计中,通过引入Loading态,来表征按钮切换到Press态时所触发的事件的加载进程,由于在实现时需要在按钮所在区域输出一个独立的浮层用于播放Loading态对应的加载动画,因此会使交互界面中单位面积的设计承载能力下降,无法充分的利用设计空间,设计效率不足。
有鉴于此,本公开提出一种按钮交互方法,通过判断按钮是否发生按钮态切换,当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形,由所述波动图形发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程;本公开对按钮的Hover态、Press态、Loading态进行了整合设计,在继承了传统界面交互设计中的按钮态和加载动画的交互功能的前提下,对传统按钮态的按钮样式和Loading态的加载动画进行了整合,统一使用分布在按钮周围的波动图形向用户发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程,将视觉焦点和操作中心巧妙的融为一体,可以在按钮交互过程中向用户输出清晰准确的交互提醒以及向用户呈现完整的交互进程,从而优化了用户的交互体验。
如图2所示,图2是根据一示例性实施例示出的一种按钮交互方法,该按钮交互方法用于终端中,包括以下步骤:
在步骤201中,判断按钮是否发生按钮态切换;
在本实施例中,所述按钮的按钮态可以包括Normal态、Hover态和Press态三种,在判断按钮是否发生按钮态切换时,在不同的终端硬件环境下可以有不同的实现方法。例如,在触屏终端上实现时,按钮态的切换通常是由用户针对按钮所在区域的触摸事件触发的,因此判断按钮是否发生按钮态切换时可以通过监听针对所述按钮所在区域的触摸事件来实现;在PC终端上实现时,按钮态的切换通常是由用户针对按钮所在区域的鼠标事件触发的,因此判断按钮是否发生按钮态切换时可以通过监听针对所述按钮所在区域的鼠标事件来实现。
以下结合上述两种不同的终端硬件环境分别进行描述。
在触屏终端上实现时,按钮由Normal态切换至Hover态,通常可以通过对该按钮所在区域进行长按操作来触发;按钮由Hover态切换至Press态,通常可以是在对该按钮所在区域进行长按后的松开操作来触发。
因此,触屏终端在判断按钮是否发生了按钮态切换时,可以在后台实时的监听用户针对所述按钮所在区域的触摸事件,并判断监听到的触摸事件是否为预设事件来实现。如果判断出所述触摸事件为长按事件(第一预设事件)时,此时会触发将按钮由Normal态切换至Hover态,因此触屏终端在判断出所述触摸事件为长按事件后,可以在后台确定按钮当前已由Normal态切换至Hover态。
当所述按钮切换为Hover态后,触屏终端可以继续在后台监听到针对所述按钮区域的触摸事件,如果在所述按钮切换为Hover态后,再次监听到针对所述按钮区域的触摸事件,并且判断出该触摸事件为松开事件(第二预设事件)时,此时会触发将按钮由Hover态切换至Press态,因此触屏终端在判断出所述触摸事件为松开事件,可以在后台确定按钮当前已由Hover态切换至Press态。
在PC终端上实现时,按钮由Normal态切换至Hover态,通常可以通过对该按钮所在区域进行鼠标悬停来触发;按钮由Hover态切换至Press态,通常可以是在对该按钮所在区域进行鼠标悬停后的点击操作来触发。
因此,PC终端在判断按钮是否发生了按钮态切换时,可以在后台实时的监听用户针对所述按钮所在区域的鼠标事件,并判断监听到的鼠标事件是否为预设事件来实现。如果判断出所述鼠标事件为鼠标悬停事件(第三预设事件)时,此时会触发将按钮由Normal态切换至Hover态,因此PC终端在判断出所述鼠标事件为鼠标悬停事件后,可以在后台确定按钮当前已由Normal态切换至Hover态。
当所述按钮切换为Hover态后,PC终端可以继续在后台监听到针对所述按钮区域的鼠标事件,如果在所述按钮切换为Hover态后,再次监听到针对所述按钮区域的鼠标事件,并且判断出该鼠标事件为鼠标点击事件(第四预设事件)时,此时会触发将按钮由Hover态切换至Press态,因此PC终端在判断出所述鼠标事件为鼠标点击事件时,可以在后台确定按钮当前已由Hover态切换至Press态。
在步骤202中,当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中 所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程;
在本实施例中,按钮发生按钮态切换时,可以是由Normal态切换至Hover态,也可以是由Hover态切换至Press态。因此,在本实施例中,出于对按钮态进行整合的目的,按钮无论是由Normal态切换至Hover态,还是由Hover态切换至Press态,可以统一在按钮周围输出一个波动图形,用以在按钮由Normal态切换至Hover态时,向用户发出交互提醒;用以在按钮由Hover态切换至Press态时,替代Loading态的功能,来表征按钮由Hover态切换至Press态时所触发的事件的加载进程。
在实现时,由于向用户发出交互提醒通常是一个静态的过程,因此当按钮由Normal态切换为Hover态时,可以在按钮周围静态输出所述波动图形,从而可以向用户发出交互提醒;另外,由于按钮由Hover态切换至Press态时所触发的事件的加载进程通常是一个动态的过程,因此当按钮由Hover态切换至Press态时,可以按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形,从而可以通过动态输出所述波动图形来向用户呈现所述事件完整的加载进程。
其中,在实现时,所述波动图形,可以是波纹图形,以下以所述波动图形为波纹图形为例进行说明。
在本实施例中,当用户通过对所述按钮进行长按操作或者鼠标悬浮操作,将按钮由Normal态切换为Hover态后,可以在按钮周围静态输出环绕按钮的波纹图样,从而达到向用户输出交互提醒的目的,用户在收到该交互提醒后,可以准确获知到所述按钮当前已经切换到了Hover态。另外,为了增强提醒效果,对于通过长按操作来触发将按钮由Normal态切换为Hover态的情况,还可以获取用户针对所述按钮区域的按压压力,然后根据按压压力的大小输出预设数量的波纹图形;其中,在这种情况下,输出波纹图形的条数可以取决于按压压力的大小,按压压力越大,则在按钮周围静态输出的波纹图形的条数则越多。
在本实施例中,当用户通过对所述按钮进行长按操作后的松开操作或者鼠标点击操作,将按钮由Hover态切换为Press态后,可以按照预设的扩散速率由所述按钮的边缘向外周期性的扩散围绕所述按钮的波纹图形
在实现时,可以在按钮边缘设定一个波纹源,然后终端可以在后台控制波纹源每隔一个固定的时间生成一个波纹,并控制每个波纹按照预设的速率向外扩散;同时为了达到很好的交互效果,所述波纹图形在向外扩散的过程中还可以逐渐进行衰减,终端可以控制交互界面按照一定频率周期性的对界面进行刷新,每次刷新后重新计算当前波纹的位置以及衰减程度,然后将波纹渲染到交互界面上。其中交互界面对界面刷新的频率,可以根据实际需求进行设置,例如,在实现时可以设置一个较高的刷新频率,从而保证渲染效果;所述波纹图形的衰减过程,可以通过为不同的波纹图形设置不同的明暗程度来表示波纹图形的衰减过程。
在本实施例中,当按钮由Hover态切换为Press态所触发的事件加载完成后,此时可 以同步的停止向外周期性的扩散围绕所述按钮的波纹图形,从而可以将动态输出所述波动图形的过程与所述事件的加载过程完整的关联起来,通过动态输出所述波动图形就可以向用户同步的呈现所述事件完整的加载过程。
值得说明的是,当按钮切换为press态后,此时按钮处于“按下”状态,当用户需要将“按下”的按钮恢复为弹起的状态时,用户可以重新通过对该按钮所在区域进行指定的触摸操作或者鼠标操作完成按钮态的切换。在这种情况下,按钮的Press态可以认为是当前的Normal态,按钮在“按下”以前的Normal态,可以认为是当前的Press态,当按钮由当前的Normal态切换至Press态时,此时按钮处于“弹起”状态,其中详细的按钮态切换过程与以上实施例的描述相同,在本实施例中不再赘述。
在以上实施例中,通过判断按钮是否发生按钮态切换,当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形,由所述波动图形发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程;本公开对按钮的Hover态、Press态、Loading态进行了整合设计,在继承了传统界面交互设计中的按钮态和加载动画的交互功能的前提下,对传统按钮态的按钮样式和Loading态的加载动画进行了整合,统一使用分布在按钮周围的波动图形向用户发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程,将视觉焦点和操作中心巧妙的融为一体,可以在按钮交互过程中向用户输出清晰准确的交互提醒以及向用户呈现完整的交互进程,从而优化了用户的交互体验。
如图3所示,图3是根据一示例性实施例示出的另一种按钮交互方法,该方法用于终端中,所述终端可以是PC终端或者触屏智能终端,所述方法包括以下步骤:
在步骤301中,判断按钮是否发生按钮态切换;
在步骤302中,当所述按钮由Normal态切换为Hover态时,在所述按钮周围静态输出所述波动图形,以发出交互提醒;
在步骤303中,当所述按钮由Hover态切换为Press态时,按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形。
值得说明的是,以上步骤302和步骤303顺序可以互换。
在本实施例中,所述按钮的按钮态可以包括Normal态、Hover态和Press态三种,在判断按钮是否发生按钮态切换时,在不同的终端硬件环境下可以有不同的实现方法。例如,在触屏终端上实现时,按钮态的切换通常是由用户针对按钮所在区域的触摸事件触发的,因此判断按钮是否发生按钮态切换时可以通过监听针对所述按钮所在区域的触摸事件来实现;在PC终端上实现时,按钮态的切换通常是由用户针对按钮所在区域的鼠标事件触发的,因此判断按钮是否发生按钮态切换时可以通过监听针对所述按钮所在区域的鼠标事件来实现。
以下结合上述两种不同的终端硬件环境分别进行描述。
在触屏终端上实现时,按钮由Normal态切换至Hover态,通常可以通过对该按钮所在区域进行长按操作来触发;按钮由Hover态切换至Press态,通常可以是在对该按钮所在区域进行长按后的松开操作来触发。
因此,触屏终端在判断按钮是否发生了按钮态切换时,可以在后台实时的监听用户针对所述按钮所在区域的触摸事件,并判断监听到的触摸事件是否为预设事件来实现。如果判断出所述触摸事件为长按事件(第一预设事件)时,此时会触发将按钮由Normal态切换至Hover态,因此触屏终端在判断出所述触摸事件为长按事件后,可以在后台确定按钮当前已由Normal态切换至Hover态。
当所述按钮切换为Hover态后,触屏终端可以继续在后台监听到针对所述按钮区域的触摸事件,如果在所述按钮切换为Hover态后,再次监听到针对所述按钮区域的触摸事件,并且判断出该触摸事件为松开事件(第二预设事件)时,此时会触发将按钮由Hover态切换至Press态,因此触屏终端在判断出所述触摸事件为松开事件,可以在后台确定按钮当前已由Hover态切换至Press态。
在PC终端上实现时,按钮由Normal态切换至Hover态,通常可以通过对该按钮所在区域进行鼠标悬停来触发;按钮由Hover态切换至Press态,通常可以是在对该按钮所在区域进行鼠标悬停后的点击操作来触发。
因此,PC终端在判断按钮是否发生了按钮态切换时,可以在后台实时的监听用户针对所述按钮所在区域的鼠标事件,并判断监听到的鼠标事件是否为预设事件来实现。如果判断出所述鼠标事件为鼠标悬停事件(第三预设事件)时,此时会触发将按钮由Normal态切换至Hover态,因此PC终端在判断出所述鼠标事件为鼠标悬停事件后,可以在后台确定按钮当前已由Normal态切换至Hover态。
当所述按钮切换为Hover态后,PC终端可以继续在后台监听到针对所述按钮区域的鼠标事件,如果在所述按钮切换为Hover态后,再次监听到针对所述按钮区域的鼠标事件,并且判断出该鼠标事件为鼠标点击事件(第四预设事件)时,此时会触发将按钮由Hover态切换至Press态,因此PC终端在判断出所述鼠标事件为鼠标点击事件时,可以在后台确定按钮当前已由Hover态切换至Press态。
如上所述,按钮发生按钮态切换时,可以是由Normal态切换至Hover态,也可以是由Hover态切换至Press态。因此,在本实施例中,出于对按钮态进行整合的目的,按钮无论是由Normal态切换至Hover态,还是由Hover态切换至Press态,可以统一在按钮周围输出一个波动图形,用以在按钮由Normal态切换至Hover态时,向用户发出交互提醒;用以在按钮由Hover态切换至Press态时,替代Loading态的功能,来表征按钮由Hover态切换至Press态时所触发的事件的加载进程。
在实现时,由于向用户发出交互提醒通常是一个静态的过程,因此当按钮由Normal态切换为Hover态时,可以在按钮周围静态输出所述波动图形,从而可以向用户发出交互提醒;另外,由于按钮由Hover态切换至Press态时所触发的事件的加载进程通常是一个 动态的过程,因此当按钮由Hover态切换至Press态时,可以按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形,从而可以通过动态输出所述波动图形来向用户呈现所述事件完整的加载进程。
其中,在实现时,所述波动图形,可以是波纹图形,以下以所述波动图形为波纹图形为例进行说明。
在本实施例中,当用户通过对所述按钮进行长按操作或者鼠标悬浮操作,将按钮由Normal态切换为Hover态后,可以在按钮周围静态输出环绕按钮的波纹图样,从而达到向用户输出交互提醒的目的,用户在收到该交互提醒后,可以准确获知到所述按钮当前已经切换到了Hover态。另外,为了增强提醒效果,对于通过长按操作来触发将按钮由Normal态切换为Hover态的情况,还可以获取用户针对所述按钮区域的按压压力,然后根据按压压力的大小输出预设数量的波纹图形;其中,在这种情况下,输出波纹图形的条数可以取决于按压压力的大小,按压压力越大,则在按钮周围静态输出的波纹图形的条数则越多。
例如,请参见图4,以所述按钮为触屏智能终端上安装的用于控制远程智能设备的APP上的开关按钮为例,当用户通过对该按钮所述在区域进行长按操作,触发将该按钮由Normal态切换为Hover态后,可以在该按钮周围静态输出环绕的波纹图样向用户发出交互提醒,用户在查看到按钮周围出现了波纹图样后,可以准确的获知该按钮当前已经切换到了Hover态。另外,为了增强提醒效果,终端还可以获取用户针对所述按钮区域的按压压力,然后根据按压压力的大小输出预设数量的波纹图形,此时按压压力越大,则在按钮周围静态输出的波纹图形的条数则越多。
与现有实现相比,由于所述波纹图样在按钮周围输出,因此用户在用手指长按该按钮时,不会对按钮态切换后发出的交互提醒造成遮挡,呈现方式更加直观,从而用户可以得到清晰准确的交互提醒。
在本实施例中,当用户通过对所述按钮进行长按操作后的松开操作或者鼠标点击操作,将按钮由Hover态切换为Press态后,可以按照预设的扩散速率由所述按钮的边缘向外周期性的扩散围绕所述按钮的波纹图形。
在实现时,可以在按钮边缘设定一个波纹源,然后终端可以在后台控制波纹源每隔一个固定的时间生成一个波纹,并控制每个波纹按照预设的速率向外扩散;同时为了达到很好的交互效果,所述波纹图形在向外扩散的过程中还可以逐渐进行衰减,终端可以控制交互界面按照一定频率周期性的对界面进行刷新,每次刷新后重新计算当前波纹的位置以及衰减程度,然后将波纹渲染到交互界面上。其中交互界面对界面刷新的频率,可以根据实际需求进行设置,例如,在实现时可以设置一个较高的刷新频率,从而保证渲染效果;所述波纹图形的衰减过程,可以通过为不同的波纹图形设置不同的明暗程度来表示波纹图形的衰减过程。
在本实施例中,当按钮由Hover态切换为Press态所触发的事件加载完成后,此时可 以同步的停止向外周期性的扩散围绕所述按钮的波纹图形,从而可以将动态输出所述波动图形的过程与所述事件的加载过程完整的关联起来,通过动态输出所述波动图形就可以向用户同步的呈现所述事件完整的加载过程。
例如,请参见图5,仍以所述按钮为触屏智能终端上安装的用于控制远程智能设备的APP上的开关按钮为例,当用户通过对该按钮进行长按后的松开操作,将该按钮由Hover态切换为Press态后,通常会触发一个将所述智能设备开启的事件,该事件被触发后,终端可以在后台向智能设备发送一个启动指令,智能设备收到该启动指令后,启动设备,并在启动成功后向终端返回一个启动成功的响应消息。因此,请继续参见图5,终端在向智能设备发出一个启动指令后,可以按照预设的扩散速率由所述按钮的边缘向外周期性的扩散围绕所述按钮的逐渐进行衰减的波纹图形,由于该波纹图形的扩散过程与所述事件的加载进程完全同步,因此用户通过查看动态输出所述波纹图形过程中所呈现出的动画效果,就可以同步的了解到所述事件完整的加载过程。与现有实现相比,由于所述波纹图样在按钮周围输出,并且完全替代Loading态的功能,因此不需要引入独立的浮层用于播放Loading态对应的加载动画,因此可以有效的提升交互界面中单位面积的设计承载能力,充分的利用设计空间,提升设计效率。
值得说明的是,当按钮切换为press态后,此时按钮处于“按下”状态,当用户需要将“按下”的按钮恢复为弹起的状态时,用户可以重新通过对该按钮所在区域进行指定的触摸操作或者鼠标操作完成按钮态的切换。在这种情况下,按钮的Press态可以认为是当前的Normal态,按钮在“按下”以前的Normal态,可以认为是当前的Press态,当按钮由当前的Normal态切换至Press态时,此时按钮处于“弹起”状态,其中详细的按钮态切换过程与以上实施例的描述相同,在本实施例中不再赘述。
在以上实施例中,通过判断按钮是否发生按钮态切换,当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形,由所述波动图形发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程;本公开对按钮的Hover态、Press态、Loading态进行了整合设计,在继承了传统界面交互设计中的按钮态和加载动画的交互功能的前提下,对传统按钮态的按钮样式和Loading态的加载动画进行了整合,统一使用分布在按钮周围的波动图形向用户发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程,将视觉焦点和操作中心巧妙的融为一体,可以在按钮交互过程中向用户输出清晰准确的交互提醒以及向用户呈现完整的交互进程,从而优化了用户的交互体验。
与前述按钮交互方法实施例相对应,本公开还提供了一种装置的实施例。
图6是根据一示例性实施例示出的一种按钮交互装置的示意框图。
如图6所示,根据一示例性实施例示出的一种按钮交互装置600,包括:判断模块601和输出模块602;其中:
所述判断模块601被配置为,判断按钮是否发生按钮态切换;
所述输出模块602被配置为,在所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
在以上实施例中,在以上实施例中,通过判断按钮是否发生按钮态切换,当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形,由所述波动图形发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程;本公开对按钮的Hover态、Press态、Loading态进行了整合设计,在继承了传统界面交互设计中的按钮态和加载动画的交互功能的前提下,对传统按钮态的按钮样式和Loading态的加载动画进行了整合,统一使用分布在按钮周围的波动图形向用户发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程,将视觉焦点和操作中心巧妙的融为一体,可以在按钮交互过程中向用户输出清晰准确的交互提醒以及向用户呈现完整的交互进程,从而优化了用户的交互体验。
请参见图7,图7是本公开根据一示例性实施例示出的另一种装置的框图,该实施例在前述图6所示实施例的基础上,所述判断模块601可以包括第一监听子模块601A、第一判断子模块601B、第一确定子模块601C和第二确定子模块601D;其中:
所述第一监听子模块601A被配置为,监听针对所述按钮区域的触摸事件;
所述第一判断子模块601B被配置为,判断所述触摸事件是否为第一预设事件;
所述第一确定子模块601C被配置为,在第一判断子模块判断出所述触摸事件为所述第一预设事件时,确定所述按钮由Normal态切换为Hover态;
所述第二确定子模块601D被配置为,在所述按钮切换为Hover态后,第一监听子模块再次监听到针对所述按钮区域的触摸事件,并且第一判断子模块判断出该触摸事件为第二预设事件时,确定所述按钮由Hover态切换为Press态。
请参见图8,图8是本公开根据一示例性实施例示出的另一种装置的框图,该实施例在前述图6所示实施例的基础上,所述判断模块601还可以包括第二监听子模块601E、第二判断子模块601F、第三确定子模块601G和第四确定子模块601G;其中:
所述第二监听子模块601E被配置为,监听针对所述按钮区域的鼠标事件;
所述第二判断子模块601F被配置为,判断所述鼠标事件是否为第三预设事件;
所述第三确定子模块601G被配置为,在所述鼠标事件为所述第三预设事件时,确定所述按钮由Normal态切换为Hover态;
所述第四确定子模块601G被配置为,在所述按钮切换为Hover态后,第二监听子模块再次监听到针对所述按钮区域的鼠标事件,并且第二判断子模块判断出该鼠标事件为第四预设事件时,确定所述按钮由Hover态切换为Press态。
需要说明的是,上述图8所示的装置实施例中示出的第二监听子模块601E、第二判断子模块601F、第三确定子模块601G和第四确定子模块601G的结构也可以包含在前述 图7的装置实施例中,对此本公开不进行限制。
请参见图9,图9是本公开根据一示例性实施例示出的另一种装置的框图,该实施例在前述图6所示实施例的基础上,所述输出模块602还可以包括第一输出子模块602A和第二输出子模块602B;其中:
所述第一输出子模块602A被配置为,在所述按钮由Normal态切换为Hover态时,在所述按钮周围静态输出所述波动图形,以发出交互提醒;
所述第二输出子模块602B被配置为,在所述按钮由Hover态切换为Press态时,按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形;
需要说明的是,上述图9所示的装置实施例中示出的第一输出子模块602A和第二输出子模块602B的结构也可以包含在前述图7-8的装置实施例中,对此本公开不进行限制。
请参见图10,图10是本公开根据一示例性实施例示出的另一种装置的框图,该实施例在前述图9所示实施例的基础上,所述波动图形为波纹图形时,所述第一输出子模块602A可以包括获取子单元602A1和输出子单元602A2;其中:
所述获取子单元602A1被配置为,获取用户针对所述按钮区域的按压压力;
所述输出子单元602A2被配置为,根据所述按压压力的大小在所述按钮周围静态输出预设数量的波纹图形;其中所述按压压力越大在所述按钮周围静态输出的波纹图形的条数越多;
需要说明的是,上述图10所示的装置实施例中示出的获取子单元602A1和输出子单元602A2的结构也可以包含在前述图6-8的装置实施例中,对此本公开不进行限制。
请参见图11,图11是本公开根据一示例性实施例示出的另一种装置的框图,该实施例在前述图9所示实施例的基础上,所述波动图形为波纹图形时,所述第二输出子模块602B可以包括设定子单元602B1和控制子单元602B2;其中:
所述设定子单元602B1被配置为,在所述按钮边缘设定波纹源;
所述控制子单元602B2被配置为,控制所述波纹源按照预设的扩散速率向外周期性的扩散逐渐衰减的波纹图形;
需要说明的是,上述图11所示的装置实施例中示出的设定子单元602B1和控制子单元602B2的结构也可以包含在前述图6-8或10的装置实施例中,对此本公开不进行限制。
上述装置中各个模块或者单元的功能和作用的实现过程具体详见上述方法中对应步骤的实现过程,在此不再赘述。
对于装置实施例而言,由于其基本对应于方法实施例,所以相关之处参见方法实施例的部分说明即可。以上所描述的装置实施例仅仅是示意性的,其中所述作为分离部件说明 的模块或者单元可以是或者也可以不是物理上分开的,作为模块或单元显示的部件可以是或者也可以不是物理模块或单元,即可以位于一个地方,或者也可以分布到多个网络模块或单元上。可以根据实际的需要选择其中的部分或者全部模块或单元来实现本公开方案的目的。本领域普通技术人员在不付出创造性劳动的情况下,即可以理解并实施。
相应的,本公开还提供一种按钮交互装置,所述装置包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为:
判断按钮是否发生按钮态切换;
当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
相应的,本公开还提供一种终端,所述终端包括有存储器,以及一个或者一个以上的程序,其中一个或者一个以上程序存储于存储器中,且经配置以由一个或者一个以上处理器执行所述一个或者一个以上程序包含用于进行以下操作的指令:
判断按钮是否发生按钮态切换;
当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
图12是根据一示例性实施例示出的一种按钮交互装置的结构示意图。
如图12所示,根据一示例性实施例示出的一种按钮交互装置1200,该装置1200可以是移动终端,移动电话,计算机,数字广播终端,消息收发设备,游戏控制台,平板设备,医疗设备,健身设备,个人数字助理等。
参照图12,装置1200可以包括以下一个或多个组件:处理组件1201,存储器1202,电源组件1203,多媒体组件1204,音频组件1205,输入/输出(I/O)的接口1206,传感器组件1207,以及通信组件1208。
处理组件1201通常控制装置1200的整体操作,诸如与显示,电话呼叫,数据通信,相机操作和记录操作相关联的操作。处理组件1201可以包括一个或多个处理器1209来执行指令,以完成上述的方法的全部或部分步骤。此外,处理组件1201可以包括一个或多个模块,便于处理组件1201和其他组件之间的交互。例如,处理部件1201可以包括多媒体模块,以方便多媒体组件1204和处理组件1201之间的交互。
存储器1202被配置为存储各种类型的数据以支持在装置1200的操作。这些数据的示例包括用于在装置1200上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图片,视频等。存储器1202可以由任何类型的易失性或非易失性存储设备或者它 们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
电源组件1203为装置1200的各种组件提供电力。电源组件1203可以包括电源管理系统,一个或多个电源,及其他与为装置1200生成、管理和分配电力相关联的组件。
多媒体组件1204包括在所述装置1200和用户之间的提供一个输出接口的屏幕。在一些实施例中,屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。所述触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与所述触摸或滑动操作相关的持续时间和压力。在一些实施例中,多媒体组件1204包括一个前置摄像头和/或后置摄像头。当装置1200处于操作模式,如拍摄模式或视频模式时,前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
音频组件1205被配置为输出和/或输入音频信号。例如,音频组件1205包括一个麦克风(MIC),当装置1200处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器1202或经由通信组件1208发送。在一些实施例中,音频组件1205还包括一个扬声器,用于输出音频信号。
I/O接口1202为处理组件1201和外围接口模块之间提供接口,上述外围接口模块可以是键盘,点击轮,按钮等。这些按钮可包括但不限于:主页按钮、音量按钮、启动按钮和锁定按钮。
传感器组件1207包括一个或多个传感器,用于为装置1200提供各个方面的状态评估。例如,传感器组件1207可以检测到装置1200的打开/关闭状态,组件的相对定位,例如所述组件为装置1200的显示器和小键盘,传感器组件1207还可以检测装置1200或装置1200一个组件的位置改变,用户与装置1200接触的存在或不存在,装置1200方位或加速/减速和装置1200的温度变化。传感器组件1207可以包括接近传感器,被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件1207还可以包括光传感器,如CMOS或CCD图像传感器,用于在成像应用中使用。在一些实施例中,该传感器组件1207还可以包括加速度传感器,陀螺仪传感器,磁传感器,压力传感器或温度传感器。
通信组件1208被配置为便于装置1200和其他设备之间有线或无线方式的通信。装置1200可以接入基于通信标准的无线网络,如WiFi,2G或3G,或它们的组合。在一个示例性实施例中,通信组件1208经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中,所述通信组件1208还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
在示例性实施例中,装置1200可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现,用于执行上述方法。
在示例性实施例中,还提供了一种包括指令的非临时性计算机可读存储介质,例如包括指令的存储器1202,上述指令可由装置1200的处理器1209执行以完成上述方法。例如,所述非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
其中,当所述存储介质中的指令由移动终端的处理器执行时,使得移动终端能够执行一种按钮交互方法,包括:
判断按钮是否发生按钮态切换;
当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本公开的真正范围和精神由下面的权利要求指出。
应当理解的是,本公开并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。

Claims (15)

  1. 一种按钮交互方法,其特征在于,所述方法包括:
    判断按钮是否发生按钮态切换;
    当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
  2. 如权利要求1所述的方法,其特征在于,所述判断按钮是否发生按钮态切换包括:
    监听针对所述按钮区域的触摸事件;
    判断所述触摸事件是否为第一预设事件;
    当所述触摸事件为所述第一预设事件时,确定所述按钮由Normal态切换为Hover态;
    当所述按钮切换为Hover态后,再次监听到针对所述按钮区域的触摸事件,并且判断出该触摸事件为第二预设事件时,确定所述按钮由Hover态切换为Press态。
  3. 如权利要求1所述的方法,其特征在于,所述判断按钮是否发生按钮态切换包括:
    监听针对所述按钮区域的鼠标事件;
    判断所述鼠标事件是否为第三预设事件;
    当所述鼠标事件为所述第三预设事件时,确定所述按钮由Normal态切换为Hover态;
    当所述按钮切换为Hover态后,再次监听到针对所述按钮区域的鼠标事件,并且判断出该鼠标事件为第四预设事件时,确定所述按钮由Hover态切换为Press态。
  4. 如权利要求2和3所述的方法,其特征在于,所述第一预设事件为长按事件;所述第二预设事件为松开事件;所述第三预设事件为鼠标悬停事件;所述第四预设事件为鼠标点击事件。
  5. 如权利要求2或3所述的方法,其特征在于,所述当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形包括:
    当所述按钮由Normal态切换为Hover态时,在所述按钮周围静态输出所述波动图形,以发出交互提醒;
    当所述按钮由Hover态切换为Press态时,按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形。
  6. 如权利要求5所述的方法,其特征在于,所述波动图形为波纹图形时,所述在所述按钮周围静态输出所述波动图形包括:
    获取用户针对所述按钮区域的按压压力;
    根据所述按压压力的大小在所述按钮周围静态输出预设数量的波纹图形;其中所述按压压力越大在所述按钮周围静态输出的波纹图形的条数越多。
  7. 如权利要求5所述的方法,其特征在于,所述波动图形为波纹图形时,所述按照预设的波动周期在所述按钮周围动态输出所述波动图形包括:
    在所述按钮边缘设定波纹源;
    控制所述波纹源按照预设的扩散速率向外周期性的扩散逐渐衰减的波纹图形。
  8. 一种按钮交互装置,其特征在于,所述装置包括:
    判断模块,用于判断按钮是否发生按钮态切换;
    输出模块,用于在所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
  9. 如权利要求8所述的装置,其特征在于,所述判断模块包括:
    第一监听子模块,用于监听针对所述按钮区域的触摸事件;
    第一判断子模块,用于判断所述触摸事件是否为第一预设事件;
    第一确定子模块,用于在第一判断子模块判断出所述触摸事件为所述第一预设事件时,确定所述按钮由Normal态切换为Hover态;
    第二确定子模块,用于在所述按钮切换为Hover态后,第一监听子模块再次监听到针对所述按钮区域的触摸事件,并且第一判断子模块判断出该触摸事件为第二预设事件时,确定所述按钮由Hover态切换为Press态。
  10. 如权利要求8所述的装置,其特征在于,所述判断模块包括:
    第二监听子模块,用于监听针对所述按钮区域的鼠标事件;
    第二判断子模块,用于判断所述鼠标事件是否为第三预设事件;
    第三确定子模块,用于在所述鼠标事件为所述第三预设事件时,确定所述按钮由Normal态切换为Hover态;
    第四确定子模块,用于在所述按钮切换为Hover态后,第二监听子模块再次监听到针对所述按钮区域的鼠标事件,并且第二判断子模块判断出该鼠标事件为第四预设事件时,确定所述按钮由Hover态切换为Press态。
  11. 如权利要求9和10所述的装置,其特征在于,所述第一预设事件为长按事件;所述第二预设事件为松开事件;所述第三预设事件为鼠标悬停事件;所述第四预设事件为鼠标点击事件。
  12. 如权利要求9或10所述的装置,其特征在于,所述输出模块包括:
    第一输出子模块,用于在所述按钮由Normal态切换为Hover态时,在所述按钮周围静态输出所述波动图形,以发出交互提醒;
    第二输出子模块,用于在所述按钮由Hover态切换为Press态时,按照预设的波动周期在所述按钮周围动态输出所述波动图形,并在所述按钮由Hover态切换为Press态时所触发的事件加载完成后,停止输出所述波动图形。
  13. 如权利要求12所述的装置,其特征在于,所述波动图形为波纹图形时,所述第一输出子模块包括:
    获取子单元,用于获取用户针对所述按钮区域的按压压力;
    输出子单元,用于根据所述按压压力的大小在所述按钮周围静态输出预设数量的波纹图形;其中所述按压压力越大在所述按钮周围静态输出的波纹图形的条数越多。
  14. 如权利要求12所述的装置,其特征在于,所述波动图形为波纹图形时,所述第二输出子模块包括:
    设定子单元,用于在所述按钮边缘设定波纹源;
    控制子单元,用于控制所述波纹源按照预设的扩散速率向外周期性的扩散逐渐衰减的波纹图形。
  15. 一种按钮交互装置,其特征在于,包括:
    处理器;
    用于存储处理器可执行指令的存储器;
    其中,所述处理器被配置为:
    判断按钮是否发生按钮态切换;
    当所述按钮发生按钮态切换时,在所述按钮周围输出波动图形;其中所述波动图形用于发出交互提醒以及表征所述按钮态切换所触发的事件的加载进程。
PCT/CN2015/093065 2015-01-23 2015-10-28 按钮交互方法和装置 WO2016115930A1 (zh)

Priority Applications (6)

Application Number Priority Date Filing Date Title
JP2016570158A JP6211721B2 (ja) 2015-01-23 2015-10-28 ボタンによるインタラクション方法、装置、プログラム及び記録媒体
RU2016114553A RU2651194C2 (ru) 2015-01-23 2015-10-28 Способ и устройство для взаимодействия с кнопкой
KR1020157036562A KR101871240B1 (ko) 2015-01-23 2015-10-28 버튼 인터랙션 방법, 장치, 프로그램 및 기록매체
EP15858090.2A EP3089016A4 (en) 2015-01-23 2015-10-28 Button interaction method and apparatus
MX2016002007A MX2016002007A (es) 2015-01-23 2015-10-28 Metodo y dispositivo para interactuar con un boton.
US15/226,511 US10705676B2 (en) 2015-01-23 2016-08-02 Method and device for interacting with button

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201510036107.6 2015-01-23
CN201510036107.6A CN104598112B (zh) 2015-01-23 2015-01-23 按钮交互方法和装置

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US15/226,511 Continuation US10705676B2 (en) 2015-01-23 2016-08-02 Method and device for interacting with button

Publications (1)

Publication Number Publication Date
WO2016115930A1 true WO2016115930A1 (zh) 2016-07-28

Family

ID=53123943

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2015/093065 WO2016115930A1 (zh) 2015-01-23 2015-10-28 按钮交互方法和装置

Country Status (8)

Country Link
US (1) US10705676B2 (zh)
EP (1) EP3089016A4 (zh)
JP (1) JP6211721B2 (zh)
KR (1) KR101871240B1 (zh)
CN (1) CN104598112B (zh)
MX (1) MX2016002007A (zh)
RU (1) RU2651194C2 (zh)
WO (1) WO2016115930A1 (zh)

Families Citing this family (17)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104598112B (zh) * 2015-01-23 2019-01-18 小米科技有限责任公司 按钮交互方法和装置
CN106547461B (zh) * 2015-09-23 2021-11-09 小米科技有限责任公司 一种操作处理方法、装置及设备
CN105706051A (zh) * 2016-01-21 2016-06-22 马岩 一种app操作方法及系统
USD832284S1 (en) * 2016-12-12 2018-10-30 Curious.Com, Inc. Computer display with a graphical user interface
USD836660S1 (en) * 2016-12-28 2018-12-25 Samsung Electronics Co., Ltd. Display screen or portion thereof with graphical user interface
CN112328143B (zh) * 2017-04-14 2024-06-21 创新先进技术有限公司 按钮激活方法及装置
USD887423S1 (en) * 2017-11-07 2020-06-16 Samsung Electronics Co., Ltd. Display screen or portion thereof with graphical user interface
USD845332S1 (en) * 2018-02-06 2019-04-09 Krikey, Inc. Display panel of a programmed computer system with a graphical user interface
USD872764S1 (en) * 2018-03-16 2020-01-14 Magic Leap, Inc. Display panel or portion thereof with graphical user interface
USD920992S1 (en) * 2018-03-16 2021-06-01 Magic Leap, Inc. Display panel or portion thereof with a graphical user interface
USD892131S1 (en) 2018-03-16 2020-08-04 Magic Leap, Inc. Display panel or portion thereof with a graphical user interface
USD861037S1 (en) 2018-06-03 2019-09-24 Apple Inc. Electronic device with icon
CN109960448B (zh) * 2019-03-21 2020-01-17 掌阅科技股份有限公司 场景特效显示方法、电子设备及计算机存储介质
CN110244948B (zh) * 2019-04-24 2023-07-07 深圳点猫科技有限公司 基于编程语言对按钮状态进行切换的方法以及电子设备
USD976264S1 (en) * 2019-05-16 2023-01-24 Pathway Innovations And Technologies, Inc. Display screen or portion thereof with a graphical user interface
CN113760427B (zh) * 2019-08-09 2022-12-16 荣耀终端有限公司 显示页面元素的方法和电子设备
CN111859214A (zh) * 2020-06-24 2020-10-30 北京金山云网络技术有限公司 网页浏览器的加载方法、装置、设备及存储介质

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102799347A (zh) * 2012-06-05 2012-11-28 北京小米科技有限责任公司 应用于触屏设备的用户界面交互方法、装置及触屏设备
CN103246475A (zh) * 2013-04-27 2013-08-14 华为终端有限公司 一种按钮识别区域的调整方法及装置
CN104598112A (zh) * 2015-01-23 2015-05-06 小米科技有限责任公司 按钮交互方法和装置

Family Cites Families (29)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5694562A (en) * 1995-01-17 1997-12-02 Fisher; Thomas A. Closely integrated key icons in a graphical interface
JPH08227341A (ja) * 1995-02-22 1996-09-03 Mitsubishi Electric Corp ユーザインターフェース
US6825861B2 (en) * 2001-01-08 2004-11-30 Apple Computer, Inc. Three state icons for operation
JP3755499B2 (ja) 2002-09-06 2006-03-15 ソニー株式会社 Guiアプリケーション開発支援装置、gui表示装置、および方法、並びにコンピュータ・プログラム
JP3755500B2 (ja) * 2002-09-06 2006-03-15 ソニー株式会社 Guiアプリケーション開発支援装置および方法、並びにコンピュータ・プログラム
JP2007086977A (ja) * 2005-09-21 2007-04-05 Mitsubishi Electric Corp 携帯機器
US7692629B2 (en) * 2006-12-07 2010-04-06 Microsoft Corporation Operating touch screen interfaces
US8446376B2 (en) * 2009-01-13 2013-05-21 Microsoft Corporation Visual response to touch inputs
US9652030B2 (en) * 2009-01-30 2017-05-16 Microsoft Technology Licensing, Llc Navigation of a virtual plane using a zone of restriction for canceling noise
KR101304321B1 (ko) * 2010-01-22 2013-09-11 전자부품연구원 싱글 터치 압력에 기반한 ui 제공방법 및 이를 적용한 전자기기
KR20120023339A (ko) * 2010-09-03 2012-03-13 에스케이플래닛 주식회사 터치신호를 이용한 기능 실행 방법 및 장치
US20120102401A1 (en) * 2010-10-25 2012-04-26 Nokia Corporation Method and apparatus for providing text selection
CN102654831A (zh) 2011-03-04 2012-09-05 百度在线网络技术(北京)有限公司 一种集中控制web页面事件与状态的装置和方法
JP5790238B2 (ja) 2011-07-22 2015-10-07 ソニー株式会社 情報処理装置、情報処理方法及びプログラム
US20130036380A1 (en) * 2011-08-02 2013-02-07 Apple Inc. Graphical User Interface for Tracking and Displaying Views of an Application
US10706096B2 (en) 2011-08-18 2020-07-07 Apple Inc. Management of local and remote media items
JP5930363B2 (ja) * 2011-11-21 2016-06-08 株式会社ソニー・インタラクティブエンタテインメント 携帯情報機器およびコンテンツ表示方法
US20130311294A1 (en) * 2012-05-21 2013-11-21 BrandinteIX, Inc. Mobile messaging ecosystem - closed loop
CN103748586B (zh) 2012-08-17 2019-03-15 青岛海信电器股份有限公司 智能电视
CN103677981B (zh) 2012-09-03 2017-08-29 联想(北京)有限公司 状态切换方法和装置
JP2014093046A (ja) * 2012-11-06 2014-05-19 Canon Inc 情報処理装置、情報処理装置の制御方法及びプログラム
KR101985336B1 (ko) * 2012-12-20 2019-06-03 삼성전자주식회사 휴대단말기의 사용 방법 및 장치
US20150332107A1 (en) * 2012-12-24 2015-11-19 Nokia Technologies Oy An apparatus and associated methods
CN104035820B (zh) * 2013-03-08 2018-06-22 腾讯科技(深圳)有限公司 显示终端的数据加载方法和装置
US9766723B2 (en) * 2013-03-11 2017-09-19 Barnes & Noble College Booksellers, Llc Stylus sensitive device with hover over stylus control functionality
CN103631379B (zh) * 2013-11-21 2017-05-31 华为终端有限公司 触摸选择的视觉反馈方法和装置
CN103699413B (zh) * 2013-12-24 2017-05-03 北京世界星辉科技有限责任公司 优化游戏运行环境的方法、客户端、服务器及系统
US20160224220A1 (en) * 2015-02-04 2016-08-04 Wipro Limited System and method for navigating between user interface screens
KR101749933B1 (ko) * 2015-11-12 2017-06-22 엘지전자 주식회사 이동 단말기 및 그 제어방법

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102799347A (zh) * 2012-06-05 2012-11-28 北京小米科技有限责任公司 应用于触屏设备的用户界面交互方法、装置及触屏设备
CN103246475A (zh) * 2013-04-27 2013-08-14 华为终端有限公司 一种按钮识别区域的调整方法及装置
CN104598112A (zh) * 2015-01-23 2015-05-06 小米科技有限责任公司 按钮交互方法和装置

Also Published As

Publication number Publication date
US10705676B2 (en) 2020-07-07
JP2017511947A (ja) 2017-04-27
JP6211721B2 (ja) 2017-10-11
KR101871240B1 (ko) 2018-08-02
EP3089016A4 (en) 2017-05-03
RU2016114553A (ru) 2017-10-19
US20160342302A1 (en) 2016-11-24
KR20160102110A (ko) 2016-08-29
CN104598112B (zh) 2019-01-18
RU2651194C2 (ru) 2018-04-18
CN104598112A (zh) 2015-05-06
EP3089016A1 (en) 2016-11-02
MX2016002007A (es) 2016-10-28

Similar Documents

Publication Publication Date Title
WO2016115930A1 (zh) 按钮交互方法和装置
US10884473B2 (en) Methods, electronic devices, and storage mediums for waking up an icon
WO2017201860A1 (zh) 视频直播方法及装置
CN107544810B (zh) 控制应用程序的方法和装置
US20190073101A1 (en) Method and device for switching pages of applications in a terminal device
US20170060599A1 (en) Method and apparatus for awakening electronic device
WO2016192324A1 (zh) 单手模式下的按键操作处理方法及装置、电子设备
WO2016112699A1 (zh) 切换显示模式的方法及装置
JP2017524222A (ja) フルスクリーン片手操作方法、装置、プログラム及び記録媒体
WO2017084183A1 (zh) 信息显示方法与装置
WO2017161811A1 (zh) 一种多媒体调节方法、装置及移动设备
JP6134870B2 (ja) 説明情報の表示方法、説明情報の表示装置、電子装置、プログラム、及び記録媒体
US20210165670A1 (en) Method, apparatus for adding shortcut plug-in, and intelligent device
JP6300389B2 (ja) ターゲットオブジェクトの表示方法及び装置
US10042328B2 (en) Alarm setting method and apparatus, and storage medium
CN110119239B (zh) 一种输入法应用显示方法及装置
CN107390977A (zh) 按键操作方法、装置及存储介质
WO2016065760A1 (zh) 设备连接的提示方法及装置
KR20150122574A (ko) 사용자 명령 실행방법, 장치, 프로그램 및 기록매체
WO2017161805A1 (zh) 一种控制方法、装置及移动设备
US11221734B2 (en) Punch-hole screen display method and apparatus
US11614953B2 (en) Method and apparatus for implementing OSD
WO2023240451A1 (zh) 屏幕控制方法及装置、电子设备、存储介质
US20220286550A1 (en) Method for controlling mobile terminal, and mobile terminal
CN115396712A (zh) 视频播放方法、装置、电子设备及存储介质

Legal Events

Date Code Title Description
ENP Entry into the national phase

Ref document number: 2016570158

Country of ref document: JP

Kind code of ref document: A

Ref document number: 20157036562

Country of ref document: KR

Kind code of ref document: A

WWE Wipo information: entry into national phase

Ref document number: MX/A/2016/002007

Country of ref document: MX

ENP Entry into the national phase

Ref document number: 2016114553

Country of ref document: RU

Kind code of ref document: A

REEP Request for entry into the european phase

Ref document number: 2015858090

Country of ref document: EP

WWE Wipo information: entry into national phase

Ref document number: 2015858090

Country of ref document: EP

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

Ref document number: 15858090

Country of ref document: EP

Kind code of ref document: A1

REG Reference to national code

Ref country code: BR

Ref legal event code: B01A

Ref document number: 112016009220

Country of ref document: BR

NENP Non-entry into the national phase

Ref country code: DE

ENP Entry into the national phase

Ref document number: 112016009220

Country of ref document: BR

Kind code of ref document: A2

Effective date: 20160425