2017-03-05 4 views
0

fabricjs 및 캔버스 요소를 사용하는 팬시 제품 디자이너를 사용하고 있습니다. 이 https://www.screenart.media/branchen/baeckerei-konditorei/plakat-liebe-verschenken/적절한 멀티 레이어 배경 레이어 선택 방법

당신이 배경처럼 여러 층 (배경)을 볼 수 있습니다, 커피 잔 (Kaffeetasse), 머핀 상자 :

은 내가이 시나리오를 만들었습니다.

캔버스 개체에서 다중 선택을 사용하고 싶습니다.

문제는 항상 배경 레이어를 선택한다는 것입니다.

선택 상자를 클릭하고 드래그하여 머그잔과 머핀 상자 만 선택하려면 배경과 같은 개체를 선택하지 않아도됩니까?

클릭 드래그 이벤트를 두 단계로 나눌 수 있습니까? 1. 선택하지 않은 객체를 클릭하고 드래그하면 선택 상자가 열립니다 (이벤트를 캔바스 배경으로 전달). 2. 개체를 클릭하여 선택하고 클릭 한 상태로 드래그하면 선택한 개체가 이동합니다.

이렇게하면 동작을보다 일관성있게 유지할 수 있습니다 (여러 묶음을 선택하고 모두 함께 움직이는 것을 생각하면됩니다).

당신은 어떻게 생각하십니까? 이것을 올바르게 구현하는 방법에 대한 아이디어가 있습니까?

감사합니다.

+0

왜 배경 이미지가 backgroundImage의 그것의 패브릭 캔버스 의미로 실제로되지 않습니다 : 그것은처럼 간단? – AndreaBogazzi

+0

FPD가 작동하는 방식입니다. 이것은 사용자가 객체를 수정할 수는 있지만 배경 이미지 자체는 수정할 수 없도록합니다. 따라서 배경 이미지를 객체로 추가해야했습니다. –

답변

0

개체의 선택 가능한 속성을 false로 설정해 보았습니까?

object.set({selectable: false}); 
+0

"Hintergrund"레이어를 "selectable : false"로 설정하면 선택 상자를 그릴 수 없습니다. 레이어 패널에서 자물쇠 아이콘을 클릭하여 모든 상호 작용을 완전히 사용 중지 한 경우에만 상자를 그릴 수 있습니다. 그러나 이것은 우리에게 필요한 것이 아닙니다. 우리가 필요로하는 것은 캔버스에서 객체를 선택하는 훨씬 더 일반적인 방법입니다. 첫 번째 클릭 드래그는 항상 선택 상자를 열어야합니다. 클릭 만 개체를 ​​선택해야합니다. –