Work in progress

The content of this page was not yet updated for Godot 4.2 and may be outdated. If you know how to improve this page or you can confirm that it's up to date, feel free to open a pull request.

カスタムGUIコントロール

非常に多くのコントロール...

まだ十分ではありません。希望どおりに動作する独自のカスタムコントロールを作成することは、ほとんどすべてのGUIプログラマーの執念です。 Godotはそれらの多くを提供しますが、期待どおりに動作しない場合があります。斜めスクロールバーをサポートするためのプルリクエストで開発者に連絡する前に、少なくともスクリプトからこれらのコントロールを簡単に作成する方法を知っておくとよいでしょう。

描画

描画については、2Dカスタム描画 チュートリアルを確認することをお勧めします。同じことが当てはまります。一部の関数は、描画時の有用性から特に言及する価値があるため、次で詳しく説明します。

コントロールサイズの確認

Unlike 2D nodes, "size" is important with controls, as it helps to organize them in proper layouts. For this, the Control.size property is provided. Checking it during _draw() is vital to ensure everything is kept in-bounds.

フォーカスの確認

一部のコントロール(ボタンやテキストエディタなど)は、キーボードまたはジョイパッド入力に入力フォーカスを提供する場合があります。この例として、テキストの入力やボタンの押下があります。これはControl.focus_mode プロパティで制御されます。描画時、およびコントロールが入力フォーカスをサポートしている場合は、常に何らかのインジケーター (強調表示、ボックスなど) を表示して、現在フォーカスされているコントロールであることが示すことが望まれます。このステータスを確認するために、Control.has_focus() メソッドが存在します。例

func _draw():
    if has_focus():
         draw_selected()
    else:
         draw_normal()

サイズ変更

前述したように、サイズはコントロールにとって重要です。これにより、グリッド、コンテナ、またはアンカーに設定したときに、適切にレイアウトできます。ほとんどの場合、コントロールは、適切にレイアウトするために 最小サイズ を提供します。たとえば、コントロールがVBoxContainer を使用して互いの上に垂直に配置されている場合、最小サイズは、コンテナ内の他のコントロールによってカスタムコントロールが押しつぶされないようにします。

To provide this callback, just override Control._get_minimum_size(), for example:

func _get_minimum_size():
    return Vector2(30, 30)

Alternatively, set it using a function:

func _ready():
    set_custom_minimum_size(Vector2(30, 30))

入力

コントロールには、入力イベントの管理を通常のノードよりもはるかに簡単に行うためのヘルパーがいくつか用意されています。

入力イベント

このチュートリアルの前に入力に関するチュートリアルがいくつかありますが、コントロールには次の場合にのみ機能する特別な入力メソッドがあることに注意してください:

  • マウスポインターがコントロールの上にある。

  • このコントロールの上でボタンが押された(ボタンが放されるまで、コントロールは常に入力をキャプチャします)

  • コントロールはControl.focus_mode を介してキーボード/ジョイパッドフォーカスを提供します。

This function is Control._gui_input(). Simply override it in your control. No processing needs to be set.

extends Control

func _gui_input(event):
   if event is InputEventMouseButton and event.button_index == MOUSE_BUTTON_LEFT and event.pressed:
       print("Left mouse button was pressed!")

イベント自体の詳細については、Using InputEvent チュートリアルを確認してください。

通知

コントロールには専用のコールバックは存在しませんが、_notificationコールバックで確認できる多くの便利な通知があります:

func _notification(what):
    match what:
        NOTIFICATION_MOUSE_ENTER:
            pass # Mouse entered the area of this control.
        NOTIFICATION_MOUSE_EXIT:
            pass # Mouse exited the area of this control.
        NOTIFICATION_FOCUS_ENTER:
            pass # Control gained focus.
        NOTIFICATION_FOCUS_EXIT:
            pass # Control lost focus.
        NOTIFICATION_THEME_CHANGED:
            pass # Theme used to draw the control changed;
            # update and redraw is recommended if using a theme.
        NOTIFICATION_VISIBILITY_CHANGED:
            pass # Control became visible/invisible;
            # check new status with is_visible().
        NOTIFICATION_RESIZED:
            pass # Control changed size; check new size
            # with get_size().
        NOTIFICATION_MODAL_CLOSE:
            pass # For modal pop-ups, notification
            # that the pop-up was closed.