Automated generation of display layouts

Abstract

A client device executes a display layout application that receives a size of each display item included in a set of display items. The set of display items is associated with a first frame included in a bounding box associated with a display screen. The display layout application determines a reference size based on the sizes of the set of display items. The display layout application determines a size of the first frame based on the reference size. The display layout application determines a position for a first display item included in the set of display items based on a position of the first frame within the bounding box. The display layout application generates a layout for display on the display screen, where the layout includes the first display item.

What is claimed is: 
     
       1. A computer-implemented method, comprising:
 receiving a set of layout instructions and a plurality of display items, wherein:
 the set of layout instructions specifies that the plurality of display items are to be stacked in a first frame, 
 the set of layout instructions and plurality of display items are attached to a shadow node that exists as a standalone node that performs frame calculations but does not directly inherit properties from any operating system, 
 the set of layout instructions are retrievable from the shadow node when a first display application, operating within a first operating system type, renders the layout, 
 the set of layout instructions are retrievable from the shadow node when a second display application, operating within a second operating system type, renders the layout, and 
 the first operating system type is distinct from the second operating system type; 
 
 determining a height of the first frame based on a height of a tallest display item in the plurality of display items; 
 determining a width of the first frame based on a width of a widest display item in the plurality of display items; 
 determining a position for each of the plurality of display items within the first frame based on one or more alignment parameters associated with the plurality of display items; and 
 generating a layout for display on a display screen, wherein the layout includes the first frame. 
 
     
     
       2. The computer-implemented method of  claim 1 , further comprising:
 retrieving one or more alignment layout properties from the set of layout instructions; and 
 setting, based on the one or more alignment layout properties, a first position for a first display item in the plurality of display items. 
 
     
     
       3. The computer-implemented method of  claim 2 , further comprising:
 determining a second position for a second display item included in the plurality of display items, 
 wherein the first position for the first display item is further based on a padding distance between the first display item and the second display item. 
 
     
     
       4. The computer-implemented method of  claim 3 , further comprising adjusting the first display item to move to a second position based on a relative position property. 
     
     
       5. The computer-implemented method of  claim 2 , wherein the first position for the first display item is further based on a padding distance between the first display item and an edge of the first frame. 
     
     
       6. The computer-implemented method of  claim 1 , further comprising:
 retrieving one or more style properties from a style property data structure; and 
 rendering a first display item in the plurality of display items for display within the layout based on the one or more style properties. 
 
     
     
       7. The computer-implemented method of  claim 1 , further comprising determining an available display area associated with a display screen, wherein:
 an initial size of the available display area is determined based on dimensions of the display screen; and 
 generating the layout for display comprises:
 generating the first frame; 
 when the available display area exceeds the first frame, reducing the available display area based on the first frame to generate a modified display area; 
 determining a frame size of a second frame; and 
 generating the second frame. 
 
 
     
     
       8. The computer-implemented method of  claim 7 , wherein the second frame includes a second plurality of display items. 
     
     
       9. The computer-implemented method of  claim 7 , further comprising determining, from a data store, the available display area, wherein reducing the available display area is based on a layout property included in the set of layout instructions. 
     
     
       10. The computer-implemented method of  claim 1 , wherein after determining the positions for each of the plurality of display items, at least two display items in the plurality of display items overlap. 
     
     
       11. One or more non-transitory computer-readable storage media including instructions that, when executed by one or more processors, cause the one or more processors to perform the steps of:
 receiving a set of layout instructions and a plurality of display items, wherein:
 the set of layout instructions specifies that the plurality of display items are to be stacked in a first frame, 
 the set of layout instructions and plurality of display items are attached to a shadow node that exists as a standalone node that performs frame calculations but does not directly inherit properties decoupled from any operating system, 
 the set of layout instructions are retrievable from the shadow node when a first display application, operating within a first operating system type, renders the layout, 
 the set of layout instructions are retrievable from the shadow node when a second display application, operating within a second operating system type, renders the layout, and 
 the first operating system type is distinct from the second operating system type; 
 
 determining a height of the first frame based on a height of a tallest display item in the plurality of display items; 
 determining a width of the first frame based on a width of a widest display item in the plurality of display items; 
 determining a position for each of the plurality of display items within the first frame based on one or more alignment parameters associated with the plurality of display items; and 
 generating a layout for display on a display screen, wherein the layout includes the first frame. 
 
     
     
       12. The one or more non-transitory computer-readable storage media of  claim 11 , further comprising instructions that, when executed by the one or more processors, cause the one or more processors to perform the steps of:
 retrieving one or more alignment layout properties from the set of layout instructions; and 
 setting, based on the one or more alignment layout properties, a first position for a first display item in the plurality of display items. 
 
     
     
       13. The one or more non-transitory computer-readable storage media of  claim 12 , wherein the first position for the first display item is further based on a padding distance between the first display item and an edge of the first frame. 
     
     
       14. The one or more non-transitory computer-readable storage media of  claim 11 , further comprising instructions that, when executed by the one or more processors, cause the one or more processors to perform the steps of:
 retrieving one or more style properties from a style property data structure; and 
 rendering a first display item in the plurality of display items for display within the layout based on the one or more style properties. 
 
     
     
       15. The one or more non-transitory computer-readable storage media of  claim 11 , further comprising instructions that, when executed by the one or more processors, cause the one or more processors to perform the step of determining an available display area associated with a display screen, wherein:
 an initial size of the available display area is determined based on dimensions of the display screen; and 
 generating the layout for display comprises:
 generating the first frame; 
 when the available display area exceeds the first frame, reducing the available display area based on the first frame to generate a modified display area; 
 determining a frame size of a second frame; and 
 generating the second frame. 
 
 
     
     
       16. A computing device, comprising:
 a memory that includes instructions; and 
 a processor that is coupled to the memory and, when executing the instructions:
 receives a set of layout instructions and a plurality of display items, wherein:
 the set of layout instructions specifies that the plurality of display items are to be stacked in a first frame, 
 the set of layout instructions and plurality of display items are attached to a shadow node that exists as a standalone node that performs frame calculations but does not directly inherit properties from any operating system, 
 the set of layout instructions are retrievable from the shadow node when a first display application, operating within a first operating system type, renders the layout, 
 the set of layout instructions are retrievable from the shadow node when a second display application, operating within a second operating system type, renders the layout, and 
 the first operating system type is distinct from the second operating system type; 
 
 determines a height of the first frame based on a height of a tallest display item in the plurality of display items; 
 determines a width of the first frame based on a width of a widest display item in the plurality of display items; 
 determines a position for each of the plurality of display items within the frame based on one or more alignment parameters associated with the plurality of display items; and 
 generates a layout for display on a display screen, wherein the layout includes the first frame. 
 
 
     
     
       17. The computer-implemented method of  claim 1 , wherein the shadow node is separate from a local graphics library of a first device running the first operating system type. 
     
     
       18. The computer-implemented method of  claim 1 , wherein the layout is generated independent of a refresh rate of a first device running the first operating system type. 
     
     
       19. The computer-implemented method of  claim 7 , wherein the shadow node computes at least one of the initial size of the available display or the available display area. 
     
     
       20. The computer-implemented method of  claim 1 , wherein the shadow node further includes a template default layout. 
     
     
       21. The computer-implemented method of  claim 1 , wherein the shadow node is separate from user interface builders specific to the operating system.