Create a Responsive Project and add couple of Smartshape objects in the Primary breakpoint slide
Last updated on
Jan 13, 2022
View-Specific Properties
Apply view specific properties by controlling the size, position, and characters of the object. Create objects in one view and make them visible or invisible to other views.
You can also make the objects view specific. For example, you can create objects A, B, and C in Primary breakpoint view. But, you would not want to use B in Tablet and C in Mobile breakpoint views. You can achieve this in Responsive Project by moving object B out of slide into scrap area in Tablet view. And, by moving object C into scrap area in Mobile view.
Alternatively, to make the object appear in only one view, right-Click the object, and choose Exclude from Other Views as shown in the screenshot below:
Applying View Specific Properties
-
-
Switch to Tablet and Mobile breakpoints and observe
You can view the same objects of Primary view in Tablet and Mobile views
-
Click the object to highlight it and click Properties > Position tab
In Position tab, you can see the object positions drop-down boxes highlighted such as Top, Left, Bottom, Right, Height and Width.
Object position properties Object position properties -
Click the drop-down boxes for each position and choose the value types such as %, px (for pixels) and relative % (relative to the overlay objects).
-
Now, customize the object position and size in each view differently.
You can observe the borders of positions highlighted in respective colors of the view breakpoint colors.Consider a case where you created a smart shape in Primary view and customized its position in Tablet view. Object Height and Width properties borders appear in Primary view breakpoint color and rest of the properties appear in Tablet view breakpoint color.
Sample screenshot is shown below:
Color coding when a smart shape is created in Primary view and its position is customized in Tablet view. Color coding when a smart shape is created in Primary view and its position is customized in Tablet view. Note:Add any two objects to the slide. In Position tab from Properties, click Checkbox adjacent to Smart Position to view the dimensions and links to other objects. Knowing the distances from the slide borders enables you to design accurate flowcharts and other drawings.
Object Position
Smart Position
Use this option if you want to follow an object instead of stage in the project.
%
Choose this unit if you want object dimension or position to be a percentage of Stage width or height.
Pixel
Choose this unit if you want object dimension or position to be a percentage of Stage width or height.
Auto
Choose this unit to maintain aspect ratio.
% Relative
Choose this option to maintain the overlay position. Appears only to height-related properties.
Note:
Relative Top can work as function of width but not as function of height. You can also use % Relative to link objects.
Min-Max
Fix the minimum and maximum size of objects so that they do not rescale across device views. This is especially useful for images such as logos, which need to look consistent and be legible at all times.
In Responsive project, you can set the Minimum Height, Minimum Width, Maximum Height, and Maximum Width for the objects.
- Click any object
- From Position Tab of Property Inspector, Click the arrow button adjacent to Advanced
- Set the Minimum and Maximum position values.
