我想制作一个自定义布局，其行为如下图所示。
我已经尝试了Tile Layout并修改了其calculateDropIndex方法，但没有得到想要的行为。
当所有图块的高度和宽度相同时，图块布局效果很好，但在我的情况下，图块大小不同。
http://gridster.net/
Gridster layout screenshot
最佳答案
经过更多的尝试后，我能够制作出类似drag n drop gird组件的gridster。
这是我如何制作此组件的简短总结。
在将容器添加到容器中的同时，在同一位置添加一个容器，并保持其可见性不变。这个额外的节点将成为我们的放置指示器。
将所有原始节点放在一个数组中称为节点，而将所有其他节点放在另一个数组中称为dropIndicators。
例如，如果在容器中添加节点A，B和C。我们将为每个主节点分别添加三个额外的节点X，Y和Z。
并且在节点数组将是
node[0] = A;
node[1] = B;
node[2] = C;
和dropIndicators数组将是
dropIndicators[0] = X;
dropIndicators[1] = Y;
dropIndicators[2] = Z;
现在，当我们拖动任何节点时，您将需要以下函数来更新节点位置。
CalculateDropLocation-在拖动时计算新放置位置。
CheckCollision-检查两个节点之间的冲突。
FixCollision-如果发生碰撞，我们将使用此功能修复该碰撞。此功能将递归地向下调整所有冲突节点。
updateNodes-修复冲突后，我们将使用此功能更新所有节点。如果有空白空间，此功能将向上移动节点。
现在，当我们开始拖动A节点时，计算A节点的新放置位置并将其相对的额外节点（即X）移动到新放置位置，请检查X是否与任何其他额外节点发生碰撞。我们将在所有函数中使用dropIndicators数组。
如果集合比调用fixCollision（）函数，则比调用更新节点函数。
最后，一旦所有节点都更新，请将所有额外节点的位置设置为其原始节点，即，将X的位置设置为A的位置，Y的位置设置为B，依此类推。在更新原始节点位置时，可以使用“移动”动画在容器中平滑移动节点。
希望这会有所帮助。使用此方法，您可以使用任何语言进行这种类型的布局。
希望这会有所帮助。
有关更多详细信息和带有源的示例应用程序，请访问此link
http://usefulflexcomponents.blogspot.in/2015/12/blog-post.html
关于javascript - 如何在AS3中制作类似于Gridster.js的图块/网格布局？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33328555/