Easeljs將對象保留在範圍內

Question

我正在使用Easeljs在HTML5畫布中繪製應用程序。到目前爲止，我可以將對象拖放到字段中，但我只希望它們在一定範圍內。

爲了說明：

對象1，2，4和5應該得到刪除，但物體3應保持。我嘗試過使用hitTest（），但那不能正常工作（我可能做錯了什麼）。我很想發佈我使用過的代碼，但是我的個人電腦在工作時凍結了......我以爲最好在解凍的時候問問，哈哈。

Answer 1

解決方案：

var obj1 = obj.getBounds().clone(); // obj = a pylon 
var e = obj1.getTransformedBounds(); 
var obj2 = bg.getBounds().clone(); // bg = the big green field 
var f = obj2.getTransformedBounds(); 

if(e.x < f.x || e.x + e.width > f.x + f.width) return false; 
if(e.y < f.y || e.y + e.height > f.y + f.height) return false; 

return true; 

所有它是如此簡單，但我想我工作了這麼久，我就開始想太辛苦之後...

Answer 2

這裏是一個快速拖放樣品與邊界約束：

http://jsfiddle.net/xrqatyLs/8/

的祕訣就是在約束的阻力位置，自己的值。

clip.x = Math.max(bounds.x, Math.min(bounds.x + bounds.width - clipWidth, evt.stageX)); 
clip.y = Math.max(bounds.y, Math.min(bounds.y + bounds.height-clipHeight, evt.stageY)); 

下面是另一個更爲複雜的例子是手動檢查，如果一個矩形相交另一個矩形：

http://jsfiddle.net/lannymcnie/yvfLwdzn/

希望幫助！