Guide to the Godot game engine/Bottom panels

Bottom panels Docks-->

Bottom panels edit

A bottom panel is a button at the bottom of the screen that shows a dock when clicked. Examples are Output, Debugger and Audio.

First, to create a bottom panel, you need to make a UI for it:

Create a scene and choose User Interface, and rename the root Control node to bottom_panel.
Save it inside your plugin folder, in the same place as the plugin script, under the name "bottom_panel.tscn".
Select your Control, press Layout from the top of the screen, and press Full Rect from the drop down menu that appears.
With the Control still selected, expand Rect in the Inspector and change min_size.y to 50 (or some larger value) to ensure your UI appears with a non zero size.
Add a VBoxContainer as a child of the bottom panel. Set its layout to Full Rect.
Add a Label, and give it text suitable to what the UI does.
Add a Panel as a child of the VBoxContainer.
Make sure the Panel is selected, and go to Size Flags on the inspector, and check expand for both horizontal and vertical.
Create the main UI as a child of the VBoxContainer.

You may wish to put the top Label in a HBoxContainer (which is in the VBoxContainer) if you want to also put buttons on the top.

You also may want to use containers more than you would for a game. You may often want to stretch or shrink the bottom panel to be larger or smaller than the default small size. Setting a min_size.x to 200 - 250 will also stop you from shrinking it too much and making the main screen invisible while the panel is open.

Now, open your plugin's main script, and type the following code:

expands Control

var bp: Control
var bp_button: ToolButton

func _enter_tree():
  # Put any load logic here, including adding new project settings
  bp = preload("bottom_panel.tscn").instance()
  bp_button = add_control_to_bottom_panel(bp, "Dock name")

func _exit_tree():
  # Put exit tree logic here, including any saving
  remove_control_from_bottom_panel(bp)
  bp.queue_free()