页面布局的数据结构，如CSS浮动

Question

假设我有自己的标记语言，允许我使用TextElements和ImageElements数组。其中每个都可以具有“float：left / right / none”和“clear：none / left / right / both”等属性。另外，非浮动元素可以在浮动元素周围流动。基本上，都像CSS浮动布局。

例如：

Elem1 Elem2 Elem3 Elem4 Elem5 _ Elem6

在我铺设这些元素时，用于存储这些元素的最佳数据结构是什么？我需要能够轻松回答以下问题的内容：

• 是否有足够的空间容纳Element1左侧或右侧的Element2？
• Element1的页面坐标是什么，原点和大小？

我基本上会存储一个结构：

{元素，原点（x，y），大小（w，h）}

此数据结构中每个已布局的元素。

有一些像RTrees，QuadTrees等等，但是我想要一些简单的东西来抽象地表示页面上矩形的布局，以便在我的布局算法中使用。

注意：我不是用HTML做这个，而是用于iOS应用程序中元素的布局，我不能使用iOS 6约束，因为我需要支持早期的iOS版本。

谢谢！

Answer 1

我相信二进制堆可以用于你想要的东西。 Wikipedia explains binary heaps quite well.

二进制堆有两个属性，可以满足你的需要：

1. 这是一棵完整的树，在结构上类似于一个布局的元素页面。
2. 对节点进行排序，使得每个节点比其子节点更大（或更少，取决于您想要的节点）。在您的情况下，“更大”意味着“进一步向左和向上放置”。

你有一个元素列表，在没有浮点数的情况下，将按顺序排列，根据需要包装行。因此，在没有浮点数的情况下构建堆只会按照接收顺序将节点添加到树中。

Floats使这一点复杂化，因为它们的位置高于它们之前的节点（或者低于右浮点数后面的节点）。幸运的是，构建一个堆可以通过将新节点冒泡到适当的位置来实现这一点。因此，只要您可以定义一个函数，该函数根据对等体对浮动元素进行排序，这可以起作用。

如果 我不确定，不幸的是，我现在没有足够的时间来更全面地探索这个想法。

无论如何，假设你有一个正确的堆，重复删除最顶层的元素应该按照它们应该放在页面上的顺序枚举节点。

我认为CHDataStructures有二进制堆，但我无法验证，因为保留文档的服务器在发布时似乎处于脱机状态。

祝你好运，我希望这会有所帮助。