Использование обработчиков перетаскивания мышью с GWT canvas - PullRequest
Новая
       18

Использование обработчиков перетаскивания мышью с GWT canvas

1 голос
/ 14 сентября 2011

В настоящее время я занимаюсь разработкой подобного рисованию приложения для GWT.Я хотел бы добавить обработчик мыши, который запускается, когда пользователь перетаскивает мышь через холст (например, делает квадрат и т. Д .;), проблема в том, что я не уверен, какой обработчик использовать.Просмотр обработчиков, реализованных в canvas, привел меня к некоторым подсказкам, но документация относительно того, к какому событию относится приложение, скудна.

Кто-нибудь знает, как мне это реализовать?Благодарю.

Ответы [ 2 ]

6 голосов
/ 14 сентября 2011

Нет обработчика "перетаскивания". Вы выполняете «перетаскивание» с помощью событий MouseDown, MouseMove и MouseUp. 

class YourWidget extends Composite
{
    @UiField
    Canvas yourCanvas;

    private boolean dragging;
    private HandlerRegistration mouseMove;

    @UiHandler("yourCanvas")
    void onMouseDown(MouseDownEvent e) {
      dragging = true;
      // do other stuff related to starting of "dragging"
      mouseMove = yourCanvas.addMouseMoveHandler(new MouseMoveHandler(){
            public void onMouseMove(MouseMoveEvent e) {
                // ...do stuff that you need when "dragging"
            }
      });
    }

    @UiHandler("yourCanvas")
    void onMouseUp(MouseUpEvent e) {
      if (dragging){
          // do other stuff related to stopping of "dragging"
          dragging = false;
          mouseMove.remove(); // in earlier versions of GWT
          //mouseMove.removeHandler(); //in later versions of GWT
      }
    }
}
0 голосов
/ 14 сентября 2011

Я тоже облажался с этим и недавно выпустил эту маленькую вещь:

http://alpha2.colorboxthing.appspot.com/#/

Я в основном обернул все, что мне нужно, с помощью FocusPanel . В моем случае это была FlowPanel.

Из этой программы в моем UiBinder: 

<g:FocusPanel ui:field="boxFocus" styleName="{style.boxFocus}">
    <g:FlowPanel ui:field="boxPanel" styleName="{style.boxFocus}"></g:FlowPanel>
</g:FocusPanel>

Как я использую панель фокусировки (display.getBoxFocus (), показанный ниже, просто получает FocusPanel выше): 

display.getBoxFocus().addClickHandler(new ClickHandler() {
    @Override
    public void onClick(ClickEvent event) {    
    }
});

display.getBoxFocus().addMouseDownHandler(new MouseDownHandler() {
    @Override
    public void onMouseDown(MouseDownEvent event) {
    }
});

display.getBoxFocus().addMouseMoveHandler(new MouseMoveHandler() {
    @Override
    public void onMouseMove(MouseMoveEvent event) {
    }
});

display.getBoxFocus().addMouseUpHandler(new MouseUpHandler() {
    @Override
    public void onMouseUp(MouseUpEvent event) {
    }
});

// etc!

Чтобы ответить на ваш вопрос о том, какой обработчик использовать для «перетаскивания», я не нашел ни одного обработчика, который бы сделал это для меня. Вместо этого я использовал MouseDownHandler, MouseMoveHandler и MouseUpHandler.

Используйте MouseDownHandler, чтобы установить флаг, который определяет, когда пользовательская мышь не работает. Я делаю это так, чтобы при вызове MouseMoveHandler он знал, должен ли он что-либо делать или нет. Наконец, используйте MouseUpHandler, чтобы переключить этот флаг, если пользователь нажимает кнопку мыши или нет.

В этом методе были некоторые недостатки (если пользователь перетаскивал свою мышь из FocusPanel), но, поскольку мое приложение было просто забавным побочным проектом, я не слишком задумывался о нем. Добавьте другие обработчики, чтобы исправить это, если это станет большой проблемой.

...