First look at editor's interface iteration
@@ -31,10 +31,10 @@ Types of assets
|
||||
Be aware that there are, broadly, two different types of assets you can post.
|
||||
|
||||
* Assets labeled as "Templates", "Projects", or "Demos" appear under
|
||||
the "Asset Library Projects" tab in the Godot Project Manager. These assets are
|
||||
the "Asset Library" tab in the Godot Project Manager. These assets are
|
||||
standalone Godot projects that can run by themselves.
|
||||
|
||||
* Other assets show up inside of the Godot editor under the "AssetLib"
|
||||
* Other assets show up inside of the Godot editor under the "Asset Library"
|
||||
main screen tab, next to "2D", "3D", and "Script". These assets are
|
||||
meant to be downloaded and placed into an existing Godot project.
|
||||
|
||||
|
||||
@@ -6,104 +6,122 @@
|
||||
|
||||
.. _doc_intro_to_the_editor_interface:
|
||||
|
||||
First look at Godot's editor
|
||||
============================
|
||||
First look at Godot's interface
|
||||
===============================
|
||||
|
||||
This page will give you a brief overview of Godot's interface. We're going to
|
||||
look at the different main screens and docks to help you situate yourself.
|
||||
|
||||
.. seealso:: For a comprehensive breakdown of the editor's interface and how to
|
||||
use it, see the :ref:`Editor manual <toc-learn-editor>`.
|
||||
use it, see the :ref:`Editor manual <doc_editor_introduction>`.
|
||||
|
||||
The Project Manager
|
||||
-------------------
|
||||
|
||||
When you launch Godot, the first window you see is the Project Manager. In the
|
||||
default tab **Local Projects**, you can manage existing projects, import or create new
|
||||
default tab **Projects**, you can manage existing projects, import or create new
|
||||
ones, and more.
|
||||
|
||||
.. image:: img/editor_intro_project_manager.webp
|
||||
|
||||
At the top of the window, there is another tab named "Asset Library Projects". The first
|
||||
time you go to this tab you'll see a "Go Online" button. For privacy reasons the Godot
|
||||
At the top of the window, there is another tab named **Asset Library**. The first
|
||||
time you go to this tab you'll see a "Go Online" button. For privacy reasons, the Godot
|
||||
project manager does not access the internet by default. To change this click
|
||||
the "Go Online button", if you want to change your network mode back to "offline" you
|
||||
can do so from the project manager settings.
|
||||
the "Go Online" button. You can change this option later in the settings.
|
||||
|
||||
Once your network mode is set to "online" you can search for demo projects in the open
|
||||
source asset library, which includes many projects developed by the community.
|
||||
Once your network mode is set to "online", you can search for demo projects in the open
|
||||
source asset library, which includes many projects developed by the community:
|
||||
|
||||
.. image:: img/editor_intro_project_templates.webp
|
||||
|
||||
The Project Manager's settings can be opened using the **Settings** menu:
|
||||
|
||||
.. image:: img/editor_intro_settings.webp
|
||||
|
||||
From here, you can change the editor's language (default is the system language), interface theme, display
|
||||
scale, network mode, and also the directory naming convention.
|
||||
|
||||
.. seealso:: To learn the Project Manager's ins and outs, read
|
||||
:ref:`doc_project_manager`.
|
||||
|
||||
.. image:: img/editor_intro_project_templates.webp
|
||||
|
||||
You can also change the editor's language by going into the settings menu.
|
||||
|
||||
.. image:: img/editor_intro_settings.webp
|
||||
|
||||
From here use the language drop down menu to select your language. By default, it is in
|
||||
English (EN).
|
||||
|
||||
.. image:: img/editor_intro_language.webp
|
||||
|
||||
First look at Godot's editor
|
||||
----------------------------
|
||||
|
||||
When you open a new or an existing project, the editor's interface appears.
|
||||
Let's look at its main areas.
|
||||
Let's look at its main areas:
|
||||
|
||||
.. image:: img/editor_intro_editor_empty.webp
|
||||
|
||||
By default, it features **menus**, **main screens**, and playtest buttons along
|
||||
the window's top edge.
|
||||
By default, along the window's top edge, it features **main menu** on the left, **workspace** switching
|
||||
buttons in the center (active workspace is highlighted), and **playtest** buttons on the right:
|
||||
|
||||
.. image:: img/editor_intro_top_menus.webp
|
||||
|
||||
In the center is the **viewport** with its **toolbar** at the top, where you'll
|
||||
find tools to move, scale, or lock the scene's nodes.
|
||||
Just below the workspace buttons, the opened :ref:`scenes <doc_key_concepts_overview_scenes>`
|
||||
as tabs are seen. The plus (+) button right next to the tabs will add a new scene to the project.
|
||||
With the button on the far right, distraction-free mode can be toggled, which maximizes or restores
|
||||
the **viewport**'s size by hiding **docks** in the interface:
|
||||
|
||||
.. image:: img/editor_intro_scene_selector.webp
|
||||
|
||||
In the center, below the scene selector is the **viewport** with its **toolbar** at the top, where you'll
|
||||
find different tools to move, scale, or lock the scene's nodes (currently the 3D workspace is active):
|
||||
|
||||
.. image:: img/editor_intro_3d_viewport.webp
|
||||
|
||||
This toolbar changes based on the context and selected node. Here is the 2D toolbar:
|
||||
|
||||
.. image:: img/editor_intro_toolbar_2d.webp
|
||||
|
||||
Below is the 3D one:
|
||||
|
||||
.. image:: img/editor_intro_toolbar_3d.webp
|
||||
|
||||
.. seealso:: To learn more on workspaces, read :ref:`doc_intro_to_the_editor_interface_four_screens`.
|
||||
|
||||
.. seealso:: To learn more on the 3D viewport and 3D in general, read :ref:`doc_introduction_to_3d`.
|
||||
|
||||
On either side of the viewport sit the **docks**. And at the bottom of the
|
||||
window lies the **bottom panel**.
|
||||
|
||||
The toolbar changes based on the context and selected node. Here is the 2D toolbar.
|
||||
|
||||
.. image:: img/editor_intro_toolbar_2d.webp
|
||||
|
||||
Below is the 3D one.
|
||||
|
||||
.. image:: img/editor_intro_toolbar_3d.webp
|
||||
|
||||
Let's look at the docks. The **FileSystem** dock lists your project files, including
|
||||
scripts, images, audio samples, and more.
|
||||
scripts, images, audio samples, and more:
|
||||
|
||||
.. image:: img/editor_intro_filesystem_dock.webp
|
||||
|
||||
The **Scene** dock lists the active scene's nodes.
|
||||
The **Scene** dock lists the active scene's nodes:
|
||||
|
||||
.. image:: img/editor_intro_scene_dock.webp
|
||||
|
||||
The **Inspector** allows you to edit the properties of a selected node.
|
||||
The **Inspector** allows you to edit the properties of a selected node:
|
||||
|
||||
.. image:: img/editor_intro_inspector_dock.webp
|
||||
|
||||
.. seealso:: To read more on inspector, see :ref:`doc_editor_inspector_dock`.
|
||||
|
||||
.. seealso:: Docks can be customized. Read more on :ref:`doc_customizing_editor_moving_docks`.
|
||||
|
||||
The **bottom panel**, situated below the viewport, is the host for the debug
|
||||
console, the animation editor, the audio mixer, and more. They can take precious
|
||||
space, that's why they're folded by default.
|
||||
space, that's why they're folded by default:
|
||||
|
||||
.. image:: img/editor_intro_bottom_panels.webp
|
||||
|
||||
When you click on one, it expands vertically. Below, you can see the animation editor opened.
|
||||
When you click on one, it expands vertically. Below, you can see the animation editor opened:
|
||||
|
||||
.. image:: img/editor_intro_bottom_panel_animation.webp
|
||||
|
||||
Bottom panels can also be shown or hidden using the shortcuts defined in
|
||||
**Editor Settings > Shortcuts**, under the **Bottom Panels** category.
|
||||
|
||||
.. _doc_intro_to_the_editor_interface_four_screens:
|
||||
|
||||
The four main screens
|
||||
---------------------
|
||||
|
||||
There are four main screen buttons centered at the top of the editor:
|
||||
2D, 3D, Script, and AssetLib.
|
||||
2D, 3D, Script, and Asset Library.
|
||||
|
||||
You'll use the **2D screen** for all types of games. In addition to 2D games,
|
||||
the 2D screen is where you'll build your interfaces.
|
||||
@@ -115,11 +133,6 @@ In the **3D screen**, you can work with meshes, lights, and design levels for
|
||||
|
||||
.. image:: img/editor_intro_workspace_3d.webp
|
||||
|
||||
Notice the perspective button under the toolbar. Clicking on it opens a list of
|
||||
options related to the 3D view.
|
||||
|
||||
.. image:: img/editor_intro_3d_viewport_perspective.webp
|
||||
|
||||
.. note:: Read :ref:`doc_introduction_to_3d` for more detail about the **3D
|
||||
main screen**.
|
||||
|
||||
@@ -128,7 +141,7 @@ auto-completion, and built-in code reference.
|
||||
|
||||
.. image:: img/editor_intro_workspace_script.webp
|
||||
|
||||
Finally, the **AssetLib** is a library of free and open source add-ons, scripts,
|
||||
Finally, the **Asset Library** is a library of free and open source add-ons, scripts,
|
||||
and assets to use in your projects.
|
||||
|
||||
.. image:: img/editor_intro_workspace_assetlib.webp
|
||||
@@ -144,11 +157,12 @@ Godot comes with a built-in class reference.
|
||||
You can search for information about a class, method, property, constant, or
|
||||
signal by any one of the following methods:
|
||||
|
||||
* Pressing :kbd:`F1` (or :kbd:`Opt + Space` on macOS, or :kbd:`fn + F1` for laptops with a :kbd:`fn` key) anywhere in the editor.
|
||||
* Pressing :kbd:`F1` (or :kbd:`Opt + Space` on macOS, or :kbd:`Fn + F1` for laptops
|
||||
with a :kbd:`Fn` key) anywhere in the editor.
|
||||
* Clicking the "Search Help" button in the top-right of the Script main screen.
|
||||
* Clicking on the Help menu and Search Help.
|
||||
* :kbd:`Ctrl + Click` (:kbd:`Cmd + Click` on macOS) on a class name, function name, or built-in variable in the script editor.
|
||||
|
||||
* :kbd:`Ctrl + Click` (:kbd:`Cmd + Click` on macOS) on a class name, function name,
|
||||
or built-in variable in the script editor.
|
||||
|
||||
.. image:: img/editor_intro_search_help_button.webp
|
||||
|
||||
@@ -160,3 +174,11 @@ also use it to browse available objects and methods.
|
||||
Double-click on an item to open the corresponding page in the script main screen.
|
||||
|
||||
.. image:: img/editor_intro_help_class_animated_sprite.webp
|
||||
|
||||
Alternatively,
|
||||
|
||||
* Clicking while pressing the :kbd:`Ctrl` key on a class name, function name,
|
||||
or built-in variable in the script editor.
|
||||
* Right-clicking on nodes and choosing **Open Documentation** or choosing **Lookup Symbol**
|
||||
for elements in script editor will directly open their documentation.
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 115 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 696 B |
@@ -16,6 +16,8 @@ These are the four concepts you will learn here. We're going to look at them
|
||||
briefly to give you a sense of how the engine works. In the getting started
|
||||
series, you will get to use them in practice.
|
||||
|
||||
.. _doc_key_concepts_overview_scenes:
|
||||
|
||||
Scenes
|
||||
------
|
||||
|
||||
|
||||
@@ -7,6 +7,8 @@ Godot's interface lives in a single window by default. Since Godot 4.0, you can
|
||||
split several elements to separate windows to better make use of multi-monitor
|
||||
setups.
|
||||
|
||||
.. _doc_customizing_editor_moving_docks:
|
||||
|
||||
Moving and resizing docks
|
||||
-------------------------
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 9.5 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 4.5 KiB After Width: | Height: | Size: 10 KiB |
@@ -4,16 +4,24 @@ Using the Project Manager
|
||||
=========================
|
||||
|
||||
When you launch Godot, the first window you see is the Project Manager. It lets
|
||||
you create, remove, import, or play game projects.
|
||||
you create, remove, import, or play game projects:
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_01.webp
|
||||
|
||||
To change the editors language click on the "Settings" Button in the top right
|
||||
corner.
|
||||
To change the editors language click on the **Settings** Button in the top right
|
||||
corner:
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_02.webp
|
||||
|
||||
Then on the settings page select the language you want from the dropdown menu.
|
||||
In Project Manager Settings, you can change the interface **language** from the language
|
||||
dropdown menu, which is the system default language by default.
|
||||
|
||||
You can also change the **theme** of the editor, the **display scale** for different interface
|
||||
element sizes, and the availability of online functionality using **network mode**.
|
||||
If network mode is online, Godot will also check and inform you about new versions of Godot.
|
||||
|
||||
The **directory naming convention** can also be changed to replace spaces according to the chosen format
|
||||
when creating folders automatically.
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_10.webp
|
||||
|
||||
@@ -24,25 +32,43 @@ Creating and importing projects
|
||||
|
||||
To create a new project:
|
||||
|
||||
1. Click the **New** button on the top-left of the window.
|
||||
1. Click the **Create** button on the top-left of the window.
|
||||
2. Give the project a name, choose an empty folder on your computer to save the
|
||||
files, and select a rendering backend.
|
||||
3. Click the **Create & Edit** button to create the project folder and open it in the editor.
|
||||
files. Alternatively, you can enable **Create Folder** option to automatically create
|
||||
a new sub-folder with the project name, following the directory naming convention
|
||||
set in the settings. An empty folder will show a green tick on the right.
|
||||
3. Select one of the rendering backends (this can also be changed later).
|
||||
4. Click the **Create & Edit** button to create the project folder and open it in the editor.
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_04.webp
|
||||
|
||||
.. note:: You can optionally choose a version control system. Currently, only
|
||||
`git <https://git-scm.com>`__ is supported and it needs the Godot Git Plugin to be installed,
|
||||
either manually or using the :ref:`Asset Library <doc_using_assetlib>`. To learn more about the Godot Git Plugin, see its `wiki <https://github.com/godotengine/godot-git-plugin/wiki>`__.
|
||||
|
||||
Using the file browser
|
||||
~~~~~~~~~~~~~~~~~~~~~~
|
||||
|
||||
Click the **Browse** button to open Godot's file browser and pick a location or type
|
||||
the folder's path in the Project Path field.
|
||||
Click the **Browse** button to open Godot's file browser.
|
||||
You can pick a location or type the folder's path in the **Path** field, after choosing a drive.
|
||||
|
||||
Left of the path field on the top row contains arrows to navigate backward and forward through the last
|
||||
visited locations.
|
||||
The up arrow navigates to parent folder.
|
||||
On the right side of the path field, there are buttons to refresh the current folder's contents,
|
||||
favorite/unfavorite the current folder, and show/hide hidden folders.
|
||||
|
||||
Next, the buttons to switch the display type of the folders and files between grid view and list view
|
||||
are seen.
|
||||
|
||||
The last button on the right will create a new folder.
|
||||
|
||||
Favorited folders will be displayed on the left side under the **Favorites** section. You can sort the
|
||||
favorites using the up and down buttons in this section.
|
||||
Last chosen folders will be listed under the **Recent** list.
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_05.webp
|
||||
|
||||
When you see the green tick on the right, it means the engine detects an empty
|
||||
folder. You can also click the **Create Folder** button to create an empty
|
||||
folder based on your project's name.
|
||||
|
||||
Opening and importing projects
|
||||
------------------------------
|
||||
|
||||
@@ -57,6 +83,8 @@ edit it.
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_08.webp
|
||||
|
||||
Alternatively, it is possible to choose a zip file to be automatically extracted by Godot.
|
||||
|
||||
When the folder path is correct, you'll see a green checkmark.
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_09.webp
|
||||
@@ -66,15 +94,15 @@ When the folder path is correct, you'll see a green checkmark.
|
||||
Downloading demos and templates
|
||||
-------------------------------
|
||||
|
||||
From the **Asset Library Projects** tab you can download open source project
|
||||
templates and demos from the :ref:`Asset Library <doc_what_is_assetlib>` to help
|
||||
From the **Asset Library** tab you can download open source project
|
||||
templates and demos from the :ref:`Asset Library <toc-learn-features-assetlib>` to help
|
||||
you get started faster.
|
||||
|
||||
The first time you open this tab you'll notice that it's asking you to go online.
|
||||
For privacy reasons the project manager, and Godot editor, can't access the internet
|
||||
by default. To enable accessing the internet click the "Go Online" button. This will
|
||||
by default. To enable accessing the internet click the **Go Online** button. This will
|
||||
also allow project manager to notify you about updates. If you wish to turn this off
|
||||
in the future go into project manager settings and change "Network Mode" to "Offline"
|
||||
in the future go into project manager settings and change **Network Mode** to "Offline"
|
||||
|
||||
Now that Godot is connected to the internet you can download a demo or template, to
|
||||
do this:
|
||||
@@ -91,7 +119,7 @@ Managing projects with tags
|
||||
|
||||
For users with a lot of projects on one PC it can be a lot to keep track of. To aid
|
||||
in this Godot allows you to create project tags. To add a tag to a project click on the
|
||||
project in the project manager, then click on the "Manage Tags" button
|
||||
project in the project manager, then click on the **Manage Tags** button
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_11.webp
|
||||
|
||||
@@ -99,10 +127,17 @@ This will open up the manage project tags window. To add a tag click the plus bu
|
||||
|
||||
.. image:: img/editor_ui_intro_project_manager_12.webp
|
||||
|
||||
Type out the tag name, and click "ok". Your project will now have a tag added to it.
|
||||
These tags can be used for any other project in your project manager. In addition tags
|
||||
will stay with projects. So if you tag your project, send it to another machine and
|
||||
import it into the project manager you will see the tags you created.
|
||||
Type out the tag name, and click **OK**. Your project will now have a tag added to it.
|
||||
These tags can be used for any other project in your project manager.
|
||||
|
||||
To show projects with a specific tag only, you can click on the tags or write ``tag:``
|
||||
and type the tag you would like to search for in the filter bar. To limit the results
|
||||
using multiple tags, you can click on another tag or add ``tag:`` after
|
||||
a space and type another tag in the filter bar.
|
||||
|
||||
In addition, tags will stay with projects. So if you tag your project, send it to
|
||||
another machine, and import it into the project manager you will see the tags
|
||||
you created.
|
||||
|
||||
To remove a tag from your project manager it must be removed from all the projects it's
|
||||
used by. Once that's done close the project manager, open it up again, and the tag should
|
||||
|
||||