Godot有一个“ HVBoxContainer”?

发布于 2025-01-17 22:01:24 字数 417 浏览 1 评论 0原文

想想一个RPG游戏,您可能需要提供按钮列表。用户可能会进入一个房间,在那里他们必须从一系列选项(按钮)中进行选择。是否有一种类型的容器/面板可以水平显示可单击的按钮,但是如果需要,请包装?

我能想到的最好的类比来描绘情况是,想象需要单击背包中的项目,但每个项目可能都是不同的宽度。 (我可以使它们的高度相同,但宽度随后变化了)

.---[My Backpack]------.
| aaa  bbb  cccc ddd   |
| ee  fff  g           |
|                      |
|                      |
`----------------------'

(选项来自数据库,因此它在编译时间未知的房间中可能有多少个选项,因此我需要编程方式添加选项。)

Think of an RPG game where you might need to present a list of buttons. A user might enter a room where they have to select from a series of options (buttons). Is there a type of container/panel that would show clickable buttons horizontally, but wrap if needed?

The best analogy I can think of to picture the situation is, Imagine needing to click on an item in a backpack, but each item is potentially a different width. (I can make them all the same height but the width then varies)

.---[My Backpack]------.
| aaa  bbb  cccc ddd   |
| ee  fff  g           |
|                      |
|                      |
`----------------------'

(The options come from a database, so its unknown at compile time how many options might be in a room, so I am going to need to programmatically add options.)

The very bottom of this godot document introduces custom container layouts, but it's unclear to me how this would work in practice

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

漆黑的白昼 2025-01-24 22:01:24

Godot 3.5 或更新版本的 Godot 3.5(目前处于测试阶段)的流容器

引入了 HFlowContainerVFlowContainer,它们将服务于所描述的目的。

HFlowContainer 将填充一行,当它们溢出时,它将添加一个新行并继续。 VFlowContainer 将以类似的方式工作,但具有列。


Godot 3.5 之前的流容器

对于旧版本的 Godot,您可以使用 HFlowContainer 插件,您可以在资源库 (此处)。 请注意,没有 VFlowContainer 对应项。

由于资产库上的所有内容都是免费且开源的,因此请随意阅读代码并对其进行修改,这些代码可以用于服务如果您想制作自己的自定义Container,请作为起点。


制作您自己的自定义Container

制作自定义Container 的要点是它必须定位其子级。

为了达到这种效果,您可以在 _notification 方法中对 NOTIFICATION_SORT_CHILDREN 做出反应。 您可能还想对 NOTIFICATION_RESIZED 做出反应。

您可以拥有一个方法 - 我将其称为 layout - 当您获得通知:

func _notification(what):
    if what == NOTIFICATION_SORT_CHILDREN:
        layout()

并且还从设置器中调用 layout (setget)定义Container必须如何组织其子级的属性。 要从 _notification 之外的任何地方调用 layout,您可能需要使用 call_deferred("layout") 来防止任何可能的重新布局布局因游戏挂起或崩溃而循环。


layout 方法将迭代可见的子 Control 并使用 get_combined_minimum_size 来计算出去他们的大小。

像这样:

func layout() -> void:
    # …
    for child in get_children():
        var control := child as Control
        if not is_instance_valid(control) or not control.visible:
            continue

        var size := control.get_combined_minimum_size()
    # …

然后使用该信息计算子控件的位置和大小。当Control有增长空间时,您可能需要根据它们的size_flags_stretch_ratio将其分割。

一旦确定了 Control 的位置和大小,请使用 fit_child_in_rect 来定位它们,这将考虑增长和大小标志。

因此,除了最简单的 Container 之外,您将需要迭代子 Control 两次。为此,您可能会发现使用辅助数据结构来临时存储它们很有用。

Flow container for Godot 3.5 or newer

Godot 3.5 (currently in beta) introduces HFlowContainer and VFlowContainer that will serve the propuse described.

The HFlowContainer will fill a row and when they overflow, it will add a new row and continue there. The VFlowContainer will work on a similar fashion but with columns.


Flow containers before Godot 3.5

For older versions of Godot you can use the HFlowContainer addon which you can find it in the asset library (here). Note that there is no VFlowContainer counterpart.

As everything on the asset library it is free and open source, so feel free to read the code and modify it, which can be serve as starting point if you want to make your own custom Container.


Making your own custom Container

The gist of making a custom Container is that it must position its children.

For that effect you react to NOTIFICATION_SORT_CHILDREN in the _notification method. You might also want to react to NOTIFICATION_RESIZED.

You can have a method - which I'll call layout - that you call when you get the notifications:

func _notification(what):
    if what == NOTIFICATION_SORT_CHILDREN:
        layout()

And also call layout from the setters (setget) of the properties that define how the Container must organize its children. To call layout from anywhere other than _notification, you might want to use call_deferred("layout") to prevent any possible re-layout loops from hanging or crashing the game.


The layout method would iterate over the visible children Controls and use get_combined_minimum_size to figure out their size.

Something like this:

func layout() -> void:
    # …
    for child in get_children():
        var control := child as Control
        if not is_instance_valid(control) or not control.visible:
            continue

        var size := control.get_combined_minimum_size()
    # …

Then using that information compute the position and size for the children Controls. When there is room for the Controls to grow, you may want to split it among them according to their size_flags_stretch_ratio.

Once you have the position and size for a Control decided, use fit_child_in_rect to position them, which will take into account grow and size flags.

Thus - barring the simplest Containers - you will need to iterate over the children Controls twice. And for that you might find useful to have an auxiliary data structure to temporarily store them.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文