Applies to: All versions of GUI Design Studio
How do I create a Tab Bar with labels that span multiple lines?
The Tab and Tab Bar elements do not support multiple line text entry. However, it's possible to work around this limitation using a combination of margins on the "Tab Bar" and "Text" element overlays.
A simple design below to demonstrate this ("Multi Line Tab Test1.gui"). This adds a 17 pixel bottom margin to the Tab Bar to make the tabs taller. The top line of the text on the tabs is provided as normal but Text element overlays are used to add the second line.
Tabs will automatically size to the contained text. If the second line text overlay is longer than the first line tab text (see the 2nd and 3rd tabs in the example above), pad the first line text with spaces. This is a very quick and easy workaround.
Note: In versions of GUI Design Studio prior to 4.2, the Text element overlay will obscure the Tab for clicking when running the prototype. So you'll need to click the top of the Tab to switch tabs.