Methods and devices for user interactive interfaces on touchscreens

• US 9,910,558 B2
• Filed: 06/04/2013
• Issued: 03/06/2018
• Est. Priority Date: 06/05/2012
• Status: Active Grant

• Current Assignee: Beijing Xiaomi Technology Company Limited (Xiaomi Corp.)
• Original Assignee: Beijing Xiaomi Technology Company Limited (Xiaomi Corp.)
• Inventors: Liu, Jing, Wu, Xiaojun, Shen, Yang, Guo, Yu
• Primary Examiner(s): Gaffin, Jeffrey A
• Assistant Examiner(s): ABOU EL SEOUD, MOHAMED
• Application Number:
  US13/909,570
• Publication Number:
  US 20130326420A1
• Time in Patent Office: 1,736 Days
• CPC Class Codes: G06F 2203/04804 Transparency, e.g. transparent or translucent windows
• CPC Class Codes: G06F 3/0482 Interaction with lists of selectable items, e.g. menus
• CPC Class Codes: G06F 3/04845 for image manipulation, e.g. dragging, rotation, expansion or change of colour
• CPC Class Codes: G06F 3/04886 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

Abstract

The present application is directed to devices and methods for touchscreen interactive interface. The method may comprise steps of combining two or more single-function buttons on the user interface of the touchscreen device into one multifunction button; monitoring a real-time touch operation with the multifunction button by a user; determining the type of the touch operation according to the time of the touch operation; and unfolding the two or more single-function buttons one after another around the multifunction button according to the type of the touch operation.

Claims

1. A processor-implemented method for operating an interactive user interface on a touchscreen device comprising:

monitoring, by a processor of the touchscreen device, a real-time touch operation of the interactive user interface, by a user, wherein a portion of the interactive user interface defines a movable area, a docking location movable within the movable area, and a multifunction button located at the docking location;

determining, by the processor, a target type of the real-time touch operation from a plurality of different types of touch operations comprising a Type I touch operation and a Type II touch operation based on a duration of the real-time touch operation, wherein;

when the duration of the real-time touch operation is shorter than a first predetermined threshold value, the real-time touch operation is determined as the Type I touch operation,

when the duration of the real-time touch operation is longer than the first predetermined threshold value, the real-time touch operation is determined as the Type II touch operation, and

each of the plurality of different types of touch operations corresponds to a distinct manner of unfolding the multifunction button from a first folded state to a second unfolded state comprising a plurality of single-function buttons oriented around the multifunction button, and wherein the docking location of the multifunction button is adjusted within the movable area in response to a determination of a particular target type of the real-time touch operation;

when the target type of the real-time touch operation is determined to be the Type I touch operation, unfolding, by the processor, the plurality of single-function buttons around the multifunction button; and

when the target type of the real-time touch operation is determined to be the Type II touch operation;

monitoring, by the processor, the real-time touch operation of the multifunction button by the user to determine whether the multifunction button has been moved,

when the multifunction button has been moved, obtaining, by the processor, a moved location of the multifunction button,

dividing, by the processor, the movable area of the interactive user interface into a plurality of subareas,

determining, by the processor, a center of each of the plurality of subareas,

determining, by the processor, an adjusted docking location of the multifunction button as the center of a particular subarea where the moved location is located, and

unfolding, by the processor, the plurality of single-function buttons in a user touch area around the adjusted docking location of the multifunction button.

2. The processor-implemented method according to claim 1, further comprising:

creating, by the processor, the multifunction button by combining the plurality of single-function buttons.

3. The processor-implemented method according to claim 1, wherein obtaining the moved location of the multifunction button comprises:

determining whether a current location of the multifunction button is outside of the movable area of the interactive user interface in a vertical direction;

adjusting a vertical coordinate of the current location of the multifunction button to a second predetermined threshold value; and

maintaining a horizontal coordinate of the current location of the multifunction button.

4. The processor-implemented method according to claim 1, wherein unfolding the plurality of single-function buttons comprises:

evenly unfolding the plurality of single-function buttons into an arc around the multifunction button, wherein

the arc has a predetermined radius,

an angle measure of the arc is dependent on the docking location of the multifunction button,

distance between any two neighboring single-function buttons of the plurality of single-function buttons is equal, and

distance between any of the plurality of single-function buttons and the multifunction button is equal.

5. The processor-implemented method according to claim 1, wherein the multifunction button is a semitransparent button.

6. The processor-implemented method according claim 1, wherein unfolding the plurality of single-function buttons further comprise implementing at least one animation of:

moving locations of the single-function buttons;

rotating the single-function buttons; and

creating a dissolving effect of the single-function buttons.

7. A touchscreen device with an interactive user interface, comprising:

a non-transitory processor-readable storage medium storing a set of instructions for conducting operations on the touchscreen device;

a processor in communication with the non-transitory processor-readable storage medium that is configured to execute the set of instructions stored in the non-transitory processor-readable storage medium and is configured to;

monitor a real-time touch operation of the interactive user interface, by a user, wherein a portion of the interactive user interface defines a movable area, a docking location movable within the movable area, and a multifunction button located at the docking location;

determine a target type of the real-time touch operation from a plurality of different types of touch operations comprising a Type I touch operation and a Type II touch operation based on a duration of the real-time touch operation, wherein;

when the duration of the real-time touch operation is shorter than a first predetermined threshold value, the real-time touch operation is determined as the Type I touch operation,

when the duration of the real-time touch operation is longer than the first predetermined threshold value, the real-time touch operation is determined as the Type II touch operation, and

each of the plurality of different types of touch operations corresponds to a distinct manner of unfolding the multifunction button from a first folded state to a second unfolded state comprising a plurality of single-function buttons oriented around the multifunction button, and wherein the docking location of the multifunction button is adjusted within the movable area in response to a determination of a particular target type of the real-time touch operation;

when the target type of the real-time touch operation is determined to be the Type I touch operation, unfold the plurality of single-function buttons around the multifunction button; and

when the target type of the real-time touch operation is determined to be the Type II touch operation;

monitoring the real-time touch operation of the multifunction button by the user to determine whether the multifunction button has been moved,

when the multifunction button has been moved, obtaining a moved location of the multifunction button,

dividing the movable area of the interactive user interface into a plurality of subareas,

determining a center of each of the plurality of subareas,

determining an adjusted docking location of the multifunction button as the center of a particular subarea where the moved location is located, and

unfolding, by the processor, the plurality of single-function buttons in a user touch area around the adjusted docking location of the multifunction button.

8. The touchscreen device according to claim 7, wherein the processor is further configured to create the multifunction button by combining the plurality of single-function buttons.

9. The touchscreen device according to claim 7, wherein to obtain the moved location of the multifunction button the processor is further configured to:

determine whether a current location of the multifunction button is outside of the movable area of the interactive user interface in a vertical direction;

adjust a vertical coordinate of the current location of the multifunction button to a second predetermined threshold value; and

maintain a horizontal coordinate of the current location of the multifunction button.

10. The touchscreen device according to claim 7, wherein to unfold the plurality of single-function buttons the processor is further configured to:

evenly unfold the plurality of single-function buttons into an arc around the multifunction button, wherein

the arc has a predetermined radius,

an angle measure of the arc is dependent on the docking location of the multifunction button,

distance between any two neighboring single-function buttons of the plurality of single-function buttons is equal, and

distance between any of the plurality of single-function buttons and the multifunction button is equal.

11. The touchscreen device according to claim 7, wherein the multifunction button is a semitransparent button.

12. The touchscreen device according claim 7, wherein to unfold the plurality of single-function buttons the processor is further configured to implement at least one animation to generating effect of:

moving locations of the single-function buttons;

rotating the single-function buttons; and

dissolving of the single-function buttons.