Programmatic native rendering of structured content

• US 10,643,023 B2
• Filed: 09/25/2015
• Issued: 05/05/2020
• Est. Priority Date: 09/25/2015
• Status: Active Grant

• Current Assignee: Yahoo Assets LLC
• Original Assignee: Oath Inc. (Verizon Communications Inc.)
• Inventors: Su, Timothy, Li, Shuai, Pintado, Jorge, Pons Bordes, Pablo
• Primary Examiner(s): Klicos, Nicholas
• Application Number:
  US14/866,388
• Publication Number:
  US 20170091159A1
• Time in Patent Office: 1,684 Days
• CPC Class Codes: G06F 40/106 Display of layout of documents; Previewing
• CPC Class Codes: G06F 40/143 Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
• CPC Class Codes: G06F 40/154 Tree transformation for tree-structured or markup documents, e.g. XSLT, XSL-FO or stylesheets
• CPC Class Codes: G06F 40/197 Version control for software G06F8/71
• CPC Class Codes: G06F 40/205 Parsing
• CPC Class Codes: G06F 8/38 for implementing user interfaces

Abstract

A user interface (UI) layout description language is described in which a UI may be specified for presentation by different versions of the same app running on different platforms. A layout engine written in a platform-specific language parses the UI layout description and transforms it to a native view using native UI components. The app on each platform has its own layout engine, but each can use the same layout description to generate a native view. Thus, a UI can be built once for all of the platforms. And because the UI layout engines are written in the language of their corresponding platforms, the UIs generated are high performing.

Claims

1. A computing device, comprising:

memory including an operating system implemented in a platform-specific language, native user interface (UI) components, and an application implemented in the platform-specific language, the application including a UI layout engine;

a display; and

one or more processors operatively coupled to the memory and the display, the one or more processors being configured to use the UI layout engine to;

build a UI layout tree using a UI layout description received from a remote platform responsive to a call by the application or the UI layout engine to the remote platform, the UI layout description specified in a UI layout description language that is different from the platform-specific language and corresponding to at least one of a particular content type or a data source;

bind data received by the computing device from one or more remote platforms to one or more elements of the UI layout tree, the data including or representing content;

determine a UI layout position for each of the one or more elements of the UI layout tree;

generate a native view using the UI layout tree, the data bound to the one or more elements of the UI layout tree, the UI layout position of each of the one or more elements of the UI layout tree, and the native UI components;

the one or more processors being configured to present the content using a UI corresponding to the native view on the display;

store the native view in a pool of recently used views;

responsive to determining a new layout, determine whether one or more views corresponding to the new layout are in the pool of recently used views; and

responsive to determining that the native view in the pool of recently used views corresponds to the new layout, use the native view to present content of the new layout.

2. The computing device of claim 1, wherein the presenting the content of the new layout comprises:

partitioning at least one content into one or more rows of content, wherein each row of content comprises a discrete section of content renderable independently from one or more other discrete sections of content; and

responsive to a user scrolling through at least some content, rendering each module when the corresponding module comes on screen in association with the scrolling.

3. The computing device of claim 1, wherein the one or more processors are configured to bind new data received from the remote platform or a second remote platform to the native view to generate a new native view.

4. The computing device of claim 1, wherein the one or more processors are configured to obtain at least a portion of the data from a second remote platform.

5. The computing device of claim 1, wherein the one or more processors are configured to use the UI layout engine to determine whether to display one or more components of the UI layout tree by:

associating elements of the UI layout tree with a node tree;

responsive to determining that a first node of the node tree is hidden, deleting the first node from the node tree;

responsive to determining that a second node of the node tree is present for layout but not visible, including the second node in one or more subsequent processing acts but not creating one or more native views associated with the second node; and

responsive to determining that a third node of the node tree is visible but has no visual impact on at least one layout other than spacing, removing the third node from a rendering process.

6. The computing device of claim 1, wherein the one or more processors are configured to build the UI layout tree by parsing the UI layout description to identify a hierarchy of non-native UI components.

7. The computing device of claim 1, wherein the one or more processors are configured to use the UI layout engine to determine whether to display one or more components of the UI layout tree by:

associating elements of the UI layout tree with a node tree; and

responsive to determining that a first node of the node tree is hidden, deleting the first node from the node tree.

8. The computing device of claim 1, wherein the one or more processors are configured to use the UI layout engine to determine whether to display one or more components of the UI layout tree by:

associating elements of the UI layout tree with a node tree; and

responsive to determining that a first node of the node tree is present for layout but not visible, including the first node in one or more subsequent processing acts but not creating one or more native views associated with the first node.

9. The computing device of claim 1, wherein the one or more processors are configured to use the UI layout engine to determine whether to display one or more components of the UI layout tree by:

associating elements of the UI layout tree with a node tree; and

responsive to determining that a first node of the node tree is visible but has no visual impact on at least one layout other than spacing, removing the first node from a rendering process.

10. A computer program product comprising one or more non-transitory computer-readable media having computer program instructions stored therein, the computer program instructions being in a platform-specific language of an operating system and being configured such that, when executed by one or more processors, the computer program instructions cause the one or more processors to:

build a user interface (UI) layout tree using a UI layout description received from a remote platform responsive to a search query transmitted to the remote platform, the UI layout description specified in a UI layout description language that is different from the platform-specific language and corresponding to at least one of a particular content type or a data source;

process data received from one or more remote platforms responsive to the search query, the data including or representing one or more search results;

bind the data to one or more elements of the UI layout tree;

determine a UI layout position for each of the one or more elements of the UI layout tree;

generate a native view of a UI using the UI layout tree, the data bound to the one or more elements of the UI layout tree, the UI layout position of each of the one or more elements of the UI layout tree, and native UI components associated with the operating system;

present the one or more search results using the UI corresponding to the native view on a display;

store the native view in a pool of recently used views;

responsive to determining a new layout, determine whether one or more views corresponding to the new layout are in the pool of recently used views; and

responsive to determining that the native view in the pool of recently used views corresponds to the new layout, use the native view to present one or more second search results of the new layout.

11. The computer program product of claim 10, wherein the computer program instructions are configured to cause the one or more processors to retrieve the UI layout description from local memory associated with the operating system.

12. The computer program product of claim 10, wherein the computer program instructions are configured to cause the one or more processors to bind new data received from the remote platform or a second remote platform to the native view to generate a new native view.

13. The computer program product of claim 10, wherein the computer program instructions are configured to cause the one or more processors to obtain the data from a second remote platform.

14. The computer program product of claim 10, wherein the UI layout description language employs the JavaScript Object Notation (JSON) format.

15. The computer program product of claim 10, wherein the computer program instructions are configured to cause the one or more processors to build the UI layout tree by parsing the UI layout description to identify a hierarchy of non-native UI components.

16. The computer program product of claim 15, wherein one of the non-native UI components represents multiple instances of an object type, and wherein the computer program instructions are configured to cause the one or more processors to add nodes to the UI layout tree for each of the instances of the object type.

17. The computer program product of claim 10, wherein the computer program instructions are configured to cause the one or more processors to determine the UI layout position for each of the one or more elements of the UI layout tree by computing a coordinate in two dimensions for each of the one or more elements of the UI layout tree.

18. The computer program product of claim 17, wherein the computer program instructions are configured to cause the one or more processors to compute the coordinate in two dimensions for each of the one or more elements of the UI layout tree using a subset of the CSS Flexible Box Layout Model.

19. A computer-implemented method, comprising:

transmitting a search query to a remote platform;

receiving a user interface (UI) layout description from the remote platform responsive to the search query, the UI layout description specified in a UI layout description language that is different from a platform-specific language and corresponding to at least one of a particular content type or a data source;

building a UI layout tree using the UI layout description;

process data received from one or more remote platforms responsive to the search query, the data including or representing one or more search results;

binding the data to one or more elements of the UI layout tree;

determining a UI layout position for each of the one or more elements of the UI layout tree;

generating a native view of a UI using the UI layout tree, the data bound to the one or more elements of the UI layout tree, the UI layout position of each of the one or more elements of the UI layout tree, and native UI components associated with an operating system;

presenting the one or more search results using the UI corresponding to the native view on a display;

storing the native view in a pool of recently used views;

responsive to determining a new layout, determining that one or more views corresponding to the new layout are in the pool of recently used views; and

responsive to determining that the native view in the pool of recently used views corresponds to the new layout, using the native view to present one or more second search results of the new layout.

20. The method of claim 19, comprising:

obtaining at least a portion of the data from the remote platform.

21. The method of claim 19, comprising:

obtaining at least a portion of the data from a second remote platform.

22. The method of claim 19, wherein the UI layout description language employs the JavaScript Object Notation (JSON) format.

23. The method of claim 19, comprising:

building the UI layout tree by parsing the UI layout description to identify a hierarchy of non-native UI components.

24. The method of claim 23, wherein one of the non-native UI components represents multiple instances of an object type, the method comprising:

adding nodes to the UI layout tree for each of the instances of the object type.

25. The method of claim 19, comprising:

determining the UI layout position for each of the one or more elements of the UI layout tree by computing a coordinate in two dimensions for each of the one or more elements of the UI layout tree.