01 Getting Started.lyx 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558
  1. #LyX 1.6.5 created this file. For more info see http://www.lyx.org/
  2. \lyxformat 345
  3. \begin_document
  4. \begin_header
  5. \textclass article
  6. \use_default_options true
  7. \language english
  8. \inputencoding auto
  9. \font_roman default
  10. \font_sans default
  11. \font_typewriter default
  12. \font_default_family default
  13. \font_sc false
  14. \font_osf false
  15. \font_sf_scale 100
  16. \font_tt_scale 100
  17. \graphics default
  18. \paperfontsize default
  19. \use_hyperref false
  20. \papersize default
  21. \use_geometry false
  22. \use_amsmath 1
  23. \use_esint 1
  24. \cite_engine basic
  25. \use_bibtopic false
  26. \paperorientation portrait
  27. \secnumdepth 3
  28. \tocdepth 3
  29. \paragraph_separation indent
  30. \defskip medskip
  31. \quotes_language english
  32. \papercolumns 1
  33. \papersides 1
  34. \paperpagestyle default
  35. \tracking_changes false
  36. \output_changes false
  37. \author ""
  38. \author ""
  39. \end_header
  40. \begin_body
  41. \begin_layout Title
  42. 01.
  43. Getting Started with Godot Engine
  44. \end_layout
  45. \begin_layout Section*
  46. Introduction:
  47. \end_layout
  48. \begin_layout Standard
  49. Godot Engine is designed to be useful.
  50. This may sound rather vague and is difficult to explain without repeating
  51. the same claims that every other engine does, but, as we progress through
  52. this (and the next) tutorials, hopefully it will be made clear what
  53. \begin_inset Quotes eld
  54. \end_inset
  55. useful
  56. \begin_inset Quotes erd
  57. \end_inset
  58. means.
  59. \end_layout
  60. \begin_layout Standard
  61. Godot Engine has many components, both high and low level, and is usually
  62. more abstract and complex than most other engines.
  63. This is, however, to the advantage of the user as complexity is presented
  64. in a way that it only needs to be discovered when more power needs to be
  65. untapped.
  66. This helps to provide an easy learning curve.
  67. \end_layout
  68. \begin_layout Standard
  69. Design wise, the whole API and set of components were created with a clear
  70. goal in mind, which is to allow for smooth integration of design ideas,
  71. code and assets.
  72. This is achieved by defining the following rules:
  73. \end_layout
  74. \begin_layout Itemize
  75. Implementing a game feature should never be too many steps away from an
  76. existing component.
  77. \end_layout
  78. \begin_layout Itemize
  79. More complex features should be leveraged by combining or extending existing
  80. components.
  81. \end_layout
  82. \begin_layout Itemize
  83. If the above fails, creating custom components should be extremely simple.
  84. \end_layout
  85. \begin_layout Standard
  86. Ultimately, Godot Engine provides an editor and tools that allows everyone
  87. to work with it:
  88. \end_layout
  89. \begin_layout Itemize
  90. Programmers can script and extend any component of the project.
  91. \end_layout
  92. \begin_layout Itemize
  93. Designers can tweak and animate any parameter from a friendly user interface.
  94. \end_layout
  95. \begin_layout Itemize
  96. Artists can import their art and models and tweak the look of everything
  97. in realtime.
  98. \end_layout
  99. \begin_layout Section*
  100. Editor:
  101. \end_layout
  102. \begin_layout Standard
  103. As mentioned before, Godot Engine is very abstract so projects consist of
  104. just a
  105. \emph on
  106. path
  107. \emph default
  108. (ie: C:
  109. \backslash
  110. games
  111. \backslash
  112. mygame5).
  113. Projects don't have to be specifically created, and many can be placed
  114. inside the same path (useful for not wasting folders on tests and experiments).
  115. \end_layout
  116. \begin_layout Standard
  117. In any case, to ease the management of projects, a graphical util exists.
  118. \end_layout
  119. \begin_layout Subsection*
  120. Running From The Project Manager
  121. \end_layout
  122. \begin_layout Standard
  123. Godot Engine includes a built-in project manager.
  124. This is installed by default on Windows and OSX and it allows for the creation
  125. and removal projects that will be remembered at the next startup:
  126. \end_layout
  127. \begin_layout Standard
  128. \align center
  129. \begin_inset Graphics
  130. filename pm.png
  131. \end_inset
  132. \end_layout
  133. \begin_layout Standard
  134. To create a new project, the [Create] button must be pressed and a dialog
  135. will appear, prompting for a path and project name.
  136. Afterwards, the [Open] button will close the project manager and open the
  137. desired project.
  138. \end_layout
  139. \begin_layout Subsection*
  140. Running From the Command Line
  141. \end_layout
  142. \begin_layout Standard
  143. To create and manage projects, it is perfectly possible to use the command
  144. line.
  145. Many users prefer this way of working with project data.
  146. \end_layout
  147. \begin_layout Standard
  148. \align center
  149. \begin_inset Graphics
  150. filename pmc.png
  151. \end_inset
  152. \end_layout
  153. \begin_layout Standard
  154. For ease of use, it is recommended that the
  155. \begin_inset Quotes eld
  156. \end_inset
  157. godot
  158. \begin_inset Quotes erd
  159. \end_inset
  160. binary exists in the path, so any project can be opened easily aywhere
  161. just by changing location to the projec and executing the editor.
  162. \end_layout
  163. \begin_layout Subsection*
  164. Godot Editor
  165. \end_layout
  166. \begin_layout Standard
  167. Godot Editor should have been opened by now, if not please check the previous
  168. steps again.
  169. \end_layout
  170. \begin_layout Standard
  171. Godot has a powerful buit-in editor.
  172. It uses the graphics toolkint within itself to display the UI, so it runs
  173. identical on any platform (even consoles or phones!).
  174. \end_layout
  175. \begin_layout Standard
  176. \align center
  177. \begin_inset Graphics
  178. filename editor.png
  179. \end_inset
  180. \end_layout
  181. \begin_layout Standard
  182. In the above screenshots, a few regions are labelled to be explained as
  183. follows:
  184. \end_layout
  185. \begin_layout Subsubsection*
  186. Viewport
  187. \end_layout
  188. \begin_layout Standard
  189. The
  190. \emph on
  191. Viewport
  192. \emph default
  193. is the main space where the content is displayed.
  194. Content includes 3D Nodes or Graphical User Interface (GUI) controls.
  195. Other types of data spawn editors of their own when being edited.
  196. The default viewport is the 3D viewport, which can be panned, zoomed, etc.
  197. \end_layout
  198. \begin_layout Subsubsection*
  199. Scene Tree
  200. \end_layout
  201. \begin_layout Standard
  202. The
  203. \emph on
  204. Scene Tree
  205. \emph default
  206. is a small dock that displays the tree of the current scene being edited.
  207. A scene is a collection of nodes arranged in a tree-hierarchy (any node
  208. can have several owned children-nodes).
  209. The meaning of this ownership depends purely on the
  210. \emph on
  211. type
  212. \emph default
  213. of the node, but it will become clear after going through the examples.
  214. In a
  215. \emph on
  216. MVC
  217. \emph default
  218. pattern, the scene tree could be considered the
  219. \emph on
  220. View
  221. \emph default
  222. .
  223. \end_layout
  224. \begin_layout Subsubsection*
  225. Property Editor
  226. \end_layout
  227. \begin_layout Standard
  228. The
  229. \emph on
  230. Property Editor
  231. \emph default
  232. is another small dock.
  233. Every node contains a finite number of
  234. \emph on
  235. properties
  236. \emph default
  237. , which can be edited.
  238. Properties can be of several types, such as integers, strings, images,
  239. matrices, etc.
  240. Usually, changes to properties are reflected in the
  241. \emph on
  242. viewport
  243. \emph default
  244. in real time.
  245. \end_layout
  246. \begin_layout Section*
  247. Examples:
  248. \end_layout
  249. \begin_layout Standard
  250. From now, a few, simple examples will be presented that will help understand
  251. a little better how Godot Engine works.
  252. \end_layout
  253. \begin_layout Subsubsection*
  254. Hello, World!
  255. \end_layout
  256. \begin_layout Enumerate
  257. Open the editor
  258. \end_layout
  259. \begin_layout Enumerate
  260. Click on
  261. \begin_inset Quotes eld
  262. \end_inset
  263. Node
  264. \begin_inset Quotes erd
  265. \end_inset
  266. (Node Menu), then on
  267. \begin_inset Quotes eld
  268. \end_inset
  269. Create Root
  270. \begin_inset Quotes erd
  271. \end_inset
  272. \end_layout
  273. \begin_deeper
  274. \begin_layout Standard
  275. \align center
  276. \begin_inset Graphics
  277. filename tute1_1.png
  278. \end_inset
  279. \end_layout
  280. \end_deeper
  281. \begin_layout Enumerate
  282. Create a node of type
  283. \emph on
  284. Label,
  285. \emph default
  286. then instruct the
  287. \emph on
  288. editor
  289. \emph default
  290. to switch to GUI editing mode.
  291. A few red squares will appear on the top left corner, don't mind them yet.
  292. \end_layout
  293. \begin_deeper
  294. \begin_layout Standard
  295. \align center
  296. \begin_inset Graphics
  297. filename tute1_2.png
  298. \end_inset
  299. \end_layout
  300. \begin_layout Standard
  301. \align center
  302. \begin_inset Graphics
  303. filename tute1_2b.png
  304. \end_inset
  305. \end_layout
  306. \begin_layout Standard
  307. \align center
  308. \begin_inset Graphics
  309. filename tute1_3c.png
  310. \end_inset
  311. \end_layout
  312. \end_deeper
  313. \begin_layout Enumerate
  314. Select the
  315. \emph on
  316. Label
  317. \emph default
  318. node in the
  319. \emph on
  320. Scene Tree
  321. \emph default
  322. (if it's not selected yet), the properties of the selected node will appear
  323. in the
  324. \emph on
  325. Property Editor
  326. \end_layout
  327. \begin_deeper
  328. \begin_layout Standard
  329. \align center
  330. \begin_inset Graphics
  331. filename tute1_3a.png
  332. \end_inset
  333. \end_layout
  334. \begin_layout Standard
  335. \align center
  336. \begin_inset Graphics
  337. filename tute1_3b.png
  338. \end_inset
  339. \end_layout
  340. \end_deeper
  341. \begin_layout Enumerate
  342. Look for the
  343. \emph on
  344. Text
  345. \emph default
  346. property in the
  347. \emph on
  348. Property Editor
  349. \emph default
  350. and click the right column, so it becomes editable.
  351. Enter the text
  352. \begin_inset Quotes eld
  353. \end_inset
  354. Hello, World!
  355. \begin_inset Quotes erd
  356. \end_inset
  357. .
  358. A red square containing
  359. \begin_inset Quotes eld
  360. \end_inset
  361. Hello World!
  362. \begin_inset Quotes erd
  363. \end_inset
  364. will appear at the top left, move it to the center.
  365. \end_layout
  366. \begin_deeper
  367. \begin_layout Standard
  368. \align center
  369. \begin_inset Graphics
  370. filename tute1_4a.png
  371. \end_inset
  372. \end_layout
  373. \begin_layout Standard
  374. \align center
  375. \begin_inset Graphics
  376. filename tute1_4b.png
  377. \end_inset
  378. \end_layout
  379. \end_deeper
  380. \begin_layout Enumerate
  381. Save the scene.
  382. \end_layout
  383. \begin_deeper
  384. \begin_layout Standard
  385. \align center
  386. \begin_inset Graphics
  387. filename tute1_5a.png
  388. \end_inset
  389. \end_layout
  390. \begin_layout Standard
  391. \align center
  392. \begin_inset Graphics
  393. filename tute1_5b.png
  394. \end_inset
  395. \end_layout
  396. \end_deeper
  397. \begin_layout Enumerate
  398. Press PLAY.
  399. A new window will appear running the application.
  400. \end_layout
  401. \begin_deeper
  402. \begin_layout Standard
  403. \align center
  404. \begin_inset Graphics
  405. filename tute1_6.png
  406. \end_inset
  407. \end_layout
  408. \begin_layout Standard
  409. \align center
  410. \begin_inset Graphics
  411. filename tute1_7.png
  412. \end_inset
  413. \end_layout
  414. \end_deeper
  415. \begin_layout Subsubsection*
  416. Hello World 2 (a little more complex)
  417. \end_layout
  418. \begin_layout Subsubsection*
  419. A 3D Cube in Space
  420. \end_layout
  421. \begin_layout Standard
  422. \end_layout
  423. \begin_layout Standard
  424. In many cases, nodes and other types of engine objects need to express changes
  425. in their state, such as a button being pressed, a scroll being dragged,
  426. or a projectile colliding against a tank.
  427. Godot Engine utilizes the concept of signals for this.
  428. Different types of nodes and objects can emit signals, and any other node
  429. or object can connect to them.
  430. \end_layout
  431. \end_body
  432. \end_document