scenes_and_nodes.rst 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. .. _doc_scenes_and_nodes:
  2. Scenes and nodes
  3. ================
  4. Introduction
  5. ------------
  6. .. image:: img/chef.png
  7. Imagine for a second that you are not a game developer anymore. Instead,
  8. you're a chef! Change your hipster outfit for a toque and a double
  9. breasted jacket. Now, instead of making games, you create new and
  10. delicious recipes for your guests.
  11. So, how does a chef create a recipe? Recipes are divided into two
  12. sections: the first is the ingredients and the second is the
  13. instructions to prepare it. This way, anyone can follow the recipe and
  14. savor your magnificent creation.
  15. Making games in Godot feels pretty much the same way. Using the engine
  16. feels like being in a kitchen. In this kitchen, *nodes* are like a
  17. refrigerator full of fresh ingredients with which to cook.
  18. There are many types of nodes. Some show images, others play sound,
  19. other nodes display 3D models, etc. There are dozens of them.
  20. Nodes
  21. -----
  22. But let's start with the basics. Nodes are fundamental building blocks for
  23. creating a game. As mentioned above, a node can perform a variety of specialized
  24. functions. However, any given node always has the following attributes:
  25. - It has a name.
  26. - It has editable properties.
  27. - It can receive a callback to process every frame.
  28. - It can be extended (to have more functions).
  29. - It can be added to another node as a child.
  30. .. image:: img/tree.png
  31. The last one is important. Nodes can have other nodes as
  32. children. When arranged in this way, the nodes become a **tree**.
  33. In Godot, the ability to arrange nodes in this way creates a powerful
  34. tool for organizing projects. Since different nodes have different
  35. functions, combining them allows for the creation of more complex functions.
  36. Don't worry if this doesn't click yet. We will continue to explore this over
  37. the next few sections. The most important fact to remember for now is that
  38. nodes exist and can be arranged this way.
  39. Scenes
  40. ------
  41. .. image:: img/scene_tree_example.png
  42. Now that the concept of nodes has been defined, the next logical
  43. step is to explain what a Scene is.
  44. A scene is composed of a group of nodes organized hierarchically (in
  45. tree fashion). Furthermore, a scene:
  46. - always has one root node.
  47. - can be saved to disk and loaded back.
  48. - can be *instanced* (more on that later).
  49. Running a game means running a scene. A project can contain several scenes,
  50. but for the game to start, one of them must be selected as the main scene.
  51. Basically, the Godot editor is a **scene editor**. It has plenty of tools for
  52. editing 2D and 3D scenes as well as user interfaces, but the editor is based on
  53. the concept of editing a scene and the nodes that compose it.
  54. Editor
  55. ------
  56. Open the project you made in :ref:`doc_intro_to_the_editor_interface`, or create a new one. This will
  57. open the Godot editor:
  58. .. image:: img/empty_editor.png
  59. As mentioned before, making games in Godot feels like being in a
  60. kitchen, so let's open the refrigerator and add some fresh nodes to the
  61. project. We'll begin with a "Hello World" message that we'll put on the
  62. screen.
  63. To do this we need to add a Label node. Press the "Add Child Node" button
  64. at the top left of the scene dock (the icon represents a plus symbol).
  65. This button is the main way to add new nodes to a scene, and will always
  66. add the chosen node as a child of the currently selected node (or, in an
  67. empty scene, as the "root" node).
  68. .. note::
  69. In an empty scene (without root node), the scene dock shows several
  70. options to quickly add a root node to the scene. "2D Scene" adds a
  71. Node2D node, "3D Scene" adds a Spatial node, "User Interface" adds a
  72. Control node, and "Other Node" which lets you select any node (so it
  73. is equivalent to pressing the "Add Child Node" button). You can also
  74. press the star-shaped icon to toggle the display of your favorited
  75. nodes.
  76. Note that these presets are here for convenience and are not mandatory
  77. for the different types of scenes. Not every 3D scene needs a Spatial
  78. node as its root node, likewise not every GUI or 2D scene needs a Control
  79. node or Node2D as their root node.
  80. Now, to add a label node to this scene you can click on the Other Node
  81. button or the Add Node button at the top. In scenes that aren't empty you
  82. use the add node button to create every child node.
  83. .. image:: img/newnode_button.png
  84. This will open the Create Node dialog, showing the long list of nodes
  85. that can be created:
  86. .. image:: img/node_classes.png
  87. From there, select the "Label" node first. Searching for it is probably
  88. the fastest way:
  89. .. image:: img/node_search_label.png
  90. And finally, create the Label! A lot happens when Create is pressed:
  91. .. image:: img/editor_with_label.png
  92. First of all, the scene changes to the 2D editor (because Label is a 2D Node
  93. type), and the Label appears, selected, at the top left corner of the viewport.
  94. The node appears in the scene tree editor in the Scene dock, and the label
  95. properties appear in the Inspector dock.
  96. The next step will be to change the "Text" Property of the label. Let's
  97. change it to "Hello World":
  98. .. image:: img/hw.png
  99. Ok, everything's ready to run the scene! Press the PLAY SCENE Button on
  100. the top bar (or hit :kbd:`F6`):
  101. .. image:: img/playscene.png
  102. Aaaand... Oops.
  103. .. image:: img/neversaved.png
  104. Scenes need to be saved to be run, so save the scene to something like
  105. Hello.tscn in Scene -> Save:
  106. .. image:: img/save_scene.png
  107. And here's when something funny happens. The file dialog is a special
  108. file dialog, and only allows you to save inside the project. The project
  109. root is ``res://`` which means "resource path". This means that files can
  110. only be saved inside the project. For the future, when doing file
  111. operations in Godot, remember that ``res://`` is the resource path, and no
  112. matter the platform or install location, it is the way to locate where
  113. resource files are from inside the game.
  114. After saving the scene and pressing run scene again, the "Hello World"
  115. demo should finally execute:
  116. .. image:: img/helloworld.png
  117. Success!
  118. .. note::
  119. If this doesn't immediately work and you have a hiDPI display on
  120. at least one of your monitors, go to
  121. **Project → Project Settings → Display → Window** then enable
  122. **Allow Hidpi** under **Dpi**.
  123. .. _doc_scenes_and_nodes-configuring_the_project:
  124. Configuring the project
  125. -----------------------
  126. Ok, it's time to configure the project. Right now, the only way to run
  127. something is to execute the current scene. Projects, however, may have several
  128. scenes, so one of them must be set as the main scene. This is the scene that
  129. will be loaded any time the project is run.
  130. These settings are all stored in a project.godot file, which is a plaintext
  131. file in win.ini format (for easy editing). There are dozens of settings that
  132. you can change in this file to alter how a project executes. To simplify this
  133. process, Godot provides a project settings dialog, which acts as a sort of
  134. frontend to editing a project.godot file.
  135. To access that dialog, select Project -> Project Settings. Try it now.
  136. Once the window opens, let's select a main scene. Locate the
  137. `Application/Run/Main Scene` property and click on it to select 'Hello.tscn'.
  138. .. image:: img/main_scene.png
  139. Now, with this change, when you press the regular Play button (or F5), this
  140. scene will run, no matter which scene is actively being edited.
  141. The project settings dialog provides a lot of options that can be saved to a
  142. project.godot file and shows their default values. If you change a value, a
  143. tick is marked to the left of its name. This means that the property will be
  144. saved to the project.godot file and remembered.
  145. As a side note, it is also possible to add custom configuration options and
  146. read them in at run-time using the :ref:`ProjectSettings <class_ProjectSettings>` singleton.
  147. To be continued...
  148. ------------------
  149. This tutorial talked about "scenes and nodes", but so far there has been
  150. only *one* scene and *one* node! Don't worry, the next tutorial will
  151. expand on that...