Table.png

The Table Widget is an advanced widget used to create table-structured data overlays in your Composition.


To learn how to add a Widget to your Composition, click here.

Inputing JSON

Paste JSON code into the text field Content. Example JSON:

{ "content":
[ { "Pos":"1.", "Name":"McLaren", "Nationality":"https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Flag_of_New_Zealand.svg/2000px-Flag_of_New_Zealand.svg.png", "Constructor": "Cooper-Climax" },

{ "Pos":"2.", "Name":"Hill", "Nationality":"https://vignette.wikia.nocookie.net/in-the-name-of-the-tsar/images/e/e0/0_o0-6o1W1DKmI5LbX.png/revision/latest?cb=20190321092930", "Constructor": "Ferrari" },

{ "Pos":"3.", "Name":"Bandini", "Nationality":"https://cdn.shopify.com/s/files/1/1166/0602/products/italy-flag_1024x1024.jpeg?v=1457043237", "Constructor": "Ferrari" },

{ "Pos":"4.", "Name":"Surtees", "Nationality":"https://qph.fs.quoracdn.net/main-qimg-5a74d299f3b3cd43ef8d732cf95a07be", "Constructor": "Lola-Climax" },

{ "Pos":"5.", "Name":"Bonnier", "Nationality":"https://upload.wikimedia.org/wikipedia/en/4/4c/Flag_of_Sweden.svg", "Constructor": "Porsche" },

{ "Pos":"6.", "Name":"Hill", "Nationality":"https://qph.fs.quoracdn.net/main-qimg-5a74d299f3b3cd43ef8d732cf95a07be", "Constructor": "BRM" },

{ "Pos":"7.", "Name":"Mairesse", "Nationality":"https://media.istockphoto.com/illustrations/belgium-flag-illustration-id843135746?k=6&m=843135746&s=612x612&w=0&h=2zjobbvUWJ9l1_m_2RszqT3dyyhBhNNDYBpxH7aKqkU=", "Constructor": "Ferrari" },

{ "Pos":"8.", "Name":"Brabham", "Nationality":"https://cdn.britannica.com/78/6078-004-A4F193DB/Flag-Australia.jpg", "Constructor": "Lotus-Climax" },

{ "Pos":"9.", "Name":"Ireland", "Nationality":"https://qph.fs.quoracdn.net/main-qimg-5a74d299f3b3cd43ef8d732cf95a07be", "Constructor": "Lotus-Climax" },

{ "Pos":"10.", "Name":"Clark", "Nationality":"https://qph.fs.quoracdn.net/main-qimg-5a74d299f3b3cd43ef8d732cf95a07be", "Constructor": "Lotus-Climax" } ]
}

In this example here, link as follows:

  • Link Name to a Text Widget
  • Link Pos to a Text Widget
  • Link Constructor to a Text Widget
  • Link Nationality to an Image widget (for example, images of national flags)

Editing Elements

Edit the graphic elements of the table. Clicking on Composition>Edit in the Message Panel opens a new Subcomposition, that's where you create the table graphic elements.

Adding Widgets

Add text and image Widgets to create table graphic elements (don't forget to link them to their corresponding Control Nodes).

Add additional graphic elements to this Subcomposition, such as rectangles, background, animation effects, etc. to achieve the nice looking table you wish to have.

Finish

Return to the Table main Composition and check your table in the preview window.

Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.