558 lines
10 KiB
Text
558 lines
10 KiB
Text
|
#LyX 1.6.5 created this file. For more info see http://www.lyx.org/
|
||
|
|
\lyxformat 345
|
||
|
|
\begin_document
|
||
|
|
\begin_header
|
||
|
|
\textclass article
|
||
|
|
\use_default_options true
|
||
|
|
\language english
|
||
|
|
\inputencoding auto
|
||
|
|
\font_roman default
|
||
|
|
\font_sans default
|
||
|
|
\font_typewriter default
|
||
|
|
\font_default_family default
|
||
|
|
\font_sc false
|
||
|
|
\font_osf false
|
||
|
|
\font_sf_scale 100
|
||
|
|
\font_tt_scale 100
|
||
|
|
|
||
|
|
\graphics default
|
||
|
|
\paperfontsize default
|
||
|
|
\use_hyperref false
|
||
|
|
\papersize default
|
||
|
|
\use_geometry false
|
||
|
|
\use_amsmath 1
|
||
|
|
\use_esint 1
|
||
|
|
\cite_engine basic
|
||
|
|
\use_bibtopic false
|
||
|
|
\paperorientation portrait
|
||
|
|
\secnumdepth 3
|
||
|
|
\tocdepth 3
|
||
|
|
\paragraph_separation indent
|
||
|
|
\defskip medskip
|
||
|
|
\quotes_language english
|
||
|
|
\papercolumns 1
|
||
|
|
\papersides 1
|
||
|
|
\paperpagestyle default
|
||
|
|
\tracking_changes false
|
||
|
|
\output_changes false
|
||
|
|
\author ""
|
||
|
|
\author ""
|
||
|
|
\end_header
|
||
|
|
|
||
|
|
\begin_body
|
||
|
|
|
||
|
|
\begin_layout Title
|
||
|
|
01.
|
||
|
|
Getting Started with Godot Engine
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Section*
|
||
|
|
Introduction:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Godot Engine is designed to be useful.
|
||
|
|
This may sound rather vague and is difficult to explain without repeating
|
||
|
|
the same claims that every other engine does, but, as we progress through
|
||
|
|
this (and the next) tutorials, hopefully it will be made clear what
|
||
|
|
\begin_inset Quotes eld
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
useful
|
||
|
|
\begin_inset Quotes erd
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
means.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Godot Engine has many components, both high and low level, and is usually
|
||
|
|
more abstract and complex than most other engines.
|
||
|
|
This is, however, to the advantage of the user as complexity is presented
|
||
|
|
in a way that it only needs to be discovered when more power needs to be
|
||
|
|
untapped.
|
||
|
|
This helps to provide an easy learning curve.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Design wise, the whole API and set of components were created with a clear
|
||
|
|
goal in mind, which is to allow for smooth integration of design ideas,
|
||
|
|
code and assets.
|
||
|
|
This is achieved by defining the following rules:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Itemize
|
||
|
|
Implementing a game feature should never be too many steps away from an
|
||
|
|
existing component.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Itemize
|
||
|
|
More complex features should be leveraged by combining or extending existing
|
||
|
|
components.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Itemize
|
||
|
|
If the above fails, creating custom components should be extremely simple.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Ultimately, Godot Engine provides an editor and tools that allows everyone
|
||
|
|
to work with it:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Itemize
|
||
|
|
Programmers can script and extend any component of the project.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Itemize
|
||
|
|
Designers can tweak and animate any parameter from a friendly user interface.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Itemize
|
||
|
|
Artists can import their art and models and tweak the look of everything
|
||
|
|
in realtime.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Section*
|
||
|
|
Editor:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
As mentioned before, Godot Engine is very abstract so projects consist of
|
||
|
|
just a
|
||
|
|
\emph on
|
||
|
|
path
|
||
|
|
\emph default
|
||
|
|
(ie: C:
|
||
|
|
\backslash
|
||
|
|
games
|
||
|
|
\backslash
|
||
|
|
mygame5).
|
||
|
|
Projects don't have to be specifically created, and many can be placed
|
||
|
|
inside the same path (useful for not wasting folders on tests and experiments).
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
In any case, to ease the management of projects, a graphical util exists.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsection*
|
||
|
|
Running From The Project Manager
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Godot Engine includes a built-in project manager.
|
||
|
|
This is installed by default on Windows and OSX and it allows for the creation
|
||
|
|
and removal projects that will be remembered at the next startup:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename pm.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
To create a new project, the [Create] button must be pressed and a dialog
|
||
|
|
will appear, prompting for a path and project name.
|
||
|
|
Afterwards, the [Open] button will close the project manager and open the
|
||
|
|
desired project.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsection*
|
||
|
|
Running From the Command Line
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
To create and manage projects, it is perfectly possible to use the command
|
||
|
|
line.
|
||
|
|
Many users prefer this way of working with project data.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename pmc.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
For ease of use, it is recommended that the
|
||
|
|
\begin_inset Quotes eld
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
godot
|
||
|
|
\begin_inset Quotes erd
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
binary exists in the path, so any project can be opened easily aywhere
|
||
|
|
just by changing location to the projec and executing the editor.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsection*
|
||
|
|
Godot Editor
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Godot Editor should have been opened by now, if not please check the previous
|
||
|
|
steps again.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
Godot has a powerful buit-in editor.
|
||
|
|
It uses the graphics toolkint within itself to display the UI, so it runs
|
||
|
|
identical on any platform (even consoles or phones!).
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename editor.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
In the above screenshots, a few regions are labelled to be explained as
|
||
|
|
follows:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsubsection*
|
||
|
|
Viewport
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
The
|
||
|
|
\emph on
|
||
|
|
Viewport
|
||
|
|
\emph default
|
||
|
|
is the main space where the content is displayed.
|
||
|
|
Content includes 3D Nodes or Graphical User Interface (GUI) controls.
|
||
|
|
Other types of data spawn editors of their own when being edited.
|
||
|
|
The default viewport is the 3D viewport, which can be panned, zoomed, etc.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsubsection*
|
||
|
|
Scene Tree
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
The
|
||
|
|
\emph on
|
||
|
|
Scene Tree
|
||
|
|
\emph default
|
||
|
|
is a small dock that displays the tree of the current scene being edited.
|
||
|
|
A scene is a collection of nodes arranged in a tree-hierarchy (any node
|
||
|
|
can have several owned children-nodes).
|
||
|
|
The meaning of this ownership depends purely on the
|
||
|
|
\emph on
|
||
|
|
type
|
||
|
|
\emph default
|
||
|
|
of the node, but it will become clear after going through the examples.
|
||
|
|
In a
|
||
|
|
\emph on
|
||
|
|
MVC
|
||
|
|
\emph default
|
||
|
|
pattern, the scene tree could be considered the
|
||
|
|
\emph on
|
||
|
|
View
|
||
|
|
\emph default
|
||
|
|
.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsubsection*
|
||
|
|
Property Editor
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
The
|
||
|
|
\emph on
|
||
|
|
Property Editor
|
||
|
|
\emph default
|
||
|
|
is another small dock.
|
||
|
|
Every node contains a finite number of
|
||
|
|
\emph on
|
||
|
|
properties
|
||
|
|
\emph default
|
||
|
|
, which can be edited.
|
||
|
|
Properties can be of several types, such as integers, strings, images,
|
||
|
|
matrices, etc.
|
||
|
|
Usually, changes to properties are reflected in the
|
||
|
|
\emph on
|
||
|
|
viewport
|
||
|
|
\emph default
|
||
|
|
in real time.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Section*
|
||
|
|
Examples:
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
From now, a few, simple examples will be presented that will help understand
|
||
|
|
a little better how Godot Engine works.
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsubsection*
|
||
|
|
Hello, World!
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Open the editor
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Click on
|
||
|
|
\begin_inset Quotes eld
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
Node
|
||
|
|
\begin_inset Quotes erd
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
(Node Menu), then on
|
||
|
|
\begin_inset Quotes eld
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
Create Root
|
||
|
|
\begin_inset Quotes erd
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_deeper
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_1.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_deeper
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Create a node of type
|
||
|
|
\emph on
|
||
|
|
Label,
|
||
|
|
\emph default
|
||
|
|
then instruct the
|
||
|
|
\emph on
|
||
|
|
editor
|
||
|
|
\emph default
|
||
|
|
to switch to GUI editing mode.
|
||
|
|
A few red squares will appear on the top left corner, don't mind them yet.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_deeper
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_2.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_2b.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_3c.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_deeper
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Select the
|
||
|
|
\emph on
|
||
|
|
Label
|
||
|
|
\emph default
|
||
|
|
node in the
|
||
|
|
\emph on
|
||
|
|
Scene Tree
|
||
|
|
\emph default
|
||
|
|
(if it's not selected yet), the properties of the selected node will appear
|
||
|
|
in the
|
||
|
|
\emph on
|
||
|
|
Property Editor
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_deeper
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_3a.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_3b.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_deeper
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Look for the
|
||
|
|
\emph on
|
||
|
|
Text
|
||
|
|
\emph default
|
||
|
|
property in the
|
||
|
|
\emph on
|
||
|
|
Property Editor
|
||
|
|
\emph default
|
||
|
|
and click the right column, so it becomes editable.
|
||
|
|
Enter the text
|
||
|
|
\begin_inset Quotes eld
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
Hello, World!
|
||
|
|
\begin_inset Quotes erd
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
.
|
||
|
|
A red square containing
|
||
|
|
\begin_inset Quotes eld
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
Hello World!
|
||
|
|
\begin_inset Quotes erd
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
will appear at the top left, move it to the center.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_deeper
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_4a.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_4b.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_deeper
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Save the scene.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_deeper
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_5a.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_5b.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_deeper
|
||
|
|
\begin_layout Enumerate
|
||
|
|
Press PLAY.
|
||
|
|
A new window will appear running the application.
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_deeper
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_6.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
\align center
|
||
|
|
\begin_inset Graphics
|
||
|
|
filename tute1_7.png
|
||
|
|
|
||
|
|
\end_inset
|
||
|
|
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_deeper
|
||
|
|
\begin_layout Subsubsection*
|
||
|
|
Hello World 2 (a little more complex)
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Subsubsection*
|
||
|
|
A 3D Cube in Space
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\begin_layout Standard
|
||
|
|
In many cases, nodes and other types of engine objects need to express changes
|
||
|
|
in their state, such as a button being pressed, a scroll being dragged,
|
||
|
|
or a projectile colliding against a tank.
|
||
|
|
Godot Engine utilizes the concept of signals for this.
|
||
|
|
Different types of nodes and objects can emit signals, and any other node
|
||
|
|
or object can connect to them.
|
||
|
|
|
||
|
|
\end_layout
|
||
|
|
|
||
|
|
\end_body
|
||
|
|
\end_document
|