Welcome, Guest Login

Support Center

Using Canvas layout

Last Updated: Feb 22, 2016 04:55PM EST

Canvas Layout

 
Canvas Layout is used to position Blocks at a specific position on a View.
To learn more about other layout or how to select a specific Layout review Introduction to Layout 

Canvas is extremely useful:
  • To design Views with different Blocks at specific position.
  • Design Layout to be used as Pattern in Blocks you build.
    • For example: A List with a different pattern than the standard list
    • An Image Gallery with a specific design.

To understand the standard function available for Blocks on a Canvas like Copy, Reuse, Swap etc..  read Block Function.
 

The core difference between Layouts is how Blocks are positioned. 


Positioning Blocks on Canvas Layout

You can drag & drop other Blocks or other Layouts on a Canvas Layout.
To position these Components on the Canvas we use 'Size & Position'  from the Block Contextual Menu.
 

Drag & drop a Block anywhere on a Canvas Layout.



In this example we are using an Image Block in the Hello World demo app.
















 

Right Click to access 'Size & Position' in the Contextual Block Menu



Click on Size & Position.








 


You can also access Size & Position from the App Navigation menu.


Select the desired Block and click on the 'Size & Position' wheel on the right side of the dynamic menu.






 

Size & Position

You can always move the Block using your mouse on the Canvas Layout.
You can change the sizing of a Block by dragging the bottom right corner of the Block.

To be more precise, create adaptive UI and more you will need to use Size & Position.
There are 3 systems of coordinate available in Size & Position:
 

Learn Size & Position

Learn more
- Scrolling Patterns

 

Help us improve! Rate this article:

Yes I found this article helpful

Ask a Question   

support@eachscape.com
http://assets0.desk.com/
false
eachscape
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete