Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Interface manual basics #9632

Draft
wants to merge 7 commits into
base: master
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions getting_started/introduction/first_look_at_the_editor.rst
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ 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 <doc_editor_introduction>`.
use it, see the :ref:`Editor manual <toc-editor-interface>`.

The Project Manager
-------------------
Expand Down Expand Up @@ -82,8 +82,8 @@ Below is the 3D one:

.. 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**.
On either side of the viewport sit the :ref:`doc_docks`. And at the bottom of the
window lies the :ref:`doc_bottom_panel`.

Let's look at the docks. The **FileSystem** dock lists your project files, including
scripts, images, audio samples, and more:
Expand All @@ -100,7 +100,7 @@ The **Inspector** allows you to edit the properties of a selected node:

.. 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`.
.. seealso:: Docks can be customized. Read more on :ref:`doc_customizing_editor_moving_resizing_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
Expand Down
1 change: 1 addition & 0 deletions index.rst
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,7 @@ the ``GodotEngine.epub`` file in an e-book reader application.
tutorials/assets_pipeline/index
tutorials/audio/index
tutorials/export/index
tutorials/debug/index
tutorials/io/index
tutorials/i18n/index
tutorials/inputs/index
Expand Down
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -30,83 +30,12 @@ You can find these options in the **Debug** editor menu.

.. image:: img/overview_debug.webp

Here are the descriptions of the options:
Read more about all available options in the :ref:`doc_main_menus_debug` menu's documentation page.

Deploy with Remote Debug
++++++++++++++++++++++++
.. _doc_overview_of_debugging_tools_run_instances:

When this option is enabled, using one-click deploy will make the executable
attempt to connect to this computer's IP so the running project can be debugged.
This option is intended to be used for remote debugging (typically with a mobile
device).
You don't need to enable it to use the GDScript debugger locally.

Small Deploy with Network Filesystem
++++++++++++++++++++++++++++++++++++

This option speeds up testing for games with a large footprint on remote devices.

When **Small Deploy with Network Filesystem** is on, instead of exporting the
full game, deploying the game builds a minimal executable. The editor then
provides files from the project over the network.

Also, on Android, the game is deployed using the USB cable to speed up
deployment.

Visible Collision Shapes
++++++++++++++++++++++++

When this option is enabled, collision shapes and raycast nodes (for 2D and 3D)
will be visible in the running project.

Visible Paths
+++++++++++++

When this option is enabled, curve resources used by path nodes will be visible
in the running project.

Visible Navigation
++++++++++++++++++

When this option is enabled, navigation meshes, and polygons will be visible in
the running project.

Visible Avoidance
+++++++++++++++++

When this option is enabled, avoidance object shapes, radiuses, and velocities
will be visible in the running project.

Debug CanvasItem Redraws
++++++++++++++++++++++++

When this option is enabled, redraw requests of 2D objects will become visible
(as a short flash) in the running project.
This is useful to troubleshoot low processor mode.

Synchronize Scene Changes
++++++++++++++++++++++++++

When this option is enabled, any changes made to the scene in the editor will be
replicated in the running project.
When used remotely on a device, this is more efficient when the network
filesystem option is enabled.

Synchronize Script Changes
+++++++++++++++++++++++++++

When this option is enabled, any changes made to the script in the editor will
be reloaded in the running project. When used
remotely on a device, this is more efficient with the network filesystem.

Keep Debug Server Open
++++++++++++++++++++++

When this option is enabled, the editor debug server will stay open and listen
for new sessions started outside of the editor itself.

Customize Run Instances...
++++++++++++++++++++++++++
Customize Run Instances
-----------------------

This opens a dialog allowing you to tell Godot to run multiple instances of the
game at once, and to specify the command line arguments for each instance. This
Expand All @@ -115,7 +44,7 @@ is especially useful when building and debugging multiplayer games.
.. image:: img/customize_run_instances.webp

Enable Multiple Instances
^^^^^^^^^^^^^^^^^^^^^^^^^
+++++++++++++++++++++++++

When this option is enabled, the editor will run multiple instances of the
project at once when you Run Project.
Expand All @@ -126,7 +55,7 @@ Checking the box and setting this to only 1 is the same as not checking this box
at all.

Main Run Args
^^^^^^^^^^^^^
+++++++++++++

These are the arguments that will be passed to **every** instance of the project
when you Run Project, unless you select "Enabled" under "Override Main Run Args"
Expand All @@ -145,33 +74,33 @@ Note that these arguments are space-separated.
passed when you Run Project.

Main Feature Tags
^^^^^^^^^^^^^^^^^
+++++++++++++++++

These are the feature tags that will be passed to **every** instance of the
project when you Run Project, unless you select "Enabled" under "Override Main
Tags" for a specific instance.

Override Main Run Args
^^^^^^^^^^^^^^^^^^^^^^
++++++++++++++++++++++

When this is enabled, the arguments in the "Main Run Args" field will **not be
passed** to this specific instance of the project when you Run Project.

Launch Arguments
^^^^^^^^^^^^^^^^
++++++++++++++++

These are the arguments that will be passed to this specific instance of the
project when you Run Project. They will be **combined with** the "Main Run Args"
unless you select "Enabled" under "Override Main Run Args".

Override Main Tags
^^^^^^^^^^^^^^^^^^
++++++++++++++++++

When this is enabled, the tags in the "Main Feature Tags" field will **not be
passed** to this specific instance of the project when you Run Project.

Feature Tags
^^^^^^^^^^^^
++++++++++++

These are the feature tags that will be passed to this specific instance of the
project when you Run Project. They will be **combined with** the "Main Feature
Expand All @@ -191,6 +120,8 @@ Tags" unless you select "Enabled" under "Override Main Tags".
`one two three -- four five six`. This is because the `--` is repeated in
the "Launch Arguments".

.. seealso:: Check out the :ref:`doc_feature_tags` page for a detailed guide on the
feature tags.

.. _doc_debugger_tools_and_options:

Expand Down Expand Up @@ -271,6 +202,8 @@ Shapes
Shapes are where you can adjust the color of shapes that only appear for
debugging purposes, such as collision and navigation shapes.

.. _doc_overview_of_debugging_tools_remote:

Remote in scene dock
--------------------

Expand Down
169 changes: 169 additions & 0 deletions tutorials/editor/bottom_panel.rst
Original file line number Diff line number Diff line change
@@ -0,0 +1,169 @@
.. _doc_bottom_panel:

Bottom panel
------------

.. |expand| image:: img/editor_ui_bottom_panel_expand_button.webp

Bottom panel lies at the bottom of the Godot's editor. The default bottom panels
vgezer marked this conversation as resolved.
Show resolved Hide resolved
at the startup are listed below, click on one page to read further about a
vgezer marked this conversation as resolved.
Show resolved Hide resolved
panel. Depending on the selected node, additional panels can be visible.
If a panel is opened, its name is highlighted with blue.
vgezer marked this conversation as resolved.
Show resolved Hide resolved
Right next to the Godot's version will then also show the |expand| button to extend
vgezer marked this conversation as resolved.
Show resolved Hide resolved
the opened panel to cover the viewport, which can be useful e.g., during
debugging, or animation creation.

.. tip:: Shortcuts to toggle bottom panels as well as to perform
some actions, can be found in Editor Settings > Shortcuts > Bottom Panel.

Below is a list of default panels click on one to read more about it:

.. contents::
:local:
:depth: 2
:backlinks: none

.. _doc_bottom_panel_output:

Output
~~~~~~

This panel shows the generated messages from the editor, or the
vgezer marked this conversation as resolved.
Show resolved Hide resolved
running script or the game.
vgezer marked this conversation as resolved.
Show resolved Hide resolved

.. image:: img/editor_ui_bottom_panel_output.webp

The broom button clears all shown messages. The button next to it copies the selected
messages into the clipboard.
vgezer marked this conversation as resolved.
Show resolved Hide resolved
Below the broom button is the collapse button for the duplicated messages. If
vgezer marked this conversation as resolved.
Show resolved Hide resolved
the same message is displayed consecutively, they will be shown as one, with the
vgezer marked this conversation as resolved.
Show resolved Hide resolved
indication of the repetition count. Clicking on it again will change its behaviour
to back.
vgezer marked this conversation as resolved.
Show resolved Hide resolved

The magnifier opens and focuses the search/filter bar. This lets you filter for
a specific message, immediately as you type.

Below these four buttons, there is another set of four buttons with number
vgezer marked this conversation as resolved.
Show resolved Hide resolved
indicators for filtering different types of messages.

.. |info| image:: img/output-panel/info.webp
.. |error| image:: img/output-panel/error.webp
.. |warning| image:: img/output-panel/warning.webp
.. |editor| image:: img/output-panel/editor.webp


|info| This one is to show or hide the standard output messages, which are white.
In the game, these are the messages created with using e.g., using ``print()``
function.

|error| one is to display or hide error messages produced by the editor or the game.
The error messages are red in the output.

|warning| Similarly, this is to show or hide the warning messages, which are yellow.

|editor| This button is to show or hide messages produced by the editor, such as
information or feedback on settings changes.

These buttons filter the messages even after they are generated, making them useful
for finding what you are looking for as well as for debugging. The message count
indicators will be blue if active; otherwise, they are grayed out.

.. _doc_bottom_panel_debugger:

Debugger
~~~~~~~~

The Debugger panel provides tools to debug your project. It includes a debugger and
other tools such as a profiler and monitors to measure and observe how your
vgezer marked this conversation as resolved.
Show resolved Hide resolved
game is performing.

.. image:: img/overview_debugger.webp

See :ref:`doc_debugger_panel` for a detailed guide on debugging and this panel.

.. _doc_bottom_panel_audio:

Audio
~~~~~

This panel allows you to create audio buses (also known as `channels`) and add effects:

.. image:: img/editor_ui_bottom_panel_audio.webp

By default it has the master bus. **Add Bus** button adds additional buses. The next
vgezer marked this conversation as resolved.
Show resolved Hide resolved
four buttons are to **Load**, **Save**, **Create** a new bus layout, or to
**Load Default** layout.
**S**, **M**, and **B** on the buses are abbreviations for Solo, Mute, and
Bypass.

Each bus can have different effects, and the settings of
these effects are edited in the inspector dock after selecting one of the
added effects.
You can drag the buses to change the audio routing order.
vgezer marked this conversation as resolved.
Show resolved Hide resolved
You can also use the three-dot menu to duplicate, or delete the buses.
vgezer marked this conversation as resolved.
Show resolved Hide resolved
Master bus cannot be deleted.
vgezer marked this conversation as resolved.
Show resolved Hide resolved

To see a detailed guide on audio buses and effects, you can read
vgezer marked this conversation as resolved.
Show resolved Hide resolved
:ref:`doc_audio_buses`.

.. _doc_bottom_panel_animation:

Animation
~~~~~~~~~

Godot's editor provides a powerful animation track editor, which
you can see the results directly on the 2D or 3D screen, without requiring
you to run the game. If you open it without selecting an
:ref:`AnimationNode <class_AnimationNode>`, it will be empty:

.. image:: img/editor_ui_bottom_panel_animation.webp

Refer to :ref:`Animation <toc-learn-features-animation>` for an in-depth manual
on animations.

.. _doc_bottom_panel_shader_editor:

Shader Editor
~~~~~~~~~~~~~

Shader Editor is a simplified version of Godot's Script Editor, with
vgezer marked this conversation as resolved.
Show resolved Hide resolved
a highlighting support for the shader language. You can learn more
vgezer marked this conversation as resolved.
Show resolved Hide resolved
on the Shaders in :ref:`doc_introduction_to_shaders` and read more on
vgezer marked this conversation as resolved.
Show resolved Hide resolved
shading language here: :ref:`doc_shading_language`.

Godot provides a shading language based on
`OpenGL Shading Language (GLSL) <https://www.khronos.org/opengl/wiki/OpenGL_Shading_Language>`__.
Instead of using Godot's Script Editor, shader files are written
in the Shader Editor.
Shader Editor is empty at startup. You need to create a shader file,
vgezer marked this conversation as resolved.
Show resolved Hide resolved
or open one to start working with:

.. image:: img/editor_ui_bottom_panel_shader_editor.webp

Alternatively, double-clicking on an existing ``.gdshader``
or ``.gdshaderinc`` file in the FileSystem dock will also
open the file in the Shader Editor.

While working with Shader Editor, you may consider expanding the panel
vgezer marked this conversation as resolved.
Show resolved Hide resolved
with the expand button to have more space for coding.

The menus in the editor similar to the Godot's Script Editor menus.
vgezer marked this conversation as resolved.
Show resolved Hide resolved

- **File** menu provides options to create a new file, load (open) an existing file,
and save. You can also quickly open the viewed file in the inspector via this menu.
- **Search** menu allows you to search or replace in the file.
- **Go To** menu enables you to navigate to a specific line, create bookmarks and
vgezer marked this conversation as resolved.
Show resolved Hide resolved
navigate through existing bookmarks.
- **Edit** menu provides options to perform actions on lines, or the selection,
providing a limited subset of the options in the Script Editor.
- **Help** takes you to the :ref:`Shading reference <toc-shading-reference>`
page.

.. |float| image:: img/editor_ui_float_button.webp

The |float| button next to the File menu allows you to float the editor, enabling
you to move it to other monitors, for example. You can close it to restore its
original location.

.. seealso:: To learn more on customizing docks, refer to
:ref:`doc_customizing_editor`.
Loading
Loading