Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
Last revision Both sides next revision
gdevelop5:interface:scene-editor [2018/06/17 23:00]
4ian [Toggle window mask]
gdevelop5:interface:scene-editor [2019/08/16 07:18]
4ian [Launch a preview with Debugger]
Line 1: Line 1:
 # Scene Editor # Scene Editor
  
-When opening a scene (or an external layout), ​scene editor opens. +When opening a scene (or an external layout), ​the scene editor opens. 
-This is where you can design and build your game levels ​(or menus, inventories...) by creating ​and adding ​objects to the scene. Gameplay and rules of the game can be created using events in [[gdevelop5:​interface:​events-editor|Events Editor]].+ 
 +{{ :​gdevelop5:​interface:​sceneeditoropens.png |}} 
 + 
 +The Scene Editor ​is where you can design and build the game levelsmenus, ​ inventories ​or any other screen in the gameThe Scene Editor allows you to create ​and add objects to the scene. Gameplay and rules of the game can be created using events in the [[gdevelop5:​interface:​events-editor|Events Editor]].
    
-We have selection ​of tools and editors available ​in the scene editor+There are number ​of tools and editors available ​on the scene editor's top toolbar. ​
 {{ :​gdevelop5:​scene-editor-toolset.png?​nolink |}} {{ :​gdevelop5:​scene-editor-toolset.png?​nolink |}}
  
 ## Objects editor ## Objects editor
-You can find the objects editor ​on the right side. This is where you can see all [[gdevelop5:​objects|the objects]] used in your scene and add new ones.+ 
 +You will find the Objects Editor ​on the right side of the Scene Editor'​s interface. This is where you can see all of [[gdevelop5:​objects|the objects]] used in your scene. You can also add new objects using the Objects Editor.
 {{ :​gdevelop5:​objects-manager-tab.png?​nolink |}} {{ :​gdevelop5:​objects-manager-tab.png?​nolink |}}
  
-In case you closed this panel, you can re open it by using the button on the top+If you close the Object Editor ​panel, you can reopen ​it by using this button on the toolbar:
 {{ :​gdevelop5:​objects-manager-button.png?​nolink |}} {{ :​gdevelop5:​objects-manager-button.png?​nolink |}}
  
-Read [[gdevelop5:​objects|the help about the objects]] to learn more about the different kind of objects that you can use in your game.+Read about the [[gdevelop5:​objects:​base_object|generic features available for all objects]] and then look at [[gdevelop5:​objects|the help about the objects ​types]] to learn more about the different kind of objects that you can use in your game.
  
 ## Object properties ## Object properties
-You can find the object properties ​on the left side, below the Project manager. ​Close the Project manager if you can't see it.+ 
 +You can find the Object Properties editor ​on the left side of the Scene Editor'​s interface. ​ If the Object Properties Editor is not visibleclose the Project manager. ​Then, select an object in your scene. ​ The Object Properties Editor panel will open on the left.
 {{ :​gdevelop5:​object-properties-bar.png?​nolink |}}  {{ :​gdevelop5:​object-properties-bar.png?​nolink |}} 
-Here you can change the properties of the selected objects such as position, scale, Z-order. 
  
-If you have closed this bar, you can open it by clicking the button ​on the top+Using the Properties Editor allows you to change the properties of the selected scene object. Such things as an object'​s position, scale, and Z-order can be changed using the Properties Editor. You can read more about [[gdevelop5:​objects:​base_object|properties of objects on this page]]. 
 + 
 +If you have closed this panel, you can open it again by clicking the button ​in the toolbar:
 {{ :​gdevelop5:​object-properties-button.png?​nolink |}} {{ :​gdevelop5:​object-properties-button.png?​nolink |}}
  
-In this case the bar may open on the right side, you can move and scale any element ​on the screen ​by dragging and moving.+<​note>​GDevelop panels ​can be moved by dragging them to any place on the screen. ​Simply drag the panel using the title bar.</​note>​
  
 ## Objects Groups editor ## Objects Groups editor
-In the Objects Groups editor ​we can find the list of groups ​we have in our scene and we can create new ones+ 
 +In the Objects Groups editor, you can find the list of groups ​of objects that are present ​in the scene.
 {{ :​gdevelop5:​objects-groups-editor.png?​nolink |}} {{ :​gdevelop5:​objects-groups-editor.png?​nolink |}}
-To open the editor ​we need to click the button ​on the top:+ 
 +To open the editorclick this button ​in the toolbar:
 {{ :​gdevelop5:​objects-groups-editor-button.png?​nolink |}} {{ :​gdevelop5:​objects-groups-editor-button.png?​nolink |}}
  
-Object groups ​allow us to collect ​objects ​in to groups ​and inside our events refer to a group instead of individual ​objects. ​+Object groups ​contain ​objects and can be used in events ​to refer to multiple objects, using single event. Read more about them on the page about [[gdevelop5:​objects:​base_object|common features for all objects]].
  
 ## Instances editor ## Instances editor
-The instances editor ​display a list of all instances ​we have present ​in our scene and we can select any instance from the list and see their position, angle, layer and Z order in our scene.+ 
 +The instances editor ​displays the list of all of an object'​s ​instances ​living ​in the scene. It can be used to select any instance from the list to see the instance'​s ​position, angle, layer and Z order in the scene.
 {{ :​gdevelop5:​instances-editor.png?​nolink |}} {{ :​gdevelop5:​instances-editor.png?​nolink |}}
  
-We can open the Instances editor by clicking ​the button ​on the top+You can open the Instances editor by clicking ​this button ​in the toolbar:
 {{ :​gdevelop5:​instances-editor-button.png?​nolink |}} {{ :​gdevelop5:​instances-editor-button.png?​nolink |}}
  
 ## Layers editor ## Layers editor
-The layer editor ​display the list of layers ​in our scenes ​and allow us to add new ones, change their order, hide them and delete them.+ 
 +layer acts as a virtual container for objects displayed on the screen. Objects are drawn on a layer, which is by default the “base layer”, and the layer is then drawn on the screen. A scene can have multiple layers. For example, there can be a layer to display ​controls on the screen and another layer for a background. 
 + 
 +[[gdevelop5:​interface:​scene-editor:​layers-and-cameras|Read more about layers ​and cameras here]]. 
 {{ :​gdevelop5:​layers-editor.png?​nolink |}} {{ :​gdevelop5:​layers-editor.png?​nolink |}}
  
-We can open the layers editor by clicking ​the button ​on the top+You can open the layers editor by clicking ​this button ​in the toolbar:
 {{ :​gdevelop5:​layers-editor-button.png?​nolink |}} {{ :​gdevelop5:​layers-editor-button.png?​nolink |}}
  
 ## Other tools ## Other tools
- 
  
 ### Toggle/Edit grid ### Toggle/Edit grid
-By clicking the toggle/​edit ​grid button ​on the top we get two options:+ 
 +By clicking the grid button ​in the toolbar, you get multiple ​options:
 {{ :​gdevelop5:​toggle-grid-button.png?​nolink |}} {{ :​gdevelop5:​toggle-grid-button.png?​nolink |}}
-  ​* **Toggle grid:​** ​it is allow us to turn the grid in the scene editor ​on and off, the grid is useful when we need to place objects accurately ​or we are dealing with tile sprites+ 
-  * **Setup grid:​** ​it is allow us to customize ​the size of the grid+* **Toggle mask**: this option displays or hides a black border on the scene. It represents the size of the game window. 
 +* **Toggle grid:​** ​this option ​ turns the grid off or on within ​the scene editor. Having a grid is useful when we need to place objects accurately. 
 +* **Setup grid:​** ​this  option opens a window that allows you to setup the size and position ​of the grid.
  
 ### Change editor zoom ### Change editor zoom
-By clicking on the Change editor ​zoom button, ​we can change the zoom level inside the scene editor+ 
 +By clicking on the zoom button, ​you can change the zoom level inside the scene editor:
 {{ :​gdevelop5:​toggle-zoom-button.png?​nolink |}} {{ :​gdevelop5:​toggle-zoom-button.png?​nolink |}}
  
 ## Launch a preview of the scene ## Launch a preview of the scene
  
-By clicking on the Preview button, you can launch a preview of your game:+By clicking on the Preview button, you can launch a preview of your game!
  
 {{ :​gdevelop5:​preview-button.png?​nolink |}} {{ :​gdevelop5:​preview-button.png?​nolink |}}
  
 The preview will open in a separate window. The preview will open in a separate window.
 + 
  
 ### Launch a Network preview (Preview over WiFi/LAN) ### Launch a Network preview (Preview over WiFi/LAN)
  
-By clicking the "​Network preview (Preview over WiFi/​LAN)"​ button, ​we can preview ​our game on mobile devices connected on the same network as the editor:+By clicking the "​Network preview (Preview over WiFi/​LAN)"​ button, ​you can preview ​your game on mobile devices ​(or any other computer) ​connected on the same network as the editor:
  
 {{ :​gdevelop5:​interface:​preview-wifi-button.png?​nolink |}} {{ :​gdevelop5:​interface:​preview-wifi-button.png?​nolink |}}
  
-After clicking the button, a window will appearshowing ​us the address the preview is being launched on+After clicking the button, a window will appear showing the address the preview is being launched on:
 {{ :​gdevelop5:​preview-wifi-window.png?​nolink |}} {{ :​gdevelop5:​preview-wifi-window.png?​nolink |}}
  
-Now we have to write and enter the given address in our mobile device'​s ​browser. The preview ​should ​load:+You can now enter the given address in your smartphone ​browser ​(or your other computer browser). The preview ​will load:
  
 {{ :​gdevelop5:​interface/​preview-wifi-running.png?​nolink |}} {{ :​gdevelop5:​interface/​preview-wifi-running.png?​nolink |}}
  
-Now we can close the pop-up window in the editor ​to continue ​editing our game. Finally, if we launch a new preview ​through wifi our mobile ​device ​will refresh the page automatically ​to show the changes made.+Note: You can close the pop-up window in the editor ​and continue ​to edit your game. If you launch a new preview, the mobile ​devices and any connected computer ​will automatically ​refresh the game to show the changes made!
  
 ### Launch a preview with Debugger ### Launch a preview with Debugger
  
-Debugger is a tool that can be used to inspect the content of your game (values of variables, existing instances and their properties...) and even do some real time edition.+Debugger is a tool that can be used to inspect the content of your game (values of variables, existing instances and their properties...) and even do some real-time editing.
  
 You can launch the debugger using this icon: You can launch the debugger using this icon:
Line 92: Line 109:
 {{ :​gdevelop5:​interface:​debugger-button.png?​nolink |}} {{ :​gdevelop5:​interface:​debugger-button.png?​nolink |}}
  
-[[gdevelop5:​interface:​debugger|See this page]] to know more about using the Debugger.+[[gdevelop5:​interface:​debugger|See this page]] to learn more about the Debugger ​usage.