按 2D 属性 排列块而不重叠
Arrange blocks by 2D property without overlap
我的应用需要显示多个按钮，不重叠，最好不滚动或缩放。它们必须足够大，可以用手指戳一下并阅读文字。按钮宽度取决于其文本长度，而高度是恒定的。屏幕尺寸已知。
每个按钮代表一种我知道一些营养信息的食物。我将计算 protein:carb 比率和脂肪含量，两者的范围都是从 0% 到 100%。
我想将按钮放在靠近反映其营养成分的位置：例如上面富含蛋白质，下面是碳水化合物，右边是脂肪，左边是瘦肉。所以蛋糕会在右下角，肉会在上边缘的某个地方。
通常会有重叠，我不得不将它们推开。
难点在于发明一种微调算法。按优先顺序排列的需求是：
1) 可读可戳的大小，无重叠。
2) 不需要滚动或缩放，尽管当按钮太多以至于它们永远无法显示在屏幕上时会发生这种情况，即使我们不关心它们在哪里。
3) 按钮应该靠近用户根据了解食物的营养成分会看到的地方。
顺便说一下，我在智能手机上使用 JS，而不是 prolog 之类的。
（有一些貌似骗人的，但没有解决办法，一个是关于对角线的梗，另一个只是提倡把它扔到游戏引擎上，但大多数都没有答案。）
MArVL group at Monash University does work on constraint-based layout work. Some of their software 可能适用于您的问题。
我的应用需要显示多个按钮，不重叠，最好不滚动或缩放。它们必须足够大，可以用手指戳一下并阅读文字。按钮宽度取决于其文本长度，而高度是恒定的。屏幕尺寸已知。
每个按钮代表一种我知道一些营养信息的食物。我将计算 protein:carb 比率和脂肪含量，两者的范围都是从 0% 到 100%。
我想将按钮放在靠近反映其营养成分的位置：例如上面富含蛋白质，下面是碳水化合物，右边是脂肪，左边是瘦肉。所以蛋糕会在右下角，肉会在上边缘的某个地方。
通常会有重叠，我不得不将它们推开。
难点在于发明一种微调算法。按优先顺序排列的需求是：
1) 可读可戳的大小，无重叠。 2) 不需要滚动或缩放，尽管当按钮太多以至于它们永远无法显示在屏幕上时会发生这种情况，即使我们不关心它们在哪里。 3) 按钮应该靠近用户根据了解食物的营养成分会看到的地方。
顺便说一下，我在智能手机上使用 JS，而不是 prolog 之类的。
（有一些貌似骗人的，但没有解决办法，一个是关于对角线的梗，另一个只是提倡把它扔到游戏引擎上，但大多数都没有答案。）
MArVL group at Monash University does work on constraint-based layout work. Some of their software 可能适用于您的问题。