Chcę przenieść element SVG (kółko) za pomocą myszy w bobrilu. Z jakiej metody komponentu cyklu życia powinienem korzystać? Próbowałem użyć onPointerDown
i tak dalej, ale te metody obsługują tylko zdarzenia wewnątrz kręgu. Czy powinienem używać przeciągania i upuszczania, czy jest jakaś inna opcja poruszania kółkiem wokół całego SVG?Jak przenieść element SVG z ramą bobrilu
Odpowiedz
W onPointerDown
, onPointerMove
i onPointerUp
metody cyklu życia składnika (więcej informacji w bobril/index.tsIBobrilComponent
) są dokładnie to, co trzeba, ale z trochę więcej kodu.
Użyj bobrilu b.registerMouseOwner
z kontekstem w metodzie onPointerDown
.
onPointerDown(ctx: ICtx, event: b.IBobrilPointerEvent) {
b.registerMouseOwner(ctx);
// Store the initial coordinates
ctx.lastX = event.x;
ctx.lastY = event.y;
return true;
},
Następnie komponent może obsługiwać ruch myszy w onPointerMove
metoda nawet przeniesienie na zewnątrz elementu. Musisz tylko upewnić się, że nadal jesteś aktualnym właścicielem. Twoja metoda może więc wyglądać np. tak:
onPointerMove(ctx: ICtx, event: b.IBobrilPointerEvent) {
if (!b.isMouseOwner(ctx))
return false;
if (ctx.lastX === event.x && ctx.lastY === event.y)
return false;
// Call handler if it is registered
if (ctx.data.onMove) {
ctx.data.onMove(event.x - ctx.lastX, event.y - ctx.lastY);
}
// Update coordinates
ctx.lastX = event.x;
ctx.lastY = event.y;
return true;
},
Nie zapomnij wydać rejestracji.
onPointerUp(ctx: ICtx, event: b.IBobrilPointerEvent) {
b.releaseMouseOwner();
return true;
}
Powyższy przykład przechowuje ostatnie współrzędne wskaźnika w kontekście komponentu ICtx
. Następnie można go użyć do obsługi programu deltaX
i deltaY
do onMove
. Ten moduł obsługi można zarejestrować za pomocą danych wejściowych podczas tworzenia węzła komponentu.
- 1. Jak przenieść wzór SVG z elementem
- 2. Jak przenieść element w DOM?
- 3. Jak przenieść element na NSMutableArray?
- 4. Łącze z ramą parasolową
- 5. logback z ramą odtwarzania
- 6. Jak przenieść element w tablicy MongoDB?
- 7. Jak przenieść element HTML w jQuery?
- 8. Jak dodać element SVG przy starcie - Kątowe
- 9. IE11 meta element Breaks SVG
- 10. Element grupy środkowej wewnątrz svg
- 11. Dodaj element SVG do istniejącego SVG używając DOM
- 12. jakiekolwiek doświadczenie z ramą programistyczną java "Play"?
- 13. Jak przenieść element do pustej listy przy użyciu jquery?
- 14. Jak przenieść element w ruchu przekątnej w jQuery?
- 15. Wypełnij element ścieżki SVG obrazem tła
- 16. SVG <image> element renderujący jakość
- 17. Safari kompatybilny CSS3 animacji na element SVG
- 18. Wstaw kod HTML wewnątrz SVG Element tekstowy
- 19. Jak przenieść DialogFragment z centrum?
- 20. Jak uczynić element tekstowy SVG "zdolnym do kliknięcia"?
- 21. Jak mogę napisać stronę ładowania z ramą gry
- 22. Skrypty SVG z
- 23. Utwórz tag SVG z JavaScript
- 24. jQuery z dokumentem SVG
- 25. Jak zdobyć ScrollBars w SVG?
- 26. Jak zapisać kod svg jako obraz .svg?
- 27. Jak przenieść element z elementem skryptowym bez ponownego wykonywania skryptu za pomocą jQuery?
- 28. Jak przenieść posiadany wskaźnik
- 29. Jak przenieść temat z Silverlight do WPF?
- 30. Przenieść pozycję na liście?
Po prostu dodaję, aby był przyjazny dla wielu osób, powinieneś sprawdzić 'event.id', a później zignorować wszystkie pozostałe wskaźniki. I dobrze słuchać również na "onPointerAnulac", które powinno wycofać wszystkie twoje działania, ponieważ tak zdecydowała przeglądarka. – Bobris