folt-a / godot-idea-board

Design all Godot editor items. Godot4 addon.
MIT License
124 stars 4 forks source link
documentation-tool game-dev game-development godot godot-addon godot4 godotengine tool

godot-idea-board

Design all Godot editor items. Godot4 addon.

日本語READMEはこちら japanese readme is here

There is no need to go back and forth between the design document tool and the Godot editor.

You can create related design for program files within the Godot editor (you can move the canvas and jump!). You can also create Game character correlations document.

You can arrange and manage items such as (scenes, resources, files, directories) in your Godot4 project as you wish.

image


There are major changes to GraphEdit in Godot 4.2. Please use Godot version 4.2 or later.

Godot4.2 でGraphEditに大きな変更があります。 Godot4.2以上のバージョンを使用してください。


Recent Updates

最近の更新履歴


Install

download this repostitory.

Copy this addons/godot-idea-board directory to your godot project's addons directory.

Reload Project.

image

"Board" at Topbar


Feature

Add item by drag-drop from Godot's file system. Basic use this addon!

Drag items from Godot's file system and add them to the canvas.

Click on the icon of the added item to open its file in the Godot editor.

For scenes, it will be the main scene editor for 2D and 3D, and for script files, it will be the script editor.

Add Groups, Labels, Text Documents, and Item Connections items with buttons in the header menu.

Items can be well managed adding items from the header menu.

Create links to jump to items in the canvas

With "link" items that can be copied from right-clicking on a item, you can manage them without getting lost in a large canvas.

Arrange

Arrange Items. Create Your super Design Document!


Sidebar

image

Floating window button

image

under development. you can use...

Displays the current canvas as a floating window.

The right-click menu is in the wrong position or there is a window "always top" error. ......

H-split, left canvas selected button, right canvas selected button

image

The canvas can be divided into left and right to display different layouts file.

Select the target to change the layout by clicking the Specify Left Canvas or Specify Right Canvas button.

Reload button

image

Reload. Update the list of layout files.

Add button

image

Add a new layout file.

Enter a new layout file name in the pop-up dialog and press OK.

Duplicate button

image

Add a new layout file by copying the currently selected layout file.

Enter a new layout file name in the pop-up dialog and press OK.

Change Filename button

image

Rename the currently selected layout file.

Enter a new layout file name in the pop-up dialog and press OK.

Remove button

image

Deletes the currently selected layout file.

A confirmation pop-up dialog will appear.

layout file ItemList

image

A list of layout files is displayed.

Click to open that layout in a canvas.

If any of the currently selected canvases have not been saved, a pop-up dialog will ask "Not saved, is that ok?" The pop-up dialog will ask you if you want to save the layout.

Change Layout Dir button and lineedit

image

Change the directory where layout files used by this addon are saved and loaded.

Layout files data in json.


Canvas

image

Copy (Ctrl+C)

It can also be found in the right-click menu.

Copies the currently selected items.

Paste (Ctrl+V)

It can also be found in the right-click menu.

Pastes the selected items to the mouse cursor position.

Delete (Delete)

It can also be found in the right-click menu.

Save (Ctrl+S)

Overwrites all canvas states to the layout file.


Common Item feature

image

Lock

Right-click context menu "Lock"

Locks the target item. The item will no longer be selectable.

While locked, the 🔒 button will appear and pressing the 🔒 button will unlock it.

You can also lock/unlock the selected items by right-clicking on them.

Related: You can lock all the selected items together in the header menu.

Related: Groups can be used to lock and un-lock a range of items together.

Copy Link

Right-click context menu "Copy Link"

Copy the link information of the target item to the clipboard.

Paste on the canvas to create a "link" item.
(Ctrl+V or from the right-click menu)

image

Clicking on the "→ icon of the target item" of a "link" item, you will jump to the location of that target item on the canvas.

Copy Path

Only items created from files have a right-click context menu "Copy Path".

Clicking on it will copy the URL of the item's path starting with res:// to the clipboard.

Only Copy

Right-click context menu "Only Copy"

Only the target item will be copied.

Only the right-clicked item will be copied, even if other items are currently selected.

If you want to copy multiple items, right-click on the canvas with multiple items selected, and then copy. Or press Ctrl+C.

Pasting on the canvas will create the copied items.
(Ctrl+V or from the right-click menu command)

Delete

Right-click context menu "Delete"

Deletes only the target item.

Even if there are other selected items, only the item you right-clicked will be deleted.

If you want to delete multiple items, right-click on an empty canvas with multiple items selected, and then Delete. Or press Del key.


Header menu Items

image

If your window is small, the header menu may not be displayed all the way to the right edge. I'll fix it soon, sorry!

image

Clicking the button on the header menu and clicking on the canvas creates the item at the click point.

Group(Alt+G)

image

image

Press the "Group" button to create a "Group" item at the point where the mouse clicks on the canvas.

Press the "cursor icon" button to select all items in the group range.

Press the right-click context menu "Edit" or double-click on the group header to
Edit the name of the group.

Pressing the right-click context menu "Group Lock" will lock all items within the group range.

Right-click context menu "Group Unlock" to unlock all items within the group's range.

Label (Alt+R)

image

image

Press the "Label" button to create a "Label" item at the point where the mouse clicks on the canvas.

A "Label" is an item intended to be used like a one-line label.

Press the right-click context menu "Edit Title" or double-click on the group header.
You can edit the name of the label by pressing the right-click context menu "Edit Title" or double-clicking on the group header. The label will not be smaller than the length of the label name width. (= all characters are always displayed)

You can change the size of the label by grabbing the bottom right handle of the label.

If you change the size.y, the font size will also increase according to the vertical length.

Right-click context menu Press "Task" and a checkbox will appear on the left.

Check ON/OFF is included in the saved contents. It is just a check box, but you can use it like a task TODO list!

Right click context menu Press "Bg~" to change the color to that color theme.

If you change the color, the next time you add a label, it will be that color from the beginning.

TxtDoc (Text Document) (Alt+T)

image

image

Press the "TxtDoc" button to create a "TxtDoc" item at the point of mouse click on the canvas.

The "TxtDoc" item is intended for document production where multiple lines of text are to be entered.

Markdowns style text can be entered.

Press the "Markdown and Edit Switch Icon" button in the upper left corner to switch modes between markdown view and text editing.

Right-click context menu Press "Edit Title" or double-click on the group header to

You can edit the name of the text title. The width of this item will not be smaller than the length of the width of the title name. (= all characters are always displayed)

Grab the bottom right handle to change the size.

Right-click context menu Press "Make it a task" and a check box will appear on the left.

Check ON/OFF is included in the saved contents. It is just a check box.

Right-click context menu Press "Background~" to change the color to that color.

After changing the color, the next time you add text, it will be the same color as the first time you add text.

(Not implemented: I want to add a function to save the file as a file) TODO

Related: "Create text from this file" for text files

Connect button(Alt+C)

image

image

image

Two items can be connected to each other to create a connect item.

This can be used to connect program files and design them as a class diagram, or to create a character correlation chart or story flow document.

When two items are selected, press Alt+C or the "Connect" button to create a connect item between them.

If the number of items selected is not 2, nothing will happen; only 2 items should be selected.

You can connect all items except the "connect" item.

Double-click on a "connect" item to edit the text displayed (only one line). (only one line) All characters are always displayed.

Right-click context menu "Color~" to change the color to that color.

Once you change the color, the next time you add a "Connect" item, it will be the same color from the beginning.

other Header menu button

image

image

Godot's built-in GraphEdit's button.

You can zoom, snap distance and minimap on/off.

Snap distance is also referenced in this add-on, but I'm using 24 and haven't checked with other snap granularities in particular.

(Thanks to GraphEdit, this add-on is based on GraphEdit, and is marked as ⚠ in Godotbeta4, but please do not make destructive changes: ......)

Save button(Alt+S)

Save layout file.

The difference with Ctrl+S is that even if there are multiple canvases, this one will save only this canvas.

Lock button (Alt+L)

image

Locks all selected items.

Since you cannot select locked items, there is no "Unlock all together" command!

If you want to unlock all the locked items, please use the command since there is "Group Lock/Unlock" in the group.

Background color button

image

change background color.

Grid color button

image

change grid color.

andchange sub grid color.

Sound settings buttons

image

You can set the music playing.

No pause! Will add if requested.

Arrange buttons

image

Aligns the currently selected items.

However, "connect" items are ignored.

There are two buttons, one for aligning up, bottom, left, right, and one for aligning at regular intervals.


Items

Scene (.tscn)

image

Click the icon in the upper left corner of the first line to open that scene.

Whether the scene is 2D or 3D is determined by the Node type of the scene.

Right-click on the context menu "Show Play Scene Button" and the Show Scene Play Button will appear on the left.

Pressing the Play Scene button will play the scene in the Godot editor. This is useful!

Resource(.tres)

Click to open the inspector.

Image

image

Click to open the inspector.

(I'd like a command to open the location of that file on the file system...) TODO

Sound

image

with play button. header settings.

Click to open the inspector.

(I'd like a command to open the location of that file on the file system...) TODO

Text Document

image

Right-click context menu "Make TxtDoc" to create a "TxtDoc" item from this text file.

image

The "TxtDoc" item you have now created will have an additional button to open the location of that file and a button to save it.

Directory

image

Click to open the location of that directory in Godot's file system.

(I'd like the ability to add files in this directory as items.) TODO


This add-on is based on and inspired the Godot3 add-on Project-Map.

the Markdown parse script is DocsMarkdownParser.gd from Dialogic.

Thank you!


Future Plans


jpreadme

日本語

もう設計書ツールとGodotエディタとの間で往復をする必要はありません。

Godotエディタ内でプログラムファイルの関連設計図を作成したり(すぐジャンプできる!)、キャラクター相関図を作ることもできます。

Godot4 プロジェクト内の(シーン、リソース、ファイル、ディレクトリ)といったアイテムを好きなように配置して管理することができます。

image


インストール

このリポジトリをダウンロードするかクローンします。

このアドオンのディレクトリから、addons/godot-idea-boardをGodotのプロジェクト直下のaddonsディレクトリに入れます。

※プロジェクトをリロードして、Godotエディタを再起動します。

image

「Design」 が上部バーにでてます。


日本語設定

Markdownテキストは、RichTextLabelになっているのでひらがななどが欠けます。

image

res://addons/godot-idea-board/main_theme.tres にて、default_fontを設定するとこのアドオンはすべてこのフォントになります。

このテーマファイルにて対象のコントロールだけフォント変更する手もあります。

または、エディタ設定にて、日本語フォントに変更してください。エディタ全部変わりますが……


メインの機能

Godotファイルシステムからのドラッグドロップによるアイテム追加 基本!

Godotのファイルシステムのところからアイテムをドラッグしてキャンバスに追加します。

追加したアイテムのアイコンをクリックするとGodotエディタでそのファイルが開きます。

シーンなら2D・3Dに対応したメイン画面、スクリプトファイルならスクリプト画面になる、などです。

グループ・ラベル・テキスト・接続のアイテム追加(ヘッダーメニュー)

ヘッダーメニューから管理系のアイテムを追加してアイテムをうまくまとめることができます。

キャンバス内のアイテムへジャンプできるリンク作成

各アイテム上で右クリックからコピーできる「リンク」アイテムを使えば、広いキャンバスで迷うことなく管理することができます。

整列

きれいにアイテムを並び替えて「ぼくのかんがえたさいきょうのせっけいしょ」を作ろう!几帳面!


サイドバー

image

ウィンドウボタン

image

開発中のため不安定

現在のキャンバスを別ウィンドウとして表示します。

右クリックメニューの位置がおかしかったりウィンドウのalways top のエラーが出たりします……

Hスプリット、左キャンバス指定、右キャンバス指定

image

キャンバスを左右に分けて別のレイアウトを表示できます。

左キャンバス指定、右キャンバス指定ボタンでレイアウトを変更する対象を選択します。

リロードボタン

image

レイアウトファイル一覧を更新します。

追加ボタン

image

新しくレイアウトファイルを追加します。

ポップアップダイアログで新しいレイアウトファイル名を入力してOKをおします。

複製ボタン

image

現在選択中のレイアウトファイルをコピーして新しくレイアウトファイルを追加します。

ポップアップダイアログで新しいレイアウトファイル名を入力してOKをおします。

名前変更ボタン

image

現在選択中のレイアウトファイルの名前を変更します。

ポップアップダイアログで新しいレイアウトファイル名を入力してOKをおします。

削除ボタン

image

現在選択中のレイアウトファイルを削除します。

確認ポップアップダイアログがでます。

レイアウトアイテムリスト

image

レイアウトファイルの一覧が表示されています。

クリックするとキャンバスでそのレイアウトを開きます。

現在選択中のキャンバスで保存されていないものがあればポップアップダイアログで「保存されないけどいいですか?」の確認されます。

レイアウトディレクトリ変更

image

このアドオンで使用するレイアウトファイルを保存、読み込みをするディレクトリを変更します。

レイアウトファイルはjsonでデータを保持しています。


キャンバス

image

コピー (Ctrl+C)

右クリックメニューにもあります。

選択中のアイテムをコピーします。

ペースト (Ctrl+V)

右クリックメニューにもあります。

選択中のアイテムをマウスカーソルの位置へ貼り付けます。

削除 (Delete)

右クリックメニューにもあります。

保存 (Ctrl+S)

すべてのキャンバスの状態をレイアウトファイルに上書き保存します。


アイテム共通

image

ロック

右クリックコンテキストメニュー「ロック」

対象のアイテムをロックします。選択できなくなります。

ロック中は🔒ボタンが表示され、🔒ボタンを押すとロック解除されます。

右クリックからロック/ロック解除できます。

関連:ヘッダーメニューで選択中まとめてロックできます。

関連:グループでまとめて範囲ロック、範囲ロック解除があります

リンクコピー

右クリックコンテキストメニュー「リンクコピー」

対象のアイテムのリンク情報をクリップボードにコピーします。

キャンバス上でペーストすると「リンク」アイテムが作成されます。
(Ctrl+V または 右クリックメニューから)

image

「リンク」アイテムの「→対象アイテムのアイコン」をクリックすると、キャンバス上でその対象のアイテムの位置に飛びます。

パスのコピー

ファイルから作ったアイテムにのみ右クリックコンテキストメニュー「パスのコピー」があります。

クリックすると res://から始まるそのアイテムのパスのURLをクリップボードにコピーします。

これだけコピー

右クリックコンテキストメニュー「これだけコピー」

対象のアイテムのみをコピーします。

他に選択中のアイテムがあっても、右クリックしたアイテムのみコピーされます。

複数コピーしたい場合は、複数選択した状態でなにもないキャンバス上で右クリック→コピーをしてください。またはCtrl+C

キャンバス上でペーストするとコピーしたアイテムが作成されます。
(Ctrl+V または 右クリックメニューから)

json形式でコピーするのでこのアドオン以外では使えなさそうです。

削除

右クリックコンテキストメニュー「削除」

対象のアイテムのみを削除します。

他に選択中のアイテムがあっても、右クリックしたアイテムのみ削除されます。

複数コピーしたい場合は、複数選択した状態で、なにもないキャンバス上で右クリック→削除をしてください。またはDeleteキー


管理系のアイテム ヘッダーメニュー

image

ウィンドウが小さいと、ヘッダーメニューの右はしっこまで表示されないことがあります。そのうち直します、ごめんなさい!

「集中モード」で広するなどでなんとか……

image

ヘッダーメニューのボタンを押して、キャンバスをクリックするとクリック地点に管理系のアイテムが作成されます。

グループ(Alt+G)

image

image

「グループ」ボタンを押し、キャンバス上でマウスクリックしたところに「グループ」アイテムを作成します。

カーソルのアイコンボタンを押すと、グループ範囲内のすべてのアイテムを選択します。

右クリックコンテキストメニュー 「編集」を押す、またはグループヘッダーをダブルクリックすると、
グループの名前を編集することができます。

右クリックコンテキストメニュー 「グループ範囲ロック」を押すと、グループの範囲内のアイテムをすべてロックします。

右クリックコンテキストメニュー 「グループ範囲ロック解除」を押すと、グループの範囲内のアイテムをすべてロック解除します。

ラベル (Alt+R)

image

image

「ラベル」ボタンを押し、キャンバス上でマウスクリックしたところに「ラベル」アイテムを作成します。

「ラベル」は1行のふせんのように使う目的のアイテムです。

右クリックコンテキストメニュー 「タイトル編集」を押す、またはグループヘッダーをダブルクリックすると、
ラベルの名前を編集することができます。ラベルの名前の幅の長さよりラベルは小さくなりません。(=常に全文字表示される)

ラベルの右下のハンドルをつかむと、ラベルのサイズを変更することができます。

縦のサイズを変更すると、フォントサイズも縦の長さに応じて大きくなります。

右クリックコンテキストメニュー 「タスクにする」を押すと、チェックボックスが左に表示されます。

チェックのON/OFFは保存内容に含まれます。ただのチェックボックスですが、タスクTODOリストのように使うことができます。

右クリックコンテキストメニュー 「背景~」を押すと、色がその色に変わります。

色変更をすると、次からラベルを追加するときは最初からその色になります。

テキスト (Alt+T)

image

image

「テキスト」ボタンを押し、キャンバス上でマウスクリックしたところに「テキスト」アイテムを作成します。

「テキスト」は複数行のテキストを入力するドキュメント制作を目的としたアイテムです。

マークダウンを入力することができます。

image

左上の「マークダウン↔編集切り替えアイコン」ボタンを押すと、マークダウン表示とテキスト編集でモードが切り替わります。

右クリックコンテキストメニュー 「タイトル編集」を押す、またはグループヘッダーをダブルクリックすると、
テキストのタイトルの名前を編集することができます。タイトルの名前の幅の長さよりこのアイテムの幅は小さくなりません。(=常に全文字表示される)

右下のハンドルをつかむと、サイズを変更することができます。

右クリックコンテキストメニュー 「タスクにする」を押すと、チェックボックスが左に表示されます。

チェックのON/OFFは保存内容に含まれます。ただのチェックボックスです。

右クリックコンテキストメニュー 「背景~」を押すと、色がその色に変わります。

色変更をすると、次からテキストを追加するときは最初からその色になります。

(未実装:ファイルにして保存する機能を追加したい)TODO

関連:テキストファイルの「このファイルからテキストをつくる」

接続(Alt+C)

image

image

image

2つのアイテム同士をつないでコネクトアイテムを作ることができます。

プログラムファイルをつないでクラス図のようにして設計したり、キャラクター相関図やストーリーフローのドキュメントを作ったりするのに使えます。

2つのアイテムを選択した状態でAlt+Cまたは「接続」ボタンを押すとコネクトアイテムが間にできます。

アイテムを選択している数が2以外の場合はなにもおこりません。2つのみ選択してください。

「コネクト」アイテム以外のすべてのアイテムをつなぐことができます。

「コネクト」アイテムをダブルクリックすると、表示文字を編集することができます。(1行のみ)常に全文字表示されます。

右クリックコンテキストメニュー 「色~」を押すと、色がその色に変わります。

色変更をすると、次から「コネクト」アイテムを追加するときは最初からその色になります。

その他のヘッダーメニュー

image

image

Godotの組み込みGraphEditにもとからついているやつ

ズームやスナップ粒度やミニマップON/OFFができます。

スナップ粒度はこのアドオンでも値を参照していますが、私は24で使っていて特にほかのスナップ粒度で確認していません。

(このアドオンはベースがGraphEditなのでGraphEditに感謝です。Godotbeta4で⚠マークついていますがなにとぞ破壊的変更はひかえめにおねがいします……)

保存(Alt+S)

保存します。

Ctrl+Sとの違いは複数キャンバスがあってもこちらはこのキャンバスのみを保存します。

ロック (Alt+L)

image

選択中のものをまとめてロックします。

ロック状態のものは選択できないので、「まとめてロック解除」はありません!

グループで「グループ範囲をまとめてロック/ロック解除」があるためまとめてロック解除がしたいときはこちらを使ってください。

背景色

image

キャンバスの背景色を変更します。

グリッドの色

image

メイングリッドの色を変更します。

サブグリッドの色はメイングリッドの色にaを0.1乗算したものが設定されます。

音量・音楽再生・音楽停止・ループ

image

image

再生中の音楽の設定ができます。

一時停止はありません!要望があれば追加します。

整列ボタンたち

選択中のアイテムを整列します。

ただし、「コネクタ」アイテムは無視されます。

上下左右にそろえるボタンと一定間隔でそろえるボタンがあります。


各アイテムについて

シーン (.tscn)

image

1行目の左上のアイコンをクリックするとそのシーンが開きます。

2Dか3DかはそのシーンのNode種類で判断されます。

右クリックコンテキストメニュー 「シーン再生ボタンを表示」を押すと、シーン再生ボタンを表示が左に表示されます。

シーン再生ボタンを押すと、Godotエディタでそのシーンをゲーム再生します。これは便利

リソース(.tres)

クリックするとインスペクタが開きます。

画像リソース

image

画像リソースはその画像を表示します。

アイコンをクリックするとインスペクタでそのファイルを開きます。

(ファイルシステム上でそのファイルの場所を開くコマンドが欲しいな・・・)TODO

音楽リソース

image

音楽リソースは再生ボタンがついています。

アイコンをクリックするとインスペクタでそのファイルを開きます。

(ファイルシステム上でそのファイルの場所を開くコマンドが欲しいな・・・)TODO

再生ボタンを押すとその音楽が再生されます。ヘッダーで調整できます。

テキストファイル

image

右クリックコンテキストメニュー 「このファイルからテキストをつくる」を押すと、このテキストファイルから「テキスト」アイテムを作成します。

image

これで作成した「テキスト」アイテムには、そのファイルの場所を開くボタンと、保存するボタンが追加されます。

ディレクトリ

image

クリックするとGodotのファイルシステムでそのディレクトリの位置を開きます。

(このディレクトリ内のファイルをアイテムとして追加する機能がほしいなあ)TODO


このアドオンはGodot3のアドオン Project-Map をベースにして作成しています。

また、MarkdownパースのスクリプトはDialogicDocsMarkdownParser.gdを使用しています。

ありがとうございます!