Index
- Element Visibility between Sizes
Introduction: Visibility in Flexitive
In Flexitive you can think of each master design as its own design concept that can contain one or many sizes. Every size that's activated in a Flexitive master design shares the same assets, and some actions, like animations. For a full list of shared actions, check out our article on What Changes Affect All My Sizes vs. Only One Size.
By sharing assets, and some actions, between different sizes that are part of the same design concept, Flexitive helps you to achieve consistency across your communications.
Since each design in Flexitive can contain multiple sizes:
- Elements in a design can be hidden or shown in a particular size. When you want to remove an element from a particular size, you should hide the element from that size. If you delete the element, it will be removed from every size.
- For example, if you've activated a 300x50 and a 900x150, they may have a similar layout because they share the same aspect ratio (6:1) but the 900x150 has significantly more space available. On the 300x50, you'll want to hide elements that should visible on the 900x150. For an example of designs that share an aspect ratio but have different layouts, check out these Flexitive designs.
- For example, if you've activated a 300x50 and a 900x150, they may have a similar layout because they share the same aspect ratio (6:1) but the 900x150 has significantly more space available. On the 300x50, you'll want to hide elements that should visible on the 900x150. For an example of designs that share an aspect ratio but have different layouts, check out these Flexitive designs.
- When you add a new element to a size i.e 300x250, that element will be added to all activated sizes.
- When building a Flexitive design that contains portrait and landscape sizes, you'll likely have elements with a portrait or landscape orientation. You'll want the elements with a portrait orientation hidden on landscape sizes and vice-versa.
Using the Visibility settings in the Size & Position panel, you can make elements in Flexitive visible on a specific size, all portrait sizes, or all landscape sizes. To apply Visibility settings to multiple elements at once, hold Ctrl (CMD on Mac) while tapping on the elements either on the canvas or in the Layers panel.
Hiding an Element on One Size
To hide an element from the size you are working in you can either;
- Select the element and tap Show/Hide on this Size from the Size and Position panel.
- Open the Layers Panel, navigate to the element you would like to hide, and select the eye icon on the element to hide the element.
Making an Element Only Visible on One Size
To hide an element in all but one size, select the element in the size you want it to be visible in and then tap Only This Size under the Visibility settings in the Size and Position panel.
Making an Element Only Visibile on all Landscape Sizes
To make an element only visible in Landscape sizes, select the element and tap Only Landscape from the Visibility settings in the Size and Position panel.
Making an Element Only Visible on all Portrait Sizes
To make an element only visible in Portrait sizes, select the element and tap Only Portrait under the Visibility settings in the Size and Position panel.
Making an Element Visible on All Sizes
To make an element only visible in all sizes, select the element and tap All Sizes under the Visibility settings in the Size and Position panel.