GUI 架构：布局、渲染和输入的分离

Question

我使用过的所有 GUI 系统都涉及处理布局、输入和呈现的规范化基本小部件对象。当我用 C++ 创建游戏 GUI 时，我发现专门化每个小部件的角色以便每个小部件只处理布局、输入或渲染使代码更可组合、更灵活和更有条理。

但是，随着我越来越深入地扩展该范例，它开始崩溃，我正试图找到规范化小部件和专用小部件之间的最佳平衡点。我的主要困难是我一直无法找到这种 GUI 模型的任何先例。

我描述的概念有一个术语吗？
是否有包含这种形式的小部件专业化的现有系统或文章？

[编辑]

这是传统 GUI 模型的代码示例：

var button = new Widget()
button.width = 100
button.height = 30
button.set_fill(FILL_COLOR)
button.set_border(BORDER_COLOR, BORDER_SIZE)
button.click(()=> submit())
button.text = "Submit"

这是专用 GUI 模型的代码示例：

var button = new Box()
button.width = 100
button.height = 30
button.add(new Fill(FILL_COLOR))
button.add(new Border(BORDER_COLOR, BORDER_SIZE))
button.add(new Clickable(()=> respond_to_click())
button.add(new Text("Submit"))

第一个模型依赖于包含许多常见 GUI 功能的大型基础 class，而第二个模型将这些功能分解为最小的 classes。对于专门的方法，Box class 只关心布局，而 class 诸如 Fill 和 Clickable 之类的东西除了继承其父级的边界之外没有布局逻辑。

Answer 1

在某些方面，您可以将其视为 component-based architecture，这在视频游戏中往往更受欢迎。这里的想法是，单独的 "components" 从事不同的工作，并且通常依附于诸如根 "GameObject" 之类的东西。从这个意义上说， "button" 甚至可能不存在，而是 "control" - 但实际上没有顶级逻辑。然后您只需添加组件即可组成工作对象。基于组件的架构不一定是特定于 GUI 的，但它似乎与您提供的代码片段非常匹配。

好消息是关于基于组件的架构的文章很多，因此您将能够利用它来评估可能的优势和劣势。祝你好运！

GUI 架构：布局、渲染和输入的分离

GUI architecture: Separation of Layout, Rendering, and Input

architecture

user-interface