Canvas layout algorithm

Patent metadata

Field	Value
Publication number	US-2018300020-A1
Application number	US-201816015705-A
Country	US
Kind code	A1
Filing date	Jun 22, 2018
Priority date	Sep 26, 2014
Publication date	Oct 18, 2018
Grant date	—

Abstract

Embodiments are directed to automatic layout organization where various visualizations within a canvas layout can be dynamically rearranged or modified in dimension upon a user specified modification to maximize usability. Some embodiments display a graphical user interface (GUI) including multiple components in a display area, where each component has one or more initial dimensions. In response to an event, embodiments can determine an edge corresponding to the event. Some embodiments determine a box based on the edge, the box enclosing a portion of the display area that is less than the entire display area. Certain embodiments determine a set of components corresponding to the box, the set of components being fewer than all of the components. Embodiments may redraw the GUI such that the set of components is redrawn, where a dimension of each component of the set of components is different from an initial dimension of the component.

First claim

What is claimed is:

1 . A method comprising:
displaying, by one or more processors, a graphical user interface (GUI) comprising a plurality of components in a display area; in response to an indication to insert a component into the display area, determining, by the one or more processors, an edge corresponding to the insertion of the component; determining, by the one or more processors, perpendicular edges of the display area or the plurality of components that intersect ends of the edge; determining, by the one or more processors, a shorter edge of the perpendicular edges; determining, by the one or more processors, an insertion box based on the edge and the shorter edge of the perpendicular edges, wherein the insertion box encloses a portion of the display area that includes the edge and the shorter edge of the perpendicular edges; determining, by the one or more processors, a set of components of the plurality of components corresponding to the insertion box; adjusting, by the one or more processors, at least one dimension of each component of the set of components corresponding to the insertion box; and rendering, by the one or more processor, the GUI to include: (i) each component of the set of components with the adjusted at least one dimension, and (ii) the insertion of the component.

2 . The method of claim 1 , wherein the indication is a user hovering over and then dropping an icon representing the component onto the edge.

3 . The method of claim 1 , wherein the at least one dimension is a height or width of each component.

4 . The method of claim 3 , further comprising:
determining, by the one or more processors, a maximum number of components of the set of components within the insertion box that are intersected by a line perpendicular to the edge; determining, by the one or more processors, the edge is a horizontal edge; assigning, by the one or more processors, a height of the component to be inserted to be 1/(the maximum number of components+1); and reducing, by the one or more processors, the height of each component of the set of components by 1/(the maximum number of components+1).

5 . The method of claim 3 , further comprising:
determining, by the one or more processors, a maximum number of components of the set of components within the insertion box that are intersected by a line perpendicular to the edge; determining, by the one or more processors, the edge is a vertical edge; assigning, by the one or more processors, a width of the component to be inserted to be 1/(the maximum number of components+1); and reducing, by the one or more processors, the width of each component of the set of components by 1/(the maximum number of components+1).

6 . The method of claim 1 , wherein the at least one dimension of each component of the set of components is adjusted at a same percentage.

7 . The method of claim 1 , wherein components of the plurality of components that are outside of the insertion box are not adjusted.

8 . A non-transitory computer-readable memory storing a plurality of instructions executable by one or more processors, the plurality of instructions comprising instructions that when executed by the one or more processors cause the one or more processors to perform processing comprising:
displaying a graphical user interface (GUI) comprising a plurality of components in a display area; in response to an indication to insert a component into the display area, determining an edge corresponding to the insertion of the component; determining perpendicular edges of the display area or the plurality of components that intersect ends of the edge; determining a shorter edge of the perpendicular edges; determining an insertion box based on the edge and the shorter edge of the perpendicular edges, wherein the insertion box encloses a portion of the display area that includes the edge and the shorter edge of the perpendicular edges; determining a set of components of the plurality of components corresponding to the insertion box; adjusting at least one dimension of each component of the set of components corresponding to the insertion box; and rendering the GUI to include: (i) each component of the set of components with the adjusted at least one dimension, and (ii) the insertion of the component.

9 . The non-transitory computer-readable memory of claim 8 , wherein the indication is a user hovering over and then dropping an icon representing the component onto the edge.

10 . The non-transitory computer-readable memory of claim 8 , wherein the at least one dimension is a height or width of each component.

11 . The non-transitory computer-readable memory of claim 10 , wherein the process further comprises:
determining a maximum number of components of the set of components within the insertion box that are intersected by a line perpendicular to the edge; determining the edge is a horizontal edge; assigning a height of the component to be inserted to be 1/(the maximum number of components+1); and reducing the height of each component of the set of components by 1/(the maximum number of components+1).

12 . The non-transitory computer-readable memory of claim 10 , wherein the process further comprises:
determining, by the one or more processors, a maximum number of components of the set of components within the insertion box that are intersected by a line perpendicular to the edge; determining, by the one or more processors, the edge is a vertical edge; assigning, by the one or more processors, a width of the component to be inserted to be 1/(the maximum number of components+1); and reducing, by the one or more processors, the width of each component of the set of components by 1/(the maximum number of components+1).

13 . The non-transitory computer-readable memory of claim 8 , wherein the at least one dimension of each component of the set of components is adjusted at a same percentage.

14 . The non-transitory computer-readable memory of claim 8 , wherein components of the plurality of components that are outside of the insertion box are not adjusted.

15 . A system comprising:
one or more processors; a memory coupled to the one or more processors, the memory storing a plurality of instructions executable by the one or more processors, the plurality of instructions comprising instructions that when executed by the one or more processors cause the one or more processors to perform processing comprising: displaying a graphical user interface (GUI) comprising a plurality of components in a display area; in response to an indication to insert a component into the display area, determining an edge corresponding to the insertion of the component; determining perpendicular edges of the display area or the plurality of components that intersect ends of the edge; determining a shorter edge of the perpendicular edges; determining an insertion box based on the edge and the shorter edge of the perpendicular edges, wherein the insertion box encloses a portion of the display area that includes the edge and the shorter edge of the perpendicular edges; determining a set of components of the plurality of components corresponding to the insertion box; adjusting at least one dimension of each component of the set of components corresponding to the insertion box; and rendering the GUI to include: (i) each component of the set of components with the adjusted at least one dimension, and (ii) the insertion of the component.

16 . The system of claim 15 , wherein the indication is a user hovering over and then dropping

Assignees

• Oracle Int Corp

Inventors

• Dyar Samuel Stephen
• Lagerblad Bo Jonas Birger

Classifications

• G06F9/451

  Execution arrangements for user interfaces · CPC title

• G06F3/0484

  for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range · CPC title

• G06F3/0481 Primary

  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 · CPC title