cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

Community Tip - If community subscription notifications are filling up your inbox you can set up a daily digest and get all your notifications in a single email. X

Layout widget with absolute sized rows / columns

0 Kudos

Layout widget with absolute sized rows / columns

When designing UIs in Thingworx the layout widget only offers relative sizes rows / columns in percent as well as an absolute sized footer and header or sidebars respectively. With a single layout widget it is not possible to build a structure like

  • Header (80 px)
  • Row 1 (60%)
  • Row 2 (130 px)
  • Row 3 (40%)

 

Row 2 could be handled just like the header and the remaining space is then divided into parts of given relative size for Row 1 and 3.

The workaround is to build layouts in layouts:

  • Header (80 px)
  • Row 1 (60%)
  • Nested layout widget 
    • Header (formerly Row 2, 130 px)
    • Row 1 (formerly Row 3100%)

I do not like this approach:

  1. This is not convenient, it clutters the the model area / widget tree (Explorer tab) and when "reading" the UI it is not obvious that this is actually supposed to be ONE layout.
  2. The 60% also needs to be adjusted to a smaller value since the 130 px from Row 2 is not using space from the root widget (and thus from all rows evenly) but only from the nested widget.
2 Comments
olivierlp
Community Manager
Status changed to: Delivered

I believe this is possible with the responsive layout editor in 9.x releases.

bbeuckSIG
15-Moonstone

Yes, I believe that, too. But I have not system here to test it.