When you’re in the Editor, you can interact with elements in your project visually on the canvas. This is an easier way to engage with elements as opposed to locating a snippet of code for an element you want to edit. You can just click the element on the canvas.
You can also interact with elements in the Editor Canvas through the Layers or Node Inspector, but in this article we’ll focus on the canvas and the five aspects of interacting with elements on the canvas:
- Selection — clicking on elements to select them
- Parent Element— selecting an element’s parent
- Dragging — clicking and dragging to relocate an element
- Copying — duplicating the selected element
- Deleting — deleting the selected element
Selection
To select an element on your canvas, point your cursor at the element and just click it.
Notice that as you hover over elements on the Canvas, a blue outline highlights the edge of each element. This indicates which element you are selecting on the canvas.
Selecting an element will show the element label at the top-left corner of the selected element.
On the right side of the label you can see 4 different icons (Up Arrow, Drag, Copy, Delete). You can click the appropriate icon to access those settings.
Parent Element
You can select the parent element in the following ways.
- Click the — Up Icon on the Label
- Use the Node Inspectors (or) Layers.
Click the Up Icon on the label — when an element is selected, click the Up icons on the right side of label to see the names of its parent and grandparent elements. You can select the parent element by clicking its Up icon in this menu. This is helpful if a child element is sitting inside a parent element that is difficult to select.
Using Node Inspector (or) Layers — you can also make these kinds of selections on the right side under Layers tab.
Dragging
If you want to drag an element, simply click on the drag icons on the right side of the label and drag it into position.
Copying
To duplicate or clone the selected element you can do that by clicking on the copy icon on the right side of the label. You can duplicate any element on the Canvas.
Deleting
To delete any element on the canvas click on the delete icon on the right side of the label or use Delete key. If you want to delete the nested item, you can make use of Layers (or) Node Inspector to select the element and the use Delete key or the delete icon.
