使用 CSS 进行 GUI 编程答案

【问题标题】：GUI programming with CSS使用 CSS 进行 GUI 编程
【发布时间】：2010-10-19 02:32:14
【问题描述】：

我将为游戏 GUI 编写一个简单的布局系统。我想到了 GUI 中使用的各种布局系统，例如绝对定位、Java 的布局管理器、spring 和 struts 等。最后我发现我更喜欢 CSS 所看到的布局——填充、边距、浮动、块、内联等。你见过这样的应用程序 GUI 吗？不是 Web 应用程序，而是必须从头开始编写 CSS 布局系统的“真实”应用程序。您是否认为有可能获得一个工作且富有表现力的类 CSS 布局系统，即使非常简单，但代码量可观？

更新：我不想从外部样式表创建 GUI。我会对运行时界面感到满意，即。像这样：

Widget *container = [Container withWidth:100 height:100];
Widget *button1 = [Button withText:@"Foo"];
Widget *button2 = [Button withText:@"Bar"];
button1.floating = button2.floating = YES;
[container addObjects: button1, button2, nil];

早该这么说的，抱歉。

【问题讨论】：

标签： css user-interface

【解决方案1】：

我不确定这是否真的是最好的方法，但我看不出有任何问题会阻止你这样做。您需要某种 CSS 解析器才能从样式表实际创建 GUI，但我想这是可行的。已经有一堆 CSS 解析器，您可能只需要对其进行一些定制，以满足您对 GUI 的特定需求。

【讨论】：

【解决方案2】：

不，我从未见过围绕 CSS 命名方案设计的应用程序。

是的，我认为创建这样一个系统是完全可能的，程序员能够以编程方式移动按钮和其他字段。通常使用小部件存在的默认函数和参数，如果您要使用这些小部件并从它们派生出来，您将能够完成您想要的。

我不确定你为什么要这样做，但答案是肯定的！

【讨论】：

【解决方案3】：

我过去曾这样做过，如果您不完全实现 CSS 规范，而只实现您需要的东西，这真的是可行的。我最终做的是实现一个 CSS 解析器、选择器语句和级联规则。属性和布局模型完全不同，因为当时根本不需要。我会说这也是编写完整 CSS 引擎的大部分工作所在。

我所做的是创建一些模仿 HTML 表格工作方式的东西，因为它们在概念上易于使用，并且因为应用程序本身对整个“语义网络”讨论是公正的。

我找不到很多有用的资源，除了 CSS 规范本身，因为它已经包含了 flex 和 bison 语法规则。

编辑：在这种情况下，您可能想看看 WebKit 和 Mozilla 如何实现其布局引擎作为参考。

【讨论】：